/* Faith Force homepage - page-scoped layout and visual language. */
.ffh-home { --ffh-ink:#0a0f1e; --ffh-panel:#111b33; --ffh-gold:var(--ff-brand-yellow); --ffh-muted:#bdc9d9; overflow:hidden; background:var(--ffh-ink); color:#fff; }
.ffh-home * { box-sizing:border-box; }
.ffh-home .container { max-width:1240px; }
.ffh-home a:focus-visible { outline:3px solid #fff; outline-offset:4px; }
.ffh-home p { color:var(--ffh-muted); line-height:1.62; }
.ffh-home h1,.ffh-home h2,.ffh-home h3 { color:#fff; }
.ffh-hero { position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(circle at 76% 25%,rgba(122,0,1,.27),transparent 32%),radial-gradient(circle at 18% 93%,rgba(212,160,23,.15),transparent 34%),linear-gradient(135deg,#0b1427,#12233e 68%,#0a1020); border-bottom:1px solid rgba(212,160,23,.3); }
.ffh-hero-grain { position:absolute; inset:0; z-index:-1; opacity:.13; background-image:radial-gradient(rgba(255,255,255,.7) .65px,transparent .8px); background-size:18px 18px; mask-image:linear-gradient(90deg,transparent 12%,#000 100%); }
.ffh-hero-inner { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); gap:clamp(20px,4vw,64px); align-items:center; min-height:580px; padding-top:54px; padding-bottom:64px; }
.ffh-hero-copy { position:relative; z-index:2; max-width:650px; }
.ffh-eyebrow,.ffh-kicker,.ffh-path-label,.ffh-card-type { display:inline-flex; align-items:center; gap:9px; color:var(--ffh-gold); font-weight:800; font-size:.73rem; line-height:1.25; text-transform:uppercase; letter-spacing:.12em; }
.ffh-eyebrow { padding:9px 12px; border:1px solid rgba(212,160,23,.32); border-radius:999px; background:rgba(212,160,23,.08); }
.ffh-eyebrow-star { font-size:1.1rem; line-height:0; }
.ffh-hero h1 { margin:20px 0 18px; max-width:640px; font-family:var(--ff-display,'Bangers',cursive); font-size:clamp(3.35rem,7.1vw,6.7rem); font-weight:400; line-height:.98; letter-spacing:.018em; text-wrap:balance; }
.ffh-hero h1 em { color:var(--ffh-gold); font-style:normal; }
.ffh-hero-copy > p { max-width:570px; font-size:clamp(1rem,1.5vw,1.18rem); margin:0 0 28px; }
.ffh-hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.ffh-button { display:inline-flex; justify-content:center; align-items:center; gap:16px; min-height:50px; padding:13px 22px; border:2px solid transparent; border-radius:10px; font-weight:800; line-height:1.2; text-decoration:none; transition:transform .22s ease,background-color .22s ease,border-color .22s ease,box-shadow .22s ease; }
.ffh-button:hover { transform:translateY(-3px); text-decoration:none; }
.ffh-button-gold { color:#111826 !important; background:var(--ffh-gold); box-shadow:0 10px 30px rgba(212,160,23,.2); }
.ffh-button-gold:hover { background:var(--ff-brand-yellow); color:#111826 !important; box-shadow:0 14px 34px rgba(212,160,23,.29); }
.ffh-button-outline { color:#fff !important; border-color:rgba(255,255,255,.43); background:rgba(255,255,255,.055); }
.ffh-button-outline:hover { border-color:var(--ffh-gold); color:#fff !important; background:rgba(212,160,23,.1); }
.ffh-hero-jump { display:inline-flex; align-items:center; gap:9px; margin-top:20px; color:#e2e9f1; font-weight:700; font-size:.87rem; text-underline-offset:4px; }
.ffh-hero-jump:hover { color:var(--ffh-gold); }
.ffh-hero-visual { position:relative; width:min(100%,450px); aspect-ratio:1/1.02; margin:auto; display:grid; place-items:center; }
.ffh-hero-sun { position:absolute; width:79%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 35% 35%,var(--ff-brand-yellow),#bd751b 77%); box-shadow:0 0 0 18px rgba(212,160,23,.07),0 0 85px rgba(212,160,23,.24); }
.ffh-hero-sun:before { content:''; position:absolute; inset:-24px; border:1px dashed rgba(212,160,23,.35); border-radius:50%; animation:ffh-turn 40s linear infinite; }
.ffh-hero-image { position:relative; width:87%; height:88%; overflow:hidden; border-radius:46% 46% 18px 18px; border:1px solid rgba(212,160,23,.35); box-shadow:0 25px 58px rgba(0,0,0,.38); transform:rotate(2deg); }
.ffh-hero-image img { width:100%; height:100%; object-fit:cover; object-position:center 18%; display:block; }
.ffh-hero-sticker { position:absolute; z-index:2; right:-4%; bottom:6%; display:grid; place-items:center; width:110px; height:110px; border-radius:50%; background:var(--ff-brand-red); border:4px solid var(--ff-brand-yellow); box-shadow:0 12px 32px rgba(0,0,0,.36); color:#fff; font-family:var(--ff-display,'Bangers',cursive); font-size:1.45rem; line-height:.92; letter-spacing:.04em; text-align:center; transform:rotate(10deg); }
.ffh-hero-bottom { position:absolute; left:0; right:0; bottom:0; height:6px; background:linear-gradient(90deg,var(--ff-brand-red) 0 24%,var(--ff-brand-yellow) 24% 74%,var(--ff-brand-red) 74%); }
.ffh-section { padding:clamp(62px,7vw,100px) 0; }
.ffh-section-head { margin-bottom:34px; }
.ffh-section-head h2 { margin:10px 0 12px; font-family:var(--ff-display,'Bangers',cursive); font-size:clamp(2.45rem,4.8vw,4.35rem); font-weight:400; line-height:1.03; letter-spacing:.035em; }
.ffh-section-head h2 span { color:var(--ffh-gold); }
.ffh-section-head p { max-width:650px; margin:0; font-size:1rem; }
.ffh-section-head-centre { text-align:center; }
.ffh-section-head-centre p { margin-left:auto; margin-right:auto; }
.ffh-section-head-split { display:flex; justify-content:space-between; align-items:end; gap:30px; }
.ffh-section-head-split p { max-width:380px; }
.ffh-paths { background:linear-gradient(180deg,#0e182b,#0b1425); }
.ffh-path-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.ffh-path-card { position:relative; display:flex; flex-direction:column; min-height:430px; padding:clamp(24px,3.5vw,42px); border-radius:22px; border:1px solid rgba(255,255,255,.13); overflow:hidden; background:#152745; scroll-margin-top:105px; }
.ffh-path-card:before { content:''; position:absolute; right:-85px; top:-90px; width:240px; height:240px; border:36px solid rgba(255,255,255,.035); border-radius:50%; pointer-events:none; }
.ffh-path-adults { background:radial-gradient(circle at 95% 8%,rgba(212,160,23,.15),transparent 43%),linear-gradient(145deg,#182d49,#101b31); border-color:rgba(212,160,23,.27); }
.ffh-path-kids { background:radial-gradient(circle at 92% 9%,rgba(122,0,1,.22),transparent 43%),linear-gradient(145deg,#272541,#121a30); border-color:rgba(122,0,1,.3); }
.ffh-path-card-top { display:flex; align-items:start; justify-content:space-between; margin-bottom:20px; }
.ffh-path-number { color:rgba(255,255,255,.46); font-family:var(--ff-display,'Bangers',cursive); font-size:2.15rem; letter-spacing:.04em; }
.ffh-path-mark { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:rgba(212,160,23,.13); color:var(--ffh-gold); font-size:1.7rem; transform:rotate(9deg); }
.ffh-path-kids .ffh-path-mark { background:rgba(122,0,1,.18); color:#fff; }
.ffh-path-card h3 { margin:9px 0 9px; font-family:var(--ff-display,'Bangers',cursive); font-size:clamp(2.15rem,3.5vw,3.25rem); font-weight:400; line-height:1; letter-spacing:.025em; }
.ffh-path-card > p { margin:0 0 22px; max-width:470px; }
.ffh-path-links { margin-top:auto; border-top:1px solid rgba(255,255,255,.14); }
.ffh-path-links a { display:flex; justify-content:space-between; gap:10px; padding:11px 0; color:#fff; font-weight:700; line-height:1.3; border-bottom:1px solid rgba(255,255,255,.1); }
.ffh-path-links a:hover { color:var(--ffh-gold); padding-left:5px; }
.ffh-featured { background:#0a0f1e; }
.ffh-featured-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.ffh-feature-card { display:flex; flex-direction:column; overflow:hidden; min-width:0; background:#17253b; border:1px solid rgba(255,255,255,.13); border-radius:18px; text-decoration:none; box-shadow:0 15px 32px rgba(0,0,0,.17); transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.ffh-feature-card:hover { transform:translateY(-5px); border-color:rgba(212,160,23,.57); box-shadow:0 22px 38px rgba(0,0,0,.27); }
.ffh-feature-art { aspect-ratio:1; overflow:hidden; background:linear-gradient(135deg,#684828,#1b2841); }
.ffh-feature-art img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.ffh-feature-card:hover img { transform:scale(1.04); }
.ffh-feature-art-podcast { display:grid; place-items:center; background:radial-gradient(circle at center,rgba(212,160,23,.25),transparent 55%),linear-gradient(135deg,#22395a,#371f37); }
.ffh-feature-art-podcast img { object-position:center 35%; }
.ffh-feature-music { color:var(--ff-brand-yellow); font-size:6rem; line-height:1; }
.ffh-feature-art-david img { object-position:center 32%; }
.ffh-feature-art-printable img { object-position:center 36%; }
.ffh-feature-content { display:flex; flex:1; flex-direction:column; padding:24px; }
.ffh-feature-content h3 { margin:9px 0 8px; font-family:var(--ff-display,'Bangers',cursive); font-size:clamp(1.8rem,2.7vw,2.4rem); line-height:1.03; letter-spacing:.025em; font-weight:400; }
.ffh-feature-content p { margin:0 0 18px; font-size:.92rem; }
.ffh-card-arrow { display:flex; justify-content:space-between; gap:12px; margin-top:auto; padding-top:14px; border-top:1px solid rgba(255,255,255,.13); color:var(--ffh-gold); font-weight:800; }
.ffh-discover { scroll-margin-top:70px; background:radial-gradient(circle at 2% 18%,rgba(122,0,1,.12),transparent 27%),linear-gradient(180deg,#111b30,#0c1527); }
.ffh-discover-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.ffh-discover-card { --ffh-accent:var(--ff-brand-yellow); position:relative; display:flex; flex-direction:column; min-height:205px; padding:21px; overflow:hidden; border:1px solid rgba(255,255,255,.12); border-radius:15px; background:rgba(255,255,255,.045); color:#fff; text-decoration:none; transition:transform .2s ease,background-color .2s ease,border-color .2s ease; }
.ffh-discover-card:hover { transform:translateY(-4px); background:rgba(255,255,255,.075); border-color:var(--ffh-accent); color:#fff; }
.ffh-tone-blue { --ffh-accent:#83b9ff; }
.ffh-tone-red { --ffh-accent:var(--ff-brand-red); }
.ffh-discover-top { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:23px; }
.ffh-discover-number { color:var(--ffh-accent); font-family:var(--ff-display,'Bangers',cursive); font-size:1.55rem; line-height:1; }
.ffh-discover-tag { padding:4px 7px; border:1px solid color-mix(in srgb,var(--ffh-accent) 48%,transparent); border-radius:999px; color:var(--ffh-accent); font-size:.64rem; text-transform:uppercase; font-weight:800; letter-spacing:.09em; }
.ffh-discover-card strong { margin-bottom:7px; color:#fff; font-family:var(--ff-display,'Bangers',cursive); font-weight:400; font-size:1.7rem; letter-spacing:.03em; line-height:1.05; }
.ffh-discover-text { max-width:240px; padding-right:15px; color:#c8d3e1; font-size:.82rem; line-height:1.45; }
.ffh-discover-arrow { position:absolute; right:19px; bottom:16px; color:var(--ffh-accent); font-size:1.4rem; }
.ffh-purpose { position:relative; background:linear-gradient(110deg,var(--ff-brand-red),var(--ff-brand-red) 48%,var(--ff-brand-red)); overflow:hidden; }
.ffh-purpose-inner { position:relative; z-index:1; display:grid; grid-template-columns:80px 1.2fr 1fr; gap:22px 30px; align-items:center; }
.ffh-purpose-spark { color:var(--ff-brand-yellow); font-size:5rem; line-height:1; }
.ffh-purpose .ffh-kicker { color:var(--ff-brand-yellow); }
.ffh-purpose h2 { margin:8px 0 0; font-family:var(--ff-display,'Bangers',cursive); font-size:clamp(2.4rem,4.6vw,4.4rem); font-weight:400; line-height:1.02; letter-spacing:.03em; }
.ffh-purpose h2 span { color:var(--ff-brand-yellow); }
.ffh-purpose p { color:#fff; margin:0; font-size:1rem; }
.ffh-purpose-actions { grid-column:2/4; display:flex; flex-wrap:wrap; align-items:center; gap:18px 24px; }
.ffh-purpose-about { color:#fff; font-weight:800; text-decoration:underline; text-underline-offset:4px; }
.ffh-purpose-about:hover { color:var(--ff-brand-yellow); }
@keyframes ffh-turn { to { transform:rotate(360deg); } }
@media (max-width:1050px) { .ffh-hero-inner { grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr); } .ffh-discover-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ffh-purpose-inner { grid-template-columns:64px 1fr; } .ffh-purpose-inner p { grid-column:2; } .ffh-purpose-actions { grid-column:2; } }
@media (max-width:760px) { .ffh-hero-inner { grid-template-columns:1fr; gap:18px; min-height:0; padding-top:52px; padding-bottom:45px; } .ffh-hero-copy { max-width:630px; } .ffh-hero h1 { max-width:630px; font-size:clamp(3.3rem,10vw,5.5rem); } .ffh-hero-visual { width:min(74%,340px); aspect-ratio:1.2; } .ffh-hero-image { height:96%; border-radius:46% 46% 18px 18px; } .ffh-hero-sticker { width:82px; height:82px; font-size:1.1rem; right:-4%; } .ffh-path-grid { grid-template-columns:1fr; } .ffh-path-card { min-height:0; } .ffh-section-head-split { display:block; } .ffh-section-head-split p { max-width:650px; } }
@media (max-width:520px) { .ffh-hero-inner { padding-top:38px; } .ffh-hero h1 { font-size:clamp(3.12rem,15vw,4.2rem); line-height:.98; } .ffh-hero-copy > p { font-size:1rem; margin-bottom:20px; } .ffh-hero-actions { gap:9px; } .ffh-button { min-height:48px; padding:11px 17px; } .ffh-hero-actions .ffh-button { width:100%; justify-content:space-between; } .ffh-hero-jump { margin-top:15px; } .ffh-hero-visual { width:min(68%,250px); aspect-ratio:1.15; margin-top:5px; } .ffh-hero-sticker { right:-14%; bottom:0; } .ffh-section { padding:62px 0; } .ffh-section-head { margin-bottom:26px; } .ffh-path-card { padding:24px; } .ffh-featured-grid,.ffh-discover-grid { grid-template-columns:1fr; } .ffh-feature-card:last-child { grid-column:auto; } .ffh-discover-card { min-height:170px; } .ffh-discover-top { margin-bottom:15px; } .ffh-purpose-inner { grid-template-columns:1fr; } .ffh-purpose-spark { font-size:3.5rem; } .ffh-purpose-inner p,.ffh-purpose-actions { grid-column:auto; } }
@media (prefers-reduced-motion:reduce) { .ffh-home *, .ffh-home *:before, .ffh-home *:after { animation:none !important; transition-duration:.01ms !important; scroll-behavior:auto !important; } .ffh-home + .cta-section .hero-particles { display:none; } }

/* Keep the opening promise clear of the fixed navigation at every width. */
.ffh-home .ffh-hero .container.ffh-hero-inner { padding-top:76px; padding-bottom:42px; }
.admin-bar .ffh-home .ffh-hero .container.ffh-hero-inner { padding-top:108px; }

@media (max-width:900px) { .ffh-featured-grid { grid-template-columns:1fr; max-width:500px; margin-inline:auto; } }


/* Angled edges connect the red callout to the surrounding navy sections. */
.ffh-purpose:before, .ffh-purpose:after { content:''; position:absolute; left:0; width:100%; height:clamp(22px,3vw,48px); pointer-events:none; }
.ffh-purpose:before { top:-1px; background:#0c1527; clip-path:polygon(0 0,100% 0,0 100%); }
.ffh-purpose:after { bottom:-1px; background:#0a0f1e; clip-path:polygon(100% 0,100% 100%,0 100%); }

/* Keep red-themed card labels readable on navy. */
.ffh-tone-red :is(.ffh-discover-number,.ffh-discover-tag,.ffh-discover-arrow) { color:#fff; }