:root{--bg:#eaf0f1;--paper:#f7fafa;--ink:#0f2b3a;--petrol:#14485a;--deep:#0b2230;--sun:#e3a72f;--mute:#53697a;--line:#c6d3d8;--max:1280px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{font-family:"Public Sans",system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.65;font-size:17px}
h1,h2,h3{font-family:"Bricolage Grotesque","Public Sans",sans-serif;line-height:1.1;letter-spacing:-.02em}
a{color:inherit}
.wrap{width:min(var(--max),100% - 48px);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:99}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.btn{display:inline-block;background:var(--petrol);color:#fff;text-decoration:none;font-weight:600;padding:15px 28px;border:2px solid var(--petrol);border-radius:2px;cursor:pointer;font:600 1rem "Public Sans",sans-serif;transition:background .2s,transform .2s}
.btn:hover{background:var(--deep);border-color:var(--deep);transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--petrol)}.btn.ghost:hover{background:var(--petrol);color:#fff}
.btn.small{padding:9px 18px;font-size:.95rem}
.site-header{position:sticky;top:0;z-index:50;background:rgba(234,240,241,.96);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:72px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:700 1.15rem "Bricolage Grotesque",sans-serif}
.mark{width:22px;height:22px;background:var(--petrol);border-bottom:6px solid var(--sun)}
.nav{display:flex;align-items:center;gap:34px}
.nav a:not(.btn){text-decoration:none;font-weight:500;position:relative}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:2px;background:var(--sun);transition:width .25s}
.nav a:not(.btn):hover::after{width:100%}
.menu-btn{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;position:relative}
.menu-btn span{position:absolute;left:10px;right:10px;height:2px;background:var(--ink);transition:.25s}
.menu-btn span:first-child{top:17px}.menu-btn span:last-child{top:26px}
.menu-btn[aria-expanded=true] span:first-child{top:21px;transform:rotate(45deg)}
.menu-btn[aria-expanded=true] span:last-child{top:21px;transform:rotate(-45deg)}
/* hero */
.hero{padding:72px 0 0}
.hero-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}
.chip{display:inline-block;border-left:4px solid var(--sun);padding-left:12px;color:var(--mute);font-weight:500;margin-bottom:26px}
.hero h1{font-size:clamp(2.6rem,5.6vw,5rem);font-weight:700;margin-bottom:28px}
.lead{font-size:1.2rem;color:var(--mute);max-width:60ch;margin-bottom:34px}
.actions{display:flex;gap:14px;flex-wrap:wrap}
.hero-art{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 150px;gap:14px;min-height:480px;animation:rise .9s ease both}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.block{padding:30px;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .3s}
.block:hover{transform:translateY(-4px)}
.block h2{font-size:1.6rem;margin-bottom:10px}.block p{font-size:.98rem}
.b1{background:var(--petrol);color:#fff;grid-row:1/2;min-height:300px}
.b2{background:var(--paper);border:1px solid var(--line);margin-top:56px;border-top:6px solid var(--sun)}
.b3{grid-column:1/3;background:var(--deep);color:#cfe0e6;flex-direction:row;align-items:flex-end;background-image:repeating-linear-gradient(90deg,transparent 0 46px,rgba(255,255,255,.06) 46px 47px)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:72px;border-top:1px solid var(--ink)}
.facts p{padding:26px 28px 30px 0;color:var(--mute);font-size:.98rem}
.facts p+p{padding-left:28px;border-left:1px solid var(--line)}
.facts strong{display:block;color:var(--ink);font:700 1.3rem "Bricolage Grotesque",sans-serif;margin-bottom:6px}
/* about */
.about{padding:110px 0;background:var(--paper)}
.about-grid{display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:start}
.sticky{position:sticky;top:104px}
.about h2,.why h2,.contact h2,.sec-head h2{font-size:clamp(2rem,3.6vw,3.2rem)}
.panel{margin-top:40px;background:var(--bg);padding:30px;border-left:6px solid var(--petrol)}
.panel h3{font-size:1.25rem;margin-bottom:16px}
.panel ol{padding-left:22px;color:var(--mute)}.panel li{margin-bottom:10px;padding-left:6px}
.prose p{margin-bottom:22px;font-size:1.08rem;max-width:68ch}
.minis{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:44px;border-top:2px solid var(--ink)}
.minis div{padding:22px 20px 0 0}.minis div+div{padding-left:20px;border-left:1px solid var(--line)}
.minis h3{font-size:1.1rem;margin-bottom:8px}.minis p{font-size:.95rem;color:var(--mute);margin:0}
/* services */
.services{padding:110px 0}
.sec-head{display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:end;margin-bottom:56px}
.sec-head p{color:var(--mute);font-size:1.1rem}
.svc-list{list-style:none;border-top:2px solid var(--ink)}
.svc-list li{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;padding:34px 24px 34px 0;border-bottom:1px solid var(--line);transition:background .25s,padding .25s}
.svc-list li:hover{background:var(--paper);padding-left:24px}
.svc-list h3{font-size:1.6rem;margin-bottom:8px}
.svc-list p{color:var(--mute);max-width:70ch}
.tags{font-weight:600;font-size:.9rem;color:var(--petrol);border:1px solid var(--petrol);padding:6px 14px;border-radius:99px;white-space:nowrap}
/* why */
.why{padding:110px 0;background:var(--deep);color:#e4eef1}
.why h2{margin-bottom:56px;max-width:18ch}
.why-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:28px}
.why article{grid-column:span 2;padding-top:22px;border-top:3px solid var(--sun)}
.why article:nth-child(4){grid-column:2/4}.why article:nth-child(5){grid-column:4/6}
.why h3{font-size:1.4rem;margin-bottom:12px;color:#fff}.why p{color:#aac1ca}
/* contact */
.contact{padding:110px 0}
.contact-grid{display:grid;grid-template-columns:5fr 6fr;gap:80px;align-items:start}
.contact .lead{margin:22px 0 36px}
.details div{padding:16px 0;border-top:1px solid var(--line)}
.details dt{font-weight:600;color:var(--mute);font-size:.92rem}.details dd{font-size:1.08rem}
.details a{color:var(--petrol);font-weight:600}
.form{background:var(--paper);padding:40px;border-top:6px solid var(--petrol);display:grid;gap:20px}
.form label{display:grid;gap:7px;font-weight:600;font-size:.95rem}
.opt{font-weight:400;color:var(--mute)}
.form input:not([type=checkbox]),.form select,.form textarea{font:400 1rem "Public Sans",sans-serif;padding:13px 14px;border:1px solid #9fb2ba;background:#fff;border-radius:2px;color:var(--ink);width:100%}
.form .check{display:flex;gap:10px;font-weight:400;align-items:flex-start}.check input{margin-top:6px}
.err{color:#a3261c;font-weight:500;min-height:0}
.form .invalid{border-color:#a3261c!important}
.status{font-weight:600;color:var(--petrol)}
/* footer */
.site-footer{background:var(--deep);color:#aac1ca;padding:54px 0 24px}
.foot{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap}
.foot strong{color:#fff;font-family:"Bricolage Grotesque",sans-serif;font-size:1.15rem}.foot p{margin-top:10px}
.foot nav{display:flex;gap:26px;flex-wrap:wrap}.foot a{text-decoration:none}.foot a:hover{color:#fff}
.legal{margin-top:40px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-size:.9rem}
/* reveal: one gentle entrance per block */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s,transform .7s}
.js .reveal.in{opacity:1;transform:none}
@media (max-width:980px){
  .hero-grid,.about-grid,.contact-grid,.sec-head{grid-template-columns:1fr;gap:44px}
  .sticky{position:static}.hero-art{min-height:0}
  .why-grid{grid-template-columns:1fr 1fr}.why article,.why article:nth-child(4),.why article:nth-child(5){grid-column:auto}
}
@media (max-width:760px){
  body{font-size:16px}
  .menu-btn{display:block}
  .nav{position:absolute;top:72px;left:0;right:0;background:var(--paper);flex-direction:column;align-items:flex-start;gap:0;padding:8px 24px 24px;border-bottom:1px solid var(--line);display:none}
  .nav.open{display:flex}.nav a:not(.btn){padding:14px 0;width:100%}.nav .btn{margin-top:10px}
  .hero{padding-top:44px}.facts,.minis{grid-template-columns:1fr}
  .facts p+p,.minis div+div{padding-left:0;border-left:0;border-top:1px solid var(--line)}
  .about,.services,.why,.contact{padding:72px 0}
  .svc-list li{grid-template-columns:1fr;gap:14px}.svc-list h3{font-size:1.3rem}
  .why-grid{grid-template-columns:1fr}.form{padding:26px 20px}
  .hero-art{grid-template-columns:1fr}.b1{min-height:220px}.b2{margin-top:0}.b3{grid-column:auto}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.js .reveal{opacity:1;transform:none}}