/* DESS brand tokens, taken from the logo */
:root{--navy:#0a2a52;--blue:#0a6fc9;--sky:#e8f2fc;--gold:#f5b301;--ink:#15233a;--muted:#5b6b82;--line:#dbe3ee;--r:10px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:#fff;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}
h1,h2,h3{line-height:1.15;letter-spacing:-.01em}
h2{font-size:clamp(1.7rem,4.5vw,2.5rem);margin-bottom:28px;color:var(--navy)}
h3{font-size:1.15rem}
.ico{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border-radius:var(--r);font-weight:700;text-decoration:none;border:2px solid transparent;cursor:pointer;font-size:1rem;font-family:inherit;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:var(--gold);color:var(--navy)}
.btn-gold:hover{background:#ffc62e}
.btn-ghost{border-color:#fff;color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12)}
.btn-blue{background:var(--blue);color:#fff}
.btn-blue:hover{background:#0858a2}
.btn-wa{background:#1fa855;color:#fff}
.btns{display:flex;flex-wrap:wrap;gap:12px}

/* Nav */
.nav{position:sticky;top:0;z-index:50;background:#050d1a;border-bottom:3px solid var(--gold)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand img{height:34px;width:auto}
.burger{display:flex;flex-direction:column;gap:5px;background:none;border:0;padding:12px;cursor:pointer}
.nav .brand img{height:50px}
.burger span{width:24px;height:2px;background:#fff;transition:transform .25s,opacity .25s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.menu{position:absolute;top:75px;left:0;right:0;background:#050d1a;display:flex;flex-direction:column;padding:8px 20px 20px;border-bottom:3px solid var(--gold);max-height:0;overflow:hidden;visibility:hidden;opacity:0;transition:opacity .25s,max-height .3s,visibility .3s}
.menu.open{max-height:420px;visibility:visible;opacity:1}
.menu a{padding:13px 0;text-decoration:none;font-weight:600;color:#fff;border-bottom:1px solid rgba(255,255,255,.14)}
.menu a:not(.btn):hover{color:var(--gold)}
.menu .nav-cta{margin-top:14px;border:0;text-align:center;color:var(--navy)}

/* Hero */
.hero{background:var(--navy);color:#fff;padding:56px 0 64px;border-bottom:6px solid var(--gold)}
.hero-in{display:grid;gap:40px}
.hero h1{font-size:clamp(2.3rem,8vw,4rem);margin-bottom:18px}
.lead{font-size:1.15rem;color:#cfdcee;max-width:34em;margin-bottom:28px}
.wa-link{display:inline-block;margin-top:18px;color:var(--gold);font-weight:600}
.hero-visual{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.slot{background:#e4ebf4;color:var(--muted);border:2px dashed #aebdd1;border-radius:var(--r);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;padding:20px;min-height:140px;font-size:.9rem}
.slot b{color:var(--navy);font-size:1.05rem}
.hero-visual .slot{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);color:#cfdcee}
.hero-visual .slot b{color:#fff}
.hero-visual .ico{color:var(--gold)}
.slot-main{grid-column:1/-1;min-height:200px}

/* Strip */
.strip{background:var(--sky)}
.strip-in{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;padding-block:22px}
.strip-in li{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--navy);font-size:.95rem}
.strip .ico{width:22px;height:22px;flex:none;color:var(--blue);stroke-width:2.4}

/* Sections */
.sec{padding:64px 0}
.tint{background:#f4f7fb}
.sub{color:var(--muted);margin:-12px 0 24px}
.cards{display:grid;gap:18px}
.card{border:1px solid var(--line);border-top:4px solid var(--blue);border-radius:var(--r);padding:28px 24px;background:#fff;transition:box-shadow .2s,transform .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(10,42,82,.1)}
.card .ico{color:var(--blue);margin-bottom:14px}
.c-solar{border-top-color:var(--gold)}.c-solar .ico{color:#d99a00}
.card p{color:var(--muted);margin:8px 0 16px}
.more{font-weight:700;color:var(--blue);text-decoration:none}
.more:hover{text-decoration:underline}

/* Why */
.dark{background:var(--navy);color:#fff}
.dark h2{color:#fff}
.why{display:grid;gap:26px}
.why>div{border-left:3px solid var(--gold);padding-left:18px}
.why p{color:#cfdcee;margin-top:6px}

/* About */
.about{display:grid;gap:32px;align-items:center}
.slot-tall{min-height:280px}
.big{font-size:1.2rem;color:var(--navy);margin-bottom:14px}
.about p:last-child{color:var(--muted)}

/* Steps */
.steps{list-style:none;padding:0;display:grid;gap:16px;counter-reset:s}
.steps li{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px}
.steps span{flex:none;width:48px;height:48px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:800}

/* Gallery + testimonials */
.gallery{display:grid;grid-template-columns:1fr;gap:12px}
.gallery .slot,.shot{margin:0;aspect-ratio:1/1}
.shot{position:relative;overflow:hidden;border-radius:var(--r)}
.shot img{width:100%;height:100%;object-fit:cover}
.shot figcaption{position:absolute;left:12px;bottom:12px;background:var(--navy);color:#fff;font-weight:700;font-size:.9rem;padding:6px 14px;border-radius:6px;border-left:3px solid var(--gold)}
.hero-photo{grid-column:1/-1;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r)}
.about-photo{width:100%;max-height:540px;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:var(--r)}
.quote{border:1px solid var(--line);border-top:4px solid var(--gold);border-radius:var(--r);padding:24px;background:#fff;color:var(--ink)}
.quote cite small{display:block;font-weight:400;font-size:.8rem;color:var(--muted)}
.quote cite{display:block;margin-top:12px;font-style:normal;font-weight:600;color:var(--navy)}

/* CTA */
.cta{background:var(--blue);color:#fff;padding:60px 0;text-align:center}
.cta h2{color:#fff;max-width:20em;margin-inline:auto}
.cta p{max-width:34em;margin:-8px auto 26px;color:#e3effc}
.cta .btns{justify-content:center}

/* Contact */
.contact{display:grid;gap:36px}
address{font-style:normal;line-height:2;color:var(--muted)}
address a{color:var(--blue);font-weight:600}
form{display:grid;gap:14px}
label{display:grid;gap:6px;font-weight:600;color:var(--navy);font-size:.95rem}
input,select,textarea{font:inherit;padding:13px 14px;border:1.5px solid #b9c6d8;border-radius:8px;background:#fff;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(10,111,201,.18)}
.invalid{border-color:#c62828!important}
.err{color:#c62828;font-size:.85rem;font-weight:500}
.status{font-weight:600;min-height:1.4em}
.status.ok{color:#1b7a3d}

/* Footer */
.foot{background:#071d3a;color:#b9c8dd;padding-top:48px}
.foot-in{display:grid;gap:30px}
.foot-logo{display:inline-block;background:#fff;padding:8px 12px;border-radius:8px;margin-bottom:12px}
.foot h3{color:#fff;margin-bottom:10px}
.foot-in div>a,.foot-in div>span{display:block;padding:4px 0;text-decoration:none}
.foot a:hover{color:var(--gold)}
.social{display:flex;gap:8px;margin-top:10px}
.social a{width:40px;height:40px;border:1px solid #35537c;border-radius:50%;display:grid!important;place-items:center;font-size:.8rem;font-weight:700;padding:0!important}
.copy{border-top:1px solid #1d3a63;margin-top:36px;padding:18px 20px;text-align:center;font-size:.85rem}

/* Fade-in (only when JS is on) */
.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s,transform .6s}
.js .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}.js .reveal{opacity:1;transform:none}}

/* Tablet and up */
@media(min-width:760px){
  .cards,.why{grid-template-columns:repeat(3,1fr)}
  .why{grid-template-columns:repeat(2,1fr)}
  .strip-in{grid-template-columns:repeat(4,1fr)}
  .cards-4{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(3,1fr)}
  .gallery .slot,.shot{aspect-ratio:4/5}
  .steps{grid-template-columns:repeat(2,1fr)}
  .about,.contact{grid-template-columns:1fr 1fr}
  .foot-in{grid-template-columns:1.5fr 1fr 1fr 1fr}
}
@media(min-width:960px){
  .burger{display:none}
  .brand img{height:40px}
  .nav .brand img{height:64px}
  html{scroll-padding-top:100px}
  .nav-in{height:96px}
  .menu{position:static;background:none;flex-direction:row;align-items:center;gap:22px;padding:0;border:0;max-height:none;visibility:visible;opacity:1;overflow:visible}
  .menu a{border:0;padding:6px 0;font-size:.95rem}
  .menu .nav-cta{margin:0;padding:10px 18px;min-height:44px;color:var(--navy)}
  .hero{padding:88px 0}
  .hero-in{grid-template-columns:1.1fr .9fr;align-items:center}
  .steps{grid-template-columns:repeat(4,1fr)}
  .steps li{flex-direction:column;align-items:flex-start}
  .why,.cards-4{grid-template-columns:repeat(4,1fr)}
}