/* ============================================================================
   UNRIVALS Deck System v1 — deck.css
   ----------------------------------------------------------------------------
   Sistemul vizual al deck-urilor de board. Versionat în cale (/deck/v1/): o
   schimbare de sistem înseamnă un folder v2/, niciodată o editare pe v1 sub
   deck-uri deja trimise.

   Principiul: PÂNZĂ FIXĂ 1600x900. Tipografia se declară în px pe pânză, iar
   JS-ul scalează pânza întreagă (transform: scale). Nimic nu se recalculează
   după lățimea ecranului, deci proporțiile desenate rămân identice de la un
   deck la altul. Sub 900px pânza se desface și slide-ul derulează vertical.

   Paleta: cele 7 tokenuri V01, atât. Fără verde, fără culori de dashboard.
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@300;400;700;900&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  /* --- cele 7 culori V01, rol semantic fix --------------------------------- */
  --void:#0A0A0A;
  --surface:#1A1A1A;
  --border:#888888;
  --cream:#F0EDE8;
  --signal:#C8372D;        /* accent pe DARK */
  --signal-dark:#9B2520;   /* accent pe LIGHT */
  --burgundy:#741C1C;      /* logo only */

  /* --- ink derivat (aceleași culori, transparență de suprafață) ------------ */
  --ink:var(--cream);
  --ink-dim:rgba(240,237,232,.62);
  --ink-faint:rgba(240,237,232,.34);
  --rule:rgba(240,237,232,.14);
  --rule-signal:rgba(200,55,45,.26);

  /* --- pânza -------------------------------------------------------------- */
  --W:1600;
  --H:900;
  --margin:96px;      /* margine de siguranță stânga/dreapta */
  --margin-top:64px;
  --margin-bot:92px;  /* lasă loc barei de jos */
  --gutter:32px;
  --col:calc((1600px - (2 * var(--margin)) - (11 * var(--gutter))) / 12); /* 85.33px */

  /* --- scala tipografică, px pe pânză ------------------------------------- */
  --t-display:116px;
  --t-h1:88px;
  --t-h2:52px;
  --t-h3:24px;
  --t-lead:26px;
  --t-body:19px;
  --t-caption:15px;
  --t-mono:13px;

  --font:'Alexandria',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;

  --ease:cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{
  background:var(--void);
  color:var(--ink);
  font-family:var(--font);
  font-size:var(--t-body);
  line-height:1.55;
  overflow:hidden;
  -webkit-font-smoothing:antialiased;
}

/* ============================================================================
   1 · PÂNZA
   ========================================================================= */

.deck{position:relative;width:100vw;height:100vh;height:100dvh;overflow:hidden;}

.slide{
  position:absolute;inset:0;display:none;
  align-items:center;justify-content:center;
  z-index:1;
}
.slide.active{display:flex;}

/* pânza propriu-zisă: 1600x900, scalată din JS prin --fit */
.stage{
  position:relative;
  width:1600px;height:900px;
  flex:0 0 auto;
  transform:scale(var(--fit,1));
  transform-origin:center center;
  padding:var(--margin-top) var(--margin) var(--margin-bot);
  display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;
}
.stage>*{position:relative;z-index:2;}
.stage>.bg,.stage>.motif{z-index:0;}

/* ============================================================================
   2 · FUNDALURI ȘI TEXTURI
   portate din motorul de reels (_engine/src/Visuals.tsx): DotGrid gap 44,
   Lattice gap 96, Hatch gap 26 la 45°, Glow radial. Aceleași valori.
   ========================================================================= */

.bg{position:absolute;inset:0;pointer-events:none;}
.bg.dots{
  opacity:.20;
  background-image:radial-gradient(circle at 22px 22px, var(--cream) 1.6px, transparent 1.7px);
  background-size:44px 44px;
}
.bg.lattice{
  opacity:.10;
  background-image:linear-gradient(var(--cream) 1px,transparent 1px),
                   linear-gradient(90deg,var(--cream) 1px,transparent 1px);
  background-size:96px 96px;
}
.bg.hatch{
  opacity:.07;
  background-image:repeating-linear-gradient(45deg,var(--cream) 0 1.2px,transparent 1.2px 26px);
}
.bg.glow{
  opacity:.5;
  background:radial-gradient(58% 62% at 78% 22%, rgba(200,55,45,.30), transparent 62%);
}
/* grain — portat din carousel-template.html */
.bg.grain{
  opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* motiv Code of Continuity ca ancoră vizuală, colț dreapta */
.motif{
  position:absolute;right:-64px;top:50%;transform:translateY(-50%);
  width:420px;height:420px;color:var(--signal);opacity:.07;pointer-events:none;
}
.motif.sm{width:280px;height:280px;top:14%;transform:none;right:-40px;}
.motif svg{width:100%;height:100%;display:block;}

/* fundal de pagină, subtil, comun tuturor slide-urilor */
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(200,55,45,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(200,55,45,.035) 1px,transparent 1px);
  background-size:52px 52px;
}
.slide.alt .stage{background:radial-gradient(110% 88% at 86% 14%, rgba(116,28,28,.26), transparent 60%);}

/* ============================================================================
   3 · TIPOGRAFIE — 3 niveluri vizibile per slide, maximum
   ========================================================================= */

.eyebrow{
  font-family:var(--mono);font-size:var(--t-mono);font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:var(--signal);
  display:flex;align-items:center;gap:12px;margin-bottom:24px;
}
.eyebrow .ei{width:20px;height:20px;flex:0 0 auto;}
.eyebrow .ei svg{width:100%;height:100%;}

h1,.display{font-size:var(--t-display);font-weight:900;line-height:.9;letter-spacing:-.032em;text-transform:uppercase;}
h2,.title{font-size:var(--t-h2);font-weight:700;line-height:1.06;letter-spacing:-.018em;}
h3{font-size:var(--t-h3);font-weight:700;line-height:1.25;letter-spacing:-.01em;}

.lead{font-size:var(--t-lead);font-weight:300;line-height:1.5;color:var(--ink-dim);max-width:56ch;margin-top:20px;}
.lead b,.lead strong{color:var(--ink);font-weight:700;}
.body{font-size:var(--t-body);font-weight:300;line-height:1.55;color:var(--ink-dim);max-width:64ch;}
.mono{font-family:var(--mono);font-size:var(--t-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);}
.signal{color:var(--signal);}
strong{color:var(--ink);font-weight:700;}

/* bara de sursă — obligatorie pe orice slide cu cifre */
.srcbar{
  font-family:var(--mono);font-size:11px;letter-spacing:.04em;line-height:1.6;
  color:var(--ink-faint);margin-top:20px;max-width:104ch;
}

/* build-in: fiecare copil direct marcat .an intră etajat */
@keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.slide.active .an{animation:rise .5s var(--ease) both;}
.slide.active .an:nth-child(1){animation-delay:.02s}
.slide.active .an:nth-child(2){animation-delay:.09s}
.slide.active .an:nth-child(3){animation-delay:.16s}
.slide.active .an:nth-child(4){animation-delay:.23s}
.slide.active .an:nth-child(5){animation-delay:.30s}
.slide.active .an:nth-child(6){animation-delay:.37s}
.slide.active .an:nth-child(7){animation-delay:.44s}
@media (prefers-reduced-motion:reduce){.slide.active .an{animation:none;}}

/* ============================================================================
   4 · TIPURI DE SLIDE
   ========================================================================= */

/* --- 4.1 cover ----------------------------------------------------------- */
.cover-top{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-bottom:48px;}
.logo-lockup img{height:48px;width:auto;display:block;}
.cover-tag{font-family:var(--mono);font-size:14px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-dim);margin-top:28px;}
.cover-lead{font-size:var(--t-lead);font-weight:300;line-height:1.45;color:var(--ink-dim);max-width:52ch;margin-top:28px;}
.cover-why{
  border-left:3px solid var(--signal);padding-left:24px;margin-top:30px;max-width:56ch;
  font-size:28px;font-weight:300;line-height:1.45;color:var(--ink);
}
.cover-why cite{display:block;margin-top:14px;font-family:var(--mono);font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-faint);font-style:normal;}
.slide.cover .stage::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:var(--cover-img,none) center 32%/cover no-repeat;
  filter:grayscale(1) invert(1);opacity:.14;
}
.slide.cover .stage::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,10,.34) 0%,rgba(10,10,10,.06) 42%,rgba(10,10,10,.76) 100%);
}

/* --- 4.2 statement (un singur gând, tipografie mare) --------------------- */
.slide-type-statement h2{max-width:22ch;}

/* --- 4.3 stat cards ------------------------------------------------------ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px;}
.stats.c3{grid-template-columns:repeat(3,1fr);}
.stats.c2{grid-template-columns:repeat(2,1fr);}
.stat{
  border:1px solid var(--rule);border-top:2px solid var(--border);
  background:var(--surface);padding:26px 24px;min-height:190px;
  display:flex;flex-direction:column;gap:10px;
}
.stats.tight .stat{min-height:104px;padding:14px 18px;}
.stats.tight .s-num{font-size:44px;}
.stat.sig{border-top-color:var(--signal);}
.stat .st-ico{width:28px;height:28px;color:var(--ink-faint);}
.stat.sig .st-ico{color:var(--signal);}
.stat .st-ico svg{width:100%;height:100%;}
.stat .s-num{font-size:56px;font-weight:900;line-height:1;letter-spacing:-.02em;margin-top:auto;color:var(--ink);}
.stat.sig .s-num{color:var(--signal);}
.stat .s-num span{font-family:var(--mono);font-size:.3em;font-weight:500;color:var(--ink-faint);letter-spacing:.04em;}
.stat .s-lbl{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-dim);line-height:1.5;}

/* --- 4.4 verdict / exec summary ------------------------------------------ */
.exec{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;margin-top:32px;align-items:start;}
.exec .verdict{font-size:26px;font-weight:300;line-height:1.5;color:var(--ink-dim);}
.exec .verdict strong{color:var(--ink);font-weight:700;}
.finds{display:flex;flex-direction:column;gap:16px;}
.find{
  border:1px solid var(--rule);border-left:3px solid var(--signal);
  background:var(--surface);padding:18px 22px;display:flex;gap:18px;align-items:center;
}
.find .f-ico{width:28px;height:28px;flex:0 0 auto;color:var(--signal);}
.find .f-ico svg{width:100%;height:100%;}
.find .f-num{font-family:var(--mono);font-size:22px;font-weight:700;color:var(--signal);line-height:1;flex:0 0 auto;}
.find .f-txt{font-size:16px;color:var(--ink-dim);line-height:1.45;font-weight:300;}
.find .f-txt b{color:var(--ink);font-weight:700;}

/* --- 4.5 trei oglinzi ---------------------------------------------------- */
.mirrors{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px;}
.mir{border:1px solid var(--rule);background:var(--surface);padding:22px;display:flex;flex-direction:column;gap:10px;}
.mir.hot{border-left:3px solid var(--signal);}
.mir .mir-t{font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);}
.mir .mir-q{font-size:17px;font-weight:300;line-height:1.45;color:var(--ink);}
.mir .mir-q b{color:var(--signal);font-weight:700;}

/* --- 4.6 hartă 2x2 / cadrane --------------------------------------------- */
.map2x2{margin-top:28px;}
.m-grid{
  position:relative;width:100%;height:340px;border:1px solid var(--rule);background:
    linear-gradient(90deg,transparent 49.85%,var(--rule) 49.85%,var(--rule) 50.15%,transparent 50.15%),
    linear-gradient(180deg,transparent 49.85%,var(--rule) 49.85%,var(--rule) 50.15%,transparent 50.15%),
    var(--surface);
}
.m-dot{
  position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:12px;color:var(--ink-dim);white-space:nowrap;z-index:2;
}
.m-dot i{width:9px;height:9px;background:var(--border);border-radius:50%;flex:0 0 auto;}
.m-dot.me{color:var(--signal);font-weight:700;font-size:13px;}
.m-dot.me i{background:var(--signal);width:13px;height:13px;box-shadow:0 0 0 4px rgba(200,55,45,.18);}
.m-dot.ghost i{background:none;border:1.5px dashed var(--signal);width:12px;height:12px;}
.m-ax{position:absolute;font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap;z-index:1;}
.m-ax.l{left:14px;bottom:10px;} .m-ax.r{right:14px;bottom:10px;}
.m-ax.t{left:14px;top:10px;}    .m-ax.b{left:14px;bottom:34px;}

/* --- 4.7 ERRC 4 cadrane / oportunități ----------------------------------- */
.quads{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:36px;}
.quad{border:1px solid var(--rule);border-top:2px solid var(--signal);background:var(--surface);padding:24px;display:flex;flex-direction:column;gap:10px;}
.quad .q-tag{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--signal);}
.quad h3{font-size:20px;}
.quad p{font-size:16px;font-weight:300;line-height:1.5;color:var(--ink-dim);}

/* --- 4.8 tabel comparativ ------------------------------------------------ */
.tbl{width:100%;border-collapse:collapse;margin-top:32px;font-size:17px;}
.tbl th,.tbl td{text-align:left;padding:13px 18px;border-bottom:1px solid var(--rule);}
.tbl th{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);font-weight:500;}
.tbl td{color:var(--ink-dim);font-weight:300;}
.tbl td.num{font-family:var(--mono);color:var(--ink);white-space:nowrap;}
.tbl tr.me td{color:var(--ink);font-weight:700;}
.tbl tr.me td.hot{color:var(--signal);}
.tbl caption{caption-side:bottom;font-family:var(--mono);font-size:11px;color:var(--ink-faint);text-align:left;margin-top:14px;letter-spacing:.05em;}

/* --- 4.9 carduri de grafic (motor: deck-charts.js) ----------------------- */
.chart-card{border:1px solid var(--rule);background:var(--surface);padding:24px 26px 20px;display:flex;flex-direction:column;margin-top:30px;}
.chart-card .c-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;}
.chart-card .c-name{font-weight:700;font-size:20px;letter-spacing:-.01em;}
.chart-card .c-delta{font-family:var(--mono);font-weight:700;font-size:22px;color:var(--signal);}
.chart-card .c-sub{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);margin:4px 0 18px;}
.chart-card .c-foot{font-size:15px;color:var(--ink-dim);font-weight:300;line-height:1.5;margin-top:16px;}
.chart-card .c-foot b{color:var(--ink);font-weight:700;}
.chart-card svg{width:100%;height:auto;display:block;overflow:visible;}
.charts2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px;}
.charts2 .chart-card{margin-top:0;}

/* --- 4.10 puncte (max 1 slide de bullet la 4 de vizual) ------------------ */
.points{list-style:none;margin-top:32px;display:flex;flex-direction:column;gap:20px;max-width:74ch;}
.points li{position:relative;padding-left:32px;font-size:22px;font-weight:300;line-height:1.5;color:var(--ink-dim);}
.points li::before{content:'';position:absolute;left:0;top:.52em;width:10px;height:10px;background:var(--signal);transform:rotate(45deg);}
.points li b{color:var(--ink);font-weight:700;}
.points.num{counter-reset:p;}
.points.num li{padding-left:38px;}
.points.num li::before{
  content:counter(p);counter-increment:p;background:none;transform:none;top:0;left:0;
  width:auto;height:auto;font-family:var(--mono);font-size:16px;color:var(--signal);font-weight:700;
}
.points.cols{display:grid;grid-template-columns:1fr 1fr;gap:18px 40px;max-width:none;}

/* --- 4.11 imagine: full-bleed, split, packshot -------------------------- */
.split{display:grid;grid-template-columns:1fr 1.3fr;gap:44px;align-items:center;margin-top:24px;}
/* fara min-width:0 coloana de grid se lateste dupa continutul ei intrinsec si
   impinge tot randul in afara ecranului (prins pe mobil, s3 si s11) */
.split>*{min-width:0;}
.split.rev{grid-template-columns:1.3fr 1fr;}
.figure{margin:0;border:1px solid var(--rule);background:var(--surface);}
.figure img{width:100%;height:auto;display:block;}
/* În split, pânza fixă nu iartă: imaginea primește un plafon de înălțime,
   altfel slide-ul iese afară și ultimul rând se pierde tăcut. Rama se strânge
   pe imagine (fit-content), altfel suprafața cardului lasă benzi gri laterale
   la orice imagine în picioare. */
.split .figure{width:fit-content;margin-inline:auto;max-width:100%;}
.split .figure img{max-height:526px;width:auto;max-width:100%;margin:0 auto;}
/* rama se strange pe imagine: altfel suprafata cardului lasa benzi laterale */
.figure.mini{width:fit-content;margin-inline:auto;}
.figure.mini img{max-height:246px;}
.figure figcaption{
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-faint);line-height:1.45;padding:10px 16px;border-top:1px solid var(--rule);
}
.figure.tall img{max-height:400px;object-fit:cover;object-position:center 38%;}
/* în split, imaginea are un plafon mai jos: coloana de stat cards dictează
   înălțimea, iar pânza este fixă — o imagine mai înaltă împinge slide-ul afară */
.split .figure.tall img{max-height:470px;}
.bleed{position:relative;margin:0;height:520px;border:1px solid var(--rule);overflow:hidden;background:var(--surface);}
.bleed img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;}
.bleed::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,10,.55),rgba(10,10,10,.18) 34%,rgba(10,10,10,.9));}
.bleed .b-cap{position:relative;z-index:2;padding:24px;margin-top:auto;height:100%;display:flex;flex-direction:column;justify-content:flex-end;}
.bleed .b-cap p{color:var(--ink);font-size:16px;font-weight:300;line-height:1.45;max-width:60ch;}

/* --- 4.11b IMAGINE EROU: poza rulează pe toată înălțimea pânzei -----------
   Slide-urile în care imaginea ESTE argumentul (poster, planșă, concept) nu-și
   permit plafonul din .split: acolo eyebrow-ul și titlul mănâncă din înălțime
   înainte ca imaginea să înceapă. Aici textul stă LÂNGĂ imagine, nu deasupra,
   iar imaginea folosește cei 900px întregi. */
.stage.hero{padding:0 0 0 var(--margin);}
.hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:48px;height:100%;align-items:center;}
.hero-txt{padding:var(--margin-top) 0 var(--margin-bot);display:flex;flex-direction:column;justify-content:center;}
.hero-txt .eyebrow{margin-bottom:20px;}
/* coloana e mai îngustă decât în .split, deci titlul coboară o treaptă ca să
   respecte ruperea de rând scrisă în conținut */
.hero-txt h2{margin-bottom:22px;font-size:44px;}
.hero-fig{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:28px 0;}
.hero-fig .figure{width:fit-content;max-width:100%;margin:0;display:flex;flex-direction:column;min-height:0;}
/* plafon explicit: 900 (pânza) - 2x28 (aer) - ~38 (captionul) */
.hero-fig .figure img{max-height:786px;height:auto;max-width:100%;width:auto;object-fit:contain;}
@media(max-width:900px){
  .stage.hero{padding:56px 20px 88px;}
  .hero-grid{grid-template-columns:1fr;height:auto;gap:22px;}
  .hero-txt{padding:0;}
  .hero-fig{height:auto;padding:0;}
  .hero-fig .figure{width:auto;margin-inline:-20px;}
  .hero-fig .figure img{max-height:420px;width:100%;object-fit:cover;}
}

/* --- 4.12 citat ---------------------------------------------------------- */
.pull{border-left:3px solid var(--signal);padding-left:32px;margin-top:32px;max-width:60ch;}
.pull p{font-size:34px;font-weight:300;line-height:1.35;color:var(--ink);}
.pull cite{display:block;margin-top:18px;font-family:var(--mono);font-size:12px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-faint);font-style:normal;}

/* --- 4.13 timeline / faze ----------------------------------------------- */
.phases{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-top:36px;}
.phase{border:1px solid var(--rule);border-top:2px solid var(--border);background:var(--surface);padding:16px 14px;display:flex;flex-direction:column;gap:8px;min-height:118px;}
.phase.on{border-top-color:var(--signal);}
.phase .p-n{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--signal);letter-spacing:.08em;}
.phase .p-t{font-size:14px;line-height:1.35;color:var(--ink-dim);font-weight:300;}
.phase.on .p-t{color:var(--ink);font-weight:400;}

/* --- 4.14 ofertă / preț -------------------------------------------------- */
.price{display:flex;flex-direction:column;align-items:flex-start;gap:2px;margin-top:26px;}
.price .old{font-family:var(--mono);font-size:26px;color:var(--ink-faint);text-decoration:line-through;letter-spacing:.06em;}
.price .now{font-size:76px;font-weight:900;line-height:1;letter-spacing:-.03em;color:var(--signal);}
.price .per{font-family:var(--mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim);}
.proof{border:1px solid var(--rule);border-left:3px solid var(--signal);background:var(--surface);padding:22px 26px;margin-top:26px;max-width:64ch;}
.proof .pr-t{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--signal);margin-bottom:12px;}
.proof p{font-size:17px;font-weight:300;line-height:1.55;color:var(--ink-dim);}
.proof p b{color:var(--ink);font-weight:700;}
.proof a{color:var(--signal);text-decoration:none;font-family:var(--mono);font-size:14px;}

/* --- 4.15 contact / închidere ------------------------------------------- */
.contact{margin-top:28px;font-family:var(--mono);font-size:14px;letter-spacing:.08em;display:flex;align-items:center;gap:14px;flex-wrap:wrap;color:var(--ink-dim);}
.contact .dot{width:7px;height:7px;background:var(--signal);transform:rotate(45deg);}
.contact a{color:var(--signal);text-decoration:none;}

/* ============================================================================
   5 · CROM — bara, contorul, progresul
   ========================================================================= */

.bar{
  position:fixed;bottom:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;
  padding:18px clamp(20px,4vw,44px);
  font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);
}
.bar .brand{display:flex;align-items:center;gap:10px;}
.bar .brand .d{width:8px;height:8px;background:var(--signal);transform:rotate(45deg);}
.bar .nav{display:flex;align-items:center;gap:16px;}
.bar .nav button{
  background:none;border:1px solid var(--rule);color:var(--cream);width:40px;height:40px;
  border-radius:2px;cursor:pointer;font-size:16px;line-height:1;
  transition:border-color .2s,color .2s;
}
.bar .nav button:hover{border-color:var(--signal);color:var(--signal);}
.counter{min-width:60px;text-align:center;white-space:nowrap;}
.progress{position:fixed;top:0;left:0;height:3px;background:var(--signal);z-index:11;transition:width .4s var(--ease);}

/* ============================================================================
   6 · MOBIL ≤900px — pânza se desface, slide-ul derulează
   Regimul calibrat 09.08.2026: fără scalare (text ilizibil la 0.5x),
   mărime naturală, imagini full-bleed, bară compactă cu fade.
   ========================================================================= */

@media(max-width:900px){
  .slide{align-items:flex-start;overflow-y:auto;}
  .stage{
    width:100%;height:auto;min-height:100%;transform:none;
    padding:56px 20px 88px;justify-content:flex-start;
  }
  .motif{display:none;}

  :root{
    --t-display:44px;--t-h1:38px;--t-h2:28px;--t-h3:19px;
    --t-lead:18px;--t-body:16px;--t-caption:14px;
  }
  h1,.display{line-height:.98;}
  .cover-why{font-size:19px;padding-left:16px;}
  .cover-top{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:28px;}

  .stats{grid-template-columns:1fr 1fr;gap:12px;margin-top:24px;}
  /* cifrele mari cu unitate lipita ("41.345/luna") nu se rup: pe doua coloane
     de ~169px cardul isi depaseste coloana si impinge randul afara. Pe telefon
     stat cards-urile stau unul sub altul. */
  .stats.tight{grid-template-columns:1fr;}
  .stats .stat{min-width:0;}
  .stat{min-height:140px;padding:16px;}
  .stat .s-num{font-size:36px;}
  .exec,.split,.split.rev{grid-template-columns:1fr;gap:22px;}
  .mirrors,.quads,.charts2,.points.cols{grid-template-columns:1fr;gap:12px;}
  .phases{grid-template-columns:1fr 1fr;gap:8px;}
  .points li{font-size:17px;padding-left:26px;}
  .pull p{font-size:22px;}
  .price .now{font-size:48px;}
  .m-grid{height:280px;}
  .tbl{font-size:14px;}
  .tbl th,.tbl td{padding:9px 10px;}

  /* imaginile ies din margine în margine; width-ul de fit-content din regimul
     de desktop se anuleaza, altfel rama depaseste ecranul spre dreapta */
  .figure,.bleed{margin-left:-20px;margin-right:-20px;border-left:0;border-right:0;}
  .split .figure,.figure.mini{width:auto;margin-inline:-20px;max-width:none;}
  .bleed{height:300px;}
  .figure.tall img{max-height:300px;}

  .bar{justify-content:flex-end;padding:20px 20px 14px;background:linear-gradient(180deg,rgba(10,10,10,0),rgba(10,10,10,.92) 34%);}
  .bar .brand{display:none;}
  .bar .nav button{width:46px;height:46px;}
}