:root{
  --teal:#00789a; --teal-deep:#004a5d; --green:#3fae4f; --ink:#12181b; --text:#2b3438;
  --muted:#5d6a70; --line:#e2e8ea; --bg:#ffffff; --bg-alt:#f3f7f8; --radius:14px;
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--text);background:var(--bg);line-height:1.6;font-size:17px}
img,video{max-width:100%;display:block}
a{color:var(--teal)}
h1,h2,h3{font-family:"Space Grotesk","Inter",sans-serif;color:var(--ink);line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(2.2rem,5vw,3.6rem);letter-spacing:-.02em}
h2{font-size:clamp(1.7rem,3.4vw,2.4rem);letter-spacing:-.01em}
h3{font-size:1.2rem}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}

/* header */
.site-head{position:sticky;top:0;z-index:20;background:var(--ink);}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px}
.logo img{height:30px;width:auto}
.nav{display:flex;gap:4px;align-items:center}
.nav a{color:#dfe8eb;text-decoration:none;font-size:.95rem;padding:8px 12px;border-radius:8px}
.nav a:hover,.nav a[aria-current]{background:rgba(255,255,255,.1);color:#fff}
.nav .cta{background:var(--teal);color:#fff;margin-left:6px}
.nav .cta:hover{background:#0a8fb5}
.menu-btn{display:none;background:none;border:0;color:#fff;font-size:1.6rem;cursor:pointer;padding:6px}
@media (max-width:860px){
  .menu-btn{display:block}
  .nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--ink);flex-direction:column;align-items:stretch;padding:8px 16px 16px}
  .nav.open{display:flex}
  .nav .cta{margin:6px 0 0;text-align:center}
}

/* sections */
section{padding:72px 0}
.alt{background:var(--bg-alt)}
.dark{background:var(--ink);color:#c9d4d8}
.dark h1,.dark h2,.dark h3{color:#fff}
.eyebrow{display:inline-block;font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin-bottom:10px}
.dark .eyebrow{color:#5cc7e4}
.lead{font-size:1.2rem;color:var(--muted)}
.dark .lead{color:#b3c2c7}

.hero{padding:88px 0 72px;background:linear-gradient(160deg,var(--ink) 0%,var(--teal-deep) 100%);color:#d3e0e4}
.hero h1{color:#fff}
.hero .lead{color:#b9cdd3;max-width:40ch}

.split{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.split.rev>:first-child{order:2}
@media (max-width:860px){.split{grid-template-columns:1fr;gap:28px}.split.rev>:first-child{order:0}}

.media{border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(10,30,40,.12)}
.media img,.media video{width:100%;height:100%;object-fit:cover}
.media.contain img{object-fit:contain}

.btn{display:inline-block;padding:12px 22px;border-radius:10px;background:var(--teal);color:#fff;text-decoration:none;font-weight:600;border:2px solid var(--teal)}
.btn:hover{background:#0a8fb5;border-color:#0a8fb5}
.btn.ghost{background:transparent;color:var(--teal)}
.hero .btn.ghost,.dark .btn.ghost{color:#fff;border-color:rgba(255,255,255,.5)}
.btn.green{background:var(--green);border-color:var(--green)}
.btn.green:hover{background:#36994a;border-color:#36994a}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}

.grid{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.g2,.g3,.g4{grid-template-columns:1fr}}

.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.card .pic{aspect-ratio:4/3;background:var(--bg-alt);overflow:hidden;position:relative}
.card .pic img,.card .pic video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card .pic.contain img{object-fit:contain;padding:10px}
.card .body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.card .body p{color:var(--muted);font-size:.97rem}
.card .body .more{margin-top:auto;font-weight:600;text-decoration:none}

.feature h3{display:flex;align-items:center;gap:10px}
.feature h3::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--green);flex:none}
.feature p{color:var(--muted);font-size:.97rem}
.dark .feature p{color:#aebdc2}

.steps .card .pic{aspect-ratio:1/1;background:#000}
.steps .card .pic img{object-fit:contain}

.price{font-family:"Space Grotesk",sans-serif;font-size:1.05rem;color:var(--ink);font-weight:600}

.inquire{background:linear-gradient(160deg,var(--teal-deep),var(--teal));color:#e3f1f5;text-align:center}
.inquire h2{color:#fff}
.inquire .btn{background:#fff;color:var(--teal-deep);border-color:#fff}
.inquire .btn:hover{background:#e7f4f7}

details{border:1px solid var(--line);border-radius:12px;padding:16px 20px;background:#fff;margin-bottom:12px}
summary{cursor:pointer;font-weight:600;color:var(--ink)}
details p{margin:.8em 0 0;color:var(--muted)}

.site-foot{background:var(--ink);color:#93a4aa;padding:48px 0 32px;font-size:.93rem}
.site-foot a{color:#cfe0e5;text-decoration:none}
.site-foot a:hover{text-decoration:underline}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}
.foot-grid h4{color:#fff;margin:0 0 10px;font-size:.95rem}
.foot-grid ul{list-style:none;margin:0;padding:0}
.foot-grid li{margin:4px 0}
.copy{border-top:1px solid #243036;margin-top:32px;padding-top:18px}
@media (max-width:700px){.foot-grid{grid-template-columns:1fr}}

.narrow{max-width:760px}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}
.mt{margin-top:32px}