/* =========================================================
   Rotix AI Systems · Landing
   Light premium, cinematic, full bleed
   ========================================================= */

:root{
  --ink:        #0A0B0D;
  --ink-2:      #2A2D33;
  --ink-3:      #6B7078;
  --ink-4:      #9AA0A8;
  --paper:      #FAFAF8;
  --paper-2:    #F3F3EF;
  --line:       #E4E4DE;
  --line-soft:  #EDEDE7;
  --accent:     #1B45F5;
  --accent-2:   #7C5CFF;
  --accent-3:   #FF6A3D;
  --white:      #FFFFFF;

  --serif: "Instrument Serif", "Iowan Old Style", Georgia, serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --maxw: 2100px;
  --pad: clamp(20px, 4vw, 96px);
  --ease: cubic-bezier(.22,1,.36,1);
}

*{ box-sizing:border-box; }
html{
  -webkit-text-size-adjust:100%;
  overflow-x:clip;
  overflow-anchor:none;
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:clamp(16px, 0.4vw + 15px, 18px);
  line-height:1.6;
  letter-spacing:-0.011em;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ margin:0; font-weight:600; letter-spacing:-0.035em; line-height:1.05; }
p{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }
em{ font-family:var(--serif); font-style:italic; font-weight:400; letter-spacing:-0.01em; }

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

/* ---------- Texture ---------- */
.grain{
  position:fixed; inset:0; z-index:9999; pointer-events:none; opacity:.26;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
.aurora{ position:fixed; inset:0; z-index:-1; pointer-events:none; overflow:hidden; }
.blob{ position:absolute; display:block; border-radius:50%; filter:blur(90px); opacity:.5; will-change:transform; }
.b1{ width:58vw; height:58vw; left:-14vw; top:-20vw; background:radial-gradient(circle at 40% 40%, rgba(27,69,245,.30), transparent 68%); animation:drift1 26s var(--ease) infinite alternate; }
.b2{ width:50vw; height:50vw; right:-15vw; top:2vw;   background:radial-gradient(circle at 55% 45%, rgba(124,92,255,.26), transparent 68%); animation:drift2 32s var(--ease) infinite alternate; }
.b3{ width:44vw; height:44vw; left:28vw;  top:36vw;   background:radial-gradient(circle at 50% 50%, rgba(255,106,61,.16), transparent 68%); animation:drift3 38s var(--ease) infinite alternate; }
@keyframes drift1{ to{ transform:translate3d(8vw,6vw,0) scale(1.12); } }
@keyframes drift2{ to{ transform:translate3d(-7vw,9vw,0) scale(1.18); } }
@keyframes drift3{ to{ transform:translate3d(6vw,-8vw,0) scale(.9); } }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-size:15px; font-weight:500; letter-spacing:-0.01em;
  padding:14px 22px; border-radius:100px; border:1px solid transparent;
  transition:transform .35s var(--ease), background .25s, color .25s, border-color .25s, box-shadow .35s var(--ease);
  white-space:nowrap;
}
.btn .arr{ transition:transform .35s var(--ease); display:inline-block; }
.btn:hover .arr{ transform:translateX(4px); }
.btn-dark{ background:var(--ink); color:var(--white); box-shadow:0 1px 2px rgba(10,11,13,.16), 0 8px 24px -8px rgba(10,11,13,.34); }
.btn-dark:hover{ transform:translateY(-2px); box-shadow:0 2px 4px rgba(10,11,13,.18), 0 18px 40px -12px rgba(10,11,13,.42); }
.btn-ghost{ border-color:var(--line); background:rgba(255,255,255,.6); backdrop-filter:blur(8px); color:var(--ink-2); }
.btn-ghost:hover{ border-color:var(--ink); color:var(--ink); transform:translateY(-2px); }
.btn-lg{ padding:17px 30px; font-size:16px; }
.btn-sm{ padding:10px 18px; font-size:14px; }

/* ---------- Nav ---------- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:16px 0; transition:padding .4s var(--ease), background .4s, border-color .4s, box-shadow .4s;
  border-bottom:1px solid transparent;
}
.nav.stuck{
  padding:10px 0; background:rgba(250,250,248,.8); backdrop-filter:blur(18px) saturate(1.4);
  border-bottom-color:var(--line-soft); box-shadow:0 1px 30px -18px rgba(10,11,13,.5);
}
.nav-inner{ display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand{ display:flex; align-items:center; gap:11px; font-weight:600; font-size:16.5px; letter-spacing:-0.03em; color:var(--ink); flex:none; }
.mark{ width:30px; height:30px; color:var(--ink); flex:none; }
.mark.sm{ width:34px; height:34px; }
.brand-thin{ font-weight:400; color:var(--ink-3); }
.nav-links{ display:flex; gap:clamp(18px,2vw,34px); font-size:14.5px; color:var(--ink-3); }
.nav-links a{ position:relative; transition:color .25s; white-space:nowrap; }
.nav-links a::after{ content:""; position:absolute; left:0; right:100%; bottom:-4px; height:1px; background:var(--ink); transition:right .4s var(--ease); }
.nav-links a:hover{ color:var(--ink); }
.nav-links a:hover::after{ right:0; }
.nav-right{ display:flex; align-items:center; gap:12px; flex:none; }

.lang{
  display:flex; align-items:center; gap:2px; padding:3px;
  border:1px solid var(--line); border-radius:100px;
  background:rgba(255,255,255,.65); backdrop-filter:blur(8px);
}
.lang-btn{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.04em; color:var(--ink-4);
  padding:6px 11px; border-radius:100px; transition:color .25s, background .25s;
  line-height:1;
}
.lang-btn:hover{ color:var(--ink-2); }
.lang-btn.on{ background:var(--ink); color:#fff; }

/* ---------- Hero ---------- */
.hero{ padding:clamp(112px,8.5vw,168px) 0 clamp(30px,4vw,56px); position:relative; }
.hero-grid{ display:grid; grid-template-columns:1fr; gap:clamp(44px,5vw,72px); align-items:center; }

.eyebrow{
  display:inline-flex; align-items:center; flex-wrap:nowrap; white-space:nowrap; gap:9px;
  font-family:var(--mono); font-size:clamp(8.6px, 2.35vw, 12px); letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-3); padding:7px 15px 7px 12px; border:1px solid var(--line);
  border-radius:100px; background:rgba(255,255,255,.65); backdrop-filter:blur(8px);
  max-width:100%;
}
.pulse{ width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 0 rgba(27,69,245,.55); animation:pulse 2.4s infinite; flex:none; }
@keyframes pulse{ 70%{ box-shadow:0 0 0 9px rgba(27,69,245,0); } 100%{ box-shadow:0 0 0 0 rgba(27,69,245,0); } }

h1{
  margin:clamp(24px,2.4vw,36px) 0 0;
  font-size:clamp(38px, 4.6vw, 80px);
  font-weight:600; line-height:1.02; letter-spacing:-0.045em;
  max-width:16ch;
}
.h1-line{ display:block; }
.h1-accent{
  background:linear-gradient(96deg, var(--ink) 0%, var(--accent) 52%, var(--accent-2) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.h1-accent em{ background:inherit; -webkit-background-clip:text; background-clip:text; white-space:nowrap; }
.lead{ margin-top:clamp(22px,2vw,32px); max-width:56ch; font-size:clamp(17px,1.15vw,21px); line-height:1.62; color:var(--ink-2); font-weight:350; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:clamp(28px,2.6vw,42px); }

/* Hero visual */
.flowcard{
  border:1px solid var(--line); border-radius:24px; padding:clamp(20px,1.7vw,30px);
  background:linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,.62));
  backdrop-filter:blur(14px);
  box-shadow:0 1px 2px rgba(10,11,13,.04), 0 30px 70px -40px rgba(10,11,13,.35);
  display:flex; flex-direction:column; gap:14px;
}
.flow-node{ border-radius:18px; padding:clamp(18px,1.5vw,26px); display:flex; flex-direction:column; gap:14px; }
.flow-node.problem{ background:var(--paper-2); border:1px dashed var(--line); min-height:118px; }
.flow-node.system{ background:var(--ink); color:var(--white); }
.node-tag{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-4); }
.flow-node.system .node-tag{ color:rgba(255,255,255,.45); }
.node-body{ font-size:clamp(17px,1.2vw,21px); letter-spacing:-0.02em; color:var(--ink-2); min-height:1.4em; line-height:1.35; }
.node-body::after{ content:"▌"; color:var(--accent); animation:blink 1s steps(1) infinite; margin-left:1px; }
@keyframes blink{ 50%{ opacity:0; } }
.flow-arrow{ color:var(--ink-4); width:56px; margin:0 auto; transform:rotate(90deg); }
.mini-ui{ display:flex; flex-direction:column; gap:9px; }
.mini-bar{ height:9px; border-radius:100px; background:rgba(255,255,255,.12); overflow:hidden; }
.mini-bar i{ display:block; height:100%; width:var(--w); border-radius:100px; background:linear-gradient(90deg, var(--accent), var(--accent-2)); animation:grow 1.6s var(--ease) both; }
@keyframes grow{ from{ width:0; } }
.mini-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin-top:5px; }
.mini-grid span{ height:28px; border-radius:8px; background:rgba(255,255,255,.08); }
.mini-grid span:nth-child(2){ background:rgba(255,255,255,.16); }
.mini-grid span:nth-child(4){ background:rgba(27,69,245,.55); }

/* Trust bar */
.trustbar{
  margin-top:clamp(44px,4.5vw,72px); padding-top:28px; border-top:1px solid var(--line);
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(24px,3vw,56px);
}
.trustbar li{ font-size:15px; line-height:1.5; color:var(--ink-3); font-weight:350; }
.tb-k{ display:block; font-family:var(--mono); font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink); margin-bottom:8px; font-weight:500; }

/* ---------- Marquee ---------- */
.marquee-wrap{ padding:26px 0 0; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); margin-top:clamp(40px,5vw,72px); }
.marquee{ overflow:hidden; padding-bottom:26px; -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); }
.marquee-track{ display:flex; gap:16px; align-items:center; width:max-content; animation:scroll 52s linear infinite; }
.marquee-track span{ font-size:15px; color:var(--ink-3); white-space:nowrap; }
.marquee-track i{ color:var(--accent); font-style:normal; }
@keyframes scroll{ to{ transform:translateX(-50%); } }

/* ---------- Sections ---------- */
.section{ padding:clamp(72px,8vw,140px) 0; position:relative; scroll-margin-top:84px; }
.section.alt{ background:linear-gradient(180deg, rgba(243,243,239,0), rgba(243,243,239,.8) 12%, rgba(243,243,239,.8) 88%, rgba(243,243,239,0)); }
.section.tight{ padding:clamp(64px,6vw,100px) 0; }
.sec-num{ font-family:var(--mono); font-size:12px; letter-spacing:.1em; color:var(--accent); display:block; margin-bottom:16px; }
.sec-head{ max-width:70ch; margin-bottom:clamp(40px,4.5vw,72px); }
.sec-head h2{ font-size:clamp(30px,3.9vw,64px); letter-spacing:-0.04em; }
.sec-sub{ margin-top:18px; font-size:clamp(16.5px,1.05vw,19px); color:var(--ink-3); line-height:1.62; font-weight:350; max-width:60ch; }

/* ---------- Quotes ---------- */
.quotes{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,1.1vw,20px); }
.quotes blockquote{
  margin:0; padding:clamp(24px,2vw,38px); border-radius:20px; background:var(--white); border:1px solid var(--line-soft);
  font-size:clamp(17px,1.15vw,21px); line-height:1.48; letter-spacing:-0.02em; color:var(--ink-2);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .3s;
}
.quotes blockquote:hover{ transform:translateY(-4px); border-color:var(--line); box-shadow:0 24px 50px -34px rgba(10,11,13,.45); }
.quotes-foot{ margin-top:clamp(28px,3vw,48px); font-size:clamp(16.5px,1.05vw,19px); color:var(--ink-3); }
.inline-link{ display:inline-flex; align-items:center; gap:7px; color:var(--ink); border-bottom:1px solid var(--line); padding-bottom:2px; margin-left:6px; transition:border-color .3s; }
.inline-link:hover{ border-color:var(--ink); }
.inline-link .arr{ transition:transform .35s var(--ease); }
.inline-link:hover .arr{ transform:translateX(4px); }

/* ---------- Cards ---------- */
.cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,1.2vw,22px); }
.card{
  padding:clamp(26px,2.2vw,42px); border-radius:24px; background:var(--white); border:1px solid var(--line-soft);
  position:relative; overflow:hidden;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .3s;
}
.card::before{
  content:""; position:absolute; inset:0; opacity:0; transition:opacity .5s;
  background:radial-gradient(600px circle at var(--mx,50%) var(--my,0%), rgba(27,69,245,.06), transparent 42%);
}
.card:hover{ transform:translateY(-5px); border-color:var(--line); box-shadow:0 30px 60px -40px rgba(10,11,13,.4); }
.card:hover::before{ opacity:1; }
.card-ico{ width:46px; height:46px; border-radius:13px; background:var(--ink); color:var(--white); display:grid; place-items:center; margin-bottom:24px; }
.card-ico svg{ width:22px; height:22px; }
.card h3{ font-size:clamp(19px,1.35vw,25px); letter-spacing:-0.03em; }
.card p{ margin-top:14px; color:var(--ink-3); font-size:clamp(15px,0.95vw,17px); line-height:1.6; font-weight:350; }
.card-list{ margin-top:24px; padding-top:22px; border-top:1px solid var(--line-soft); display:flex; flex-direction:column; gap:10px; }
.card-list li{ font-size:14.5px; color:var(--ink-2); padding-left:20px; position:relative; }
.card-list li::before{ content:""; position:absolute; left:0; top:9px; width:9px; height:1px; background:var(--accent); }

/* ---------- Steps ---------- */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); border-radius:22px; overflow:hidden; }
.steps li{ background:var(--paper); padding:clamp(26px,2.2vw,40px); transition:background .35s; }
.steps li:hover{ background:var(--white); }
.step-n{ font-family:var(--mono); font-size:12px; color:var(--white); background:var(--ink); width:27px; height:27px; border-radius:50%; display:grid; place-items:center; margin-bottom:18px; }
.steps h4{ font-size:clamp(18px,1.2vw,22px); letter-spacing:-0.03em; }
.steps p{ margin-top:10px; color:var(--ink-3); font-size:15px; line-height:1.55; font-weight:350; }

/* ---------- Dark section (Rotix IQ) ---------- */
.section.dark{
  background:var(--ink); color:var(--paper);
  border-radius:clamp(22px,2.4vw,40px); margin:0 clamp(12px,1.6vw,32px);
  overflow:hidden; position:relative; padding:clamp(64px,7vw,130px) 0;
}
.dark-aurora{
  position:absolute; inset:0; opacity:.8;
  background:
    radial-gradient(60% 55% at 12% 0%, rgba(27,69,245,.42), transparent 62%),
    radial-gradient(55% 50% at 92% 22%, rgba(124,92,255,.30), transparent 62%),
    radial-gradient(50% 50% at 68% 108%, rgba(255,106,61,.16), transparent 62%);
}
.section.dark .wrap{ position:relative; z-index:1; }
.eyebrow.light{ color:rgba(255,255,255,.7); border-color:rgba(255,255,255,.16); background:rgba(255,255,255,.05); }
.iq-grid{ display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(40px,4.5vw,80px); align-items:center; }
.iq-copy h2{ font-size:clamp(42px,5.4vw,88px); margin-top:26px; letter-spacing:-0.045em;
  background:linear-gradient(100deg,#fff 20%, #A9B8FF 78%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.iq-lead{ margin-top:22px; font-size:clamp(18px,1.25vw,23px); line-height:1.55; color:rgba(255,255,255,.9); font-weight:350; max-width:52ch; }
.iq-body{ margin-top:18px; font-size:clamp(15.5px,1vw,18px); line-height:1.65; color:rgba(255,255,255,.6); font-weight:350; max-width:56ch; }
.iq-body em{ color:#fff; }
.iq-points{ margin-top:28px; display:flex; flex-direction:column; gap:14px; }
.iq-points li{ font-size:clamp(15px,0.95vw,17px); color:rgba(255,255,255,.62); padding-left:22px; position:relative; line-height:1.55; font-weight:350; }
.iq-points li::before{ content:""; position:absolute; left:0; top:10px; width:11px; height:1px; background:var(--accent-2); }
.iq-points strong{ color:#fff; font-weight:500; }
.iq-guard{ margin-top:30px; padding-top:22px; border-top:1px solid rgba(255,255,255,.1); font-size:14px; color:rgba(255,255,255,.45); }

/* app mock */
.app{
  border-radius:20px; overflow:hidden; border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.035); backdrop-filter:blur(20px);
  box-shadow:0 50px 100px -40px rgba(0,0,0,.7);
  transform:perspective(1600px) rotateY(-6deg) rotateX(2deg);
  transition:transform .8s var(--ease);
}
.app:hover{ transform:perspective(1600px) rotateY(0deg) rotateX(0deg); }
.app-bar{ display:flex; align-items:center; gap:7px; padding:13px 16px; border-bottom:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.03); }
.dot{ width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.16); flex:none; }
.app-title{ margin-left:12px; font-size:12px; font-family:var(--mono); color:rgba(255,255,255,.45); }
.app-body{ padding:clamp(18px,1.6vw,28px); }
.app-tabs{ display:flex; gap:6px; margin-bottom:22px; flex-wrap:wrap; }
.tab{ font-size:12.5px; padding:7px 13px; border-radius:100px; color:rgba(255,255,255,.42); border:1px solid transparent; }
.tab.on{ background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.12); }
.kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:22px; }
.kpi{ padding:15px; border-radius:13px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.07); display:flex; flex-direction:column; gap:7px; }
.k-l{ font-size:11px; color:rgba(255,255,255,.4); }
.k-v{ font-size:clamp(15px,1.05vw,19px); font-weight:600; letter-spacing:-0.03em; color:#fff; font-variant-numeric:tabular-nums; }
.chart{ padding:18px; border-radius:13px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.07); }
.chart-head{ display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:12px; color:rgba(255,255,255,.5); margin-bottom:16px; }
.chart-tag{ font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:100px; background:rgba(27,69,245,.28); color:#B9C6FF; white-space:nowrap; }
.bars{ display:flex; align-items:flex-end; gap:6px; height:clamp(84px,7vw,120px); }
.bars i{ flex:1; height:var(--h); border-radius:4px 4px 2px 2px; background:linear-gradient(180deg, var(--accent-2), var(--accent)); transform-origin:bottom; animation:rise 1.1s var(--ease) both; }
.bars i.neg{ background:linear-gradient(180deg, rgba(255,106,61,.85), rgba(255,106,61,.35)); }
@keyframes rise{ from{ transform:scaleY(0); opacity:0; } }
.axis{ display:flex; justify-content:space-between; margin-top:10px; font-family:var(--mono); font-size:10px; color:rgba(255,255,255,.3); }
.cite{ margin-top:16px; display:flex; align-items:center; gap:9px; font-size:12px; color:rgba(255,255,255,.42); }
.cite-ico{ width:17px; height:17px; border-radius:50%; background:rgba(60,200,140,.2); color:#6EE7B7; display:grid; place-items:center; font-size:10px; flex:none; }

/* ---------- Principles ---------- */
.principles{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); border-radius:22px; overflow:hidden; }
.pr{ background:var(--paper); padding:clamp(28px,2.4vw,44px); transition:background .35s; }
.pr:hover{ background:var(--white); }
.pr h3{ font-size:clamp(18px,1.25vw,23px); letter-spacing:-0.03em; }
.pr p{ margin-top:12px; color:var(--ink-3); font-size:clamp(15px,0.95vw,17px); line-height:1.6; font-weight:350; }

/* ---------- Honest ---------- */
.honest{ display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(36px,5vw,90px); align-items:start; }
.honest-l h2{ font-size:clamp(28px,3.4vw,52px); }
.honest-list{ display:flex; flex-direction:column; }
.honest-list li{ padding:clamp(16px,1.4vw,24px) 0 clamp(16px,1.4vw,24px) 36px; border-bottom:1px solid var(--line); font-size:clamp(16px,1.05vw,19px); color:var(--ink-2); position:relative; }
.honest-list li:first-child{ border-top:1px solid var(--line); }
.honest-list li::before{
  content:"×"; position:absolute; left:0; top:calc(clamp(16px,1.4vw,24px) + 1px); width:21px; height:21px; border-radius:50%;
  background:rgba(255,106,61,.12); color:var(--accent-3); display:grid; place-items:center; font-size:13px; line-height:1;
}

/* ---------- Contact ---------- */
.contact{ padding:clamp(80px,9vw,150px) 0 clamp(72px,8vw,120px); }
.ct{ text-align:center; max-width:1000px; margin:0 auto; }
.ct .sec-num{ margin-bottom:18px; }
.ct h2{ font-size:clamp(32px,4.6vw,74px); letter-spacing:-0.045em; max-width:17ch; margin:0 auto; }
.ct-sub{ margin:24px auto 0; max-width:58ch; font-size:clamp(16.5px,1.05vw,19px); color:var(--ink-3); line-height:1.62; font-weight:350; }
.ct-cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:clamp(34px,3.5vw,56px); text-align:left; }
.ct-card{
  padding:clamp(24px,2vw,36px); border-radius:22px; background:var(--white); border:1px solid var(--line-soft);
  display:flex; flex-direction:column; gap:8px; position:relative; overflow:hidden;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), border-color .3s;
}
.ct-card:hover{ transform:translateY(-4px); border-color:var(--ink); box-shadow:0 30px 60px -40px rgba(10,11,13,.45); }
.ct-l{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-4); }
.ct-v{ font-size:clamp(18px,1.55vw,28px); font-weight:500; letter-spacing:-0.035em; word-break:break-word; }
.ct-hint{ margin-top:10px; font-size:14px; color:var(--ink-3); display:inline-flex; align-items:center; gap:7px; }
.ct-card:hover .arr{ transform:translateX(4px); }
.ct-hint .arr{ transition:transform .35s var(--ease); }
.ct-direct{
  margin-top:16px; display:block; text-align:left; padding:clamp(20px,1.8vw,30px) clamp(24px,2vw,36px); border-radius:22px;
  background:var(--ink); color:#fff; transition:transform .5s var(--ease), box-shadow .5s var(--ease);
  box-shadow:0 1px 2px rgba(10,11,13,.16), 0 20px 44px -26px rgba(10,11,13,.5);
}
.ct-direct:hover{ transform:translateY(-4px); box-shadow:0 2px 4px rgba(10,11,13,.2), 0 30px 60px -30px rgba(10,11,13,.55); }
.ct-direct:hover .arr{ transform:translateX(4px); }
.ct-direct-l{ display:block; font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom:8px; }
.ct-direct-v{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:clamp(16px,1.35vw,24px); font-weight:500; letter-spacing:-0.025em; }
.ct-direct-v .arr{ transition:transform .35s var(--ease); }

/* ---------- Footer ---------- */
.foot{ border-top:1px solid var(--line); padding:clamp(34px,3.4vw,56px) 0; }
.foot-inner{ display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.foot-brand{ display:flex; align-items:center; gap:13px; }
.foot-name{ font-weight:600; letter-spacing:-0.03em; font-size:15.5px; }
.foot-legal{ font-size:12.5px; color:var(--ink-4); margin-top:3px; line-height:1.5; }
.foot-links{ display:flex; gap:clamp(16px,1.8vw,30px); font-size:14px; color:var(--ink-3); flex-wrap:wrap; }
.foot-links a{ transition:color .25s; }
.foot-links a:hover{ color:var(--ink); }
.foot-copy{ font-size:12.5px; color:var(--ink-4); width:100%; }

/* ---------- Toast ---------- */
.toast{
  position:fixed; left:50%; bottom:34px; transform:translate(-50%, 20px);
  background:var(--ink); color:#fff; padding:11px 20px; border-radius:100px; font-size:14px;
  opacity:0; pointer-events:none; transition:opacity .3s, transform .4s var(--ease); z-index:200;
  max-width:calc(100vw - 32px); text-align:center;
}
.toast.on{ opacity:1; transform:translate(-50%, 0); }

/* ---------- Reveal ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.d1{ transition-delay:.09s; } .d2{ transition-delay:.18s; } .d3{ transition-delay:.27s; } .d4{ transition-delay:.36s; }

/* =========================================================
   Responsive
   ========================================================= */

/* ecrane foarte late: mai multe coloane, ca sa nu ramana goluri */
@media (min-width:1500px){
  .cards{ grid-template-columns:repeat(4,1fr); }
  .steps{ grid-template-columns:repeat(6,1fr); }
}

/* desktop: hero pe doua coloane */
@media (min-width:1100px){
  .hero-grid{ grid-template-columns:1.1fr .9fr; }
  .hero-visual{ justify-self:end; width:100%; max-width:640px; }
  h1{ max-width:none; }
  .lead{ max-width:52ch; }
}

@media (max-width:1099px){
  .hero-visual{ max-width:760px; }
  h1{ max-width:17ch; }
}

@media (max-width:1080px){
  .iq-grid{ grid-template-columns:1fr; gap:48px; }
  .app{ transform:none; }
  .quotes{ grid-template-columns:repeat(2,1fr); }
  .principles{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:900px){
  .nav-links{ display:none; }
  .honest{ grid-template-columns:1fr; gap:32px; }
  .steps{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:760px){
  .quotes{ grid-template-columns:1fr; }
  .cards{ grid-template-columns:1fr; }
  .principles{ grid-template-columns:1fr; }
  .trustbar{ grid-template-columns:1fr; gap:20px; }
  .ct-cards{ grid-template-columns:1fr; }
  .foot-inner{ flex-direction:column; align-items:flex-start; gap:22px; }
}

@media (max-width:620px){
  .hero{ padding-top:104px; }
  .steps{ grid-template-columns:1fr; }
  .kpis{ grid-template-columns:1fr; }
  .hero-cta{ flex-direction:column; align-items:stretch; }
  .hero-cta .btn{ width:100%; }
  .nav-cta{ display:none; }
  .brand-thin{ display:none; }
  h1{ max-width:none; letter-spacing:-0.04em; }
  .ct h2{ max-width:none; }
  .app-title{ font-size:11px; margin-left:8px; }
}

@media (max-width:520px){
  .eyebrow{ padding:6px 12px 6px 10px; letter-spacing:.045em; gap:7px; }
  .eyebrow .pulse{ width:6px; height:6px; }
  .ct-v{ overflow-wrap:anywhere; }
  .foot-links{ gap:14px 20px; }
  .honest-list li{ padding-left:30px; }
}
@media (max-width:400px){
  .brand-text{ font-size:15px; }
  .lang-btn{ padding:6px 9px; font-size:11px; }
  .wrap{ padding:0 18px; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition-duration:.01ms !important; }
  .reveal{ opacity:1; transform:none; }
}
