@font-face{font-family:"Druk";src:url(assets/DrukHeavy.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"Archivo";src:url(assets/Archivo-ExtraBold.woff2) format("woff2");font-weight:800;font-display:swap}
:root{--ink:#15130f;--bone:#f4eedf;--paper:#fffaf0;--muted:#766f62;--lime:#c9ff3b;--cobalt:#2457ff;--r-md:16px;--sp-2:14px;--sp-3:22px;--sp-4:36px;--sp-5:64px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bone);color:var(--ink);font:650 17px/1.5 system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif}
h1,h2,h3{font-family:"Druk",Impact,"Arial Narrow Bold",sans-serif;font-weight:900;text-transform:uppercase;letter-spacing:-.02em;line-height:.9;margin:0}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.btn{display:inline-block;font-family:"Archivo",system-ui,sans-serif;font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:.01em;text-decoration:none;padding:14px 22px;border:3px solid var(--ink);border-radius:999px;background:var(--lime);color:var(--ink);box-shadow:4px 4px 0 var(--ink)}
.btn.ghost{background:var(--paper)}
.phone{display:block;width:100%;border:4px solid var(--ink);border-radius:36px;box-shadow:8px 8px 0 var(--ink);background:var(--ink)}
.legal{font-family:"Archivo",system-ui,sans-serif;font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.02em}
.hero{background:var(--cobalt);color:var(--paper);overflow:hidden;position:relative;min-height:100svh;display:grid;grid-template-columns:1fr 1fr;align-items:end}
.hero .pic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:left bottom}
.hero .txt{position:relative;padding:var(--sp-5) 20px var(--sp-4) max(20px,calc((100vw - 1180px)/2))}
.hero .top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.hero .brand{font-family:"Archivo",sans-serif;font-weight:800;text-transform:uppercase;font-size:14px;display:inline-block;background:var(--lime);color:var(--ink);border:3px solid var(--ink);padding:8px 14px;border-radius:999px}
.hero .lang{color:var(--paper);text-decoration:none;border:2px solid var(--paper);border-radius:999px;padding:6px 12px}
.hero h1{font-size:clamp(56px,9vw,150px);margin:var(--sp-3) 0}
.hero h1 em{font-style:normal;color:var(--lime)}
.hero p{font-size:clamp(18px,1.8vw,24px);max-width:24ch;font-weight:700;margin:0 0 var(--sp-4)}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.hero .shot{position:relative;align-self:end;padding:var(--sp-5) max(20px,calc((100vw - 1180px)/2)) 0 20px}
.hero .shot img{max-width:340px;margin:0 0 -60px auto;transform:rotate(-3deg)}
.corp{padding:var(--sp-5) 0}
.corp .grid{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--sp-5);align-items:start}
.corp h2{font-size:clamp(40px,6vw,88px);margin-bottom:var(--sp-3)}
.corp p{max-width:52ch;margin:0 0 var(--sp-2)}
.card{background:var(--paper);border:4px solid var(--ink);border-radius:var(--r-md);box-shadow:8px 8px 0 var(--ink);padding:var(--sp-3)}
.card h3{font-size:30px;margin-bottom:var(--sp-2)}
.card dl{margin:0;font-size:15px}
.card dt{color:var(--muted);font-family:"Archivo",sans-serif;text-transform:uppercase;font-size:12px;margin-top:12px}
.card dd{margin:2px 0 0}
footer{background:var(--ink);color:var(--bone);padding:var(--sp-4) 0;font-size:14px;font-weight:700}
footer p{margin:6px 0}
footer a{color:var(--lime)}
header.bar{border-bottom:4px solid var(--ink);padding:18px 0}
header.bar .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px}
header.bar a.home{font-family:"Druk",Impact,sans-serif;font-size:28px;text-transform:uppercase;text-decoration:none;line-height:1}
main.doc{padding-top:var(--sp-5);padding-bottom:var(--sp-5)}
main.doc h1{font-size:clamp(44px,8vw,96px);margin-bottom:var(--sp-4)}
main.doc dl{max-width:72ch;margin:0;border-top:2px solid var(--ink)}
main.doc dt{font-family:"Archivo",sans-serif;font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.02em;color:var(--muted);padding-top:18px}
main.doc dd{margin:4px 0 18px;border-bottom:1px dashed var(--muted);padding-bottom:18px}
main.doc dd:last-child{border:0}
@media(max-width:760px){.hero{grid-template-columns:1fr;min-height:0}.hero .shot{padding-top:0}.hero .shot img{max-width:260px;margin:0 auto -40px}.hero .txt{padding-top:var(--sp-4);background:linear-gradient(180deg,var(--cobalt) 78%,rgba(36,87,255,0))}.corp .grid{grid-template-columns:1fr;gap:var(--sp-4)}}

/* Motion. Entrance once on load, feedback on buttons. Transform and opacity only. */
@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes settle{from{opacity:0;transform:translateY(48px) rotate(-8deg)}to{opacity:1;transform:rotate(-3deg)}}
@keyframes zoomout{from{transform:scale(1.06)}to{transform:none}}
.hero .txt>*{animation:rise 520ms cubic-bezier(.32,.72,0,1) both}
.hero .txt>:nth-child(2){animation-delay:70ms}
.hero .txt>:nth-child(3){animation-delay:140ms}
.hero .txt>:nth-child(4){animation-delay:210ms}
.hero .shot img{animation:settle 720ms cubic-bezier(.32,.72,0,1) 120ms both}
.hero .pic{animation:zoomout 1400ms cubic-bezier(.2,.7,.2,1) both;transform-origin:left bottom}
.btn{transition:transform 120ms ease-out,box-shadow 120ms ease-out}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink);transition-duration:60ms}
.hero .lang{transition:background-color 120ms ease-out,color 120ms ease-out}
.hero .lang:hover{background:var(--paper);color:var(--cobalt)}
@media(prefers-reduced-motion:reduce){
  .hero .txt>*,.hero .shot img,.hero .pic{animation:none;opacity:1;transform:none}
  .hero .shot img{transform:rotate(-3deg)}
  .btn,.hero .lang{transition:none}
  .btn:hover,.btn:active{transform:none;box-shadow:4px 4px 0 var(--ink)}
}