
:root{
--background:oklch(1 0 0);--foreground:oklch(0.18 0.03 250);
--navy-deep:oklch(0.18 0.04 255);--navy:oklch(0.26 0.05 255);
--card:oklch(1 0 0);--primary:oklch(0.68 0.16 230);--primary-foreground:oklch(0.99 0 0);
--secondary:oklch(0.96 0.01 250);--muted-foreground:oklch(0.5 0.02 255);
--accent:oklch(0.94 0.03 230);--border:oklch(0.92 0.01 250);
--shadow-card:0 10px 30px -15px color-mix(in oklab, var(--navy-deep) 25%, transparent);
--shadow-elegant:0 20px 60px -20px color-mix(in oklab, var(--navy-deep) 35%, transparent);
--gradient-hero:linear-gradient(135deg, var(--navy-deep) 0%, var(--navy) 60%, color-mix(in oklab, var(--primary) 40%, var(--navy)) 100%);
--gradient-accent:linear-gradient(135deg, var(--primary) 0%, color-mix(in oklab, var(--primary) 70%, white) 100%);
}
*{box-sizing:border-box}
body{margin:0;font-family:"Inter",system-ui,sans-serif;color:var(--foreground);background:var(--background);-webkit-font-smoothing:antialiased;line-height:1.65}
h1,h2,h3,h4{font-family:"Sora","Inter",sans-serif;letter-spacing:-0.02em;line-height:1.12;margin:0}
img{display:block}
.container-x{width:100%;margin-inline:auto;padding-inline:1.25rem;max-width:80rem}
@media(min-width:768px){.container-x{padding-inline:2rem}}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.75rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--primary)}
.eyebrow.on-dark{color:rgba(255,255,255,.8)}.eyebrow.on-primary{color:var(--primary)}
.btn-primary,.btn-ghost,.btn-on-dark{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:9999px;padding:.75rem 1.5rem;font-weight:600;text-decoration:none;cursor:pointer;font-size:.95rem;border:none}
.btn-primary{background:var(--gradient-accent);color:var(--primary-foreground);box-shadow:var(--shadow-card)}
.btn-ghost{background:transparent;color:var(--navy-deep);border:1px solid var(--border)}
.btn-on-dark{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.2)}
.btn-primary.full,.btn-ghost.full{width:100%;margin-top:.5rem}
.sm-btn{padding:.55rem 1.1rem;font-size:.85rem}
.section{padding-block:4rem}.section.pt0{padding-top:0}
@media(min-width:768px){.section{padding-block:6rem}}
.secbg{background:oklch(0.975 0.006 250)}
.dark{background:var(--navy-deep);color:#fff}
.muted{color:var(--muted-foreground)}.muted.lg{font-size:1.05rem;margin-top:1rem}.sm{font-size:.85rem}
.white{color:#fff}.white70{color:rgba(255,255,255,.7)}.b{font-weight:600}
.h2{font-size:clamp(1.7rem,3.5vw,3rem);font-weight:700;margin-top:.6rem}
.h3{font-size:1.4rem;font-weight:700}
.card{background:var(--card);border:1px solid var(--border);border-radius:1rem;box-shadow:var(--shadow-card);transition:transform .25s,box-shadow .25s;text-decoration:none;color:inherit}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-elegant)}
.pad{padding:1.5rem}
.icon{display:grid;place-items:center;height:2.5rem;width:2.5rem;border-radius:.6rem;background:color-mix(in oklab,var(--primary) 15%,white);color:var(--primary);font-size:.8rem}
.icon.big{height:3rem;width:3rem;border-radius:.85rem;background:var(--navy-deep);color:#fff}
/* hero */
.hero{position:relative;overflow:hidden;color:#fff}
.hero .bg{position:absolute;inset:0;background:var(--gradient-hero)}
.hero .img{position:absolute;inset:0;opacity:.3;mix-blend-mode:overlay;background-size:cover;background-position:center}
.hero .inner{position:relative;padding-top:5rem;padding-bottom:6.5rem}
.hero.page .inner{padding-top:4.5rem;padding-bottom:5rem}
@media(min-width:768px){.hero .inner{padding-top:8rem;padding-bottom:9rem}.hero.page .inner{padding-top:6.5rem;padding-bottom:7rem}}
.hero h1{font-size:clamp(2.2rem,6vw,4.5rem);font-weight:700;color:#fff;margin-top:1rem;max-width:60rem}
.hero.page h1{font-size:clamp(2rem,5vw,3.7rem)}
.hero .sub{margin-top:1.4rem;font-size:1.1rem;color:rgba(255,255,255,.8);max-width:42rem}
.btns{margin-top:2rem;display:flex;gap:.75rem;flex-wrap:wrap}
.stats{margin-top:3rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:34rem}
.stats .k{font-family:"Sora";font-size:1.35rem;font-weight:700;color:#fff}
.stats .v{font-size:.72rem;color:rgba(255,255,255,.6);margin-top:.25rem}
/* layout helpers */
.split{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
.center{max-width:42rem;margin:0 auto 3rem;text-align:center}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:3rem;flex-wrap:wrap}
.grid{display:grid;gap:1.4rem}.g-2{grid-template-columns:repeat(2,1fr)}.g-3{grid-template-columns:repeat(3,1fr)}.g-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1023px){.g-3,.g-4{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr;gap:2.5rem}}
@media(max-width:639px){.g-2,.g-3,.g-4{grid-template-columns:1fr}}
.rimg{border-radius:1rem;width:100%;object-fit:cover;aspect-ratio:4/5;box-shadow:var(--shadow-elegant)}
.ticks{list-style:none;padding:0;margin:1.3rem 0 0}
.ticks li{position:relative;padding:.4rem 0 .4rem 1.7rem;font-size:.95rem}
.ticks li:before{content:"✓";position:absolute;left:0;color:var(--primary);font-weight:700}
.ticks.two{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
@media(max-width:560px){.ticks.two{grid-template-columns:1fr}}
/* service cards */
.scard{overflow:hidden;display:flex;flex-direction:column;position:relative}
.scard .ph{aspect-ratio:16/10;background-size:cover;background-position:center}
.scard .ph.wide{aspect-ratio:16/9}
.cbody{padding:1.5rem;display:flex;flex-direction:column;flex:1}
.crow{display:flex;align-items:center;gap:.75rem}
.crow h3{font-size:1.05rem;font-weight:600}
.num{color:var(--primary);font-weight:700;font-size:.9rem}
.link{margin-top:1rem;color:var(--primary);font-weight:600;font-size:.9rem}
.soon-badge{position:absolute;top:.75rem;right:.75rem;z-index:2;background:color-mix(in oklab,var(--navy-deep) 90%,transparent);color:#fff;font-size:11px;font-weight:600;padding:.25rem .6rem;border-radius:999px}
.acard{padding:1.5rem;position:relative;display:flex;flex-direction:column}
.acard h3{margin-top:1.2rem;font-size:1.05rem;font-weight:600}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:1.1rem 0 0}
.chip{font-size:.72rem;padding:.35rem .7rem;border-radius:999px;background:oklch(0.96 0.01 250);color:var(--navy)}
.alist{list-style:none;padding:0;margin:1rem 0 0;display:grid;grid-template-columns:1fr 1fr;gap:.3rem;font-size:.85rem;color:var(--muted-foreground)}
@media(max-width:520px){.alist{grid-template-columns:1fr}}
.wide{}
/* dark cards */
.card-w{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);border-radius:1rem;padding:1.5rem}
.card-w p{margin:.5rem 0 0}
/* testimonials */
.stars{color:var(--primary)}.q{margin:1rem 0;flex:1}.who{border-top:1px solid var(--border);padding-top:1rem;margin-top:1rem}
/* team */
.teamc{overflow:hidden}.teamc .ph{aspect-ratio:4/3;background-size:cover;background-position:center}
.note{margin-top:1rem;font-size:.8rem;color:#8a6d1e;background:#FBF3DD;border:1px solid #efe2bf;border-radius:.6rem;padding:.6rem .9rem}
/* detail */
.det{display:grid;grid-template-columns:2fr 1fr;gap:3rem;align-items:start}
@media(max-width:900px){.det{grid-template-columns:1fr}}
.itemgrid{margin-top:2rem}
.sm-card{display:flex;gap:.75rem;align-items:center;padding:1rem}
.chk{display:grid;place-items:center;height:1.8rem;width:1.8rem;border-radius:999px;background:color-mix(in oklab,var(--primary) 15%,white);color:var(--primary);flex-shrink:0}
.detaside{position:sticky;top:6rem;display:flex;flex-direction:column;gap:1rem}
.detaside .rimg{aspect-ratio:4/5}
.soonbanner{margin-top:1.5rem;border:1px solid var(--border);background:var(--accent);border-radius:1rem;padding:1rem 1.25rem;font-size:.9rem}
/* prose */
.prose{max-width:48rem}
.prose h2{font-size:clamp(1.4rem,2.5vw,1.9rem);font-weight:700;margin:2.5rem 0 .8rem}
.prose h3{font-size:1.1rem;font-weight:600;margin:1.4rem 0 .4rem}
.prose p{color:var(--muted-foreground);margin:0 0 .9rem}
.prose li{color:var(--muted-foreground);margin:.3rem 0 .3rem 1.2rem}
.narrow{max-width:48rem}
.faqs{margin-top:1.5rem;display:flex;flex-direction:column;gap:.6rem}
.faq{padding:1.1rem 1.25rem}
.faq summary{font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary span{color:var(--primary)}
.faq[open] summary span{transform:rotate(45deg)}
.faq p{margin:.8rem 0 0;color:var(--muted-foreground);font-size:.95rem}
/* cta */
.cta{position:relative;overflow:hidden;border-radius:1.5rem;color:#fff}
.cta .ctabg{position:absolute;inset:0;background:var(--gradient-hero)}
.cta .ctaimg{position:absolute;inset:0;opacity:.2;mix-blend-mode:overlay;background:url(https://images.unsplash.com/photo-1534438327276-14e5300c3a48?auto=format&fit=crop&w=1600&q=80) center/cover}
.ctainner{position:relative;padding:3.5rem 2rem;max-width:40rem}
@media(min-width:768px){.ctainner{padding:5rem 4rem}}
.ctainner h2{font-size:clamp(1.7rem,3.5vw,3rem);font-weight:700;color:#fff}
.ctainner p{color:rgba(255,255,255,.8);margin-top:1rem;font-size:1.05rem}
/* forms */
.field{border:1px solid var(--border);border-radius:.6rem;padding:.75rem .9rem;color:#9aa6b8;font-size:.9rem;background:#fff;margin-top:0}
.grid .field{margin:0}
.field.tall{padding-bottom:2.5rem;margin-top:1rem}
.cgrid{display:grid;grid-template-columns:2fr 3fr;gap:2.5rem}
.bgrid{display:grid;grid-template-columns:1fr 2fr;gap:2rem}
@media(max-width:900px){.cgrid,.bgrid{grid-template-columns:1fr}}
.cinfo{display:flex;flex-direction:column;gap:1rem}
.info{display:flex;gap:1rem;align-items:flex-start}
.maparea{border:1px solid var(--border);border-radius:1rem;height:11rem;display:grid;place-items:center;color:var(--muted-foreground);background:oklch(0.97 0.008 250);font-size:.9rem}
.chips2{display:flex;gap:.5rem;flex-wrap:wrap;margin:.5rem 0 1.2rem}
.chips2 .chip.on{background:color-mix(in oklab,var(--primary) 18%,white);color:var(--navy)}
.card.pad .grid{margin-top:1rem}
.card.pad .btn-primary{margin-top:1.2rem}
/* header/footer */
.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.row{display:flex;height:4.5rem;align-items:center;justify-content:space-between;gap:1.5rem}
.logo{display:flex;align-items:center;gap:.5rem;font-family:"Sora";font-weight:700;font-size:1.2rem;text-decoration:none;color:inherit}
.logo.light{color:#fff}
.mark{display:grid;place-items:center;height:2.1rem;width:2.1rem;border-radius:.55rem;background:var(--navy-deep);color:#fff;font-family:"Sora";font-weight:700}
.mark.light{background:#fff;color:var(--navy-deep)}
.nav{display:flex;align-items:center;gap:.2rem}
.nav a{padding:.5rem .75rem;font-size:.875rem;font-weight:500;color:var(--muted-foreground);text-decoration:none;border-radius:.5rem}
.nav a:hover,.nav a.active{color:var(--foreground);background:oklch(0.96 0.01 250)}
@media(max-width:920px){.nav{display:none}}
.foot{background:var(--navy-deep);color:rgba(255,255,255,.75)}
.foot .cols{padding:3.5rem 0;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2.5rem}
@media(max-width:768px){.foot .cols{grid-template-columns:1fr 1fr}}
.foot h4{color:#fff;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:1rem}
.fl{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem;font-size:.875rem}
.foot a{color:rgba(255,255,255,.75);text-decoration:none}.foot a:hover{color:#fff}
.muted2{color:rgba(255,255,255,.5);font-size:.85rem;margin-top:1rem}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding:1.2rem 0;font-size:.78rem;color:rgba(255,255,255,.5)}
.route{display:none}

/* --- enhancements --- */
.logo-img{height:42px;width:auto;display:block}
.navtoggle{display:none;background:none;border:1px solid var(--border);border-radius:.5rem;padding:.45rem .6rem;cursor:pointer;font-size:1.1rem;line-height:1}
@media(max-width:920px){.navtoggle{display:inline-flex}
  .nav{display:none}
  .nav.open{display:flex;position:absolute;top:4.5rem;left:0;right:0;flex-direction:column;align-items:stretch;background:#fff;border-bottom:1px solid var(--border);padding:.75rem 1.25rem 1.25rem;gap:.15rem;box-shadow:var(--shadow-card)}
  .nav.open a{padding:.7rem .5rem}
}
.wa-float{position:fixed;right:18px;bottom:18px;z-index:300;width:56px;height:56px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.28);transition:transform .2s}
.wa-float:hover{transform:scale(1.07)}
.wa-float svg{width:30px;height:30px;fill:#fff}
.ig-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.5rem}
@media(max-width:900px){.ig-grid{grid-template-columns:repeat(2,1fr)}}
.ig-item{aspect-ratio:1;border-radius:1rem;overflow:hidden;position:relative;display:block;background:var(--navy-deep)}
.ig-item img{width:100%;height:100%;object-fit:cover;opacity:.92;transition:opacity .2s,transform .3s}
.ig-item:hover img{opacity:1;transform:scale(1.05)}
.ig-item .play{position:absolute;top:8px;right:10px;color:#fff;font-size:.9rem;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.mapframe{width:100%;height:16rem;border:0;border-radius:1rem}
.founder{display:grid;grid-template-columns:0.9fr 1.4fr;gap:2.5rem;align-items:center}
@media(max-width:768px){.founder{grid-template-columns:1fr}}
.founder img{width:100%;border-radius:1rem;object-fit:cover;aspect-ratio:4/5;box-shadow:var(--shadow-elegant)}
input.field,select.field,textarea.field{width:100%;font-family:inherit;color:var(--foreground)}
textarea.field{min-height:6rem;resize:vertical}
