/* Concept 3 - Playful Discovery. Unbounded + Manrope (local). Bright, tasteful, trail-map language. */
@font-face{font-family:"Unbounded";src:url("fonts/unbounded-wght-normal.woff2") format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:"Manrope";src:url("fonts/manrope-wght-normal.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}

:root{
  --sky:#cdeefc; --sky-lt:#eaf7fd; --sun:#ffc531; --sun-lt:#fff3cc; --coral:#c4361e; --teal:#087a69; --navy:#16213e; --white:#fff; --dim:#43506b;
  --display:"Unbounded","Trebuchet MS",system-ui,sans-serif; --sans:"Manrope","Segoe UI",system-ui,sans-serif;
  --out:cubic-bezier(.23,1,.32,1); --pad:clamp(20px,4vw,72px);
  --blob:58% 42% 46% 54% / 52% 44% 56% 48%;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--white);color:var(--navy);font-family:var(--sans);font-size:1.125rem;line-height:1.65;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,ul,ol,dl,dd,figure,address{margin:0;padding:0}
ul,ol{list-style:none}
address{font-style:normal}
a{color:inherit;text-underline-offset:.2em}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--navy);outline-offset:3px;box-shadow:0 0 0 6px #fff}
::selection{background:var(--sun);color:var(--navy)}
.skip{position:absolute;left:12px;top:-80px;z-index:300;background:var(--navy);color:#fff;padding:10px 16px;border-radius:12px}
.skip:focus{top:12px}
.wrap{max-width:1500px;margin-inline:auto;padding-inline:var(--pad)}
h1,h2,h3{font-family:var(--display);font-weight:700;letter-spacing:-.025em;line-height:1.1;text-wrap:balance}
h2{font-size:clamp(2rem,3.9vw,3.8rem)}
h3{font-size:clamp(1.15rem,1.6vw,1.5rem);letter-spacing:-.015em}
.lead{font-size:clamp(1.15rem,1.5vw,1.4rem);line-height:1.55;font-weight:500;max-width:46ch}
.illus{position:absolute;left:50%;transform:translateX(-50%);bottom:7%;background:rgba(22,33,62,.88);color:#fff;font:700 .75rem/1 var(--sans);padding:7px 12px;border-radius:999px;white-space:nowrap}
.deco{position:absolute;width:64px;height:64px;pointer-events:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;border-radius:999px;font-weight:800;font-size:1rem;text-decoration:none;border:3px solid var(--navy);transition:transform 160ms var(--out),background-color 200ms var(--out),color 200ms var(--out),box-shadow 200ms var(--out)}
.btn:active{transform:scale(.96)}
.btn--coral{background:var(--coral);border-color:var(--coral);color:#fff}
.btn--navy{background:var(--navy);color:#fff}
.btn--white{background:#fff;color:var(--navy)}
@media (hover:hover){.btn:hover{transform:translateY(-3px);box-shadow:0 8px 0 -2px var(--navy)}.btn:active{transform:scale(.96)}}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}

/* floating bar */
.top__in{pointer-events:auto;max-width:1500px;margin:auto;background:#fff;border:3px solid var(--navy);border-radius:999px;display:flex;align-items:center;gap:20px;padding:8px 10px 8px 22px;box-shadow:0 6px 0 var(--navy)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto;font-family:var(--display);font-weight:800;font-size:1.15rem;letter-spacing:-.03em;line-height:1}
.logo__mark{width:38px;height:38px;color:var(--teal);flex:none}
.logo small{display:block;font-family:var(--sans);font-weight:800;font-size:.6875rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);margin-top:4px}
.menu{display:flex;gap:6px}
.menu a{font-weight:800;font-size:.9375rem;text-decoration:none;padding:10px 14px;border-radius:999px;transition:background-color 180ms var(--out)}
@media (hover:hover){.menu a:hover{background:var(--sky)}}
.burger{display:none;background:var(--navy);color:#fff;border:0;border-radius:999px;min-height:46px;padding:0 22px;font-weight:800}
.panel{pointer-events:auto;max-width:1500px;margin:10px auto 0;background:#fff;border:3px solid var(--navy);border-radius:28px;padding:18px 22px 24px;display:grid;gap:4px;box-shadow:0 6px 0 var(--navy)}
.panel[hidden]{display:none}
.panel>a:not(.btn){font-family:var(--display);font-weight:700;font-size:1.25rem;text-decoration:none;padding:12px 0;border-bottom:2px dashed rgba(22,33,62,.25)}
.panel .btn{margin-top:14px}
.panel p{margin-top:12px;font-weight:800}

/* hero */
.hero{position:relative;background:var(--sky);padding:132px 0 0;overflow:hidden}
.hero__in{max-width:1500px;margin:auto;padding:0 var(--pad) clamp(70px,8vw,120px);display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(24px,4vw,64px);align-items:center;min-height:min(720px,calc(100svh - 132px))}
.ribbon{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.ribbon span{font:800 .8125rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;padding:9px 14px;border-radius:999px;border:2px solid var(--navy)}
.ribbon span:nth-child(1){background:var(--teal);color:#fff;border-color:var(--teal)}
.ribbon span:nth-child(2){background:var(--coral);color:#fff;border-color:var(--coral)}
.ribbon span:nth-child(3){background:var(--sun)}
.hero h1{font-size:clamp(2.3rem,4.5vw,4.6rem);line-height:1.08;margin-bottom:24px}
.hl{text-decoration:underline;text-decoration-color:var(--sun);text-decoration-thickness:.2em;text-underline-offset:.08em;text-decoration-skip-ink:none}
.hero__art{position:relative;height:clamp(440px,60vh,600px)}
.blob{position:relative;margin:0;overflow:hidden;border-radius:var(--blob);background:#fff;border:6px solid var(--navy)}
.blob img{width:100%;height:100%;object-fit:cover}
.blob--hero{position:absolute;inset:0 4% 6% 8%}
.bubble{position:relative;margin:0;overflow:hidden;border-radius:50%;border:6px solid var(--navy);background:#fff}
.bubble img{width:100%;height:100%;object-fit:cover}
.bubble--a{position:absolute;left:0;bottom:0;width:30%;aspect-ratio:1;box-shadow:0 8px 0 rgba(22,33,62,.25)}
.badge{position:absolute;display:grid;place-content:center;text-align:center;border-radius:50%;border:4px solid var(--navy);box-shadow:0 6px 0 var(--navy)}
.badge strong{font-family:var(--display);font-weight:800;font-size:1.8rem;line-height:1}
.badge span{font-weight:800;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
.badge--age{right:0;top:0;width:128px;height:128px;background:var(--sun);transform:rotate(10deg)}
.deco--sun{right:8%;top:116px;width:92px;height:92px;color:var(--sun);animation:spin 40s linear infinite}
.deco--star1{left:47%;bottom:14%;color:var(--coral);width:44px;height:44px;transform:rotate(-12deg)}
.deco--star2{left:46%;top:-4%;color:#fff;width:40px;height:40px}
@keyframes spin{to{transform:rotate(360deg)}}
.wave{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:clamp(40px,6vw,90px);display:block}
.wave--sky{fill:#fff}

/* choose */
.choose{padding:clamp(56px,7vw,110px) 0 clamp(72px,9vw,130px);background:#fff}
.choose h2{margin-bottom:14px}
.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:40px}
.tab{display:flex;align-items:center;gap:16px;min-height:96px;padding:0 28px;border:3px solid var(--navy);border-radius:32px;background:#fff;font-family:var(--display);font-weight:700;font-size:clamp(1.3rem,2.3vw,2.2rem);letter-spacing:-.02em;text-align:left;transition:transform 180ms var(--out),background-color 220ms var(--out),color 220ms var(--out),box-shadow 220ms var(--out)}
.tab svg{width:44px;height:44px;flex:none}
.tab[aria-selected="true"]{box-shadow:0 8px 0 var(--navy);transform:translateY(-4px)}
.tab--faith[aria-selected="true"]{background:var(--teal);color:#fff}
.tab--explore[aria-selected="true"]{background:var(--coral);color:#fff}
.tab--grow[aria-selected="true"]{background:var(--sun)}
@media (hover:hover){.tab[aria-selected="false"]:hover{transform:translateY(-4px) rotate(-1deg);background:var(--sky-lt)}}
.tab:active{transform:scale(.98)}
.panels{margin-top:28px}
.pn{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:center;border:3px solid var(--navy);border-radius:44px;padding:clamp(28px,4vw,64px);animation:pop 420ms var(--out)}
.pn[hidden]{display:none}
.pn--faith{background:var(--teal);color:#fff}
.pn--explore{background:var(--coral);color:#fff}
.pn--grow{background:var(--sun)}
.pn h3{font-size:clamp(1.6rem,3vw,2.8rem);margin-bottom:18px;line-height:1.12}
.pn p{font-size:clamp(1.1rem,1.4vw,1.3rem);max-width:44ch;font-weight:500}
.blob--pn{aspect-ratio:5/4;border-color:var(--navy)}
@keyframes pop{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}

/* days */
.days{position:relative;background:var(--sun-lt);padding:clamp(72px,9vw,140px) 0 clamp(80px,10vw,160px);overflow:hidden}
.trail{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}
.trail path{fill:none;stroke:var(--navy);stroke-opacity:.2;stroke-width:5;stroke-linecap:round;stroke-dasharray:1 16;vector-effect:non-scaling-stroke}
.days__in{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:clamp(32px,4.5vw,72px)}
.days__h{grid-column:1 / span 7}
.days__h h2{margin-bottom:14px}
.stop{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:center}
.stop--1{grid-column:1 / span 7;grid-template-columns:minmax(0,5fr) minmax(0,5fr)}
.stop--2{grid-column:6 / span 7;grid-template-columns:minmax(0,5fr) minmax(0,5fr);margin-top:-30px}
.stop--3{grid-column:2 / span 7;grid-template-columns:minmax(0,4fr) minmax(0,5fr)}
.stop--4{grid-column:6 / span 7;grid-template-columns:minmax(0,5fr) minmax(0,5fr);margin-top:-40px}
.stop .bubble{aspect-ratio:1;box-shadow:0 10px 0 rgba(22,33,62,.2)}
.stop--2 .bubble,.stop--4 .bubble{order:2}
.stop--2 .stop__t,.stop--4 .stop__t{order:1}
.stop__t{position:relative}
.stop__n{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--navy);color:#fff;font-family:var(--display);font-weight:700;margin-bottom:12px}
.stop h3{margin-bottom:8px}
.stop p{max-width:32ch;font-weight:500}
.days__note{grid-column:1 / -1;font-size:.875rem;color:var(--dim)}
.stop .bubble img{transition:transform 900ms var(--out)}
@media (hover:hover) and (pointer:fine){.stop:hover .bubble img{transform:scale(1.06) rotate(1deg)}}

/* grown-ups */
.grown{background:var(--navy);color:#fff;padding:clamp(72px,9vw,140px) 0}
.grown__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,96px);align-items:center}
.grown__h h2{margin-bottom:16px}
.grown .lead{color:#dfe6f3}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.tile{border-radius:36px;padding:28px 28px 30px;border:3px solid #fff;color:var(--navy)}
.tile svg{width:44px;height:44px;margin-bottom:14px}
.tile h3{margin-bottom:8px}
.tile p{font-weight:500;font-size:1.0625rem;line-height:1.5}
.tile--a{background:var(--sun);transform:rotate(-1.2deg)}
.tile--b{background:var(--sky);transform:translateY(24px) rotate(1deg)}
.tile--c{background:#fff;transform:rotate(1deg)}
.tile--d{background:var(--coral);color:#fff;transform:translateY(24px) rotate(-1deg)}
.tile--d svg,.tile--d h3{color:#fff}
.tiles{padding-bottom:24px}

/* safe */
.safe{background:var(--sky-lt);padding:clamp(64px,8vw,120px) 0}
.safe__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(24px,5vw,96px);row-gap:28px;align-items:start}
.safe h2{grid-row:1 / span 2}
.safe__lead{font-size:clamp(1.15rem,1.5vw,1.4rem);font-weight:600;line-height:1.5;max-width:50ch}
.safe__who{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.safe__who li{background:#fff;border:3px solid var(--navy);border-radius:28px;padding:20px 24px;display:flex;flex-direction:column;gap:4px}
.safe__who span{font-size:.8125rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.safe__who strong{font-family:var(--display);font-size:1.25rem;letter-spacing:-.02em;line-height:1.2}

/* path */
.path{background:#fff;padding:clamp(72px,9vw,140px) 0}
.path h2{margin-bottom:clamp(40px,6vw,80px)}
.route{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;position:relative}
.route::before{content:"";position:absolute;left:3%;right:3%;top:28px;border-top:5px dotted rgba(22,33,62,.35)}
.route li:nth-child(even){margin-top:44px}
.dot{position:relative;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;border:3px solid var(--navy);background:var(--sun);font-family:var(--display);font-weight:700;font-size:1.3rem;margin-bottom:16px;box-shadow:0 5px 0 var(--navy)}
.route li:nth-child(2) .dot{background:var(--sky)}
.route li:nth-child(3) .dot{background:var(--coral);color:#fff}
.route li:nth-child(4) .dot{background:var(--teal);color:#fff}
.route li:nth-child(5) .dot{background:var(--sun)}
.route h3{margin-bottom:8px;font-size:1.15rem}
.route p{font-size:1rem;color:var(--dim);font-weight:500}

/* visit */
.visit{position:relative;background:var(--sun);overflow:hidden}
.visit__in{max-width:1500px;margin:auto;padding:clamp(64px,8vw,120px) var(--pad);display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,80px);align-items:center}
.visit h2{margin-bottom:18px;font-size:clamp(2rem,3.7vw,3.6rem)}
.visit address{margin-top:34px;font-weight:700;line-height:1.5}
.visit address a{display:inline-block;margin-top:6px}
.blob--visit{aspect-ratio:1/.92;border-radius:var(--blob)}
.deco--sun2{right:-30px;top:-30px;width:150px;height:150px;color:#fff;opacity:.55;animation:spin 50s linear infinite}

.foot{background:var(--navy);color:#dde5f3;padding:36px 0 40px;font-size:.9375rem}
.foot__s{margin-top:10px;color:#aab6cf;font-size:.8125rem;max-width:100ch}

/* reveal */
.js .rv{opacity:0;transform:translateY(22px);transition:opacity 700ms var(--out),transform 700ms var(--out)}
.js .rv.in{opacity:1;transform:none}
.tile.rv.in{transition:transform 700ms var(--out)}

@media (max-width:1180px){
  .menu{display:none}
  .top__cta{display:none}
  .burger{display:block}
}
@media (max-width:980px){
  .hero{padding-top:100px}
  .hero__in{display:flex;flex-direction:column-reverse;min-height:0;gap:36px;padding-bottom:70px}
  .hero__art{height:clamp(340px,92vw,500px);width:100%}
  .badge--age{width:104px;height:104px}
  .deco--sun{top:96px;right:4%;width:64px;height:64px}
  .tabs{grid-template-columns:1fr;gap:12px}
  .tab{min-height:76px}
  .pn{grid-template-columns:1fr;border-radius:32px}
  .pn .blob--pn{order:-1}
  .trail{display:none}
  .days__in{display:flex;flex-direction:column;gap:44px}
  .stop,.stop--1,.stop--2,.stop--3,.stop--4{display:grid;grid-template-columns:minmax(0,1fr);margin:0}
  .stop--2 .bubble,.stop--4 .bubble{order:0}
  .stop--2 .stop__t,.stop--4 .stop__t{order:0}
  .stop .bubble{border-radius:36px 120px 36px 36px;aspect-ratio:4/3}
  .stop--2 .bubble{border-radius:120px 36px 36px 36px}
  .stop--4 .bubble{border-radius:36px 36px 120px 36px}
  .grown__in,.safe__in,.visit__in{grid-template-columns:1fr}
  .safe h2{grid-row:auto}
  .tiles{grid-template-columns:1fr;padding-bottom:0}
  .tile--b,.tile--d{transform:rotate(1deg)}
  .safe__who{grid-template-columns:1fr}
  .route{grid-template-columns:1fr;gap:0}
  .route::before{left:28px;right:auto;top:0;bottom:0;border-top:0;border-left:5px dotted rgba(22,33,62,.35)}
  .route li,.route li:nth-child(even){margin:0;padding:0 0 26px 84px;position:relative}
  .route .dot{position:absolute;left:0;top:0;margin:0}
  .visit .blob--visit{order:-1}
}
@media (max-width:640px){
  body{font-size:1.0625rem}
  .top{top:8px}
  .top__in{padding:6px 8px 6px 14px;gap:10px}
  .logo{font-size:1rem}
  .logo__mark{width:32px;height:32px}
  .logo small{display:none}
  .hero h1{font-size:clamp(2.1rem,9.2vw,3rem)}
  .actions .btn{flex:1 1 100%}
  .bubble--a{width:34%}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .deco--sun,.deco--sun2{animation:none}
  .pn{animation:none}
  .js .rv{opacity:1;transform:none;transition:none}
  .stop .bubble img,.btn,.tab{transition:none}
}
.blob--hero .illus{left:auto;right:12%;transform:none;bottom:9%}