/* EyeCube Seeing Forward — Deck v2 CSS
   Design system: Zaha DDArch AI 2026-06-11
   Build: Data DDArch AI 2026-06-11 */

/* ── FONTS ─────────────────────────────────────────────── */
@font-face { font-family:'Mona Sans'; font-weight:100 900; font-style:normal oblique;
  src:url('../fonts/Mona-Sans.woff2') format('woff2 supports variations'),
      url('../fonts/Mona-Sans.woff2') format('woff2'); }
@font-face { font-family:'EB Garamond'; font-weight:400; font-style:normal;
  src:url('../fonts/EB-Garamond-400.woff2') format('woff2'); }
@font-face { font-family:'EB Garamond'; font-weight:400; font-style:italic;
  src:url('../fonts/EB-Garamond-400i.woff2') format('woff2'); }
@font-face { font-family:'EB Garamond'; font-weight:500;
  src:url('../fonts/EB-Garamond-500.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:300;
  src:url('../fonts/IBM-Plex-Mono-300.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:400;
  src:url('../fonts/IBM-Plex-Mono-400.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-weight:500;
  src:url('../fonts/IBM-Plex-Mono-500.woff2') format('woff2'); }

/* ── TOKENS ─────────────────────────────────────────────── */
:root {
  --ec-petrolio:      #0E2B36;
  --ec-petrolio-deep: #071A21;
  --ec-salvia:        #3F6B5B;
  --ec-near-black:    #0A0A0A;
  --ec-oro:           #C9A96A;
  --ec-accent:        #1BBFB2;
  --ec-accent-dim:    rgba(27,191,178,0.18);
  --ec-font-sans:     'Mona Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', Helvetica, Arial, sans-serif;
  --ec-font-mono:     'IBM Plex Mono', 'Menlo', monospace;
  --ec-font-serif:    'EB Garamond', Georgia, serif;   /* solo citazioni/passaggi emotivi */
  --ec-text-xs:   0.64rem;
  --ec-text-sm:   0.8rem;
  --ec-text-base: 1rem;
  --ec-text-lg:   1.25rem;
  --ec-text-xl:   1.563rem;
  --ec-text-2xl:  1.953rem;
  --ec-text-3xl:  2.441rem;
  --ec-text-4xl:  3.052rem;
  --ec-text-hero: 4.768rem;
  --ec-sp-1:  0.25rem;
  --ec-sp-2:  0.5rem;
  --ec-sp-3:  0.75rem;
  --ec-sp-4:  1rem;
  --ec-sp-6:  1.5rem;
  --ec-sp-8:  2rem;
  --ec-sp-12: 3rem;
  --ec-sp-16: 4rem;
  --ec-r-sm: 2px; --ec-r-md: 4px; --ec-r-lg: 8px; --ec-r-pill: 100px;
  --ec-ease-out: cubic-bezier(0.16,1,0.3,1);
}

/* ── DARK THEME (default) ───────────────────────────────── */
:root, [data-theme="dark"] {
  --ec-bg:           #080F12;
  --ec-bg-surface:   #0E1E26;
  --ec-bg-subtle:    #162835;
  --ec-text-primary: #E8F0F4;
  --ec-text-secondary:#8DAEC0;
  --ec-text-muted:   #4E7080;
  --ec-border:       rgba(27,191,178,0.12);
  --ec-border-strong:rgba(27,191,178,0.28);
  --ec-dot-color:    rgba(27,191,178,0.07);
  --ec-dot-size:     24px;
  --ec-accent-text:  #1BBFB2;
  --ec-accent-bg:    rgba(27,191,178,0.18);
  --ec-kpi-number:   #1BBFB2;
  --ec-kpi-label:    #4E7080;
  --ec-oro-text:     #C9A96A;
  --ec-oro-border:   rgba(201,169,106,0.3);
  --ec-logo-filter:  brightness(0) invert(1);
  --ec-toggle-bg:    rgba(27,191,178,0.15);
  --ec-toggle-dot:   #1BBFB2;
  --ec-frame-border: 1px solid rgba(27,191,178,0.2);
  --ec-frame-elevation: 0 4px 32px rgba(0,0,0,0.5);
  --ec-divider-accent: linear-gradient(90deg,#1BBFB2 0%,transparent 100%);
}

/* ── LIGHT THEME ────────────────────────────────────────── */
[data-theme="light"] {
  --ec-bg:           #F7F8FA;
  --ec-bg-surface:   #FFFFFF;
  --ec-bg-subtle:    #EEF0F3;
  --ec-text-primary: #0E1A22;
  --ec-text-secondary:#3A5260;
  --ec-text-muted:   #748A96;
  --ec-border:       rgba(14,43,54,0.14);
  --ec-border-strong:rgba(14,43,54,0.32);
  --ec-dot-color:    rgba(14,43,54,0.08);
  --ec-dot-size:     24px;
  --ec-accent-text:  #0D9B90;
  --ec-accent-bg:    rgba(27,191,178,0.1);
  --ec-kpi-number:   #0E2B36;
  --ec-kpi-label:    #748A96;
  --ec-oro-text:     #B8943A;
  --ec-oro-border:   rgba(201,169,106,0.4);
  --ec-logo-filter:  none;
  --ec-toggle-bg:    #EEF0F3;
  --ec-toggle-dot:   #0E2B36;
  --ec-frame-border: 1px solid rgba(14,43,54,0.14);
  --ec-frame-elevation: 0 4px 16px rgba(14,43,54,0.12);
  --ec-divider-accent: linear-gradient(90deg,#0D9B90 0%,transparent 100%);
}

/* ── RESET ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin:0; padding:0; }
html, body { width:100%; height:100%; overflow:hidden; background:#000; }

/* ── DECK ───────────────────────────────────────────────── */
#deck {
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}

/* ── SLIDE BASE ─────────────────────────────────────────── */
.ec-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-color: var(--ec-bg);
  background-image: radial-gradient(var(--ec-dot-color) 1px, transparent 1px);
  background-size: var(--ec-dot-size) var(--ec-dot-size);
  font-family: var(--ec-font-serif);
  color: var(--ec-text-primary);
  overflow: hidden;
  display: none;
  padding: clamp(32px,4vh,64px) clamp(48px,5vw,96px);
}
.ec-slide.active { display: flex; }
.ec-slide.exiting { display: flex; opacity:0; pointer-events:none; transition: opacity 0.3s; }

/* ── LOGO + SLIDE NUMBER ────────────────────────────────── */
.ec-logo-mark {
  position: absolute;
  top: var(--ec-sp-6);
  left: var(--ec-sp-8);
  width: 32px; height: 32px;
  filter: var(--ec-logo-filter);
  opacity: 0.7;
}
.ec-slide-n {
  position: absolute;
  bottom: var(--ec-sp-6);
  right: var(--ec-sp-8);
  font-family: var(--ec-font-mono);
  font-size: var(--ec-text-xs);
  color: var(--ec-text-muted);
  letter-spacing: 0.1em;
}

/* ── TYPOGRAPHY — Sans-led health-tech ──────────────────── */
.ec-h1 { font-family:var(--ec-font-sans); font-size:clamp(2rem,4.7vw,4.768rem); font-weight:700; line-height:1.0; letter-spacing:-0.03em; color:var(--ec-text-primary); }
.ec-h2 { font-family:var(--ec-font-sans); font-size:clamp(1.5rem,3vw,3.052rem); font-weight:700; line-height:1.05; letter-spacing:-0.025em; color:var(--ec-text-primary); }
.ec-h3 { font-family:var(--ec-font-sans); font-size:clamp(1.2rem,2.4vw,2.441rem); font-weight:600; line-height:1.1; letter-spacing:-0.02em; }
.ec-h4 { font-family:var(--ec-font-sans); font-size:clamp(1rem,1.9vw,1.953rem); font-weight:600; letter-spacing:-0.015em; }
.ec-label { font-family:var(--ec-font-mono); font-size:var(--ec-text-xs); letter-spacing:0.14em; text-transform:uppercase; color:var(--ec-text-muted); }
.ec-body  { font-family:var(--ec-font-sans); font-size:clamp(0.85rem,1.1vw,1.1rem); font-weight:400; line-height:1.65; color:var(--ec-text-secondary); }
.ec-mono  { font-family:var(--ec-font-mono); font-size:var(--ec-text-sm); }
/* EB Garamond: solo citazioni/passaggi emotivi (max 4-5 slide) */
.ec-quote { font-family:var(--ec-font-serif); font-style:italic; font-size:clamp(1.4rem,2.8vw,2.8rem); line-height:1.35; color:var(--ec-text-primary); }
.ec-accent-text { color:var(--ec-accent-text); }
.ec-oro { color:var(--ec-oro-text); }

/* ── FRAME SYSTEM ───────────────────────────────────────── */
.ec-frame {
  position: relative;
  border: var(--ec-frame-border);
  border-radius: var(--ec-r-sm);
  overflow: hidden;
  box-shadow: var(--ec-frame-elevation);
}
.ec-frame::before, .ec-frame::after {
  content: '';
  position: absolute;
  width: 10px; height: 10px;
  border-color: var(--ec-accent);
  border-style: solid;
  z-index: 2;
}
.ec-frame::before { top:-1px; left:-1px; border-width:2px 0 0 2px; }
.ec-frame::after  { bottom:-1px; right:-1px; border-width:0 2px 2px 0; }
.ec-frame img { display:block; width:100%; height:100%; object-fit:cover; }

/* Frame con sfondo chiaro (per asset light su tema dark) */
.ec-frame-light {
  background: #FFFFFF;
  padding: 16px;
  border-radius: var(--ec-r-sm);
  border: 1px solid rgba(14,43,54,0.12);
  box-shadow: 0 2px 16px rgba(0,0,0,0.15);
  position: relative;
}
.ec-frame-light::before, .ec-frame-light::after {
  content: '';
  position: absolute;
  width: 8px; height: 8px;
  border-color: var(--ec-accent);
  border-style: solid;
  z-index: 2;
}
.ec-frame-light::before { top:-1px; left:-1px; border-width:2px 0 0 2px; }
.ec-frame-light::after  { bottom:-1px; right:-1px; border-width:0 2px 2px 0; }
.ec-frame-light img { display:block; width:100%; height:auto; border-radius:1px; }

/* ── KPI BLOCK ──────────────────────────────────────────── */
.ec-kpi { display:flex; flex-direction:column; gap:4px; }
.ec-kpi-number {
  font-family:var(--ec-font-mono);
  font-size:clamp(1.8rem,3.5vw,3.5rem);
  font-weight:700;
  color:var(--ec-kpi-number);
  line-height:1;
  letter-spacing:-0.02em;
  font-variant-numeric: tabular-nums;
}
.ec-kpi-label {
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--ec-kpi-label);
}
.ec-kpi-desc { font-family:var(--ec-font-serif); font-size:0.75rem; color:var(--ec-text-muted); line-height:1.5; margin-top:2px; }

/* ── TAG / BADGE ────────────────────────────────────────── */
.ec-tag {
  display:inline-flex; align-items:center; gap:4px;
  padding:2px 10px;
  border:1px solid var(--ec-border-strong);
  border-radius:var(--ec-r-pill);
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ec-text-secondary);
}
.ec-tag-accent {
  border-color:var(--ec-accent);
  color:var(--ec-accent-text);
  background:var(--ec-accent-bg);
}

/* ── DIVIDER HAIRLINE ───────────────────────────────────── */
.ec-rule {
  width:64px; height:1px;
  background:var(--ec-accent);
  margin:var(--ec-sp-4) 0;
  opacity:0.6;
}
.ec-rule-full { width:100%; height:1px; background:var(--ec-border); }

/* ── SOURCE CAPTION ─────────────────────────────────────── */
.ec-source {
  position:absolute;
  bottom:var(--ec-sp-8);
  left:50%;
  transform:translateX(-50%);
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  color:var(--ec-text-muted);
  letter-spacing:0.08em;
  white-space:nowrap;
}

/* ── PROGRESS BAR ───────────────────────────────────────── */
#ec-progress {
  position:fixed;
  bottom:0; left:0;
  height:2px;
  background:var(--ec-accent);
  opacity:0.7;
  transition:width 0.3s var(--ec-ease-out);
  z-index:200;
}
#ec-counter {
  position:fixed;
  bottom:var(--ec-sp-3);
  left:var(--ec-sp-6);
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  color:var(--ec-text-muted);
  letter-spacing:0.1em;
  z-index:200;
}

/* ── THEME TOGGLE ───────────────────────────────────────── */
#ec-toggle {
  position:fixed;
  top:var(--ec-sp-4);
  right:var(--ec-sp-4);
  z-index:300;
  display:flex; align-items:center; gap:6px;
  background:var(--ec-toggle-bg);
  border:1px solid var(--ec-border);
  border-radius:var(--ec-r-pill);
  padding:4px 12px;
  cursor:pointer;
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  letter-spacing:0.1em;
  color:var(--ec-text-secondary);
  text-transform:uppercase;
  user-select:none;
  transition:background 0.2s;
}
#ec-toggle::before {
  content:'';
  width:7px; height:7px;
  border-radius:50%;
  background:var(--ec-toggle-dot);
}

/* ── THREE.JS CANVAS ────────────────────────────────────── */
#three-canvas {
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
}

/* ─────────────────────────────────────────────────────────
   LAYOUT ATOMS
───────────────────────────────────────────────────────── */

/* Split 2 colonne */
.ec-split {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(32px,5vw,80px);
  align-items:center;
  width:100%; height:100%;
  padding:clamp(48px,6vh,80px) clamp(64px,6vw,96px);
}
.ec-split-wide { grid-template-columns:1.2fr 0.8fr; }
.ec-split-narrow { grid-template-columns:0.8fr 1.2fr; }

/* Colonna testo */
.ec-col { display:flex; flex-direction:column; gap:var(--ec-sp-6); }

/* KPI grid */
.ec-kpi-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--ec-sp-6);
  align-items:start;
}
.ec-kpi-grid-3 { grid-template-columns:repeat(3,1fr); }
.ec-kpi-grid-2 { grid-template-columns:repeat(2,1fr); }

/* Bullet list */
.ec-list { list-style:none; display:flex; flex-direction:column; gap:var(--ec-sp-4); }
.ec-list li {
  font-family:var(--ec-font-sans);
  font-size:clamp(0.85rem,1.05vw,1rem);
  color:var(--ec-text-secondary);
  line-height:1.6;
  padding-left:1.2em;
  position:relative;
}
.ec-list li::before {
  content:'·';
  position:absolute; left:0;
  color:var(--ec-accent-text);
}
.ec-list strong { color:var(--ec-text-primary); font-weight:500; }

/* Table */
.ec-table { width:100%; border-collapse:collapse; font-family:var(--ec-font-mono); font-size:clamp(0.7rem,0.9vw,0.9rem); }
.ec-table th { padding:var(--ec-sp-3) var(--ec-sp-4); border-bottom:1px solid var(--ec-border-strong); color:var(--ec-text-muted); letter-spacing:0.1em; font-weight:400; text-align:left; }
.ec-table td { padding:var(--ec-sp-3) var(--ec-sp-4); border-bottom:1px solid var(--ec-border); color:var(--ec-text-secondary); text-align:left; }
.ec-table tr.ec-table-hl td { background:var(--ec-accent-bg); color:var(--ec-text-primary); }
.ec-table tr.ec-table-hl td:first-child { border-left:2px solid var(--ec-accent); }
.ec-metric { font-family:var(--ec-font-mono); font-weight:500; color:var(--ec-text-primary); }

/* Stat box */
.ec-stat-box {
  padding:var(--ec-sp-4) var(--ec-sp-6);
  background:var(--ec-bg-surface);
  border:1px solid var(--ec-border);
  border-radius:var(--ec-r-md);
  display:flex; flex-direction:column; gap:4px;
}
.ec-stat-box-accent { border-color:var(--ec-accent); background:var(--ec-accent-bg); }
.ec-stat-box-oro { border-color:var(--ec-oro-border); }

/* ─────────────────────────────────────────────────────────
   LAYOUT TEMPLATES
───────────────────────────────────────────────────────── */

/* COVER */
.ec-cover {
  display:grid;
  grid-template-columns:1fr 1fr;
  height:100%;
  overflow:hidden;
}
.ec-cover-left {
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(48px,6vw,96px);
  gap:var(--ec-sp-6);
  position:relative;
  z-index:1;
}
.ec-cover-right {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
#three-canvas-cover {
  position:absolute; inset:0;
  pointer-events:none;
}

/* DIVIDER */
.ec-divider-slide {
  display:grid;
  grid-template-columns:120px 1fr;
  align-items:center;
  height:100%;
  gap:0;
  overflow:hidden;
}
.ec-divider-num {
  display:flex;
  flex-direction:column;
  align-items:center;
  height:100%;
  justify-content:center;
  padding:0 24px;
  border-right:1px solid var(--ec-border);
}
.ec-cap-num {
  font-family:var(--ec-font-mono);
  font-size:clamp(3rem,6vw,7rem);
  font-weight:700;
  color:var(--ec-accent);
  line-height:1;
  letter-spacing:-0.04em;
}
.ec-divider-body {
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(48px,6vw,96px);
  gap:var(--ec-sp-4);
}

/* STATEMENT */
.ec-statement {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  height:100%;
  text-align:center;
  padding:clamp(64px,8vw,128px);
  gap:var(--ec-sp-6);
}
.ec-statement-text {
  font-family:var(--ec-font-sans);
  font-size:clamp(1.4rem,2.8vw,2.8rem);
  font-weight:600;
  line-height:1.3;
  letter-spacing:-0.02em;
  color:var(--ec-text-primary);
  max-width:900px;
}
.ec-statement-text em { color:var(--ec-accent-text); font-style:normal; }
/* Variante garamond solo per le 4-5 slide di citazione emotiva */
.ec-statement-quote {
  font-family:var(--ec-font-serif);
  font-size:clamp(1.4rem,2.8vw,2.8rem);
  font-weight:400;
  line-height:1.4;
  color:var(--ec-text-primary);
  max-width:900px;
  font-style:italic;
}
.ec-statement-quote em { color:var(--ec-accent-text); }
.ec-statement-attr {
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  color:var(--ec-text-muted);
  letter-spacing:0.12em;
  text-transform:uppercase;
}

/* KPI SLIDE */
.ec-kpi-slide {
  display:flex;
  flex-direction:column;
  justify-content:center;
  height:100%;
  padding:clamp(48px,6vh,80px) clamp(64px,8vw,120px);
  gap:var(--ec-sp-8);
}

/* FULL BLEED */
.ec-fullbleed {
  position:absolute; inset:0;
  display:flex; align-items:flex-end;
}
.ec-fullbleed img.ec-bg {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.ec-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(8,15,18,0.92) 0%, rgba(8,15,18,0.4) 50%, transparent 100%);
}
.ec-overlay-side {
  position:absolute; inset:0;
  background:linear-gradient(to right, transparent 40%, rgba(8,15,18,0.88) 100%);
}
.ec-fullbleed-content {
  position:relative; z-index:5;
  padding:clamp(32px,5vw,64px) clamp(48px,6vw,96px);
  display:flex; flex-direction:column; gap:var(--ec-sp-4);
}

/* BRAND WALL */
.ec-brand-wall {
  display:flex;
  flex-direction:column;
  height:100%;
  padding:clamp(32px,4vh,56px) clamp(48px,5vw,80px);
  gap:var(--ec-sp-6);
}
.ec-brand-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:var(--ec-sp-4);
  flex:1;
}
.ec-brand-item {
  background:var(--ec-bg-surface);
  border:1px solid var(--ec-border);
  border-radius:var(--ec-r-md);
  display:flex; align-items:center; justify-content:center;
  padding:var(--ec-sp-4);
  min-height:64px;
}
.ec-brand-item img {
  max-height:32px; max-width:100%;
  object-fit:contain;
  filter:var(--ec-logo-filter);
  opacity:0.7;
}
.ec-brand-item.ec-brand-more {
  font-family:var(--ec-font-serif);
  font-style:italic;
  font-size:0.85rem;
  color:var(--ec-text-muted);
}

/* FUNNEL */
.ec-funnel {
  display:flex;
  flex-direction:column;
  height:100%;
  padding:clamp(40px,5vh,64px) clamp(64px,8vw,120px);
  gap:var(--ec-sp-6);
}
.ec-funnel-track {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex:1;
  position:relative;
  padding:0 24px;
}
.ec-funnel-track::before {
  content:'';
  position:absolute;
  top:50%; left:0; right:0;
  height:1px;
  background:var(--ec-border);
  transform:translateY(-50%);
}
.ec-funnel-step {
  display:flex; flex-direction:column; align-items:center;
  gap:var(--ec-sp-3);
  position:relative; z-index:1;
}
.ec-funnel-node {
  width:40px; height:40px;
  border-radius:50%;
  border:1px solid var(--ec-border-strong);
  background:var(--ec-bg);
}
.ec-funnel-pct {
  font-family:var(--ec-font-mono);
  font-size:clamp(1rem,2vw,1.8rem);
  font-weight:700;
  color:var(--ec-text-muted);
}
.ec-funnel-step.ec-funnel-active .ec-funnel-pct { color:var(--ec-accent-text); }
.ec-funnel-step.ec-funnel-active .ec-funnel-node {
  border-color:var(--ec-accent);
  box-shadow:0 0 0 4px var(--ec-accent-dim);
}
.ec-funnel-label {
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ec-text-muted);
}

/* TIMELINE */
.ec-timeline { display:flex; flex-direction:column; gap:var(--ec-sp-3); }
.ec-tl-item {
  display:flex; gap:var(--ec-sp-6); align-items:flex-start;
  padding:var(--ec-sp-4);
  border-left:2px solid var(--ec-border);
}
.ec-tl-item.active { border-left-color:var(--ec-accent); background:var(--ec-bg-surface); border-radius:0 var(--ec-r-md) var(--ec-r-md) 0; }
.ec-tl-year {
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-sm);
  color:var(--ec-text-muted);
  min-width:72px;
  letter-spacing:0.1em;
}
.ec-tl-body {
  font-family:var(--ec-font-sans);
  font-size:clamp(0.85rem,1.1vw,1rem);
  line-height:1.6;
  color:var(--ec-text-secondary);
}

/* FLYWHEEL SVG ─ reset */
.ec-flywheel-svg { width:100%; height:auto; }

/* CTA */
.ec-cta {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  height:100%; text-align:center;
  gap:var(--ec-sp-8);
  padding:clamp(48px,6vw,96px);
}
.ec-cta-urgency {
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-sm);
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--ec-accent-text);
  border:1px solid var(--ec-accent);
  border-radius:var(--ec-r-pill);
  padding:var(--ec-sp-2) var(--ec-sp-6);
}
.ec-cta-main {
  font-family:var(--ec-font-sans);
  font-size:clamp(2.5rem,5vw,5rem);
  font-weight:700;
  line-height:1.0;
  letter-spacing:-0.03em;
  color:var(--ec-text-primary);
}
.ec-cta-main em { color:var(--ec-oro-text); font-style:normal; }
.ec-cta-email {
  font-family:var(--ec-font-mono);
  font-size:clamp(1rem,1.8vw,1.6rem);
  color:var(--ec-accent-text);
  letter-spacing:0.08em;
  text-decoration:none;
  border-bottom:1px solid var(--ec-accent);
  padding-bottom:4px;
}
.ec-cta-sub {
  font-family:var(--ec-font-mono);
  font-size:var(--ec-text-xs);
  color:var(--ec-text-muted);
  letter-spacing:0.12em;
}

/* GSAP reveal initial state */
.gsap-up { opacity:0; transform:translateY(24px); }
.gsap-fade { opacity:0; }
.gsap-left { opacity:0; transform:translateX(-20px); }
.gsap-scale { opacity:0; transform:scale(0.96); }

/* QA mode / prefers-reduced-motion: skip all animation initial states */
.qa-mode .gsap-up,
.qa-mode .gsap-fade,
.qa-mode .gsap-left,
.qa-mode .gsap-scale { opacity:1 !important; transform:none !important; }