/* ==========================================================================
   Seduthan Technologies — One3 Technologies
   Direction: Cinematic / product. See ../../DESIGN.md
   Radius family: sharp (0 / 2px). One accent. Chrome is a material, not a colour.
   ========================================================================== */

/* --- 1. Tokens ----------------------------------------------------------- */
:root{
  --bg:            #0b0d11;
  --bg-alt:        #101318;
  --surface:       #14181e;
  --surface-2:     #1b2029;
  --border:        rgb(238 241 245 / .10);
  --border-2:      rgb(238 241 245 / .16);
  --border-strong: #667182;
  --text:          #eef1f5;
  --text-muted:    #9aa4b2;
  --text-inverse:  #06080b;
  --accent:        #3b93e8;
  --accent-hover:  #5aa9f0;
  --accent-soft:   rgb(59 147 232 / .12);

  --chrome: linear-gradient(180deg,#f2f4f7 0%,#c3cad3 42%,#828c99 58%,#e4e9ee 100%);

  --shadow-md: 0 2px 4px rgb(0 0 0 / .30), 0 8px 16px rgb(0 0 0 / .34);
  --shadow-lg: 0 4px 8px rgb(0 0 0 / .30), 0 16px 40px rgb(0 0 0 / .44);

  --wrap: 1280px;
  --gut: clamp(1.25rem, 5vw, 3rem);
  --sec: clamp(4.5rem, 10vw, 10rem);
  --r: 2px;

  --ff-display: "Bebas Neue", Impact, Haettenschweiler, system-ui, sans-serif;
  --ff-text: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ff-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  --e-micro: 160ms cubic-bezier(.2,0,.2,1);
  --e-std:   300ms cubic-bezier(.16,1,.3,1);
  --e-in:    620ms cubic-bezier(.16,1,.3,1);

  --header-h: 76px;
}

/* --- 2. Reset ------------------------------------------------------------ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--ff-text);
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  /* No overflow-x clip: horizontal overflow is prevented structurally and
     verified at 320/390/768/1440 on every page. A clip here would only mask
     future layout bugs and can cut off fixed/positioned layers. */
}
img,svg,video{ display:block; max-width:100%; }
img{ height:auto; }
button,input,select,textarea{ font:inherit; color:inherit; }
a{ color:inherit; }
h1,h2,h3,h4,p,figure,blockquote{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }

::selection{ background:var(--accent); color:var(--text-inverse); }

:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

.skip{
  position:absolute; left:8px; top:-64px; z-index:200;
  background:var(--accent); color:var(--text-inverse);
  padding:12px 20px; font-weight:700; text-decoration:none;
  transition:top var(--e-micro);
}
.skip:focus{ top:8px; }

.sr{
  position:absolute!important; width:1px; height:1px;
  padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

/* --- 3. Typography ------------------------------------------------------- */
.display,h1.display,h2.display{
  font-family:var(--ff-display);
  font-weight:400;
  font-size:clamp(3rem,8.5vw,7rem);
  line-height:.92;
  letter-spacing:.005em;
  text-transform:uppercase;
}
.h2{
  font-family:var(--ff-display);
  font-weight:400;
  font-size:clamp(2rem,4.5vw,3.5rem);
  line-height:.98;
  letter-spacing:.006em;
  text-transform:uppercase;
}
.h3{
  font-family:var(--ff-text);
  font-weight:700;
  font-size:clamp(1.125rem,2vw,1.375rem);
  line-height:1.25;
  letter-spacing:-.01em;
}
.eyebrow{
  font-family:var(--ff-mono);
  font-weight:500;
  font-size:.75rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent);
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px;
}
.eyebrow::before{
  content:"";
  width:28px; height:1px; flex:none;
  background:var(--accent);
}
.lead{
  font-size:clamp(1.0625rem,1.6vw,1.25rem);
  line-height:1.6;
  color:var(--text-muted);
  max-width:56ch;
}
.prose{ max-width:62ch; color:var(--text-muted); }
.prose + .prose{ margin-top:16px; }
.chrome-text{
  background:var(--chrome);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
}
@supports not (background-clip:text){ .chrome-text{ color:#dfe4ea; } }

/* --- 4. Layout ----------------------------------------------------------- */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut); }
.section{ padding-block:var(--sec); }
.section--alt{ background:var(--bg-alt); }
.rule{ height:1px; background:var(--border); border:0; margin:0; }

.sec-head{ margin-bottom:clamp(2rem,4vw,4rem); }
.sec-head--split{
  display:grid; gap:24px;
  grid-template-columns:1fr;
  align-items:end;
}
@media (min-width:900px){
  .sec-head--split{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:48px; }
}

/* --- 5. Buttons ---------------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:48px; padding:14px 28px;
  font-weight:700; font-size:.9375rem; letter-spacing:.01em;
  text-decoration:none; cursor:pointer;
  border:1px solid transparent; border-radius:var(--r);
  transition:background var(--e-micro), border-color var(--e-micro),
             color var(--e-micro), transform var(--e-micro);
}
.btn svg{ width:18px; height:18px; flex:none; }
.btn--primary{ background:var(--accent); color:var(--text-inverse); }
.btn--primary:hover{ background:var(--accent-hover); }
.btn--primary:active{ transform:scale(.98); }
.btn--ghost{ background:transparent; color:var(--text); border-color:var(--border-strong); }
.btn--ghost:hover{ background:var(--surface-2); border-color:var(--text); }
.btn--ghost:active{ transform:scale(.98); }
.btn--lg{ min-height:56px; padding:18px 36px; font-size:1rem; }
.btn[disabled],.btn[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; transform:none; }

.btn-row{ display:flex; flex-wrap:wrap; gap:14px; }

.link-arrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--ff-mono); font-size:.75rem; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none; color:var(--accent);
  padding-block:6px;
  transition:color var(--e-micro), gap var(--e-micro);
}
.link-arrow:hover{ color:var(--accent-hover); gap:16px; }
.link-arrow svg{ width:14px; height:14px; }

/* --- 6. Header ----------------------------------------------------------- */
.hdr{
  position:sticky; top:0; z-index:90;
  background:rgb(11 13 17 / .86);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
.hdr__in{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; min-height:var(--header-h);
}
.brand{ display:flex; align-items:center; gap:12px; text-decoration:none; flex:none; min-height:44px; }
.brand img{ width:42px; height:42px; object-fit:contain; }
.brand__txt{ display:flex; flex-direction:column; line-height:1; }
.brand__name{
  font-family:var(--ff-display); font-size:1.375rem;
  letter-spacing:.04em; text-transform:uppercase; color:var(--text);
}
.brand__sub{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.155em;
  text-transform:uppercase; color:var(--text-muted); margin-top:4px;
}

.nav{ display:none; }
.hdr__cta{ display:none; }        /* base: hidden below 1024px */
@media (min-width:1024px){
  .nav{ display:flex; align-items:center; gap:4px; }
  .nav a{
    position:relative; text-decoration:none; color:var(--text-muted);
    font-size:.875rem; font-weight:500; padding:10px 14px;
    transition:color var(--e-micro);
  }
  .nav a:hover{ color:var(--text); }
  .nav a::after{
    content:""; position:absolute; left:14px; right:14px; bottom:4px; height:1px;
    background:var(--accent); transform:scaleX(0); transform-origin:left;
    transition:transform var(--e-std);
  }
  .nav a:hover::after{ transform:scaleX(1); }
  .nav a[aria-current="page"]{ color:var(--text); }
  .nav a[aria-current="page"]::after{ transform:scaleX(1); }
  .hdr__cta{ display:inline-flex; }
}

.burger{
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; background:transparent;
  border:1px solid var(--border-strong); border-radius:var(--r);
  cursor:pointer; flex:none;
}
.burger:hover{ background:var(--surface-2); border-color:var(--text); }
.burger span{ display:block; width:20px; height:1.5px; background:var(--text); position:relative; transition:background var(--e-micro); }
.burger span::before,.burger span::after{
  content:""; position:absolute; left:0; width:20px; height:1.5px; background:var(--text);
  transition:transform var(--e-std);
}
.burger span::before{ top:-6px; }
.burger span::after{ top:6px; }
.burger[aria-expanded="true"] span{ background:transparent; }
.burger[aria-expanded="true"] span::before{ transform:translateY(6px) rotate(45deg); }
.burger[aria-expanded="true"] span::after{ transform:translateY(-6px) rotate(-45deg); }
@media (min-width:1024px){ .burger{ display:none; } }

/* Mobile drawer */
.drawer{
  position:fixed; inset:0; z-index:100;
  background:var(--bg);
  display:flex; flex-direction:column;
  padding:20px var(--gut) 32px;
  overflow-y:auto;
  opacity:0; visibility:hidden;
  transform:translateY(-8px);
  transition:opacity var(--e-std), transform var(--e-std), visibility 0s linear 300ms;
}
.drawer[data-open="true"]{
  opacity:1; visibility:visible; transform:none;
  transition:opacity var(--e-std), transform var(--e-std), visibility 0s linear 0s;
}
.drawer__top{ display:flex; align-items:center; justify-content:space-between; min-height:var(--header-h); }
.drawer__nav{ display:flex; flex-direction:column; margin-top:24px; border-top:1px solid var(--border); }
.drawer__nav a{
  display:flex; align-items:baseline; gap:16px;
  padding:20px 0; text-decoration:none;
  border-bottom:1px solid var(--border);
  font-family:var(--ff-display); font-size:2rem; letter-spacing:.02em;
  text-transform:uppercase; color:var(--text-muted);
  transition:color var(--e-micro), padding-left var(--e-std);
}
.drawer__nav a:hover,.drawer__nav a[aria-current="page"]{ color:var(--text); }
.drawer__nav a:hover{ padding-left:10px; }
.drawer__nav .n{ font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.16em; color:var(--accent); }
.drawer__foot{ margin-top:32px; display:flex; flex-direction:column; gap:12px; }
@media (min-width:1024px){ .drawer{ display:none; } }

/* --- 7. Hero ------------------------------------------------------------- */
.hero{
  position:relative;
  min-height:clamp(600px, 88svh, 920px);
  display:flex; align-items:flex-end;
  overflow:hidden;
  border-bottom:1px solid var(--border);
}
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media img{ width:100%; height:100%; object-fit:cover; }
.hero__media::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgb(11 13 17 / .58) 0%, rgb(11 13 17 / .40) 38%, rgb(11 13 17 / .94) 100%),
    linear-gradient(100deg, rgb(11 13 17 / .92) 0%, rgb(11 13 17 / .46) 52%, rgb(11 13 17 / .18) 100%);
}
/* signature scan sweep — runs behind content, never over the headline */
.hero__scan{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  overflow:hidden;
}
.hero__scan::before{
  content:""; position:absolute; left:0; right:0; height:26vh;
  top:-30vh;
  background:linear-gradient(180deg,
    transparent 0%,
    rgb(59 147 232 / .06) 42%,
    rgb(59 147 232 / .16) 50%,
    rgb(59 147 232 / .06) 58%,
    transparent 100%);
  animation:scan 7.5s cubic-bezier(.45,0,.55,1) infinite;
}
@keyframes scan{
  0%   { transform:translateY(0); opacity:0; }
  12%  { opacity:1; }
  88%  { opacity:1; }
  100% { transform:translateY(160vh); opacity:0; }
}
.hero__grid{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:
    linear-gradient(rgb(238 241 245 / .035) 1px, transparent 1px),
    linear-gradient(90deg, rgb(238 241 245 / .035) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(120% 90% at 78% 20%, #000 0%, transparent 70%);
  -webkit-mask-image:radial-gradient(120% 90% at 78% 20%, #000 0%, transparent 70%);
}
.hero__in{ position:relative; z-index:2; padding-block:clamp(3rem,8vw,6rem); width:100%; }
.hero__badge{
  width:clamp(64px,9vw,104px); height:auto;
  margin-bottom:clamp(20px,3vw,32px);
}
.hero h1{ max-width:100%; text-wrap:balance; margin-bottom:24px; }
.hero .lead{ margin-bottom:36px; }
.hero__meta{
  display:flex; flex-wrap:wrap; gap:8px 28px;
  margin-top:40px; padding-top:24px; border-top:1px solid var(--border);
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-muted);
}
.hero__meta b{ color:var(--text); font-weight:500; }

/* Page hero (inner pages) */
.phero{
  position:relative; overflow:hidden;
  border-bottom:1px solid var(--border);
  padding-block:clamp(3.5rem,9vw,7rem);
  background:var(--bg-alt);
}
.phero__grid{
  position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgb(238 241 245 / .03) 1px, transparent 1px),
    linear-gradient(90deg, rgb(238 241 245 / .03) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(95deg, transparent 0%, #000 100%);
  -webkit-mask-image:linear-gradient(95deg, transparent 0%, #000 100%);
}
.phero__in{ position:relative; }
.phero h1{ max-width:18ch; margin-bottom:20px; }
.crumb{
  font-family:var(--ff-text); font-size:.8125rem; letter-spacing:0;
  color:var(--text-muted); margin-bottom:28px;
}
.crumb a{ color:var(--text-muted); text-decoration:none; }
.crumb a:hover{ color:var(--accent); }
.crumb span{ color:var(--border-strong); margin-inline:8px; }

/* --- 8. Capability ticker ------------------------------------------------ */
.ticker{
  border-block:1px solid var(--border);
  background:var(--surface);
  overflow:hidden;
  padding-block:18px;
}
.ticker__track{
  display:flex; width:max-content;
  animation:marquee 46s linear infinite;
}
.ticker:hover .ticker__track{ animation-play-state:paused; }
@keyframes marquee{ to{ transform:translateX(-50%); } }
.ticker__item{
  display:flex; align-items:center; gap:14px;
  padding-inline:28px;
  font-family:var(--ff-mono); font-size:.75rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-muted);
  white-space:nowrap;
}
.ticker__item::before{
  content:""; width:5px; height:5px; flex:none;
  background:var(--accent);
}

/* --- 9. Service index (sticky left + stacked entries) -------------------- */
.svcx{ display:grid; gap:48px; grid-template-columns:1fr; }
@media (min-width:1024px){
  .svcx{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(48px,6vw,96px); }
}
.svcx__aside{ align-self:start; }
@media (min-width:1024px){
  .svcx__aside{ position:sticky; top:calc(var(--header-h) + 48px); }
}
.svcx__list{ border-top:1px solid var(--border); }

.svce{
  position:relative;
  display:grid; gap:20px;
  grid-template-columns:1fr;
  padding-block:clamp(28px,4vw,44px);
  border-bottom:1px solid var(--border);
}
@media (min-width:640px){
  .svce{ grid-template-columns:auto minmax(0,1fr); gap:28px; }
}
.svce__n{
  font-family:var(--ff-mono); font-size:.75rem; letter-spacing:.16em;
  color:var(--accent); padding-top:6px;
}
.svce h3{ margin-bottom:10px; }
.svce p{ color:var(--text-muted); max-width:58ch; margin-bottom:16px; }
.svce__tags{ display:flex; flex-wrap:wrap; gap:8px; }
.svce__tags li{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--text-muted);
  border:1px solid var(--border-2); padding:6px 10px;
}
/* one-shot scan reveal on each entry */
.svce::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:var(--accent); transform:scaleX(0); transform-origin:left;
  transition:transform 700ms cubic-bezier(.16,1,.3,1);
}
.svce.is-in::after{ transform:scaleX(1); }

/* --- 10. Statement band -------------------------------------------------- */
.band{
  position:relative; overflow:hidden;
  border-block:1px solid var(--border);
}
.band__media{ position:absolute; inset:0; }
.band__media img{ width:100%; height:100%; object-fit:cover; }
.band__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgb(11 13 17 / .62) 0%, rgb(11 13 17 / .80) 55%, rgb(11 13 17 / .90) 100%);
}
.band__in{ position:relative; padding-block:var(--sec); }
.band__line{
  font-family:var(--ff-display); font-weight:400;
  font-size:clamp(2.25rem,6vw,5rem); line-height:.96;
  letter-spacing:.005em; text-transform:uppercase;
  max-width:20ch;
}
.band__line em{ font-style:normal; color:var(--accent); }

.stats{
  display:grid; grid-template-columns:repeat(2,1fr);
  gap:1px; margin-top:clamp(2.5rem,5vw,4.5rem);
  background:var(--border);
  border:1px solid var(--border);
}
@media (min-width:900px){ .stats{ grid-template-columns:repeat(4,1fr); } }
.stat{ background:var(--bg); padding:clamp(20px,3vw,32px); }
.stat__n{
  font-family:var(--ff-display); font-size:clamp(2.25rem,4.5vw,3.25rem);
  line-height:1; letter-spacing:.01em; color:var(--text);
}
.stat__l{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--text-muted); margin-top:10px;
}
.stat__note{ font-family:var(--ff-text); font-size:.8125rem; color:var(--text-muted); margin-top:8px; text-transform:none; letter-spacing:0; }

/* --- 11. Industries (offset image + list) -------------------------------- */
.ind{
  display:grid; gap:32px; grid-template-columns:1fr;
  align-items:center;
  padding-block:clamp(2.5rem,5vw,4.5rem);
  border-bottom:1px solid var(--border);
}
.ind:last-child{ border-bottom:0; }
@media (min-width:900px){
  .ind{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:clamp(40px,5vw,80px); }
  .ind--flip .ind__media{ order:2; }
  .ind--flip .ind__body{ order:1; }
}
.ind__media{ position:relative; overflow:hidden; }
.ind__media img{
  width:100%; aspect-ratio:4/3; object-fit:cover;
  clip-path:inset(0 0 0 0);
  transition:transform 900ms cubic-bezier(.16,1,.3,1);
}
.ind__media::after{
  content:""; position:absolute; inset:0;
  border:1px solid var(--border);
  pointer-events:none;
}
.ind:hover .ind__media img{ transform:scale(1.035); }
.ind__tag{
  position:absolute; left:0; top:0; z-index:2;
  background:var(--bg); color:var(--accent);
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.14em;
  text-transform:uppercase; padding:9px 14px;
  border-right:1px solid var(--border); border-bottom:1px solid var(--border);
}
.ind__body h3{ margin-bottom:12px; }
.ind__body p{ color:var(--text-muted); max-width:52ch; margin-bottom:20px; }
.ind__pts{ display:flex; flex-direction:column; gap:10px; margin-bottom:24px; }
.ind__pts li{
  display:flex; gap:12px; align-items:flex-start;
  font-size:.9375rem; color:var(--text-muted);
}
.ind__pts li::before{
  content:""; flex:none; width:6px; height:6px; margin-top:.55em;
  background:var(--accent);
}

/* --- 12. Process timeline ------------------------------------------------ */
.steps{
  display:grid; gap:1px; grid-template-columns:1fr;
  background:var(--border); border:1px solid var(--border);
}
@media (min-width:700px){ .steps{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1100px){ .steps{ grid-template-columns:repeat(5,1fr); } .step{ padding:32px 24px; } }
.step{
  background:var(--bg); padding:clamp(24px,3vw,32px);
  display:flex; flex-direction:column; gap:12px;
}
.step__n{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.16em;
  color:var(--accent);
}
.step h3{ font-size:1.0625rem; }
.step p{ font-size:.9375rem; color:var(--text-muted); }

/* --- 13. Spec table ------------------------------------------------------ */
.spec{ border-top:1px solid var(--border); }
.spec__row{
  display:grid; gap:6px 32px; grid-template-columns:1fr;
  padding-block:20px; border-bottom:1px solid var(--border);
}
@media (min-width:700px){
  .spec__row{ grid-template-columns:minmax(0,4fr) minmax(0,8fr); align-items:baseline; }
}
.spec__k{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-muted);
}
.spec__v{ color:var(--text); }
.spec__v .pending{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--accent);
  border:1px dashed var(--border-strong); padding:3px 8px; display:inline-block;
}

/* --- 14. Cards (projects) ------------------------------------------------ */
.grid-3{ display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:640px){ .grid-3{ grid-template-columns:repeat(2,1fr); gap:24px; } }
@media (min-width:1024px){ .grid-3{ grid-template-columns:repeat(3,1fr); gap:24px; } }

.pcard{
  position:relative; overflow:hidden;
  border:1px solid var(--border); background:var(--surface);
  display:flex; flex-direction:column;
}
.pcard__media{ position:relative; overflow:hidden; }
.pcard__media img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform 800ms cubic-bezier(.16,1,.3,1); }
.pcard:hover .pcard__media img{ transform:scale(1.04); }
.pcard__body{ padding:24px; display:flex; flex-direction:column; gap:10px; flex:1; }
.pcard__meta{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent);
}
.pcard p{ font-size:.9375rem; color:var(--text-muted); }

/* --- 15. CTA band -------------------------------------------------------- */
.cta{
  border-top:1px solid var(--border);
  background:var(--bg-alt);
  text-align:center;
}
.cta__in{ padding-block:var(--sec); display:flex; flex-direction:column; align-items:center; gap:24px; }
.cta .h2{ max-width:18ch; }
.cta .lead{ margin-inline:auto; }
.cta .btn-row{ justify-content:center; }

/* --- 16. Forms ----------------------------------------------------------- */
.form{ display:grid; gap:20px; grid-template-columns:1fr; }
@media (min-width:640px){ .form__2{ display:grid; grid-template-columns:1fr 1fr; gap:20px; } }
.field{ display:flex; flex-direction:column; gap:8px; }
.field label{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-muted);
}
.field label .req{ color:var(--accent); }
.field input,.field select,.field textarea{
  background:var(--surface); color:var(--text);
  border:1px solid var(--border-strong); border-radius:var(--r);
  padding:14px 16px; min-height:50px; width:100%;
  transition:border-color var(--e-micro), background var(--e-micro);
}
.field textarea{ min-height:140px; resize:vertical; }
.field input:hover,.field select:hover,.field textarea:hover{ border-color:var(--text); }
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{
  border-color:var(--accent); background:var(--surface-2);
}
.field input::placeholder,.field textarea::placeholder{ color:var(--border-strong); }
.field select{ appearance:none; background-image:none; cursor:pointer; }
.field--err input,.field--err select,.field--err textarea{ border-color:#ff6b6b; }
.field__err{ font-size:.8125rem; color:#ff9b9b; min-height:0; }
.form__note{ font-size:.8125rem; color:var(--text-muted); }
.form__status{
  font-size:.9375rem; padding:14px 16px; border:1px solid var(--border-2);
  background:var(--surface); display:none;
}
.form__status[data-show="true"]{ display:block; }
.form__status[data-kind="ok"]{ border-color:var(--accent); color:var(--text); }
.form__status[data-kind="err"]{ border-color:#ff6b6b; color:#ffc9c9; }

/* --- 17. Contact blocks -------------------------------------------------- */
.contact-grid{ display:grid; gap:48px; grid-template-columns:1fr; }
@media (min-width:1024px){ .contact-grid{ grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:clamp(48px,6vw,88px); } }
.cblock{ border-top:1px solid var(--border); padding-block:20px; display:grid; gap:4px; }
.cblock a{ color:var(--text); text-decoration:none; }
.cblock a:hover{ color:var(--accent); }
.map{
  border:1px solid var(--border); background:var(--surface);
  aspect-ratio:4/3; width:100%;
  display:flex; align-items:center; justify-content:center; text-align:center;
  padding:24px;
}
.map p{ color:var(--text-muted); font-size:.9375rem; max-width:32ch; }

/* --- 18. Footer ---------------------------------------------------------- */
.ftr{ border-top:1px solid var(--border); background:var(--bg); }
.ftr__grid{
  display:grid; gap:40px; grid-template-columns:1fr;
  padding-block:clamp(3rem,6vw,5rem);
}
@media (min-width:700px){ .ftr__grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .ftr__grid{ grid-template-columns:2fr 1fr 1fr 1.4fr; gap:48px; } }
.ftr h3{
  font-family:var(--ff-mono); font-size:.6875rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--text-muted); margin-bottom:18px; font-weight:500;
}
.ftr ul{ display:flex; flex-direction:column; gap:10px; }
.ftr a{ color:var(--text-muted); text-decoration:none; font-size:.9375rem; transition:color var(--e-micro); }
.ftr a:hover{ color:var(--accent); }
.ftr__brand p{ color:var(--text-muted); font-size:.9375rem; max-width:34ch; margin-top:16px; }
.ftr__bot{
  border-top:1px solid var(--border);
  padding-block:24px;
  display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; justify-content:space-between;
  font-size:.8125rem; color:var(--text-muted);
}
.ftr__bot a{ font-size:.8125rem; }
.one3{ color:var(--text-muted); }
.one3 a{ color:var(--text); text-decoration:none; border-bottom:1px solid var(--border-strong); }
.one3 a:hover{ color:var(--accent); border-color:var(--accent); }

/* --- 19. WhatsApp float -------------------------------------------------- */
.wa{
  position:fixed; right:16px; bottom:16px; z-index:80;
  width:56px; height:56px; border-radius:999px;
  display:flex; align-items:center; justify-content:center;
  background:#25d366; color:#04240f;
  box-shadow:var(--shadow-lg); text-decoration:none;
  transition:transform var(--e-micro);
}
.wa:hover{ transform:scale(1.06); }
.wa:active{ transform:scale(.97); }
.wa svg{ width:28px; height:28px; }
@media (min-width:1024px){ .wa{ right:24px; bottom:24px; } }

/* --- 20. Reveal ---------------------------------------------------------- */
.rv{ opacity:0; transform:translateY(20px); }
.rv.is-in{ opacity:1; transform:none; transition:opacity var(--e-in), transform var(--e-in); }
.no-js .rv{ opacity:1; transform:none; }

/* --- 21. Reduced motion -------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
  .hero__scan{ display:none; }
  .ticker__track{ animation:none; transform:none; }
  .rv{ opacity:1; transform:none; }
  .svce::after{ transform:scaleX(1); }
  .ind__media img,.pcard__media img{ transition:none; }
  .ind:hover .ind__media img,.pcard:hover .pcard__media img{ transform:none; }
}