/* =========================================================
   ITLS — stylesheet unic
   1. Tokens        5. Hero
   2. Reset/base    6. Secțiuni
   3. Utilitare     7. Footer
   4. Topbar        8. Responsive
   ========================================================= */

/* ---------- 1. Tokens ---------- */
:root{
  --bg:        #101B2C;
  --bg-2:      #15243A;
  --bg-3:      #0C1726;
  --card:      #17263B;
  --card-2:    #1C2D45;

  --line:      #344760;
  --line-2:    #2B3D56;
  --line-soft: rgba(255,255,255,.11);

  --gold:      #C79A43;
  --gold-hi:   #E0B65D;
  --gold-dim:  rgba(199,154,67,.14);

  --txt:       #F5F7FA;
  --txt-2:     #C0CAD8;
  --txt-3:     #909DB0;

  --r-card:    10px;
  --r-btn:     5px;

  --wrap:      1180px;
  --gut:       24px;

  --ff-d: "Segoe UI Variable Display", "Aptos Display", "Segoe UI", Roboto, Helvetica, Arial, ui-sans-serif, system-ui, sans-serif;
  --ff-b: "Segoe UI Variable Text", Aptos, "Segoe UI", Roboto, Helvetica, Arial, ui-sans-serif, system-ui, sans-serif;
}

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

body{
  margin:0;
  background:linear-gradient(180deg, #132238 0%, var(--bg) 52%, #0D1828 100%);
  color:var(--txt);
  font-family:var(--ff-b);
  font-size:15px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,svg{ max-width:100%; display:block; }
ul,ol{ margin:0; padding:0; list-style:none; }
p{ margin:0; }
a{ color:inherit; text-decoration:none; }

:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
  border-radius:3px;
}

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--gold); color:#0A0F1A; padding:10px 18px; font-weight:600;
}
.skip:focus{ left:12px; top:12px; }

/* ---------- 3. Utilitare ---------- */
.wrap{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut); }
.gold{ color:var(--gold); }

.h1{
  font-family:var(--ff-d);
  font-weight:700;
  font-size:clamp(1.95rem, 1.1rem + 2.6vw, 2.9rem);
  line-height:1.14;
  letter-spacing:-.02em;
  margin:0;
}
.h1--page{ font-size:clamp(1.85rem,1.1rem + 2.4vw,2.7rem); margin-bottom:16px; }

.h2{
  font-family:var(--ff-d);
  font-weight:700;
  font-size:clamp(1.5rem, 1.05rem + 1.55vw, 2.1rem);
  line-height:1.22;
  letter-spacing:-.015em;
  margin:0 0 14px;
}
.h2--sm{ font-size:clamp(1.3rem,1.05rem + .9vw,1.6rem); }

.h3{
  font-family:var(--ff-d);
  font-weight:600;
  font-size:1.16rem;
  line-height:1.3;
  margin:0 0 10px;
}

.lede{ color:var(--txt-2); font-size:.945rem; line-height:1.7; }
.lede--wide{ max-width:62ch; }

.prose p{ margin:0 0 16px; color:var(--txt-2); max-width:72ch; }
.prose h2{ margin-top:38px; }
.prose h3{ margin-top:26px; }
.prose strong{ color:var(--txt); font-weight:600; }
.prose a{ color:var(--gold); text-decoration:underline; text-underline-offset:3px; }
.prose ul{ margin:0 0 18px; }
.prose ul li{
  position:relative; padding-left:22px; margin-bottom:9px;
  color:var(--txt-2); max-width:72ch;
}
.prose ul li::before{
  content:""; position:absolute; left:2px; top:.66em;
  width:6px; height:6px; border-radius:50%; background:var(--gold);
}
.prose .table-wrap{ overflow-x:auto; margin:22px 0 28px; border:1px solid var(--line-2); border-radius:var(--r-card); }
.prose table{ width:100%; border-collapse:collapse; min-width:620px; background:rgba(12,23,38,.3); }
.prose th,.prose td{ padding:12px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--line-2); color:var(--txt-2); }
.prose th{ color:var(--txt); font-size:.78rem; letter-spacing:.04em; text-transform:uppercase; background:rgba(255,255,255,.025); }
.prose tr:last-child td{ border-bottom:0; }
.prose code{ font-family:ui-monospace,SFMono-Regular,Consolas,monospace; color:var(--gold-hi); }


/* butoane */
.btn{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--ff-b);
  font-size:.795rem; font-weight:600; letter-spacing:.07em;
  padding:14px 22px; border-radius:var(--r-btn);
  border:1px solid transparent; cursor:pointer;
  background:transparent;   /* necesar pe <button>: altfel apare fundalul gri implicit */
  transition:background-color .18s ease, border-color .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn__i{ flex:none; }
.btn--gold{ background:var(--gold); color:#0A0F1A; }
.btn--gold:hover{ background:var(--gold-hi); }
.btn--ghost{ border-color:rgba(255,255,255,.26); color:var(--txt); }
.btn--ghost:hover{ border-color:rgba(255,255,255,.55); }
.btn--ghost-gold{ border-color:rgba(199,154,67,.55); color:var(--gold); }
.btn--ghost-gold:hover{ background:var(--gold-dim); border-color:var(--gold); }

/* link text auriu */
.tlink{
  display:inline-flex; align-items:center; gap:8px;
  color:var(--gold); font-size:.755rem; font-weight:600; letter-spacing:.09em;
  transition:gap .18s ease;
}
.tlink:hover{ gap:13px; }

/* liste bifate */
.ticks li{
  display:flex; align-items:flex-start; gap:11px;
  font-size:.845rem; color:var(--txt-2); margin-bottom:11px;
}
.ticks li svg{ flex:none; margin-top:2px; color:var(--gold); }
.ticks--lg li{ font-size:.94rem; margin-bottom:15px; color:var(--txt); }

/* firimituri */
.crumbs ol{ display:flex; flex-wrap:wrap; gap:10px; font-size:.78rem; color:var(--txt-3); margin-bottom:20px; }
.crumbs li+li::before{ content:"/"; margin-right:10px; color:var(--line); }
.crumbs a{ color:var(--txt-2); }
.crumbs a:hover{ color:var(--gold); }

/* ---------- 4. Topbar ---------- */
.topbar{
  position:sticky; top:0; z-index:100;
  background:rgba(16,27,44,.86);
  backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:background-color .2s ease, border-color .2s ease;
}
.topbar.is-stuck{ background:rgba(16,27,44,.97); border-bottom-color:var(--line-2); }

.topbar__in{
  display:flex; align-items:center; gap:28px;
  min-height:78px;
}

.brand{ display:block; flex:none; margin-right:auto; }
.brand__logo{ width:168px; height:auto; max-height:58px; object-fit:contain; }
.brand__logo--foot{ width:184px; max-height:none; }

.mainnav{ display:flex; align-items:center; gap:30px; }
.mainnav>ul{ display:flex; align-items:center; gap:30px; }
.mainnav__link{
  font-size:.755rem; font-weight:500; letter-spacing:.1em;
  color:var(--txt-2);
  padding:6px 0;
  border-bottom:1px solid transparent;
  transition:color .18s ease, border-color .18s ease;
}
.mainnav__link:hover{ color:var(--txt); }
.mainnav__link.is-active{ color:var(--gold); border-bottom-color:var(--gold); }
.mainnav__cta{ display:none; }

.burger{
  display:none; flex:none;
  background:none; border:1px solid var(--line); border-radius:var(--r-btn);
  color:var(--txt); padding:8px; cursor:pointer;
}

/* ---------- 5. Hero ---------- */
.hero{
  position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,0) 72%);
  padding:clamp(36px,5vw,64px) 0 clamp(48px,6vw,78px);
  overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(60% 55% at 72% 34%, rgba(199,154,67,.10), transparent 70%),
    radial-gradient(50% 45% at 12% 8%,  rgba(58,110,190,.10), transparent 70%);
  pointer-events:none;
}
.hero__in{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,52fr) minmax(0,48fr);
  grid-template-areas:"copy viz" "trust trust";
  gap:clamp(24px,3.4vw,40px); align-items:center;
}
.hero__copy{ grid-area:copy; }
.hero__viz { grid-area:viz;  }
.trust     { grid-area:trust; }
.hero__lede{ margin:24px 0 30px; color:var(--txt-2); font-size:.97rem; line-height:1.75; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; }

.trust{ display:flex; flex-wrap:wrap; gap:14px 30px; }
.trust li{ display:flex; align-items:center; gap:9px; font-size:.775rem; color:var(--txt-2); }
.trust li svg{ flex:none; color:var(--gold); }

.hero__viz{ min-width:0; }

/* diagrama izometrică */
.isod{ width:100%; height:auto; }
.iso-top{ fill:#1D3049; stroke:var(--line); stroke-width:1.2; }
.iso-side{ fill:#15243A; stroke:var(--line-2); stroke-width:1; }
.iso-side--dark{ fill:#101D30; }
.iso-face{ fill:#1A2A42; stroke:var(--line); stroke-width:1.2; }
.iso-face--dark{ fill:#122137; }
.iso-link{ stroke:var(--gold); stroke-width:1.1; stroke-dasharray:4 6; opacity:.55; }
.iso-node{ fill:var(--gold); opacity:.85; }
.iso-ico{ fill:none; stroke:var(--gold); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.iso-ico-fill{ fill:var(--gold); stroke:none; }
.iso-rack line{ stroke:var(--gold); stroke-width:1.4; opacity:.45; }
.iso-core{ fill:#7FD4FF; }
.iso-core-glow{ fill:#3EA6E8; opacity:.75; }
.iso-label rect{ fill:var(--card); stroke:var(--line); stroke-width:1; }
.iso-label text{
  fill:var(--gold); font-family:var(--ff-b);
  font-size:11px; font-weight:600; letter-spacing:.1em;
}

/* ---------- 6. Secțiuni ---------- */
.sec{ padding:clamp(48px,6vw,76px) 0; }
.sec--pillars{ padding-top:0; }
.sec--process{ padding-block:clamp(44px,5vw,64px); }
.sec--infra{ background:var(--bg-3); border-block:1px solid var(--line-2); }
.sec--cta{ background:var(--bg-2); border-block:1px solid var(--line-2); }

/* 6a. carduri pilon */
.pillars{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.pcard{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r-card);
  padding:30px 28px 28px;
  display:flex; flex-direction:column;
  transition:border-color .2s ease, background-color .2s ease;
}
.pcard:hover{ border-color:rgba(199,154,67,.42); background:var(--card-2); }
.pcard__icon{ display:block; color:var(--gold); margin-bottom:20px; }
.pcard__h{ font-family:var(--ff-d); font-weight:600; font-size:1.3rem; line-height:1.25; margin:0 0 14px; }
.pcard__lede{ color:var(--txt-2); font-size:.885rem; line-height:1.68; margin-bottom:22px; }
.pcard .ticks{ margin-bottom:24px; }
.pcard .tlink{ margin-top:auto; }

/* 6b. proces */
.process{ display:grid; grid-template-columns:minmax(0,250px) minmax(0,1fr); gap:clamp(24px,4vw,56px); align-items:start; }
.process__intro .h2{ margin-bottom:10px; }

.steps{ --sgap:22px; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0 var(--sgap); }
.step{ position:relative; padding-right:4px; }
.step__no{
  display:block; font-family:var(--ff-d); font-weight:700;
  font-size:1.45rem; line-height:1; color:var(--gold); margin-bottom:22px;
}
.step__icon{
  display:grid; place-items:center;
  width:44px; height:44px; border-radius:50%;
  border:1px solid var(--line); background:var(--card);
  color:var(--gold); margin-bottom:16px;
}
.step__rail{
  position:absolute; top:70px; left:52px;
  width:calc(100% + var(--sgap) - 60px); height:0;
  border-top:1px dashed rgba(199,154,67,.42);
}
.step__dot{
  position:absolute; top:70px;
  left:calc(50% + (var(--sgap) / 2) + 22px);
  width:6px; height:6px; border-radius:50%; background:var(--gold);
  transform:translate(-50%,-50%);
}
.step:last-child .step__rail,
.step:last-child .step__dot{ display:none; }
.step__h{ font-family:var(--ff-d); font-weight:600; font-size:.985rem; margin:0 0 8px; }
.step__t{ color:var(--txt-2); font-size:.8rem; line-height:1.62; }

/* 6c. infrastructură */
.infra{ display:grid; grid-template-columns:minmax(0,42fr) minmax(0,58fr); gap:clamp(28px,4vw,56px); align-items:center; }
.infra__copy .h2{ margin-bottom:16px; }
.infra__copy .lede{ margin-bottom:28px; }
.infra__viz{ min-width:0; }

.ind{ width:100%; height:auto; }
.ind-path{ fill:none; stroke:rgba(199,154,67,.38); stroke-width:1.1; stroke-dasharray:4 7; }
.ind-spoke line{ stroke:rgba(199,154,67,.45); stroke-width:1.1; stroke-dasharray:4 6; }
.ind-node rect{ fill:var(--card); stroke:var(--line); stroke-width:1.1; }
.ind-node__ico{ fill:none; stroke:var(--gold); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.ind-node text{ fill:var(--txt); font-family:var(--ff-b); font-size:12.5px; font-weight:600; letter-spacing:.11em; }
.ind-hub{ fill:var(--card-2); stroke:var(--gold); stroke-width:1.4; }
.ind-hub-ring{ fill:none; stroke:rgba(199,154,67,.3); stroke-width:1; }
.ind-hub-ico{ fill:none; stroke:var(--gold); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.ind-hub-t{ fill:var(--gold); font-family:var(--ff-b); font-size:10.5px; font-weight:600; letter-spacing:.12em; }

/* 6d. produse */
.products{ display:grid; grid-template-columns:minmax(0,300px) minmax(0,1fr); gap:clamp(24px,4vw,48px); align-items:start; }
.products__intro .lede{ margin-bottom:26px; }
.products__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.prod{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r-card);
  padding:26px 24px 24px; display:flex; flex-direction:column;
  transition:border-color .2s ease;
}
.prod:hover{ border-color:rgba(199,154,67,.42); }
.prod__head{ display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.prod__icon{ color:var(--gold); flex:none; }
.prod__icon--logo{
  display:grid; place-items:center; width:42px; height:42px;
  border-radius:10px; overflow:hidden; background:rgba(255,255,255,.035);
  border:1px solid var(--line-soft);
}
.prod__icon--logo img{ width:36px; height:36px; object-fit:contain; }
.prod__h{ font-family:var(--ff-d); font-weight:600; font-size:1.12rem; line-height:1.22; margin:0; }
.prod__t{ color:var(--txt-2); font-size:.845rem; line-height:1.65; margin-bottom:22px; }
.prod .tlink{ margin-top:auto; }

/* 6f. bandă CTA */
.ctaband{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:26px; }
.ctaband__actions{ display:flex; flex-wrap:wrap; gap:14px; }

/* 6g. hero pagini interioare */
.phero{
  padding:clamp(34px,4vw,56px) 0 clamp(26px,3vw,38px);
  border-bottom:1px solid var(--line-2);
  background:
    radial-gradient(52% 120% at 84% 0%, rgba(199,154,67,.08), transparent 70%),
    var(--bg);
}

/* 6h. grile generice pentru pagini interioare */
.grid-2{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.grid-3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.panel{
  background:var(--card); border:1px solid var(--line);
  border-radius:var(--r-card); padding:26px 24px;
}
.panel .h3{ margin-bottom:10px; }
.panel__icon{ display:block; color:var(--gold); margin-bottom:16px; }
.panel p{ color:var(--txt-2); font-size:.875rem; line-height:1.68; }

.split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(26px,4vw,52px); align-items:start; }

.kpis{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.kpi{ border-left:2px solid var(--gold); padding:4px 0 4px 18px; }
.kpi__v{ font-family:var(--ff-d); font-weight:700; font-size:1.5rem; line-height:1.1; }
.kpi__l{ color:var(--txt-2); font-size:.79rem; margin-top:6px; display:block; }

/* 6i. formular contact */
.form{ display:grid; gap:18px; }
.field{ display:grid; gap:7px; }
.field label{ font-size:.78rem; font-weight:600; letter-spacing:.05em; color:var(--txt-2); }
.field input,
.field textarea,
.field select{
  width:100%; font:inherit; font-size:.9rem; color:var(--txt);
  background:#14233A; border:1px solid var(--line); border-radius:var(--r-btn);
  padding:12px 14px;
  transition:border-color .18s ease;
}
.field textarea{ min-height:150px; resize:vertical; }
.field input:focus,
.field textarea:focus,
.field select:focus{ border-color:var(--gold); outline:none; }
.field--check{ grid-template-columns:auto 1fr; align-items:start; gap:11px; }
.field--check input{ width:17px; height:17px; margin-top:3px; accent-color:var(--gold); }
.field--check label{ font-weight:400; letter-spacing:0; font-size:.8rem; line-height:1.6; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.note{
  border:1px solid var(--line); border-left-width:3px;
  border-radius:var(--r-btn); padding:14px 16px; font-size:.87rem;
}
.note--ok{ border-left-color:#3FBF7F; color:var(--txt); background:rgba(63,191,127,.07); }
.note--err{ border-left-color:#E0574A; color:var(--txt); background:rgba(224,87,74,.07); }

.contact-info li{
  display:flex; gap:13px; align-items:flex-start;
  padding:15px 0; border-bottom:1px solid var(--line-2);
  font-size:.9rem; color:var(--txt-2);
}
.contact-info li svg{ flex:none; margin-top:3px; color:var(--gold); }
.contact-info a:hover{ color:var(--gold); }
.contact-info strong{ display:block; color:var(--txt); font-weight:600; margin-bottom:2px; }

/* ---------- 7. Footer ---------- */
.foot{ background:var(--bg-3); border-top:1px solid var(--line-2); }
.foot__grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) repeat(2,minmax(0,1fr)) minmax(0,1.55fr);
  gap:34px 28px;
  padding-block:clamp(38px,4.5vw,56px);
}
.foot__legal-id{ margin-top:18px; color:var(--txt-3); font-size:.76rem; line-height:1.7; }
.foot__h{
  font-family:var(--ff-b); font-size:.7rem; font-weight:600; letter-spacing:.14em;
  color:var(--txt); margin:0 0 16px;
}
.foot__col li{ margin-bottom:10px; }
.foot__col a{ color:var(--txt-2); font-size:.83rem; }
.foot__col a:hover{ color:var(--gold); }
.foot__contact-list li{ display:flex; gap:10px; align-items:flex-start; color:var(--txt-2); font-size:.83rem; }
.foot__contact-list li svg{ flex:none; margin-top:3px; color:var(--gold); }
.foot__social{ display:flex; gap:10px; margin-top:18px; }
.foot__social a{
  display:grid; place-items:center; width:34px; height:34px;
  border:1px solid var(--line); border-radius:50%; color:var(--txt-2);
  transition:color .18s ease, border-color .18s ease;
}
.foot__social a:hover{ color:var(--gold); border-color:var(--gold); }

.foot__anpc{ display:flex; gap:14px; flex-wrap:wrap; padding-bottom:26px; }
.foot__anpc a{
  border:1px solid var(--line); border-radius:var(--r-btn);
  padding:8px 16px; font-size:.72rem; letter-spacing:.08em; color:var(--txt-3);
}
.foot__anpc a:hover{ color:var(--gold); border-color:var(--gold); }

.foot__bar{ border-top:1px solid var(--line-2); }
.foot__bar-in{
  display:flex; flex-wrap:wrap; gap:12px 26px;
  align-items:center; justify-content:space-between;
  padding-block:20px; font-size:.755rem; color:var(--txt-3);
}
.foot__legal{ display:flex; flex-wrap:wrap; gap:12px 22px; }
.foot__legal a:hover{ color:var(--gold); }

/* ---------- 8. Responsive ---------- */
@media (max-width:1080px){
  .hero__in{ grid-template-columns:1fr; grid-template-areas:"copy" "viz" "trust"; }
  .hero__viz{ max-width:640px; margin-inline:auto; }
  .process{ grid-template-columns:1fr; }
  .products{ grid-template-columns:1fr; }
  .infra{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:34px; }
  .step:nth-child(3n) .step__rail,
  .step:nth-child(3n) .step__dot{ display:none; }
}

@media (max-width:900px){
  .brand__logo{ width:148px; max-height:52px; }
  .mainnav{
    position:fixed; inset:78px 0 auto 0;
    display:none; flex-direction:column; align-items:stretch; gap:0;
    background:var(--bg-2); border-bottom:1px solid var(--line);
    padding:14px var(--gut) 22px; max-height:calc(100dvh - 78px); overflow:auto;
  }
  .mainnav.is-open{ display:flex; }
  .mainnav>ul{ flex-direction:column; align-items:stretch; gap:0; }
  .mainnav__link{ display:block; padding:14px 0; border-bottom:1px solid var(--line-2); }
  .mainnav__link.is-active{ border-bottom-color:var(--gold); }
  .mainnav__cta{ display:inline-flex; justify-content:center; margin-top:18px; }
  .topbar__cta{ display:none; }
  .burger{ display:block; }

  .pillars{ grid-template-columns:1fr; }
  .products__grid{ grid-template-columns:1fr; }
  .grid-3,.grid-2,.split{ grid-template-columns:1fr; }
  .kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .foot__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:640px){
  .steps{ grid-template-columns:1fr; row-gap:28px; }
  .step__rail,.step__dot{ display:none !important; }
  .step__no{ margin-bottom:14px; }
  .kpis{ grid-template-columns:1fr; }
  .hero__actions .btn,
  .ctaband__actions .btn{ flex:1 1 auto; justify-content:center; }

  /* Footer mobile: structură dedicată, nu coloane desktop stivuite. */
  .foot__grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      "brand brand"
      "company services"
      "contact contact";
    gap:22px 26px;
    padding-block:28px 22px;
  }
  .foot__brand{
    grid-area:brand;
    display:flex; align-items:center; justify-content:space-between; gap:18px;
    padding-bottom:20px; border-bottom:1px solid var(--line-2);
  }
  .brand--foot{ margin-right:0; }
  .brand__logo--foot{ width:142px; }
  .foot__legal-id{
    margin-top:0; text-align:right; font-size:.68rem; line-height:1.5;
  }
  .foot__col--company{ grid-area:company; }
  .foot__col--services{ grid-area:services; }
  .foot__contact{
    grid-area:contact; padding-top:20px; border-top:1px solid var(--line-2);
  }
  .foot__h{ margin-bottom:10px; font-size:.66rem; }
  .foot__col li{ margin-bottom:6px; }
  .foot__col a{ font-size:.79rem; }
  .foot__contact-list{ display:grid; gap:8px; }
  .foot__contact-list li{ margin-bottom:0; font-size:.79rem; line-height:1.45; }
  .foot__social{ margin-top:14px; }
  .foot__social a{ width:32px; height:32px; }
  .foot__anpc{
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px; padding-bottom:18px;
  }
  .foot__anpc a{ padding:7px 9px; text-align:center; font-size:.66rem; }
  .foot__bar-in{
    display:grid; grid-template-columns:1fr; gap:12px;
    padding-block:15px 18px; font-size:.68rem; line-height:1.5;
  }
  .foot__legal{
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px 14px;
  }
  .foot__legal a{ display:block; line-height:1.4; }
}

@media (max-width:380px){
  .foot__brand{ align-items:flex-start; }
  .brand__logo--foot{ width:132px; }
  .foot__legal-id{ font-size:.64rem; }
  .foot__grid{ gap-inline:20px; }
  .foot__legal{ grid-template-columns:1fr; }
}


/* Stage 1.6 — integrated hero + richer network motion
   The approved render remains the visual source of truth. On desktop the
   artwork is enlarged and feathered into the hero instead of reading as a
   rectangular image. Motion stays aligned to the original 856×580 scene. */
.brand__logo{filter:drop-shadow(0 2px 10px rgba(0,0,0,.16));}

.hero-render{
  --hero-parallax-x:0px;
  --hero-parallax-y:0px;
  position:relative;
  width:100%;
  aspect-ratio:856 / 580;
  isolation:isolate;
  overflow:hidden;
}
.hero-render__stage{
  position:absolute;
  inset:0;
  transform:translate3d(var(--hero-parallax-x),var(--hero-parallax-y),0) scale(1.006);
  transform-origin:50% 50%;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);
  will-change:transform;
}
.hero-render__picture{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
}
.hero-render__img{
  width:100%;
  height:100%;
  object-fit:cover;
  user-select:none;
  pointer-events:none;
}
.hero-render::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:8% 5% 5%;
  border-radius:50%;
  background:
    radial-gradient(circle at 43% 44%,rgba(62,166,232,.105),transparent 27%),
    radial-gradient(circle at 58% 50%,rgba(199,154,67,.09),transparent 48%);
  filter:blur(30px);
  pointer-events:none;
}
/* Default/tablet/mobile integration: only the vertical edge is feathered.
   Mobile is full-bleed, so keeping the side pixels intact preserves impact. */
.hero-render::after{
  content:"";
  position:absolute;
  z-index:4;
  inset:-1px;
  pointer-events:none;
  background:linear-gradient(180deg,
    rgba(25,40,61,.98) 0%,
    rgba(25,40,61,0) 8%,
    rgba(16,29,48,0) 91%,
    rgba(16,29,48,.98) 100%);
}

.hero-render__labels{
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
}
.hero-render__label{
  position:absolute;
  transform:translate(-50%,-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:clamp(9px,1.25vw,18px);
  padding:clamp(1px,.14vw,2px) clamp(3px,.42vw,6px);
  border:1px solid rgba(211,155,58,.34);
  border-radius:3px;
  background:rgba(4,12,22,.96);
  box-shadow:0 2px 8px rgba(0,0,0,.24);
  color:#D9A441;
  font:600 clamp(5px,.62vw,10px)/1.1 var(--ff-b);
  letter-spacing:.035em;
  white-space:nowrap;
}
.hero-render__label--cloud{left:11.6%;top:28.5%;}
.hero-render__label--servers{left:75.7%;top:30.1%;}
.hero-render__label--monitoring{left:86.9%;top:61%;}
.hero-render__label--security{left:68.9%;top:86%;}
.hero-render__label--users{left:23.5%;top:89.3%;}

.hero-motion{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}
.hero-motion__halo,
.hero-motion__core{
  transform-box:fill-box;
  transform-origin:center;
  will-change:opacity,transform;
}
.hero-motion__halo{
  opacity:.22;
  filter:url(#heroGlowBlue);
  animation:heroHaloBreath 5.2s ease-in-out infinite;
}
.hero-motion__core--outer{
  fill:rgba(72,190,255,.09);
  stroke:rgba(116,212,255,.34);
  stroke-width:1.15;
  filter:url(#heroGlowBlue);
  animation:heroCoreOuter 5.2s ease-in-out infinite;
}
.hero-motion__core--mid{
  fill:rgba(93,205,255,.16);
  stroke:rgba(148,228,255,.28);
  stroke-width:.9;
  filter:url(#heroGlowBlue);
  animation:heroCoreMid 3.9s ease-in-out .45s infinite;
}
.hero-motion__core--inner{
  fill:#B9ECFF;
  opacity:.62;
  filter:url(#heroGlowBlue);
  animation:heroCoreInner 2.9s ease-in-out infinite;
}
.hero-motion__cloud-beam{
  stroke:#FFD36A;
  stroke-width:2.1;
  stroke-linecap:round;
  opacity:.18;
  filter:url(#heroGlowGold);
  animation:heroCloudBeam 5.7s ease-in-out 1.2s infinite;
}
.hero-motion__shield-halo{
  fill:rgba(255,195,70,.08);
  stroke:rgba(255,205,91,.18);
  stroke-width:1;
  transform-box:fill-box;
  transform-origin:center;
  filter:url(#heroGlowGold);
  animation:heroShieldBreath 6.6s ease-in-out 2.2s infinite;
}
.hero-motion__signal circle{
  fill:#FFF0B4;
  opacity:.12;
  transform-box:fill-box;
  transform-origin:center;
  animation:heroSignal 4.8s ease-in-out infinite;
}
.hero-motion__signal circle:nth-child(2){animation-delay:.45s;}
.hero-motion__signal circle:nth-child(3){animation-delay:.9s;}
.hero-motion__signal circle:nth-child(4){animation-delay:1.35s;}
.hero-motion__nodes circle{
  fill:#FFD36A;
  opacity:.2;
  transform-box:fill-box;
  transform-origin:center;
  animation:heroNode 6.4s ease-in-out infinite;
}
.hero-motion__nodes circle:nth-child(2){animation-delay:.7s;}
.hero-motion__nodes circle:nth-child(3){animation-delay:1.6s;}
.hero-motion__nodes circle:nth-child(4){animation-delay:2.8s;}
.hero-motion__nodes circle:nth-child(5){animation-delay:4.1s;}
.hero-motion__nodes circle:nth-child(6){animation-delay:5.2s;}
.hero-motion__nodes circle:nth-child(7){animation-delay:3.4s;}
.hero-motion__nodes circle:nth-child(8){animation-delay:1.1s;}

.hero-motion__leds circle{
  fill:#FFD36A;
  opacity:.14;
  animation:heroLed 5.8s ease-in-out infinite;
}
.hero-motion__leds circle:nth-child(2){animation-delay:.55s;}
.hero-motion__leds circle:nth-child(3){animation-delay:1.65s;}
.hero-motion__leds circle:nth-child(4){animation-delay:2.35s;}
.hero-motion__leds circle:nth-child(5){animation-delay:3.45s;}
.hero-motion__leds circle:nth-child(6){animation-delay:4.25s;}
.hero-motion__leds circle:nth-child(7){animation-delay:2.9s;}
.hero-motion__leds circle:nth-child(8){animation-delay:5.05s;}
.hero-motion__leds circle:nth-child(9){animation-delay:1.15s;}

.hero-motion__packet-tail{opacity:.14;}
.hero-motion__packet-dot{opacity:.95;}
.hero-motion__packet--gold .hero-motion__packet-tail{fill:#FFD36A;}
.hero-motion__packet--gold .hero-motion__packet-dot{fill:#FFF1BD;}
.hero-motion__packet--blue .hero-motion__packet-tail{fill:#67CCFF;}
.hero-motion__packet--blue .hero-motion__packet-dot{fill:#D9F5FF;}

@keyframes heroHaloBreath{
  0%,100%{opacity:.12;transform:scale(.9);}
  50%{opacity:.38;transform:scale(1.22);}
}
@keyframes heroCoreOuter{
  0%,100%{opacity:.28;transform:scale(.91);}
  50%{opacity:.72;transform:scale(1.15);}
}
@keyframes heroCoreMid{
  0%,100%{opacity:.24;transform:scale(.9);}
  50%{opacity:.68;transform:scale(1.12);}
}
@keyframes heroCoreInner{
  0%,100%{opacity:.42;transform:scale(.92);}
  50%{opacity:.92;transform:scale(1.15);}
}
@keyframes heroCloudBeam{
  0%,100%{opacity:.12;stroke-width:1.4;}
  45%{opacity:.48;stroke-width:2.6;}
  62%{opacity:.2;stroke-width:1.7;}
}
@keyframes heroShieldBreath{
  0%,100%{opacity:.12;transform:scale(.9);}
  50%{opacity:.46;transform:scale(1.16);}
}
@keyframes heroSignal{
  0%,52%,100%{opacity:.1;transform:scale(.78);}
  61%{opacity:.88;transform:scale(1.5);}
  72%{opacity:.18;transform:scale(.92);}
}
@keyframes heroNode{
  0%,42%,100%{opacity:.13;transform:scale(.82);}
  49%{opacity:.72;transform:scale(1.52);}
  56%{opacity:.2;transform:scale(.95);}
}
@keyframes heroLed{
  0%,34%,100%{opacity:.1;}
  41%{opacity:.78;}
  47%{opacity:.2;}
  52%{opacity:.58;}
  58%{opacity:.13;}
}

/* Stage 2.2.2 — desktop motion aligned to the new 1536×1024 transparent artwork.
   It is separate from the frozen tablet/mobile overlay, so their coordinates never drift. */
.hero-motion-desktop{
  display:none;
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}
.hero-motion-desktop__halo,
.hero-motion-desktop__core,
.hero-motion-desktop__shield-halo,
.hero-motion-desktop__signal circle,
.hero-motion-desktop__nodes circle{
  transform-box:fill-box;
  transform-origin:center;
  will-change:opacity,transform;
}
.hero-motion-desktop__halo{
  opacity:.16;
  filter:url(#heroDesktopGlowBlue);
  animation:heroDesktopHaloBreath 5.6s ease-in-out infinite;
}
.hero-motion-desktop__core--outer{
  fill:rgba(65,188,255,.07);
  stroke:rgba(116,220,255,.28);
  stroke-width:1.7;
  filter:url(#heroDesktopGlowBlue);
  animation:heroDesktopCoreOuter 5.6s ease-in-out infinite;
}
.hero-motion-desktop__core--inner{
  fill:#C8F2FF;
  opacity:.48;
  filter:url(#heroDesktopGlowBlue);
  animation:heroDesktopCoreInner 3.2s ease-in-out .35s infinite;
}
.hero-motion-desktop__cloud-beam{
  stroke:#FFD36A;
  stroke-width:3.2;
  stroke-linecap:round;
  opacity:.12;
  filter:url(#heroDesktopGlowGold);
  animation:heroDesktopCloudBeam 6.1s ease-in-out 1s infinite;
}
.hero-motion-desktop__shield-halo{
  fill:rgba(255,193,64,.055);
  stroke:rgba(255,205,91,.16);
  stroke-width:1.5;
  filter:url(#heroDesktopGlowGold);
  animation:heroDesktopShieldBreath 6.8s ease-in-out 2.1s infinite;
}
.hero-motion-desktop__signal circle{
  fill:#FFF0B4;
  opacity:.1;
  animation:heroDesktopSignal 5.1s ease-in-out infinite;
}
.hero-motion-desktop__signal circle:nth-child(2){animation-delay:.55s;}
.hero-motion-desktop__signal circle:nth-child(3){animation-delay:1.1s;}
.hero-motion-desktop__signal circle:nth-child(4){animation-delay:1.65s;}
.hero-motion-desktop__nodes circle{
  fill:#FFD36A;
  opacity:.12;
  animation:heroDesktopNode 6.8s ease-in-out infinite;
}
.hero-motion-desktop__nodes circle:nth-child(2){animation-delay:.8s;}
.hero-motion-desktop__nodes circle:nth-child(3){animation-delay:1.8s;}
.hero-motion-desktop__nodes circle:nth-child(4){animation-delay:2.9s;}
.hero-motion-desktop__nodes circle:nth-child(5){animation-delay:4.1s;}
.hero-motion-desktop__nodes circle:nth-child(6){animation-delay:5.2s;}
.hero-motion-desktop__nodes circle:nth-child(7){animation-delay:3.3s;}
.hero-motion-desktop__nodes circle:nth-child(8){animation-delay:1.25s;}
.hero-motion-desktop__leds circle{
  fill:#FFD36A;
  opacity:.09;
  animation:heroDesktopLed 5.9s ease-in-out infinite;
}
.hero-motion-desktop__leds circle:nth-child(2){animation-delay:.6s;}
.hero-motion-desktop__leds circle:nth-child(3){animation-delay:1.4s;}
.hero-motion-desktop__leds circle:nth-child(4){animation-delay:2.2s;}
.hero-motion-desktop__leds circle:nth-child(5){animation-delay:3.2s;}
.hero-motion-desktop__leds circle:nth-child(6){animation-delay:4.1s;}
.hero-motion-desktop__leds circle:nth-child(7){animation-delay:2.75s;}
.hero-motion-desktop__leds circle:nth-child(8){animation-delay:4.8s;}
.hero-motion-desktop__leds circle:nth-child(9){animation-delay:1.05s;}
.hero-motion-desktop__packet-tail{opacity:.11;}
.hero-motion-desktop__packet-dot{opacity:.88;}
.hero-motion-desktop__packet--gold .hero-motion-desktop__packet-tail{fill:#FFD36A;}
.hero-motion-desktop__packet--gold .hero-motion-desktop__packet-dot{fill:#FFF1BD;}
.hero-motion-desktop__packet--blue .hero-motion-desktop__packet-tail{fill:#57C8FF;}
.hero-motion-desktop__packet--blue .hero-motion-desktop__packet-dot{fill:#D9F7FF;}

@keyframes heroDesktopHaloBreath{
  0%,100%{opacity:.09;transform:scale(.92);}
  50%{opacity:.29;transform:scale(1.18);}
}
@keyframes heroDesktopCoreOuter{
  0%,100%{opacity:.2;transform:scale(.92);}
  50%{opacity:.58;transform:scale(1.14);}
}
@keyframes heroDesktopCoreInner{
  0%,100%{opacity:.34;transform:scale(.92);}
  50%{opacity:.82;transform:scale(1.18);}
}
@keyframes heroDesktopCloudBeam{
  0%,100%{opacity:.08;stroke-width:2.2;}
  45%{opacity:.38;stroke-width:3.8;}
  63%{opacity:.15;stroke-width:2.6;}
}
@keyframes heroDesktopShieldBreath{
  0%,100%{opacity:.08;transform:scale(.92);}
  50%{opacity:.34;transform:scale(1.13);}
}
@keyframes heroDesktopSignal{
  0%,54%,100%{opacity:.08;transform:scale(.78);}
  63%{opacity:.72;transform:scale(1.45);}
  74%{opacity:.14;transform:scale(.94);}
}
@keyframes heroDesktopNode{
  0%,44%,100%{opacity:.08;transform:scale(.82);}
  51%{opacity:.58;transform:scale(1.45);}
  59%{opacity:.14;transform:scale(.96);}
}
@keyframes heroDesktopLed{
  0%,36%,100%{opacity:.07;}
  43%{opacity:.62;}
  49%{opacity:.16;}
  55%{opacity:.44;}
  61%{opacity:.1;}
}

@media (min-width:768px){
  .hero-render::after{display:none;}
}

/* Desktop composition pass (Stage 2.2).
   The artwork itself is unchanged. We reduce its visual mass, let it overlap
   the copy column subtly and pull the trust row into the feathered lower edge.
   This makes the hero read as one composition instead of text + a large image. */
@media (min-width:1081px){
  .hero{
    padding-top:clamp(30px,3.2vw,46px);
    padding-bottom:clamp(42px,4.4vw,62px);
  }
  .hero::before{
    background:
      radial-gradient(58% 58% at 69% 34%, rgba(199,154,67,.085), transparent 72%),
      radial-gradient(48% 46% at 17% 7%, rgba(58,110,190,.085), transparent 72%);
  }
  .hero__in{
    grid-template-columns:minmax(0,45fr) minmax(0,55fr);
    column-gap:0;
    row-gap:0;
    align-items:center;
  }
  .hero__copy{
    position:relative;
    z-index:3;
    max-width:610px;
    padding-bottom:clamp(4px,.9vw,13px);
  }
  .hero__viz{
    position:relative;
    z-index:1;
    width:min(680px,49vw);
    max-width:none;
    justify-self:end;
    margin-left:clamp(-70px,-4.1vw,-44px);
    margin-right:clamp(-70px,-4vw,-38px);
    transform:translateY(clamp(-16px,-1vw,-8px));
  }
  .hero__viz::before{
    content:"";
    position:absolute;
    z-index:-1;
    inset:11% 6% 12% 2%;
    border-radius:50%;
    background:radial-gradient(circle at 48% 50%,rgba(55,136,205,.12),rgba(199,154,67,.045) 44%,transparent 72%);
    filter:blur(30px);
    pointer-events:none;
  }
  .hero-render{
    overflow:visible;
    filter:drop-shadow(0 25px 46px rgba(0,0,0,.105));
  }
  /* Desktop-only transparent artwork. Tablet and mobile keep the frozen Stage 2.2 scene. */
  .hero-render__img{object-fit:contain;}
  .hero-render__labels,
  .hero-motion{display:none;}
  .hero-motion-desktop{display:block;}
  /* Stage 2.2.3 — the transparent artwork is a fixed reference plane.
     Only the SVG overlay animates; the base hero never translates/floats. */
  .hero-render__stage{
    transform:scale(1.006);
    transition:none;
    will-change:auto;
    animation:none;
  }
  .hero-render::after{display:none;}
  .trust{
    position:relative;
    z-index:4;
    margin-top:clamp(-24px,-1.55vw,-16px);
    padding-top:16px;
    border-top:1px solid rgba(255,255,255,.075);
  }
}

/* Tablet: keep the composition generous without forcing a mobile full-bleed. */
@media (max-width:1080px){
  .hero__viz{width:100%;max-width:760px;margin-inline:auto;}
}

/* Mobile: true viewport full-bleed geometry; no device-specific pixel offsets. */
@media (max-width:767px){
  .hero{padding-top:30px;}
  .hero__in{gap:20px;}
  .hero__lede{margin:20px 0 26px;font-size:.94rem;line-height:1.7;}
  .hero__lede br{display:none;}

  .hero__viz{
    width:100vw;
    max-width:none;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
  }
  .hero-render{
    width:100%;
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.16));
  }
  .hero-render__stage{transform:scale(1.006);}
  .hero-motion__packet-tail{opacity:.11;}
  .hero-motion__packet-dot{opacity:.82;}
  .hero-motion__halo{opacity:.18;}
  .trust{gap:14px 22px;}
  .trust li{font-size:.78rem;}
}

@media (max-width:430px){
  .hero__actions{gap:10px;}
  .hero__actions .btn{padding-inline:16px;font-size:.74rem;letter-spacing:.055em;}
}

/* Mobile process: compact vertical timeline instead of five oversized cards. */
@media (max-width:640px){
  .sec--process{padding-block:38px 44px;}
  .process{gap:24px;}
  .process__intro .h2{margin-bottom:8px;}
  .process__intro .lede{font-size:.94rem;line-height:1.55;}

  .steps{display:grid;grid-template-columns:1fr;row-gap:0;}
  .step{
    display:grid;
    grid-template-columns:38px 42px minmax(0,1fr);
    column-gap:12px;
    row-gap:4px;
    align-items:center;
    min-width:0;
    padding:0 0 22px;
  }
  .step:not(:last-child)::after{
    content:"";
    position:absolute;
    left:58px;
    top:42px;
    bottom:0;
    width:1px;
    background:linear-gradient(180deg,rgba(199,154,67,.48),rgba(199,154,67,.1));
  }
  .step__rail,.step__dot{display:none !important;}
  .step__no{
    grid-column:1;
    grid-row:1;
    margin:0;
    align-self:center;
    font-size:1.05rem;
    letter-spacing:.02em;
  }
  .step__icon{
    grid-column:2;
    grid-row:1;
    width:40px;
    height:40px;
    margin:0;
    position:relative;
    z-index:1;
    background:var(--bg-2);
  }
  .step__icon svg{width:20px;height:20px;}
  .step__h{
    grid-column:3;
    grid-row:1;
    margin:0;
    align-self:center;
    font-size:1rem;
    line-height:1.25;
  }
  .step__t{
    grid-column:2 / -1;
    grid-row:2;
    margin:3px 0 0;
    padding-right:2px;
    font-size:.82rem;
    line-height:1.5;
  }
  .step:last-child{padding-bottom:0;}
}

@media (max-width:370px){
  .step{grid-template-columns:34px 40px minmax(0,1fr);column-gap:10px;}
  .step:not(:last-child)::after{left:53px;}
  .step__icon{width:38px;height:38px;}
  .step__t{font-size:.8rem;}
}

@media (prefers-reduced-motion:reduce){
  .hero-render__stage{transform:none !important;transition:none !important;animation:none !important;}
  .hero-motion__halo,
  .hero-motion__core,
  .hero-motion__cloud-beam,
  .hero-motion__shield-halo,
  .hero-motion__signal circle,
  .hero-motion__nodes circle,
  .hero-motion__leds circle{animation:none !important;}
  .hero-motion__packet,
  .hero-motion-desktop__packet{display:none !important;}
  .hero-motion-desktop__halo,
  .hero-motion-desktop__core,
  .hero-motion-desktop__cloud-beam,
  .hero-motion-desktop__shield-halo,
  .hero-motion-desktop__signal circle,
  .hero-motion-desktop__nodes circle,
  .hero-motion-desktop__leds circle{animation:none !important;}
  .hero-motion-desktop__halo{opacity:.08;transform:none;}
  .hero-motion-desktop__core--outer{opacity:.2;transform:none;}
  .hero-motion-desktop__core--inner{opacity:.34;transform:none;}
  .hero-motion-desktop__cloud-beam{opacity:.08;}
  .hero-motion-desktop__shield-halo{opacity:.08;transform:none;}
  .hero-motion-desktop__signal circle,
  .hero-motion-desktop__nodes circle,
  .hero-motion-desktop__leds circle{opacity:.08;}
  .hero-motion__halo{opacity:.14;transform:none;}
  .hero-motion__core--outer{opacity:.3;transform:none;}
  .hero-motion__core--mid{opacity:.3;transform:none;}
  .hero-motion__core--inner{opacity:.5;transform:none;}
  .hero-motion__cloud-beam{opacity:.16;}
  .hero-motion__shield-halo{opacity:.14;transform:none;}
  .hero-motion__signal circle,.hero-motion__nodes circle,.hero-motion__leds circle{opacity:.16;}
}

/* CSS animations pause off-screen; JS also pauses the SVG SMIL packet motion. */
.hero-render.is-motion-paused .hero-motion-desktop__halo,
.hero-render.is-motion-paused .hero-motion-desktop__core,
.hero-render.is-motion-paused .hero-motion-desktop__cloud-beam,
.hero-render.is-motion-paused .hero-motion-desktop__shield-halo,
.hero-render.is-motion-paused .hero-motion-desktop__signal circle,
.hero-render.is-motion-paused .hero-motion-desktop__nodes circle,
.hero-render.is-motion-paused .hero-motion-desktop__leds circle,
.hero-render.is-motion-paused .hero-motion__halo,
.hero-render.is-motion-paused .hero-motion__core,
.hero-render.is-motion-paused .hero-motion__cloud-beam,
.hero-render.is-motion-paused .hero-motion__shield-halo,
.hero-render.is-motion-paused .hero-motion__signal circle,
.hero-render.is-motion-paused .hero-motion__nodes circle,
.hero-render.is-motion-paused .hero-motion__leds circle{
  animation-play-state:paused;
}

/* =========================================================
   9. Consimțământ pentru cookie-uri
   ========================================================= */
.cc[hidden]{ display:none; }
.cc__scrim{
  position:fixed; inset:0; z-index:190;
  background:rgba(6,12,20,.72); backdrop-filter:blur(3px);
}
.cc__scrim[hidden]{ display:none; }

/* --- bara de jos --- */
.cc__bar{
  position:fixed; left:0; right:0; bottom:0; z-index:200;
  background:var(--bg-3);
  border-top:1px solid var(--line);
  box-shadow:0 -18px 44px rgba(0,0,0,.42);
  animation:ccUp .28s ease-out both;
}
.cc__bar[hidden]{ display:none; }
@keyframes ccUp{ from{ transform:translateY(100%); } to{ transform:translateY(0); } }
@media (prefers-reduced-motion: reduce){ .cc__bar{ animation:none; } }

.cc__inner{
  width:100%; max-width:var(--wrap); margin-inline:auto;
  padding:20px var(--gut);
  display:flex; align-items:center; gap:26px; flex-wrap:wrap;
}
.cc__copy{ flex:1 1 460px; min-width:0; }
.cc__title{
  font-family:var(--ff-d); font-size:1.02rem; font-weight:700;
  margin:0 0 6px; letter-spacing:-.01em;
}
.cc__text{ color:var(--txt-2); font-size:.85rem; line-height:1.62; max-width:74ch; }
.cc__text a{ color:var(--gold); text-decoration:underline; text-underline-offset:3px; }

.cc__actions{ display:flex; gap:10px; flex-wrap:wrap; flex:0 0 auto; }
.cc__btn{ padding:11px 18px; font-size:.755rem; }
.cc.is-busy .cc__btn{ opacity:.55; pointer-events:none; }

/* --- panoul de preferințe --- */
.cc__sheet{
  position:fixed; z-index:201; inset:auto 0 0 0;
  display:flex; justify-content:center;
  padding:0 var(--gut) max(var(--gut), env(safe-area-inset-bottom));
}
.cc__sheet[hidden]{ display:none; }
.cc__sheet-in{
  width:100%; max-width:600px;
  background:var(--card); border:1px solid var(--line);
  border-radius:14px 14px 0 0;
  max-height:min(84dvh, 720px); display:flex; flex-direction:column;
  box-shadow:0 -20px 60px rgba(0,0,0,.5);
  animation:ccUp .26s ease-out both;
}
@media (prefers-reduced-motion: reduce){ .cc__sheet-in{ animation:none; } }
@media (min-width:720px){
  .cc__sheet{ inset:0; align-items:center; padding:var(--gut); }
  .cc__sheet-in{ border-radius:14px; }
}

.cc__sheet-head{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:22px 24px 16px; border-bottom:1px solid var(--line-2);
}
.cc__sheet-title{ font-family:var(--ff-d); font-size:1.08rem; font-weight:700; margin:0; }
.cc__x{
  background:none; border:1px solid var(--line); border-radius:var(--r-btn);
  color:var(--txt-2); padding:6px; cursor:pointer; flex:none;
}
.cc__x:hover{ color:var(--gold); border-color:var(--gold); }

.cc__cats{ padding:8px 24px; overflow:auto; }
.cc__cat{ padding:18px 0; border-bottom:1px solid var(--line-2); }
.cc__cat:last-child{ border-bottom:0; }
.cc__cat-head{ display:flex; align-items:center; justify-content:space-between; gap:14px; }
.cc__cat-name{ font-weight:600; font-size:.94rem; }
.cc__cat-desc{ color:var(--txt-2); font-size:.815rem; line-height:1.6; margin-top:9px; max-width:66ch; }
.cc__pill{
  flex:none; font-size:.66rem; letter-spacing:.09em; color:var(--gold);
  border:1px solid rgba(199,154,67,.42); border-radius:999px; padding:4px 11px;
}

/* comutator */
.cc__sw{ display:flex; align-items:center; gap:13px; cursor:pointer; }
.cc__sw.is-locked{ cursor:default; }
.cc__sw input{ position:absolute; opacity:0; width:0; height:0; }
.cc__sw-track{
  position:relative; flex:none; width:42px; height:24px; border-radius:999px;
  background:#26364C; border:1px solid var(--line);
  transition:background-color .18s ease, border-color .18s ease;
}
.cc__sw-dot{
  position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%;
  background:var(--txt-3); transition:transform .18s ease, background-color .18s ease;
}
.cc__sw input:checked + .cc__sw-track{ background:var(--gold-dim); border-color:var(--gold); }
.cc__sw input:checked + .cc__sw-track .cc__sw-dot{ transform:translateX(18px); background:var(--gold); }
.cc__sw input:disabled + .cc__sw-track{ opacity:.6; }
.cc__sw input:focus-visible + .cc__sw-track{ outline:2px solid var(--gold); outline-offset:3px; }

.cc__sheet-foot{ padding:18px 24px 22px; border-top:1px solid var(--line-2); }
.cc__fine{ color:var(--txt-3); font-size:.755rem; line-height:1.6; margin-bottom:14px; }
.cc__sheet-actions{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }

@media (max-width:640px){
  .cc__inner{ padding:18px var(--gut); gap:16px; }
  .cc__actions{ width:100%; }
  .cc__actions .cc__btn{ flex:1 1 auto; justify-content:center; }
  .cc__sheet-actions{ width:100%; }
  .cc__sheet-actions .cc__btn{ flex:1 1 auto; justify-content:center; }
}