/* ============================================================
   takeOne — WeTake · Site Design System
   Cinematic editorial: noir hero -> warm cream editorial content.
   Brand: red #af1220 / ink #161310 / cream #f7f3ea
   Type: Fraunces (display) · Inter (UI) · JetBrains Mono (timecode)
   ============================================================ */

:root{
  /* light / cream surface */
  --bg-0:#f7f3ea; --bg-1:#efe8d9; --bg-2:#e7ddc9; --white:#ffffff;
  /* ink text scale */
  --ink-0:#161310; --ink-1:#332e26; --ink-2:#5c5646; --ink-3:#8a8371; --ink-4:#b6ad99;
  /* noir surface (hero / footer) */
  --noir-0:#0a0908; --noir-1:#100e0c; --noir-2:#171512; --noir-3:#211d18;
  --cream:#f4efe4; --cream-dim:#c9beaa; --cream-faint:#8a8272;
  /* red */
  --red:#af1220; --red-bright:#d5222c; --red-glow:#e23a2c; --red-deep:#7a2530;
  --red-soft:rgba(175,18,32,.10); --red-line:rgba(175,18,32,.28);
  /* status */
  --good:oklch(0.52 0.13 150); --good-soft:oklch(0.52 0.13 150 / .12);
  --check:oklch(0.55 0.11 220); --check-soft:oklch(0.55 0.11 220 / .12);
  /* lines */
  --line:rgba(22,19,16,.10); --line-strong:rgba(22,19,16,.18);
  --line-dark:rgba(244,239,228,.10); --line-dark-strong:rgba(244,239,228,.18);
  /* type */
  --font-display:'Fraunces',Georgia,serif;
  --font-ui:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --font-mono:'JetBrains Mono','SF Mono',ui-monospace,monospace;
  /* radii + shadow */
  --r-sm:8px; --r-md:14px; --r-lg:20px; --r-xl:28px;
  --sh-sm:0 1px 2px rgba(22,19,16,.05),0 2px 12px rgba(22,19,16,.05);
  --sh-md:0 12px 34px rgba(22,19,16,.09);
  --sh-lg:0 28px 70px rgba(22,19,16,.16);
  --nav-h:70px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--font-ui);background:var(--bg-0);color:var(--ink-0);
  line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
svg{display:block;}
::selection{background:var(--red);color:#fff;}

.container{max-width:1180px;margin:0 auto;padding:0 32px;}
.container-wide{max-width:1320px;margin:0 auto;padding:0 32px;}
section{padding:104px 0;position:relative;}
.tight{padding:72px 0;}

/* ---------- film-grain overlay (global) ---------- */
.grain{position:fixed;inset:0;z-index:60;pointer-events:none;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='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* ---------- brand / camera-lens logo ---------- */
.brand{display:inline-flex;align-items:center;gap:1px;line-height:1;color:var(--cream);}
.brand .lens{position:relative;top:.06em;flex-shrink:0;}
.brand-word{font-family:var(--font-display);font-weight:700;letter-spacing:-.01em;white-space:nowrap;}
/* wetakeone wordmark (real Poppins outlines + red ring O) — text=currentColor, ring=accent */
.wmark{display:block;width:auto;height:22px;}

/* ---------- navigation ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;transition:background .35s ease,box-shadow .35s ease,border-color .35s ease;}
.nav-inner{max-width:1320px;margin:0 auto;padding:16px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px;}
.nav .brand{color:var(--cream);transition:color .35s ease;}
.nav .brand .wmark{height:21px;}
.nav-links{display:flex;align-items:center;gap:30px;}
.nav-links a{font-size:13.5px;font-weight:500;color:var(--cream-dim);transition:color .2s ease;position:relative;}
.nav-links a:hover,.nav-links a.active{color:var(--cream);}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--red-bright);border-radius:2px;}
.nav-right{display:flex;align-items:center;gap:16px;}
/* solid (scrolled) state -> light glass */
.nav.solid{background:rgba(247,243,234,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);box-shadow:0 6px 24px rgba(22,19,16,.06);}
.nav.solid .brand{color:var(--ink-0);}
.nav.solid .nav-links a{color:var(--ink-2);}
.nav.solid .nav-links a:hover,.nav.solid .nav-links a.active{color:var(--ink-0);}
.nav.solid .nav-links a.active::after{background:var(--red);}
/* logo lens swaps to the dark-body variant once the nav goes solid */
.lens-solid{display:none;}
.nav.solid .lens-hero{display:none;}
.nav.solid .lens-solid{display:inline-block;}
.nav-burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:8px;}
.nav-burger span{width:22px;height:2px;background:var(--cream);border-radius:2px;transition:background .3s;}
.nav.solid .nav-burger span{background:var(--ink-0);}

/* mobile drawer */
.mobile-menu{position:fixed;inset:0;z-index:49;background:var(--noir-0);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;opacity:0;pointer-events:none;transition:opacity .3s ease;}
.mobile-menu.open{opacity:1;pointer-events:auto;}
.mobile-menu a{font-family:var(--font-display);font-size:30px;color:var(--cream);font-weight:600;padding:10px 0;}
.mobile-menu a em{color:var(--red-bright);font-style:italic;}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-ui);font-weight:700;font-size:14px;
  border-radius:4px;padding:13px 26px;border:1px solid transparent;cursor:pointer;letter-spacing:.01em;
  transition:transform .18s ease,background .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease;}
.btn:hover{transform:translateY(-2px);}
.btn:active{transform:translateY(0);}
.btn-primary{background:var(--red);color:#fff;box-shadow:0 8px 26px color-mix(in srgb,var(--red) 34%,transparent);}
.btn-primary:hover{background:var(--red-bright);box-shadow:0 12px 32px color-mix(in srgb,var(--red) 44%,transparent);}
.btn-outline{background:transparent;color:var(--ink-0);border-color:var(--line-strong);}
.btn-outline:hover{border-color:var(--ink-0);}
.btn-ghost{background:transparent;color:var(--cream);border-color:var(--line-dark-strong);}
.btn-ghost:hover{background:rgba(244,239,228,.06);border-color:var(--cream);}
.btn-dark{background:var(--ink-0);color:var(--bg-0);}
.btn-sm{padding:9px 18px;font-size:13px;}
.btn .arw{transition:transform .2s ease;}
.btn:hover .arw{transform:translateX(3px);}

/* ---------- hero (noir) ---------- */
.hero{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:center;
  background:var(--noir-0);color:var(--cream);overflow:hidden;isolation:isolate;}
.hero-page{min-height:78vh;} /* shorter hero for inner pages */
.hero__bg{position:absolute;inset:0;z-index:0;}
.hero__glow{position:absolute;inset:0;z-index:0;
  background:radial-gradient(60% 55% at 50% 42%,color-mix(in srgb,var(--red-glow) 22%,transparent),transparent 60%),
             radial-gradient(90% 80% at 50% 120%,color-mix(in srgb,var(--red) 18%,transparent),transparent 70%);}
.hero__vignette{position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(120% 90% at 50% 30%,transparent 40%,rgba(0,0,0,.55) 100%);}
#hero-canvas,#particles-canvas{position:absolute;inset:0;width:100%;height:100%;}
#hero-canvas{z-index:1;}
#particles-canvas{z-index:1;pointer-events:none;}
.hero__inner{position:relative;z-index:3;width:100%;max-width:1180px;margin:0 auto;padding:120px 32px 90px;}
.hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;}
.hero-page .hero__grid{grid-template-columns:1fr;text-align:center;justify-items:center;}
.hero__copy{max-width:600px;}
.hero-page .hero__copy{max-width:800px;margin:0 auto;text-align:center;}
.hero-page .ctas{justify-content:center;}
.hero-page .kicker{margin-left:auto;margin-right:auto;}

.kicker{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:11.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim);
  background:rgba(244,239,228,.05);border:1px solid var(--line-dark-strong);padding:7px 15px;border-radius:999px;margin-bottom:26px;}
.kicker b{color:var(--red-glow);}
.kicker .dot{width:7px;height:7px;border-radius:50%;background:var(--red-bright);box-shadow:0 0 10px var(--red-glow);animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

.hero h1{font-family:var(--font-display);font-weight:700;letter-spacing:-.015em;line-height:1.06;
  font-size:clamp(2.4rem,6vw,4.3rem);margin-bottom:24px;color:#fff;}
.hero h1 em{font-style:italic;color:var(--red-glow);}
.hero .sub{font-size:clamp(1rem,1.4vw,1.15rem);color:var(--cream-dim);max-width:540px;margin-bottom:34px;}
.hero-page .sub{margin-left:auto;margin-right:auto;}
.hero .ctas{display:flex;gap:14px;flex-wrap:wrap;}
.hero .microcopy{margin-top:20px;font-size:11px;color:var(--cream-faint);font-family:var(--font-mono);letter-spacing:.08em;}

/* scroll cue */
.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:4;
  display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--cream-faint);font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;}
.scroll-cue svg{width:22px;height:22px;animation:bob 1.4s infinite;}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}

/* timecode strip (works on dark & light via modifiers) */
.tc-strip{display:inline-flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:rgba(244,239,228,.05);border:1px solid var(--line-dark-strong);border-radius:var(--r-md);padding:14px 20px;}
.tc-strip .seg{font-family:var(--font-mono);font-weight:700;font-size:20px;letter-spacing:.02em;color:var(--cream);}
.tc-strip .seg.accent{color:var(--red-glow);}
.tc-strip .sep{color:var(--cream-faint);font-weight:700;}
.tc-strip .label{font-size:10px;color:var(--cream-faint);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em;}
.tc-strip.on-light{background:var(--white);border-color:var(--line);}
.tc-strip.on-light .seg{color:var(--ink-0);}
.tc-strip.on-light .seg.accent{color:var(--red);}
.tc-strip.on-light .sep,.tc-strip.on-light .label{color:var(--ink-3);}

/* ---------- section headings ---------- */
.eyebrow{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:16px;display:flex;align-items:center;gap:10px;}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--red);opacity:.5;}
.eyebrow.center{justify-content:center;}
.eyebrow.center::before{display:none;}
h2.h2{font-family:var(--font-display);font-weight:700;letter-spacing:-.01em;line-height:1.12;
  font-size:clamp(1.9rem,3.6vw,2.6rem);margin-bottom:18px;max-width:720px;}
h2.h2 em{font-style:italic;color:var(--ink-3);}
.center h2.h2,h2.h2.center{margin-left:auto;margin-right:auto;text-align:center;}
p.lead{font-size:16.5px;color:var(--ink-2);max-width:620px;}
.center p.lead{margin-left:auto;margin-right:auto;text-align:center;}
.sec-head.center{text-align:center;}
/* center every section header site-wide (consistency across pages) */
.sec-head{text-align:center;}
.sec-head .eyebrow{justify-content:center;}
.sec-head .eyebrow::before{display:none;}
.sec-head h2.h2{margin-left:auto;margin-right:auto;}
.sec-head p.lead{margin-left:auto;margin-right:auto;text-align:center;}

/* surfaces */
.section-alt{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.section-cream{background:linear-gradient(180deg,var(--bg-1),var(--bg-0));}
.section-noir{background:var(--noir-0);color:var(--cream);}
.section-noir .eyebrow{color:var(--red-glow);}
.section-noir .eyebrow::before{background:var(--red-glow);}
.section-noir h2.h2{color:#fff;}
.section-noir h2.h2 em{color:var(--cream-faint);}
.section-noir p.lead{color:var(--cream-dim);}

/* ---------- generic card grids ---------- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.mt-46{margin-top:46px;}
.mt-30{margin-top:30px;}

/* problem / solution */
.pcard{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;box-shadow:var(--sh-sm);}
.pcard.problem{border-color:var(--red-line);}
.pcard .icn{width:46px;height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:18px;color:var(--red);}
.pcard.problem .icn{background:var(--red-soft);}
.pcard.solution .icn{background:var(--good-soft);color:var(--good);}
.pcard h3{font-family:var(--font-display);font-size:19px;margin-bottom:14px;font-weight:700;}
.pcard ul{list-style:none;}
.pcard li{position:relative;padding-left:24px;margin-bottom:11px;color:var(--ink-2);font-size:14.5px;}
.pcard li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;border-radius:2px;}
.pcard.problem li::before{background:var(--red);opacity:.55;}
.pcard.solution li::before{background:var(--good);opacity:.6;}

/* product duo */
.product{display:grid;grid-template-columns:1fr 1fr;background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-md);}
.product .ph{position:relative;min-height:360px;}
.product .body{padding:44px 46px;}
.product.rev .ph{order:2;}
.product .plat{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--red);margin-bottom:14px;}
.product h3{font-family:var(--font-display);font-size:27px;font-weight:700;margin-bottom:12px;letter-spacing:-.01em;}
.product p.d{color:var(--ink-2);font-size:14.5px;margin-bottom:24px;}
.feat{display:flex;gap:13px;align-items:flex-start;font-size:14px;color:var(--ink-1);margin-bottom:13px;}
.feat .chk{color:var(--red);font-weight:800;flex-shrink:0;font-family:var(--font-mono);font-size:12px;padding-top:2px;}
.feat svg{flex-shrink:0;color:var(--red);margin-top:1px;}

/* workflow steps */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.step{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 24px;box-shadow:var(--sh-sm);position:relative;overflow:hidden;}
.step .num{font-family:var(--font-mono);font-weight:700;font-size:12px;color:var(--red);margin-bottom:18px;}
.step .stepicon{width:44px;height:44px;border-radius:11px;background:var(--red-soft);color:var(--red);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.step h4{font-family:var(--font-display);font-size:18px;margin-bottom:10px;font-weight:700;}
.step p{font-size:13.4px;color:var(--ink-2);}
.step::after{content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--red),transparent);opacity:0;transition:opacity .3s;}
.step:hover::after{opacity:1;}

/* feature cards */
.fcard{padding:30px;border-radius:var(--r-lg);background:var(--white);border:1px solid var(--line);box-shadow:var(--sh-sm);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.fcard:hover{transform:translateY(-4px);box-shadow:var(--sh-md);border-color:var(--red-line);}
.fcard .ficon{width:48px;height:48px;border-radius:12px;background:var(--red-soft);color:var(--red);display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.fcard .num{font-family:var(--font-mono);color:var(--ink-4);font-size:12px;float:right;}
.fcard h4{font-family:var(--font-display);font-size:19px;margin-bottom:11px;font-weight:700;}
.fcard p{font-size:13.8px;color:var(--ink-2);}
/* feature card on noir */
.section-noir .fcard{background:var(--noir-2);border-color:var(--line-dark);}
.section-noir .fcard:hover{border-color:var(--red-line);}
.section-noir .fcard h4{color:#fff;}
.section-noir .fcard p{color:var(--cream-dim);}
.section-noir .fcard .ficon{background:color-mix(in srgb,var(--red-bright) 16%,transparent);color:var(--red-glow);}

/* stat cards */
.stat{text-align:center;padding:26px 18px;}
.stat .big{font-family:var(--font-display);font-weight:700;font-size:clamp(2.2rem,4vw,3rem);color:var(--red);line-height:1;}
.section-noir .stat .big{color:var(--red-glow);}
.stat .lbl{font-size:13px;color:var(--ink-3);margin-top:10px;}
.section-noir .stat .lbl{color:var(--cream-dim);}

/* roles */
.role{text-align:center;padding:26px 14px;border-radius:var(--r-lg);background:var(--white);border:1px solid var(--line);box-shadow:var(--sh-sm);transition:transform .2s ease;}
.role:hover{transform:translateY(-3px);}
.role .ic{width:52px;height:52px;margin:0 auto 12px;border-radius:14px;background:var(--red-soft);color:var(--red);display:flex;align-items:center;justify-content:center;}
.role h5{font-size:13.5px;font-weight:700;}

/* format pills */
.formats{display:flex;flex-wrap:wrap;gap:10px;}
.fmt{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:13px;font-weight:600;
  background:var(--white);border:1px solid var(--line-strong);padding:10px 16px;border-radius:999px;transition:border-color .2s,color .2s;}
.fmt:hover{border-color:var(--red);color:var(--red);}
.fmt .d{width:7px;height:7px;border-radius:50%;background:var(--red);}
.section-noir .fmt{background:var(--noir-2);border-color:var(--line-dark-strong);color:var(--cream);}

/* badges */
.badge{font-family:var(--font-mono);font-weight:700;font-size:10.5px;padding:5px 11px;border-radius:3px;text-transform:uppercase;letter-spacing:.05em;display:inline-flex;align-items:center;gap:6px;}
.badge.good{background:var(--good-soft);color:var(--good);}
.badge.bad{background:var(--red-soft);color:var(--red);}
.badge.check{background:var(--check-soft);color:var(--check);}

/* device mockup frame */
.mock{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:linear-gradient(160deg,#eee6d4,#f2ead9);}
.mock.illust{display:flex;align-items:center;justify-content:center;}
.mock svg{width:100%;height:auto;}

/* pull quote */
.pquote{font-family:var(--font-display);font-style:italic;font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.4;max-width:820px;margin-left:auto;margin-right:auto;text-align:center;}
.pquote .accent{color:var(--red);}
.section-noir .pquote .accent{color:var(--red-glow);}

/* CTA block */
.cta-block{background:var(--red);color:#fff;border-radius:var(--r-xl);padding:66px 48px;text-align:center;box-shadow:var(--sh-lg);position:relative;overflow:hidden;}
.cta-block::before{content:"";position:absolute;inset:0;opacity:.14;
  background:radial-gradient(50% 60% at 20% 10%,#fff,transparent 60%);}
.cta-block h2{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.4rem);margin-bottom:14px;color:#fff;position:relative;}
.cta-block p{color:rgba(255,255,255,.85);margin-bottom:30px;font-size:16px;position:relative;}
.cta-block .ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative;}
.cta-block .btn-primary{background:#fff;color:var(--red);box-shadow:0 10px 30px rgba(0,0,0,.2);}
.cta-block .btn-primary:hover{background:var(--bg-0);}
.cta-block .btn-outline{border-color:rgba(255,255,255,.55);color:#fff;}
.cta-block .btn-outline:hover{background:rgba(255,255,255,.1);border-color:#fff;}

/* marquee ticker */
.ticker{overflow:hidden;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);background:var(--noir-1);padding:16px 0;}
.ticker__track{display:flex;gap:48px;width:max-content;animation:scrollx 28s linear infinite;}
.ticker span{font-family:var(--font-mono);font-size:14px;letter-spacing:.06em;color:var(--cream-dim);display:inline-flex;align-items:center;gap:14px;white-space:nowrap;}
.ticker span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--red-glow);}
@keyframes scrollx{to{transform:translateX(-50%);}}

/* ---------- footer (noir) ---------- */
.footer{background:var(--noir-0);color:var(--cream);padding:72px 0 42px;}
.footer .grid-foot{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;}
.footer .brand{color:var(--cream);}
.footer .brand .wmark{height:19px;}
.footer .fdesc{color:var(--cream-faint);font-size:13.5px;max-width:280px;margin-top:16px;}
.footer h6{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--cream-faint);margin-bottom:16px;}
.footer ul{list-style:none;}
.footer li{margin-bottom:10px;}
.footer a{font-size:13.5px;color:var(--cream-dim);transition:color .2s;}
.footer a:hover{color:var(--cream);}
.footer .fbottom{margin-top:52px;padding-top:26px;border-top:1px solid var(--line-dark);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--cream-faint);}
.footer .fbottom a{color:var(--cream-faint);}

/* ---------- reveal on scroll ---------- */
[data-reveal]{opacity:0;transform:translateY(28px);filter:blur(6px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1),filter .8s ease;}
[data-reveal].is-visible{opacity:1;transform:none;filter:blur(0);}
[data-reveal-delay="1"]{transition-delay:.08s;}
[data-reveal-delay="2"]{transition-delay:.16s;}
[data-reveal-delay="3"]{transition-delay:.24s;}
[data-reveal-delay="4"]{transition-delay:.32s;}
[data-reveal-delay="5"]{transition-delay:.40s;}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1!important;transform:none!important;filter:none!important;}
  .scroll-cue svg,.kicker .dot,.ticker__track{animation:none!important;}
  html{scroll-behavior:auto;}
}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .footer .grid-foot{grid-template-columns:1fr 1fr;gap:30px;}
}
@media (max-width:860px){
  .nav-links{display:none;}
  .nav-right .btn{display:none;}
  .nav-burger{display:flex;}
  .hero__grid{grid-template-columns:1fr;text-align:left;}
  .hero__inner{padding:110px 24px 80px;}
  .grid-2,.grid-3,.grid-4,.flow{grid-template-columns:1fr;}
  .flow{grid-template-columns:1fr 1fr;}
  .grid-4{grid-template-columns:1fr 1fr;}
  .product{grid-template-columns:1fr;}
  .product .ph{min-height:240px;order:1!important;}
  .product .body{padding:32px 26px;}
  section{padding:72px 0;}
  .container,.container-wide{padding:0 20px;}
  .cta-block{padding:44px 24px;}
  .footer .grid-foot{grid-template-columns:1fr 1fr;}
}
@media (max-width:520px){
  .flow,.grid-4,.footer .grid-foot{grid-template-columns:1fr;}
  .hero .ctas{flex-direction:column;align-items:stretch;}
  .hero .ctas .btn{justify-content:center;}
}

/* ---------- 3D canvases (hero + showcase) ---------- */
#hero-canvas{opacity:0;transition:opacity .9s ease;}
#hero-canvas.loaded{opacity:1;}
.obj3d{width:100%;height:360px;display:block;opacity:0;transition:opacity .9s ease;cursor:grab;}
.obj3d.loaded{opacity:1;}
.showcase{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:46px;}
.showcase-item{background:transparent;border:0;padding:0 6px;text-align:center;}
.showcase-item .cap{margin-top:6px;}
.showcase-item .tag{font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--red-glow);}
.showcase-item h4{font-family:var(--font-display);font-size:23px;margin:8px 0 8px;color:#fff;font-weight:700;}
.showcase-item p{color:var(--cream-dim);font-size:14px;max-width:380px;margin:0 auto;}
@media (max-width:860px){ .showcase{grid-template-columns:1fr;} .obj3d{height:320px;} }

/* mobil: landing hero'da 3D klaket üstte ayrı bir blok, metin altında (çakışma yok) */
@media (max-width:860px){
  .hero:not(.hero-page){min-height:auto;justify-content:flex-start;padding-top:74px;}
  .hero:not(.hero-page) #hero-canvas{position:relative;inset:auto;height:56vh;width:100%;z-index:2;}
  .hero:not(.hero-page) .hero__inner{padding:6px 24px 56px;}
  .hero:not(.hero-page) .scroll-cue{display:none;}
}

/* ---------- deneysel ikincil renk seçici (nav) ---------- */
.nav-left{display:flex;align-items:center;gap:16px;}
.accent-pick{display:flex;align-items:center;gap:7px;}
.accent-dot{width:16px;height:16px;border-radius:50%;background:var(--d);border:2px solid rgba(244,239,228,.25);cursor:pointer;padding:0;transition:transform .15s ease,border-color .2s ease;}
.accent-dot:hover{transform:scale(1.18);}
.accent-dot.active{border-color:var(--cream);}
.nav.solid .accent-dot{border-color:rgba(22,19,16,.22);}
.nav.solid .accent-dot.active{border-color:var(--ink-0);}
@media (max-width:520px){ .nav-left{gap:10px;} .accent-pick{gap:6px;} .accent-dot{width:14px;height:14px;} }

/* ============================================================
   TASARIM TEMALARI (deneysel) — data-theme ile tüm site yeniden derilenir.
   general (varsayılan) · swiss (International Typographic) · lux (Luxury/Editorial)
   ============================================================ */

/* tema seçici kontrolü (nav, renk seçicinin yanında) */
.theme-pick{display:inline-flex;align-items:center;gap:1px;border:1px solid var(--line-dark-strong);border-radius:999px;padding:2px;}
.theme-opt{font-family:var(--font-mono);font-size:10.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--cream-faint);background:transparent;border:0;padding:5px 11px;border-radius:999px;cursor:pointer;white-space:nowrap;transition:color .2s ease,background .2s ease;}
.theme-opt:hover{color:var(--cream);}
.theme-opt.active{background:var(--cream);color:var(--noir-0);}
.nav.solid .theme-pick{border-color:var(--line-strong);}
.nav.solid .theme-opt{color:var(--ink-3);}
.nav.solid .theme-opt:hover{color:var(--ink-0);}
.nav.solid .theme-opt.active{background:var(--ink-0);color:var(--white);}
@media (max-width:640px){ .theme-opt{padding:4px 8px;font-size:10px;letter-spacing:.02em;} .nav-left{gap:10px;} }
/* tema/aksan geçişi anında tüm geçişleri kapat — var() değeri değişince transition'ın eski
   renkte donmasını engeller (aksi halde buton/kart/logo eski renkte kalır) */
html.tk-switching,html.tk-switching *,html.tk-switching *::before,html.tk-switching *::after{transition:none !important;}

/* ===================== SWISS · International Typographic Style ===================== */
[data-theme="swiss"]{
  --bg-0:#ffffff; --bg-1:#f2f2f2; --bg-2:#e9e9e9; --white:#ffffff;
  --ink-0:#000000; --ink-1:#0a0a0a; --ink-2:#2b2b2b; --ink-3:#565656; --ink-4:#8a8a8a;
  --noir-0:#000000; --noir-1:#080808; --noir-2:#111111; --noir-3:#1a1a1a;
  --cream:#ffffff; --cream-dim:#d6d6d6; --cream-faint:#9a9a9a;
  --red:#af1220; --red-bright:#d5222c; --red-glow:#e23a2c; --red-deep:#7a2530;
  --red-soft:rgba(175,18,32,.12); --red-line:#000000;
  --line:rgba(0,0,0,.82); --line-strong:#000000;
  --line-dark:rgba(255,255,255,.25); --line-dark-strong:rgba(255,255,255,.45);
  --font-display:'Inter',-apple-system,system-ui,sans-serif;
  --r-sm:0; --r-md:0; --r-lg:0; --r-xl:0;
  --sh-sm:none; --sh-md:none; --sh-lg:none;
}
[data-theme="swiss"] .hero h1,[data-theme="swiss"] h2.h2,[data-theme="swiss"] .pcard h3,
[data-theme="swiss"] .step h4,[data-theme="swiss"] .fcard h4,[data-theme="swiss"] .product h3,
[data-theme="swiss"] .role h5{font-family:var(--font-ui);font-weight:900;text-transform:uppercase;letter-spacing:-.02em;font-style:normal;}
[data-theme="swiss"] .hero h1 em,[data-theme="swiss"] h2.h2 em{font-style:normal;font-weight:900;}
[data-theme="swiss"] .btn{border-radius:0;text-transform:uppercase;letter-spacing:.06em;font-weight:800;}
[data-theme="swiss"] .kicker,[data-theme="swiss"] .fmt,[data-theme="swiss"] .tc-strip{border-radius:0;}
[data-theme="swiss"] .pcard,[data-theme="swiss"] .step,[data-theme="swiss"] .fcard,[data-theme="swiss"] .role,
[data-theme="swiss"] .product,[data-theme="swiss"] .fmt,[data-theme="swiss"] .kicker,[data-theme="swiss"] .tc-strip{border-width:2px;box-shadow:none;}
[data-theme="swiss"] .section-alt{border-top-width:2px;border-bottom-width:2px;}
[data-theme="swiss"] .btn-primary{background:var(--red);color:#fff;border:2px solid var(--red);box-shadow:none;}
[data-theme="swiss"] .btn-primary:hover{background:#000;border-color:#000;color:#fff;}
[data-theme="swiss"] .btn-ghost{border:2px solid var(--line-dark-strong);}
[data-theme="swiss"] .btn-outline{border-width:2px;}
[data-theme="swiss"] .fcard:hover,[data-theme="swiss"] .role:hover{transform:none;box-shadow:none;background:var(--red);border-color:var(--red);}
[data-theme="swiss"] .fcard:hover h4,[data-theme="swiss"] .fcard:hover p,[data-theme="swiss"] .fcard:hover .num,
[data-theme="swiss"] .role:hover h5{color:#fff;}
[data-theme="swiss"] .section-alt,[data-theme="swiss"] .section-cream{
  background-color:#f2f2f2;
  background-image:linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px);
  background-size:24px 24px;}
[data-theme="swiss"] .hero__glow{opacity:.22;}
[data-theme="swiss"] .nav.solid{background:rgba(255,255,255,.96);border-bottom:2px solid #000;}

/* ===================== LUX · Luxury / Editorial ===================== */
[data-theme="lux"]{
  --bg-0:#f9f8f6; --bg-1:#f3f1ec; --bg-2:#ebe5de; --white:#fffdfb;
  --ink-0:#1a1a1a; --ink-1:#2a2824; --ink-2:#4a463f; --ink-3:#6c6863; --ink-4:#9a958c;
  --noir-0:#1a1a1a; --noir-1:#1f1d1a; --noir-2:#242220; --noir-3:#2c2a26;
  --cream:#f9f8f6; --cream-dim:rgba(249,248,246,.78); --cream-faint:rgba(249,248,246,.55);
  --red:#af1220; --red-bright:#d5222c; --red-glow:#e23a2c; --red-deep:#7a2530;
  --red-soft:rgba(175,18,32,.12); --red-line:rgba(26,26,26,.18);
  --line:rgba(26,26,26,.12); --line-strong:rgba(26,26,26,.2);
  --line-dark:rgba(249,248,246,.12); --line-dark-strong:rgba(249,248,246,.22);
  --font-display:'Playfair Display',Georgia,serif;
  --r-sm:0; --r-md:0; --r-lg:0; --r-xl:0;
  --sh-sm:0 2px 10px rgba(26,26,26,.04); --sh-md:0 10px 30px rgba(26,26,26,.07); --sh-lg:0 20px 50px rgba(26,26,26,.1);
}
[data-theme="lux"] .hero h1,[data-theme="lux"] h2.h2{font-weight:500;letter-spacing:0;}
[data-theme="lux"] .eyebrow,[data-theme="lux"] .kicker,[data-theme="lux"] .product .plat{letter-spacing:.26em;}
[data-theme="lux"] .btn{border-radius:0;letter-spacing:.14em;text-transform:uppercase;transition-duration:.6s;}
[data-theme="lux"] .btn-primary{background:var(--red);color:#fff;box-shadow:0 6px 22px color-mix(in srgb,var(--red) 32%,transparent);}
[data-theme="lux"] .btn-primary:hover{background:var(--red-bright);color:#fff;}
[data-theme="lux"] .fcard,[data-theme="lux"] .role,[data-theme="lux"] .step,[data-theme="lux"] .fmt{transition-duration:.6s;}
[data-theme="lux"] .kicker{border-radius:0;}
[data-theme="lux"] .cardlogo img,[data-theme="lux"] .role img,[data-theme="lux"] .product .ph img,[data-theme="lux"] .ph img{filter:grayscale(1);transition:filter 1.4s ease;}
[data-theme="lux"] .cardlogo img:hover,[data-theme="lux"] .role:hover img,[data-theme="lux"] .product .ph img:hover,[data-theme="lux"] .ph img:hover{filter:grayscale(0);}
[data-theme="lux"] .nav.solid{background:rgba(249,248,246,.9);}

/* ===================== MINIMAL · sakin, ferah, tek renkli ===================== */
[data-theme="minimal"]{
  --bg-0:#f4f3ef; --bg-1:#efeee9; --bg-2:#e7e5df; --white:#fbfaf7;
  --ink-0:#1e1c19; --ink-1:#3a3833; --ink-2:#6b675f; --ink-3:#918c82; --ink-4:#bcb6aa;
  --noir-0:#1c1a17; --noir-1:#211f1b; --noir-2:#26241f; --noir-3:#2e2b25;
  --cream:#f4f3ef; --cream-dim:#bdb8ac; --cream-faint:#8a857a;
  --red:#af1220; --red-bright:#d5222c; --red-glow:#e23a2c; --red-deep:#7a2530;
  --red-soft:rgba(175,18,32,.10); --red-line:rgba(30,28,25,.14);
  --line:rgba(30,28,25,.08); --line-strong:rgba(30,28,25,.14);
  --line-dark:rgba(244,243,239,.10); --line-dark-strong:rgba(244,243,239,.18);
  --font-display:'Inter',-apple-system,system-ui,sans-serif;
  --r-sm:0; --r-md:0; --r-lg:0; --r-xl:0;
  --sh-sm:none; --sh-md:none; --sh-lg:none;
}
[data-theme="minimal"] .hero h1,[data-theme="minimal"] h2.h2{font-family:var(--font-display);font-weight:300;letter-spacing:-.025em;}
[data-theme="minimal"] .hero h1 em,[data-theme="minimal"] h2.h2 em{font-style:normal;font-weight:500;color:var(--cream);}
[data-theme="minimal"] h2.h2 em{color:var(--ink-1);}
[data-theme="minimal"] .pcard h3,[data-theme="minimal"] .step h4,[data-theme="minimal"] .fcard h4,[data-theme="minimal"] .product h3,[data-theme="minimal"] .role h5{font-family:var(--font-display);font-weight:500;}
[data-theme="minimal"] .eyebrow{color:var(--ink-3);}
[data-theme="minimal"] .eyebrow::before{background:var(--ink-3);}
[data-theme="minimal"] .pcard,[data-theme="minimal"] .step,[data-theme="minimal"] .fcard,[data-theme="minimal"] .role,[data-theme="minimal"] .product,[data-theme="minimal"] .tc-strip{box-shadow:none;border-color:var(--line-strong);}
[data-theme="minimal"] .fcard:hover,[data-theme="minimal"] .step:hover,[data-theme="minimal"] .role:hover{transform:none;box-shadow:none;border-color:var(--ink-2);}
[data-theme="minimal"] .fcard .ficon,[data-theme="minimal"] .step .stepicon,[data-theme="minimal"] .role .ic,[data-theme="minimal"] .pcard .icn{background:transparent;border:1px solid var(--line-strong);color:var(--ink-1);box-shadow:none;}
[data-theme="minimal"] .btn-primary{background:var(--ink-0);color:var(--bg-0);box-shadow:none;}
[data-theme="minimal"] .btn-primary:hover{background:var(--ink-1);}
[data-theme="minimal"] .hero .btn-primary{background:var(--cream);color:var(--ink-0);}
[data-theme="minimal"] .hero .btn-primary:hover{background:#fff;}
[data-theme="minimal"] .section-alt{background:var(--white);}
[data-theme="minimal"] .nav.solid{background:rgba(244,243,239,.92);}

/* aksan rengi temaları — kırmızı ailesini deneysel olarak yeniden eşler */
[data-accent="blue"]{--red:#1f6feb;--red-bright:#3b8bff;--red-glow:#4d9bff;--red-deep:#17457a;--red-soft:rgba(31,111,235,.12);--red-line:rgba(31,111,235,.30);}
[data-accent="green"]{--red:#1f9d57;--red-bright:#28b869;--red-glow:#34c877;--red-deep:#14512f;--red-soft:rgba(31,157,87,.12);--red-line:rgba(31,157,87,.30);}

/* ---------- detailed workflow (havalı) big ghost numerals ---------- */
.wf-detailed .product{border:1px solid var(--line);box-shadow:0 22px 54px rgba(22,19,16,.12);}
.wf-detailed .product .body{position:relative;}
.step-no{position:absolute;top:20px;right:30px;font-family:var(--font-display);font-weight:700;font-size:68px;line-height:1;color:var(--red);opacity:.15;pointer-events:none;}
@media (max-width:860px){ .step-no{font-size:46px;top:14px;right:20px;} }

/* ---------- software logo tile (masked, brand-tinted) ---------- */
.swlogo{display:block;width:27px;height:27px;background:var(--red);
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;}
.fcard:hover .swlogo{background:var(--red-bright);}

/* ---------- role photo cards ---------- */
.role.role-photo{padding:0;overflow:hidden;text-align:left;}
.role.role-photo .role-img{height:160px;background:#161310 center/cover no-repeat;filter:saturate(.92);}
.role.role-photo .role-body{display:flex;align-items:center;gap:12px;padding:16px 18px;}
.role.role-photo .role-body .ic{width:40px;height:40px;margin:0;flex-shrink:0;}
.role.role-photo .role-body h5{font-size:13px;text-align:left;}
@media (max-width:520px){ .role.role-photo .role-img{height:190px;} }

/* ---------- software logo images (compatibility cards) ---------- */
.fcard:has(.cardlogo){position:relative;}
.fcard:has(.cardlogo) .num{position:absolute;top:28px;right:26px;float:none;margin:0;}
.cardlogo{height:34px;margin-bottom:22px;display:flex;align-items:center;}
.cardlogo img{height:100%;width:auto;max-width:104px;object-fit:contain;display:block;}

/* ---------- stat with icon (havalı sayılar) ---------- */
.stat .stat-ic{width:48px;height:48px;margin:0 auto 14px;border-radius:13px;background:color-mix(in srgb,var(--red-bright) 16%,transparent);color:var(--red-glow);display:flex;align-items:center;justify-content:center;}
.section-cream .stat .stat-ic,.section-alt .stat .stat-ic{background:var(--red-soft);color:var(--red);}

/* ---------- differentiator (takeOne) card — dark + green-forward ---------- */
.diff-grid{grid-template-columns:0.86fr 1.14fr;}
@media (max-width:860px){ .diff-grid{grid-template-columns:1fr;} }
.pcard.solution.diff{background:linear-gradient(160deg,#14140f,#0a0908);border:1px solid rgba(92,201,138,.35);box-shadow:0 26px 64px rgba(0,0,0,.4),0 0 0 1px rgba(92,201,138,.12);padding:40px;position:relative;overflow:hidden;}
.pcard.solution.diff::before{content:"";position:absolute;top:-32%;right:-12%;width:62%;height:74%;background:radial-gradient(circle,rgba(92,201,138,.18),transparent 70%);pointer-events:none;}
.pcard.solution.diff > *{position:relative;}
.diff-brand{display:inline-flex;align-items:center;gap:1px;margin:4px 0 18px;color:var(--cream);}
.diff-brand .wmark{height:30px;}
/* badge solda, takeOne logosu sağda */
.diff-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px;}
.diff-top .diff-badge{margin-bottom:0;}
.diff-top .diff-brand{margin:0;}
@media (max-width:520px){ .diff-top{flex-wrap:wrap;} .diff-top .diff-brand .wmark{height:25px;} }
.pcard.solution.diff h3{color:#fff;font-size:24px;}
.pcard.solution.diff li{color:var(--cream-dim);font-size:15px;}
.pcard.solution.diff li::before{background:#5cc98a;opacity:1;}
.pcard.solution.diff .icn{background:rgba(92,201,138,.18);color:#5cc98a;}
.diff-badge{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#5cc98a;background:rgba(92,201,138,.14);border:1px solid rgba(92,201,138,.3);padding:5px 12px;border-radius:999px;margin-bottom:16px;}

/* center helpers for formats / ctas under centered heads */
.center .formats,.formats.center{justify-content:center;}

/* ---------- dark-mode step cards (workflow on noir) ---------- */
.section-noir .step{background:var(--noir-2);border-color:var(--line-dark);}
.section-noir .step h4{color:#fff;}
.section-noir .step p{color:var(--cream-dim);}
.section-noir .step .stepicon{background:color-mix(in srgb,var(--red-bright) 16%,transparent);color:var(--red-glow);}
.section-noir .step .num{color:var(--red-glow);}
.section-noir .step::after{background:linear-gradient(90deg,var(--red-glow),transparent);}
/* flow connectors (red chevrons between steps) */
.flow.connected .step::before{content:"";position:absolute;top:50%;right:-21px;width:11px;height:11px;
  border-top:2px solid var(--red-glow);border-right:2px solid var(--red-glow);
  transform:translateY(-50%) rotate(45deg);z-index:3;}
.flow.connected .step:last-child::before{display:none;}
@media (max-width:860px){ .flow.connected .step::before{display:none;} }

/* ============================================================
   ANA SAYFA HERO — tema başına farklı hook + yerleşim (yalnızca index: .hero:not(.hero-page)).
   Genel tasarıma dokunulmaz; varyantlar data-hero ile, general varsayılan görünür.
   ============================================================ */
.hero__copy .kicker[data-hero],.hero__copy h1[data-hero],.hero__copy .sub[data-hero]{display:none;}
.hero-spine,.hero-vlabel,.hero-tag,.hero-rule{display:none;}
html:not([data-theme]) .hero__copy .kicker[data-hero="general"]{display:inline-flex;}
html:not([data-theme]) .hero__copy h1[data-hero="general"]{display:block;}
html:not([data-theme]) .hero__copy .sub[data-hero="general"]{display:block;}
[data-theme="swiss"] .hero:not(.hero-page) .tc-strip,[data-theme="swiss"] .hero:not(.hero-page) .microcopy,
[data-theme="lux"] .hero:not(.hero-page) .tc-strip,[data-theme="lux"] .hero:not(.hero-page) .microcopy,
[data-theme="minimal"] .hero:not(.hero-page) .tc-strip,[data-theme="minimal"] .hero:not(.hero-page) .microcopy{display:none;}

/* ---------- SWISS hero: numaralı grid, dev uppercase, sol dikey "01" ---------- */
[data-theme="swiss"] .hero__copy .kicker[data-hero="swiss"]{display:block;}
[data-theme="swiss"] .hero__copy h1[data-hero="swiss"]{display:block;}
[data-theme="swiss"] .hero__copy .sub[data-hero="swiss"]{display:block;}
[data-theme="swiss"] .hero:not(.hero-page) .kicker-swiss{font-family:var(--font-ui);font-weight:800;background:none;border:0;border-bottom:2px solid var(--red);border-radius:0;padding:0 0 12px;margin-bottom:26px;width:100%;max-width:620px;letter-spacing:.16em;color:var(--red);}
[data-theme="swiss"] .hero:not(.hero-page) .kicker-swiss b{color:#fff;margin:0 8px;}
[data-theme="swiss"] .hero:not(.hero-page) h1[data-hero="swiss"]{font-size:clamp(2.7rem,8.5vw,6.4rem);line-height:.94;letter-spacing:-.03em;max-width:14ch;}
[data-theme="swiss"] .hero:not(.hero-page) .sub[data-hero="swiss"]{max-width:440px;margin-top:30px;}
[data-theme="swiss"] .hero:not(.hero-page) .cta-secondary{display:none;}
[data-theme="swiss"] .hero-spine{display:block;position:absolute;left:12px;top:104px;writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--font-ui);font-weight:900;font-size:clamp(4rem,11vw,9rem);line-height:1;color:var(--red);opacity:.15;z-index:-1;letter-spacing:-.04em;}

/* ---------- LUX hero: alt-sol editöryel, dikey etiket, text-link CTA ---------- */
[data-theme="lux"] .hero__copy .kicker[data-hero="lux"]{display:inline-flex;align-items:center;}
[data-theme="lux"] .hero__copy h1[data-hero="lux"]{display:block;}
[data-theme="lux"] .hero__copy .sub[data-hero="lux"]{display:block;}
[data-theme="lux"] .hero:not(.hero-page){justify-content:flex-end;}
[data-theme="lux"] .hero:not(.hero-page) .hero__inner{padding-bottom:92px;}
[data-theme="lux"] .hero:not(.hero-page) .hero__copy{max-width:640px;}
[data-theme="lux"] .hero:not(.hero-page) .kicker-lux{background:none;border:0;padding:0;border-radius:0;letter-spacing:.28em;color:var(--cream-dim);font-family:var(--font-mono);}
[data-theme="lux"] .hero:not(.hero-page) .kicker-lux .khair{display:inline-block;width:38px;height:1px;background:var(--red-glow);margin-right:14px;}
[data-theme="lux"] .hero:not(.hero-page) h1[data-hero="lux"]{font-size:clamp(2.3rem,5.4vw,4.2rem);line-height:1.06;font-weight:500;letter-spacing:0;max-width:15ch;}
[data-theme="lux"] .hero:not(.hero-page) .sub[data-hero="lux"]{max-width:480px;margin-top:22px;}
[data-theme="lux"] .hero-vlabel{display:block;position:absolute;left:8px;top:50%;transform:translateY(-50%) rotate(180deg);writing-mode:vertical-rl;font-family:var(--font-mono);font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--cream-faint);}
[data-theme="lux"] .hero .ctas{gap:34px;margin-top:34px;}
[data-theme="lux"] .hero .ctas .btn{background:transparent;border:0;box-shadow:none;padding:0;color:var(--cream);position:relative;letter-spacing:.14em;text-transform:uppercase;font-size:12.5px;transform:none;}
[data-theme="lux"] .hero .ctas .btn::after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:1px;background:var(--red-glow);transform:scaleX(.35);transform-origin:left;transition:transform .6s cubic-bezier(.25,.46,.45,.94);}
[data-theme="lux"] .hero .ctas .btn:hover::after{transform:scaleX(1);}
[data-theme="lux"] .hero .ctas .btn:hover{transform:none;}

/* ---------- MINIMAL hero: dar sol kolon, çok boşluk, ince tip, tek text-link ---------- */
[data-theme="minimal"] .hero__copy h1[data-hero="minimal"]{display:block;}
[data-theme="minimal"] .hero__copy .sub[data-hero="minimal"]{display:block;}
[data-theme="minimal"] .hero-rule{display:block;width:60px;height:1px;background:var(--cream-dim);margin:26px 0;opacity:.7;}
[data-theme="minimal"] .hero:not(.hero-page) .hero__copy{max-width:540px;position:relative;padding-top:8px;}
[data-theme="minimal"] .hero__copy .kicker[data-hero="minimal"]{display:inline-flex;}
[data-theme="minimal"] .hero:not(.hero-page) .kicker-min{background:none;border:0;padding:0;border-radius:0;font-family:var(--font-mono);font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--cream-faint);margin-bottom:32px;}
[data-theme="minimal"] .hero:not(.hero-page) h1[data-hero="minimal"]{font-size:clamp(2.3rem,4.8vw,3.7rem);font-weight:600;line-height:1.08;letter-spacing:-.03em;color:var(--cream);}
[data-theme="minimal"] .hero:not(.hero-page) h1[data-hero="minimal"] em{color:#fff;font-weight:800;font-style:normal;}
[data-theme="minimal"] .hero:not(.hero-page) .hero-rule{width:56px;margin:30px 0;}
[data-theme="minimal"] .hero:not(.hero-page) .sub[data-hero="minimal"]{font-size:15px;line-height:1.7;max-width:400px;}
[data-theme="minimal"] .hero:not(.hero-page) .sub[data-hero="minimal"]{font-size:14.5px;color:var(--cream-dim);max-width:360px;}
[data-theme="minimal"] .hero:not(.hero-page) .cta-secondary{display:none;}
[data-theme="minimal"] .hero .ctas{margin-top:28px;}
[data-theme="minimal"] .hero .ctas .btn-primary{background:transparent;color:var(--cream);padding:0;box-shadow:none;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px;font-weight:400;letter-spacing:.02em;transform:none;}
[data-theme="minimal"] .hero .ctas .btn-primary:hover{background:transparent;transform:none;color:#fff;}

/* tema hero süslemeleri: mobilde dikey öğeleri gizle (çakışmayı önle) */
@media (max-width:860px){
  .hero-spine,.hero-vlabel{display:none !important;}
  [data-theme="lux"] .hero:not(.hero-page) .hero__inner{padding-bottom:56px;}
  [data-theme="minimal"] .hero-tag{position:static;display:inline-block;margin-bottom:14px;}
}

/* mobil: renk + tema seçicileri üst bardan kaldır, sağ menüye (drawer) taşı */
.mobile-pickers{display:none;}
@media (max-width:860px){
  .nav-left .accent-pick,.nav-left .theme-pick{display:none;}
  .mobile-pickers{display:flex;flex-direction:column;align-items:center;gap:22px;margin-top:36px;}
  .mobile-pickers .accent-pick{display:flex;gap:16px;}
  .mobile-pickers .accent-dot{width:24px;height:24px;}
  .mobile-pickers .theme-pick{flex-wrap:wrap;justify-content:center;}
  .mobile-pickers .theme-opt{padding:9px 16px;font-size:12.5px;}
}

/* minimal: üst bar CTA'sı koyu zeminde kaybolmasın — ince çerçeveli, sade */
[data-theme="minimal"] .nav .btn-primary{background:transparent;color:var(--cream);border:1px solid var(--line-dark-strong);box-shadow:none;}
[data-theme="minimal"] .nav .btn-primary:hover{background:var(--cream);color:var(--ink-0);border-color:var(--cream);}
[data-theme="minimal"] .nav.solid .btn-primary{color:var(--ink-0);border-color:var(--line-strong);}
[data-theme="minimal"] .nav.solid .btn-primary:hover{background:var(--ink-0);color:var(--bg-0);}