:root{--navy:#011834;--navy2:#06244a;--blue:#1e8fff;--sky:#4fb3ff;--yellow:#ffd52e;--wa:#25d366;--ink:#0b1a2e;--muted:#5b6b80;--bg:#f4f7fb;--r:16px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:17px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{line-height:1.1;margin:0 0 .5em;font-weight:900;letter-spacing:-.01em}
h2{font-size:clamp(1.6rem,4.5vw,2.3rem);text-transform:uppercase;text-align:center;color:var(--navy)}
section{padding:56px 20px}
.top{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;justify-content:flex-end;align-items:center;padding:12px 14px}
.brand{display:none}
.langs{display:flex;gap:4px;background:rgba(1,24,52,.55);backdrop-filter:blur(6px);padding:4px;border-radius:999px}
.langs button{font:700 12px/1 system-ui,sans-serif;color:#cfe3ff;background:none;border:0;padding:7px 8px;border-radius:999px;cursor:pointer;letter-spacing:.04em}
.langs button[aria-pressed=true]{background:var(--yellow);color:var(--navy)}
/* hero */
.hero{position:relative;overflow:hidden;color:#fff;padding:60px 20px 28px;background:radial-gradient(120% 70% at 85% 10%,#0d4d9a 0,transparent 60%),radial-gradient(80% 60% at 0 100%,#0a3b7a 0,transparent 60%),var(--navy);display:grid;gap:8px}
.hero-img{position:absolute;right:-30px;top:0;bottom:0;width:58%;max-width:420px;opacity:.45;-webkit-mask-image:linear-gradient(to left,#000 45%,transparent);mask-image:linear-gradient(to left,#000 45%,transparent)}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:top}
.hero-text{position:relative;z-index:1;max-width:620px}
.hero-logo img{width:190px;margin:0 0 14px -8px;mix-blend-mode:lighten}
.noanswer{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:6px;max-width:240px}
.noanswer li{display:grid;grid-template-columns:1fr auto;align-items:center;border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:4px}
.noanswer b{font-size:15px;text-transform:uppercase;font-weight:900;font-style:italic}
.noanswer span{grid-column:1;font-size:11px;text-transform:uppercase;color:#b9cbe4;letter-spacing:.05em}
.noanswer i{grid-row:1/3;grid-column:2;font-style:normal;background:#ef2b3a;color:#fff;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:900}
h1{text-transform:uppercase;font-style:italic;margin:0 0 6px;transform:rotate(-3deg);transform-origin:left}
h1 .hl{display:inline-block;background:var(--yellow);color:var(--navy);padding:2px 12px;font-size:clamp(1.5rem,6.5vw,2.6rem)}
h1 .big{display:block;font-size:clamp(2.6rem,12vw,4.6rem);text-shadow:0 3px 0 rgba(0,0,0,.25)}
.sub{font-weight:800;font-style:italic;text-transform:uppercase;font-size:clamp(1rem,4.4vw,1.3rem);margin:0 0 22px;border-bottom:4px solid var(--yellow);display:inline-block;padding-bottom:4px;transform:rotate(-3deg);transform-origin:left}
.ctas{display:grid;gap:10px;max-width:420px}
.btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;border-radius:14px;font-weight:800;font-size:18px;text-decoration:none;padding:0 18px}
.btn svg{width:26px;height:26px;flex:none}
.btn.wa{background:var(--wa);color:#04210f;box-shadow:0 8px 24px rgba(37,211,102,.35)}
.btn.call{background:#fff;color:var(--navy)}
.avail{display:flex;align-items:center;gap:8px;font-size:14px;color:#cfe3ff;margin:16px 0 0}
.dot{width:9px;height:9px;border-radius:50%;background:var(--wa);box-shadow:0 0 0 4px rgba(37,211,102,.25)}
.wave{display:block;width:100%;height:40px;background:var(--navy);margin-top:-1px}
/* badges */
.badges{background:var(--navy2);color:#fff;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 12px 26px;text-align:center}
.badges div{display:grid;justify-items:center;align-content:start;gap:6px;font-weight:800;text-transform:uppercase;font-size:11px;line-height:1.25}
.badges svg{width:42px;height:42px;padding:9px;border:2px solid #fff;border-radius:50%;color:var(--sky)}
/* services */
.cards{display:grid;gap:16px;max-width:1100px;margin:0 auto}
.card{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:0 6px 20px rgba(1,24,52,.08);border:1px solid #d9e6f5;padding-bottom:18px}
.card img{width:100%;aspect-ratio:16/9;object-fit:cover}
.card h3{color:var(--navy);text-transform:uppercase;font-size:1.2rem;margin:16px 18px 6px}
.card p{margin:0 18px;color:#2c3d52;font-size:15.5px}
.card .tag{margin-top:12px;display:inline-block;background:var(--yellow);color:var(--navy);font-weight:800;font-style:italic;padding:6px 10px;border-radius:4px;transform:rotate(-2deg)}
/* work */
.work{background:var(--navy);color:#fff;display:grid;gap:24px;align-items:center;justify-items:center}
.work h2{color:#fff}
.work-video{width:100%;max-width:480px;border-radius:var(--r);overflow:hidden;border:3px solid var(--blue);box-shadow:0 10px 40px rgba(30,143,255,.25);background:#000}
.work-video video{width:100%}
.work-text{max-width:520px}
.caption{text-align:center;color:var(--yellow);font-weight:700;margin:0 0 14px}
.ba{margin:0;padding-left:1.3em;color:#d6e5f7}
.ba li{margin:4px 0}
/* how */
.steps{list-style:none;padding:0;margin:0 auto;max-width:1000px;display:grid;gap:14px}
.steps li{background:#fff;border-radius:var(--r);padding:20px 20px 18px 74px;position:relative;border:1px solid #d9e6f5}
.steps .n{position:absolute;left:18px;top:18px;width:40px;height:40px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:900;font-size:20px}
.steps h3{font-size:1.1rem;margin-bottom:4px;color:var(--navy)}
.steps p{margin:0;color:var(--muted)}
/* why */
.why{background:#fff;display:grid;gap:26px;justify-items:center}
.why-text{max-width:620px}
.whylist{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.whylist li{padding-left:34px;position:relative}
.whylist li::before{content:"";position:absolute;left:0;top:4px;width:22px;height:22px;border-radius:50%;background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12l4 4 8-8' fill='none' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat}
.whylist b{display:block;color:var(--navy)}
.whylist span{color:var(--muted);font-size:15.5px}
.why-img{margin:0;max-width:520px}
.why-img img{border-radius:var(--r)}
.why-img figcaption{text-align:center;color:var(--muted);font-size:14px;margin-top:6px}
/* area */
.area{text-align:center}
.area>p{max-width:620px;margin:0 auto 18px;color:var(--muted)}
.towns{list-style:none;padding:0;margin:0 auto;max-width:900px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.towns li{background:#fff;border:1px solid #cfe0f3;color:var(--navy);border-radius:999px;padding:6px 14px;font-size:15px;font-weight:600}
/* cta band */
.cta-band{background:linear-gradient(180deg,#0b3a75,var(--navy));color:#fff;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px 34px;padding:40px 20px}
.bigwa{display:flex;align-items:center;gap:14px;text-decoration:none}
.bigwa svg{width:64px;height:64px;color:#fff;background:var(--wa);border-radius:50%;padding:10px}
.bigwa small{display:block;text-transform:uppercase;font-weight:800;font-size:15px}
.bigwa strong{display:block;font-size:2.2rem;line-height:1;color:var(--wa);font-weight:900;text-transform:uppercase}
.bigtel{display:flex;align-items:center;gap:12px;font-size:clamp(1.6rem,7vw,2.4rem);font-weight:900;text-decoration:none;white-space:nowrap}
.bigtel svg{width:48px;height:48px;background:var(--blue);border-radius:50%;padding:11px}
/* footer */
.foot{background:var(--navy);color:#fff;text-align:center;padding:30px 20px 110px}
.local{font-style:italic;font-weight:800;font-size:1.35rem;margin:0 0 14px;text-decoration:underline var(--yellow) 4px;text-underline-offset:6px}
.who{list-style:none;padding:0;margin:0 0 14px;display:flex;justify-content:center;gap:0;text-transform:uppercase;font-weight:700;font-size:13px}
.who li{padding:0 14px}.who li+li{border-left:1px solid rgba(255,255,255,.3)}
.motto{font-style:italic;font-weight:800;font-size:1.2rem;margin:0 0 16px}
.small{font-size:13px;color:#9db3cf;margin:0}
/* floating WA */
.fab{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:62px;height:62px;border-radius:50%;background:var(--wa);color:#fff;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.3);z-index:10}
.fab svg{width:34px;height:34px}
@media (min-width:720px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(3,1fr)}
  .steps li{padding:64px 20px 20px}
  .badges div{font-size:14px;grid-template-columns:auto auto;justify-content:center;text-align:left;align-items:center;gap:10px}
}
@media (min-width:1000px){
  section{padding:80px 40px}
  .top{padding:16px 28px}
  .hero{min-height:640px;padding:80px 60px 40px;grid-template-columns:1.1fr .9fr;align-items:center}
  .hero-img{position:relative;right:auto;width:auto;max-width:none;opacity:1;height:600px;-webkit-mask-image:linear-gradient(to bottom,#000 80%,transparent);mask-image:linear-gradient(to bottom,#000 80%,transparent)}
  .hero-img img{object-fit:contain;object-position:center bottom}
  .hero-logo img{width:240px}
  .ctas{grid-template-columns:1fr 1fr;max-width:560px}
  .cards{grid-template-columns:repeat(4,1fr)}
  .work{grid-template-columns:1fr 1fr;max-width:none}
  .work-video{justify-self:end}.work-text{justify-self:start}
  .work h2,.work .caption{text-align:left}
  .why{grid-template-columns:1fr 1fr;align-items:center}
  .fab{display:none}
  .foot{padding-bottom:40px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.area{padding-top:30px;padding-bottom:40px}.area h2{font-size:1.2rem}.towns li{font-size:13px;padding:4px 10px}
/* refinements */
.hero-logo img{width:170px;margin-left:-10px}
.noanswer{grid-template-columns:repeat(3,auto);max-width:none;justify-content:start;gap:6px;margin-bottom:22px}
.noanswer li{display:flex;gap:6px;align-items:center;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:4px 6px 4px 10px;background:rgba(0,0,0,.2)}
.noanswer b{font-size:12px}
.noanswer span{display:none}
.noanswer i{width:18px;height:18px;font-size:10px}
.cards{grid-template-columns:repeat(2,1fr);gap:12px}
.card{padding-bottom:12px}
.card h3{font-size:.95rem;margin:10px 12px 4px}
.card p{margin:0 12px;font-size:13.5px;line-height:1.4}
.card .tag{font-size:12px;padding:4px 8px;margin-top:8px}
section.services{padding:40px 14px}
.work{padding:40px 20px}
@media (min-width:1000px){
  .hero-logo img{width:230px}
  .ctas{grid-template-columns:auto auto;max-width:none;justify-content:start}
  .hero-img{height:560px;-webkit-mask-image:radial-gradient(60% 55% at 50% 45%,#000 60%,transparent 100%);mask-image:radial-gradient(60% 55% at 50% 45%,#000 60%,transparent 100%)}
  .cards{grid-template-columns:repeat(4,1fr);gap:18px}
  .card h3{font-size:1.1rem;margin:14px 16px 6px}.card p{margin:0 16px;font-size:15px}
  .work-video{max-width:420px}
}

.hero-logo{display:inline-block;background:radial-gradient(closest-side,rgba(1,24,52,.97) 72%,rgba(1,24,52,0) 100%);border-radius:8px;padding:4px 8px;margin-bottom:12px}
.hero-logo img{width:160px;margin:0}
@media (min-width:1000px){.hero-logo img{width:220px}}

/* simplified hero */
h1,.sub{transform:none}
h1{margin-bottom:12px}
h1 .hl{font-size:clamp(1.3rem,5.5vw,2rem);transform:rotate(-2deg);margin-bottom:8px}
h1 .big{font-size:clamp(2rem,8.6vw,3.4rem);line-height:1.05;max-width:16ch}
.sub{text-transform:none;font-style:normal;font-weight:600;color:#d6e6fa;border-bottom:0;padding:0;margin:0 0 24px;font-size:clamp(1rem,4.2vw,1.2rem)}

/* rune text logo + van hero */
.hero-logo{background:none;padding:0;border-radius:0;margin:6px 0 22px}
.hero-logo img{width:200px;height:auto;margin:0}
.hero-img{display:none}
.foot-logo{width:min(320px,80vw);height:auto;margin:0 auto 18px}
@media (min-width:1000px){
  .hero-logo img{width:300px}
  .hero-img{display:block;position:relative;right:auto;width:auto;height:auto;max-width:560px;opacity:1;-webkit-mask-image:none;mask-image:none;justify-self:end}
  .hero-img img{width:100%;height:auto;object-fit:initial;border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.45)}
}
.small a{white-space:nowrap}

.speaks{display:inline-flex;flex-direction:column;gap:2px;margin:0 0 14px;padding:8px 14px;border-left:4px solid var(--yellow);background:rgba(255,255,255,.08);border-radius:0 10px 10px 0}
.speaks strong{font-size:clamp(1.05rem,4.6vw,1.3rem);font-weight:900;color:#fff}
.speaks span{font-size:14px;color:#b9d3f2;font-weight:600}