/* v3 redesign: clean, warm, premium. Loaded last on every page. */
@font-face{font-family:"Inter";src:url(/fonts/inter.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--teal:#0E5A5A;--teal-2:#17807A;--aqua:#7DD3C7;--coral:#FF8F72;--coral-2:#FF7A59;--sand:#EADCC8;--paper:#FBF9F6;
--ink:#13302F;--muted:#4D5E5C;--line:#E8E1D6;--bg:var(--paper);--alt:#F4EFE7;--brand:var(--teal);--brand-2:var(--teal-2);
--font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;--shadow:0 24px 48px -28px rgba(14,90,90,.35);--shadow-sm:0 1px 2px rgba(19,48,47,.05),0 8px 24px -16px rgba(19,48,47,.18)}
body{background:var(--paper);color:var(--ink);font-family:var(--font)}
a{color:var(--teal)}
h1,h2,h3{color:var(--teal)}
.eyebrow{background:none;padding:0;color:var(--teal-2);letter-spacing:.16em;font-size:.74rem}
/* Buttons: coral pills with arrow */
.btn{background:var(--coral);border:2px solid var(--coral);color:#0D2B2B;border-radius:999px;box-shadow:0 10px 24px -12px rgba(255,122,89,.7);font-weight:650}
.btn:not(.btn-ghost)::after{content:"\2192"/"";display:inline-block;margin-left:.5em;transition:transform .15s}
.btn:hover{background:var(--coral-2);border-color:var(--coral-2);color:#0D2B2B}
.btn:hover::after{transform:translateX(3px)}
.btn-small{border-radius:999px}
.btn-ghost{background:transparent;border-color:var(--teal);color:var(--teal)}
.btn-ghost:hover{background:#fff;border-color:var(--teal);color:var(--teal)}
.btn-light{background:var(--coral);border-color:var(--coral);color:#0D2B2B}
.btn:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:999px}
.cta-band .btn:focus-visible,.footer a:focus-visible{outline-color:var(--aqua)}
/* Nav + logo */
.nav{background:rgba(251,249,246,.92);border-bottom:1px solid var(--line);backdrop-filter:saturate(1.2) blur(8px)}
.nav-inner{height:72px}
.logo{color:var(--teal);font-weight:600;letter-spacing:-.03em;font-size:1.35rem;gap:10px}
.logo .logo-img{width:38px;height:28px;border-radius:0}
.nav-links a{color:var(--ink)}
.nav-links a:hover{color:var(--teal-2)}
/* Hero: split */
.hero{padding:72px 0 88px;background:linear-gradient(180deg,var(--paper) 0%,#F6F0E8 100%)}
.hero-grid{grid-template-columns:1.05fr .95fr;gap:56px;justify-items:stretch;text-align:left;align-items:center}
.hero-copy{max-width:none}
.hero h1{margin:.25em 0 .45em;max-width:none;color:var(--teal);font-size:clamp(2.3rem,4.4vw,3.6rem)}
.hero h1 .line{display:block}
.hero h1 .line+.line{color:var(--teal-2)}
.lead{margin:0;max-width:34em;color:var(--muted)}
.hero-ctas{justify-content:flex-start;margin:30px 0 12px}
.cta-sub{margin:0 0 22px;max-width:34em}
.hero-note{justify-content:flex-start}
.hero-note .pill{background:#fff;border-color:var(--line);color:var(--ink)}
.hero-note .pill svg{color:var(--teal-2)}
.hero-media{position:relative;margin:0}
.hero-media img{display:block;width:100%;height:auto;aspect-ratio:640/520;object-fit:cover;border-radius:28px;box-shadow:var(--shadow);background:var(--sand)}
.hero-media .hero-card{position:absolute;left:-36px;bottom:-40px;max-width:340px;padding:18px 20px;border-radius:20px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.hero-media .task-list li{padding:7px 0;font-size:.86rem}
.hero-media .card-foot{font-size:.75rem;margin:6px 0 0}
.tick{background:#E3F6F2;color:var(--teal)}
/* Sections + cards */
.section{padding:96px 0}
.section.alt,.alt{background:var(--alt)}
.card,.step,.faq details,.table-wrap{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-sm)}
.feature .icon,.step-num{background:#E3F6F2;color:var(--teal);border-color:var(--aqua)}
.feature .icon{border-radius:50%}
.ex-label,.try-step .time{background:#E3F6F2;color:var(--teal)}
.compare .hl{background:#EEF8F5;color:var(--ink)}
.compare th{color:var(--teal)}
.price-card{background:#fff;border:1px solid var(--line);box-shadow:0 0 0 6px #F1EADF,var(--shadow);border-radius:28px}
.price{color:var(--teal)}
.checks li::before{background:var(--teal-2)}
.quote blockquote{color:var(--teal)}
.quote cite{color:var(--muted)}
.cta-band{background:var(--teal);color:#fff;border-radius:32px;margin:0 24px 72px;padding:88px 0}
.cta-band h2{color:#fff}
.footer{background:#0B3F3F;color:#D7E8E5}
.footer a{color:#fff}
.footer .logo{color:#fff}
.fine,.sub{color:var(--muted)}
/* Legal pages */
.legal h1,.legal h2,.legal h3{color:var(--teal)}
.legal-table thead th,.legal-table tbody th{background:var(--alt)}
/* Responsive */
@media (max-width:900px){
 .hero{padding:48px 0 64px}
 .hero-grid{grid-template-columns:1fr;gap:40px}
 .hero-media .hero-card{position:static;max-width:none;margin-top:-48px;margin-left:16px;margin-right:16px}
 .cta-band{margin:0 12px 48px;border-radius:24px}
}
@media (max-width:600px){.hero h1 .line{display:block}.section{padding:64px 0}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.nav .btn-small{white-space:nowrap;font-size:.88rem;padding:.55em 1.05em}
.hero-media .hero-card{left:-28px;bottom:-36px;max-width:300px}
@media (min-width:901px){.hero-media img{aspect-ratio:auto;min-height:440px}}
@media (max-width:420px){.nav .btn-small{font-size:.8rem;padding:.5em .85em}.nav .btn-small::after{display:none}.logo{font-size:1.2rem}}
.hero-media .hero-card{left:-44px;bottom:-72px;max-width:280px}.hero{padding-bottom:120px}@media (max-width:900px){.hero{padding-bottom:64px}}
/* v3 hero photo */
.hero-media img{object-fit:cover;object-position:66% 30%}
.hero-media .hero-card{left:-44px;right:auto;top:auto;bottom:-72px;max-width:260px}
@media (min-width:901px){.hero-media .hero-card{bottom:-150px}.hero{padding-bottom:190px}}

/* v6: mobile hero — photo first */
@media (max-width:900px){
 .hero{padding-top:16px}
 .hero-grid{display:flex!important;flex-direction:column;gap:18px}
 .hero-media{display:contents!important}
 .hero-media img{order:-1;width:100%;aspect-ratio:16/10;max-height:260px;height:auto;object-fit:cover;object-position:50% 25%;border-radius:20px}
 .hero-copy{order:0}
 .hero-media .hero-card{order:1}
 .hero h1{font-size:clamp(30px,8.5vw,38px);margin:.2em 0 .4em}
 .hero .eyebrow{margin-top:0}
}
@media (max-width:900px){
 .hero{padding-top:12px}
 .hero-grid{gap:14px}
 .hero-media img{max-height:210px}
 .hero-copy p:not(.eyebrow):not(.hero-note){font-size:16px;line-height:1.5;margin-bottom:.6em}
 .hero h1{margin:.15em 0 .35em}
}