/* ===========================================================================
   PENTA-STYLE LAYER  —  loaded AFTER main.css, rewrites the visual language.
   Reference: pentayazilim.com
     · uniform near-black canvas, no alternating light bands
     · very large, LIGHT-weight display type (300) with tight tracking
     · full-viewport statement sections whose words brighten on scroll
     · minimal nav: logo | phone · globe · purple pill · burger
     · hairline-divided service grid, vivid rounded feature panels
     · staggered two-column reference grid, oversized footer links
   =========================================================================== */

/* ---------- tokens ---------- */
:root {
  --bg:        #090B10;
  --surface:   #101219;
  --surface-2: #14161F;
  --surface-3: #1A1D28;

  --text:    #FFFFFF;
  --muted:   #9BA1AE;
  --muted-2: #6E7482;

  --border:        rgba(255,255,255,.07);
  --border-strong: rgba(255,255,255,.14);

  --violet: #6C35B2;
  --indigo: #3C43DD;
  --lilac:  #DCAADC;

  --font-head: 'Inter', system-ui, -apple-system, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;

  --container: 1360px;
  --pad-x: clamp(20px, 4vw, 64px);
  --section: clamp(88px, 11vw, 180px);   /* Penta breathes: huge vertical rhythm */
  --radius: 28px;
  --radius-lg: 20px;

  --grad-btn: linear-gradient(90deg, #601799 0%, #3C43DD 100%);
  --glass-bg: rgba(255,255,255,.03);
}

/* ---------- canvas: flat and dark, faint nebula only ---------- */
.aurora-bg { background: var(--bg); }
.aurora-mesh { display: none; }
.aurora-orb { opacity: .13; filter: blur(150px); }
.aurora-orb.o3 { display: none; }
.noise-overlay { opacity: .018; }
body { background: var(--bg); font-feature-settings: "cv11", "ss01"; }

/* ---------- typography: light, large, tight ---------- */
h1, h2, h3, h4, h5 {
  font-family: var(--font-head);
  font-weight: 300;
  letter-spacing: -.025em;
  line-height: 1.08;
}
h3, h4, h5 { font-weight: 400; letter-spacing: -.015em; line-height: 1.25; }
b, strong { font-weight: 500; }

.h-display, .hero-title, .hero h1 { font-weight: 300; letter-spacing: -.035em; line-height: 1.02; }
.section-head { max-width: 1000px; gap: 20px; margin-bottom: clamp(56px, 7vw, 96px); }
.section-head h2 { font-size: clamp(30px, 4.4vw, 64px); font-weight: 400; letter-spacing: -.02em; }
.section-head p { color: var(--muted); font-size: clamp(16px, 1.4vw, 19px); font-weight: 300; max-width: 720px; }
.lead { color: var(--muted); font-weight: 300; }

/* Penta keeps all display type plain white — no gradient fills, no underline flourish */
.grad-text, .h-display .grad-text, .shimmer-text {
  background: none; -webkit-text-fill-color: currentColor; color: inherit;
  animation: none; font-weight: inherit;
}
.section-head h2::after { display: none; }

/* eyebrow → Penta's plain light label, no pill */
.eyebrow, .hero-eyebrow {
  background: none; border: none; padding: 0;
  font-size: clamp(15px, 1.6vw, 22px); font-weight: 300; letter-spacing: 0;
  text-transform: none; color: rgba(255,255,255,.62);
}
.eyebrow .dot { display: none; }
.hero-eyebrow-sep { display: inline-block; width: 6px; }

/* ---------- nav: a plain transparent bar, not a floating pill ---------- */
.nav { padding-top: 0; }
.nav-inner {
  height: clamp(88px, 8vw, 150px); gap: 24px;
  max-width: var(--container); padding-inline: var(--pad-x);
  background: transparent; border: none; border-radius: 0; box-shadow: none;
  backdrop-filter: none; -webkit-backdrop-filter: none;
  transition: background .35s ease, height .35s ease;
}
.nav.scrolled { padding-top: 0; }
.nav.scrolled .nav-inner {
  height: 82px; box-shadow: none;
  background: rgba(9,11,16,.86);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  max-width: none; padding-inline: max(var(--pad-x), calc((100% - var(--container)) / 2 + var(--pad-x)));
}
.nav-logo svg, .nav-logo img { height: 42px; }
/* inline link list moves into the fullscreen menu */
.nav-links { display: none !important; }
.nav-right { display: flex; align-items: center; gap: 22px; }
.nav-phone { display: inline-flex; align-items: center; gap: 9px; font-size: 16px; font-weight: 400; color: #fff; }
.nav-phone svg { width: 19px; height: 19px; color: #fff; }
.nav-cta {
  background: var(--grad-btn); color: #fff;
  padding: 15px 34px; border-radius: 999px;
  font-size: 15px; font-weight: 500; letter-spacing: .01em;
  box-shadow: none; transition: filter .25s ease, transform .25s ease;
}
.nav-cta:hover { filter: brightness(1.14); transform: none; box-shadow: 0 0 30px rgba(108,53,178,.55); }
.nav-cta svg { display: none; }

/* language switch → globe icon toggle */
.lang-toggle {
  display: inline-flex; gap: 0; background: none; border: none; padding: 0;
  border-radius: 0; overflow: visible;
}
.lang-toggle button {
  background: none; border: none; color: rgba(255,255,255,.55);
  font-size: 13px; font-weight: 500; padding: 4px 5px; border-radius: 0;
}
.lang-toggle button.active { background: none; color: #fff; }
.lang-toggle button.active::after { content: ""; display: block; height: 1px; background: #fff; margin-top: 2px; }

/* burger is always visible (Penta hides nav links behind it at every size) */
.nav .hamburger { display: flex !important; align-items: center; justify-content: center;
  width: 62px; height: 62px; border-radius: 50%;
  background: rgba(255,255,255,.06); border: 1px solid var(--border);
  flex-direction: column; gap: 6px; transition: background .25s; }
.nav .hamburger:hover { background: rgba(255,255,255,.12); }
.nav .hamburger span { display: block; width: 22px; height: 1.5px; background: #fff; border-radius: 2px; }
.nav .hamburger span:nth-child(3) { display: none; }
.nav-progress { background: var(--grad-btn); }

/* ---------- hero: full viewport, left aligned, oversized ---------- */
main { padding-top: clamp(88px, 8vw, 150px); }
/* the home hero runs full-bleed underneath the transparent bar */
.hero-has-video { margin-top: calc(-1 * clamp(88px, 8vw, 150px)); }

.hero, .hero-pro, .hero-has-video {
  min-height: 100svh; display: flex; align-items: center;
  padding-top: clamp(100px, 9vw, 170px); padding-bottom: clamp(90px, 9vw, 140px);
}
.hero:not(.hero-has-video) { min-height: 0; padding-top: clamp(40px, 5vw, 80px); }
/* Hero metni videonun ÜSTÜNDE kalmalı. .hero-video (z:0) ve .hero-scrim (z:1)
   konumlandırılmış; metin sarmalayıcıları konumlandırılmazsa z-index yok sayılır
   ve yazı videonun arkasında kaybolur. Her genişlikte geçerli olmalı. */
.hero-has-video > .container,
.hero-pro .hero-grid,
.hero-has-video .hero-left { position: relative; z-index: 2; }

.hero-has-video .hero-left { max-width: none; }
/* Penta: kicker is 36px at weight 100, headline 100px at weight 400, leading-none */
.hero-has-video .hero-title, .hero-title, .hero h1 {
  font-size: clamp(38px, 5.6vw, 84px);
  font-weight: 400; letter-spacing: -.03em; line-height: 1.03;
  margin-bottom: clamp(24px, 2.4vw, 38px); max-width: 20ch;
}
.hero .lead {
  font-size: clamp(15px, 1.25vw, 18px); font-weight: 300;
  color: rgba(255,255,255,.62); max-width: 540px; margin-bottom: clamp(26px, 2.6vw, 40px);
}
.hero-has-video .lead { color: rgba(255,255,255,.78); }
.hero-eyebrow {
  margin-bottom: clamp(14px, 1.6vw, 26px); display: block;
  font-size: clamp(17px, 2.1vw, 32px); font-weight: 300; color: rgba(255,255,255,.88);
}
/* video her genişlikte parlak bölgeler taşıyor — metin gölgesi her yerde açık kalsın */
.hero-has-video .hero-eyebrow { text-shadow: 0 1px 16px rgba(9,11,16,.9), 0 0 40px rgba(9,11,16,.55); }
.hero-has-video .hero-title { text-shadow: 0 2px 28px rgba(9,11,16,.8), 0 0 60px rgba(9,11,16,.5); }
.hero-has-video .lead { text-shadow: 0 1px 16px rgba(9,11,16,.85); }
/* the blinking type cursor Penta ends its headline with */
.hero-title .type-caret {
  display: inline-block; width: .42em; height: .055em; margin-left: .1em;
  background: #fff; vertical-align: baseline; animation: caret 1.1s steps(1) infinite;
}
.hero-btns { margin-bottom: 0; gap: 16px; }
@keyframes caret { 50% { opacity: 0; } }

/* trust row + secondary hero chrome recede */
.hero-trust { opacity: .85; }
.hero-scroll {
  left: 50%; bottom: 38px; transform: translateX(-50%);
  flex-direction: row; gap: 10px; font-size: 13px;
  font-weight: 300; letter-spacing: .01em; text-transform: none;
  color: rgba(255,255,255,.6);
}
.hero-scroll::before {
  content: ""; width: 15px; height: 23px; background: none;
  border: 1px solid rgba(255,255,255,.45); border-radius: 8px;
  animation: none; flex-shrink: 0; position: relative;
}
.hero-scroll::after {
  content: ""; position: absolute; left: 7px; top: 6px;
  width: 1.5px; height: 5px; background: rgba(255,255,255,.8); border-radius: 2px;
  animation: wheel 1.8s ease-in-out infinite;
}
@keyframes wheel { 0%,100% { transform: translateY(0); opacity: 1; } 60% { transform: translateY(6px); opacity: .2; } }

/* ---------- inner-page header (Penta: centred light title + breadcrumb) ---------- */
.phead {
  padding-top: clamp(56px, 7vw, 112px);
  padding-bottom: clamp(72px, 9vw, 150px);
  text-align: center; position: relative;
}
.phead h1 {
  font-size: clamp(29px, 4.3vw, 60px); font-weight: 400;
  letter-spacing: -.03em; line-height: 1.12;
  max-width: 20ch; margin-inline: auto;
}
.phead-sub {
  margin-top: 22px; font-size: clamp(15px, 1.4vw, 20px); font-weight: 300;
  color: rgba(255,255,255,.6); max-width: 660px; margin-inline: auto; line-height: 1.55;
}
.phead-crumb {
  margin-top: 28px; display: flex; justify-content: center; align-items: center; gap: 10px;
  font-size: 15px; font-weight: 300; color: rgba(255,255,255,.45);
}
.phead-crumb a { color: rgba(255,255,255,.45); transition: color .25s; }
.phead-crumb a:hover { color: #fff; }
.phead-crumb .sep { color: rgba(255,255,255,.25); }
.phead-crumb .cur { color: rgba(255,255,255,.72); }
.phead + .section { padding-top: 0; }

/* detay sayfaları: iki sütunlu hero yerine ortalanmış başlık + geniş çerçeve */
.pd-hero-flat { padding-top: 0; text-align: center; }
.pd-meta-center, .pd-cta-center, .pd-pills-center { justify-content: center; }
.pd-meta-center { margin-bottom: 30px; }
.pd-pills-center { margin-bottom: 30px; display: flex; flex-wrap: wrap; gap: 12px; }
.pd-cta-center { margin-bottom: clamp(48px, 6vw, 88px); display: flex; flex-wrap: wrap; gap: 16px; }
.pd-frame-wide {
  max-width: 1120px; margin-inline: auto; text-align: left;
  border-radius: clamp(18px, 2vw, 30px); overflow: hidden;
  border: 1px solid var(--border); background: var(--surface);
  box-shadow: 0 60px 140px -60px rgba(0,0,0,.9);
}
.pd-frame-wide .pd-frame-body img { width: 100%; height: auto; display: block; }
.pd-hero-flat .pd-orb { opacity: .12; }
@media (max-width: 560px) {
  .pd-cta-center { flex-direction: column; align-items: stretch; }
  .pd-cta-center .btn { width: 100%; }
}

/* ---------- STATEMENT: full-viewport line that brightens word by word ---------- */
.statement {
  min-height: 100svh; display: flex; align-items: center; justify-content: center;
  text-align: center; padding-block: var(--section);
}
.statement-inner { max-width: 1240px; margin-inline: auto; }
/* Penta: text-22 (88px) at font-medium, leading 1.1, tracking -.01em */
.statement-text {
  font-family: var(--font-head); font-weight: 500;
  font-size: clamp(28px, 4.9vw, 80px); line-height: 1.1; letter-spacing: -.015em;
}
.statement-text .w { color: rgba(255,255,255,.16); transition: color .18s linear; }
.statement-text .w.on { color: #fff; }
.statement-sub {
  margin-top: 38px; font-size: clamp(15px, 1.3vw, 18px); font-weight: 300;
  color: rgba(255,255,255,.5); max-width: 640px; margin-inline: auto;
}
.statement-cta { margin-top: 46px; }

/* ---------- hairline service grid ---------- */
.pgrid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--border); border-left: 1px solid var(--border);
}
.pgrid-cell {
  border-right: 1px solid var(--border); border-bottom: 1px solid var(--border);
  padding: clamp(38px, 4.2vw, 62px) clamp(20px, 2.2vw, 34px);
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 20px;
  transition: background .4s ease;
}
.pgrid-cell:hover { background: rgba(255,255,255,.028); }
.pgrid-ico {
  width: 58px; height: 58px; border-radius: 50%;
  border: 1px solid var(--border-strong); display: grid; place-items: center;
  color: rgba(255,255,255,.75); transition: border-color .4s, color .4s, transform .4s;
}
.pgrid-ico svg { width: 24px; height: 24px; }
.pgrid-cell:hover .pgrid-ico { border-color: var(--lilac); color: var(--lilac); transform: translateY(-3px); }
.pgrid-name { font-size: clamp(17px, 1.5vw, 22px); font-weight: 300; color: rgba(255,255,255,.72); letter-spacing: -.01em; transition: color .4s; }
.pgrid-cell:hover .pgrid-name { color: #fff; }
.pgrid-desc { font-size: 14px; font-weight: 300; color: var(--muted-2); line-height: 1.55; }
@media (max-width: 900px) { .pgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .pgrid { grid-template-columns: 1fr; } }

/* ---------- vivid rounded feature panel ---------- */
.ppanel {
  border-radius: clamp(28px, 3vw, 46px); overflow: hidden; position: relative;
  padding: clamp(40px, 5.5vw, 88px);
  background: linear-gradient(128deg, #2A22C8 0%, #4A3BE8 42%, #6C35B2 100%);
  color: #fff;
}
.ppanel.alt { background: linear-gradient(128deg, #601799 0%, #3C43DD 100%); }
.ppanel.soft { background: linear-gradient(140deg, #E8E4F6 0%, #D7E6F2 55%, #EAE0F2 100%); color: #151026; }
.ppanel.soft .ppanel-body { color: #3A3550; }
.ppanel::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(70% 90% at 88% 12%, rgba(255,255,255,.22), transparent 62%);
}
.ppanel-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(26px, 3.5vw, 60px); align-items: start; }
.ppanel-title { font-size: clamp(24px, 2.7vw, 38px); font-weight: 300; letter-spacing: -.02em; line-height: 1.18; }
.ppanel-body { font-size: clamp(15px, 1.2vw, 17px); font-weight: 300; line-height: 1.65; color: rgba(255,255,255,.9); }
.ppanel-rule { position: relative; z-index: 1; height: 1px; background: rgba(255,255,255,.28); margin-block: clamp(26px, 3vw, 44px); }
.ppanel.soft .ppanel-rule { background: rgba(21,16,38,.16); }
.ppanel-lead { position: relative; z-index: 1; font-size: clamp(22px, 2.4vw, 34px); font-weight: 300; letter-spacing: -.02em; margin-bottom: 6px; }
.ppanel-metrics { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: clamp(24px, 4vw, 72px); }
.ppanel-metric b { display: block; font-size: clamp(30px, 3.6vw, 52px); font-weight: 300; letter-spacing: -.03em; line-height: 1; }
.ppanel-metric span { font-size: 14px; font-weight: 300; color: rgba(255,255,255,.72); }
.ppanel.soft .ppanel-metric span { color: rgba(21,16,38,.6); }
@media (max-width: 820px) { .ppanel-grid { grid-template-columns: 1fr; } }

/* ---------- staggered reference grid (Penta: 2 cols, gap-18, aspect 31/28) ---------- */
.prefs { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(34px, 4.8vw, 72px); align-items: start; }
.pref { display: block; }
/* the left column drops instead of the right column rising, so nothing rides up over the heading */
.prefs > .pref:nth-child(2n+1) { transform: translateY(clamp(48px, 6.5vw, 104px)); }
.prefs { padding-bottom: clamp(48px, 6.5vw, 104px); }
.pref-media {
  position: relative; overflow: hidden; border-radius: 24px;
  aspect-ratio: 31 / 28; display: grid; place-items: center;
  background:
    radial-gradient(90% 120% at 50% -10%, color-mix(in srgb, var(--ac) 42%, transparent), transparent 70%),
    linear-gradient(160deg, #191C26 0%, #0E1016 100%);
  border: 1px solid var(--border);
  transition: border-color .5s ease;
}
.pref:hover .pref-media { border-color: color-mix(in srgb, var(--ac) 55%, transparent); }
.pref-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s cubic-bezier(.16,1,.3,1); }
.pref:hover .pref-media img { transform: scale(1.05); }
.pref-glow {
  position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; pointer-events: none;
  background: radial-gradient(60% 60% at 50% 50%, color-mix(in srgb, var(--ac) 30%, transparent), transparent 72%);
}
.pref:hover .pref-glow { opacity: 1; }
.pref-badge {
  position: relative; z-index: 1; font-family: var(--font-head); font-weight: 500;
  font-size: clamp(22px, 2.4vw, 34px); letter-spacing: -.02em; color: #fff;
  text-shadow: 0 2px 30px rgba(0,0,0,.55);
}
.pref-metric {
  position: absolute; z-index: 1; left: 26px; bottom: 24px;
  font-size: clamp(20px, 1.9vw, 28px); font-weight: 400; letter-spacing: -.02em; color: #fff;
}
.pref-metric small { display: block; font-size: 13px; font-weight: 300; color: rgba(255,255,255,.55); letter-spacing: 0; }
/* Penta: title 32px medium, subtitle 20px italic */
.pref-name { margin-top: 22px; font-size: clamp(19px, 2.2vw, 32px); font-weight: 500; letter-spacing: -.02em; color: #fff; }
.pref-cat { margin-top: 5px; font-size: clamp(15px, 1.4vw, 20px); font-weight: 300; font-style: italic; color: rgba(255,255,255,.5); }
@media (max-width: 760px) {
  .prefs { grid-template-columns: 1fr; padding-bottom: 0; }
  .prefs > .pref:nth-child(2n+1) { transform: none; }   /* single column: no stagger */
}

/* ---------- buttons (Penta: 68px tall pills, 20px label) ---------- */
.btn {
  font-weight: 400; letter-spacing: .005em; border-radius: 999px;
  height: clamp(50px, 4.4vw, 68px); padding-inline: clamp(28px, 2.9vw, 46px);
  font-size: clamp(14.5px, 1.15vw, 18px);
}
.btn svg { display: none; }
.btn-grad, .btn-primary {
  background: linear-gradient(to top right, #601799, #3C43DD);
  border: 1px solid rgba(255,255,255,.3);
  box-shadow: 0 0 100px 0 rgba(108,53,178,.25), inset 0 4px 12px rgba(0,0,0,.25);
}
.btn-grad:hover { transform: none; filter: brightness(1.1); box-shadow: 0 0 90px 0 rgba(23,114,153,.85); }
.btn-lg { padding-inline: clamp(32px, 3.6vw, 56px); }
.btn-ghost {
  background: linear-gradient(to top, rgba(255,255,255,.1), rgba(255,255,255,0));
  border: 1px solid rgba(255,255,255,.1);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); font-weight: 400;
}
.btn-ghost:hover { background: transparent; transform: none; border-color: rgba(255,255,255,.3); }

/* ---------- cards: flatten the glassmorphism ---------- */
.glass {
  background: rgba(255,255,255,.028);
  border: 1px solid var(--border); border-radius: var(--radius-lg);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.card-hover:hover { border-color: rgba(255,255,255,.16); box-shadow: none; transform: translateY(-4px); }
.chip, .pd-tech-chip { background: rgba(255,255,255,.045); border: 1px solid var(--border); color: rgba(255,255,255,.7); font-weight: 400; }

/* section panels stay on the same dark canvas — no floating cards */
.section-light, .pd-light {
  background: transparent; border: none; box-shadow: none;
  margin-inline: 0; margin-block: 0; border-radius: 0;
}
.section-light::before, .pd-light::before { display: none; }

/* quote / statement card → plain giant text */
.quote-card { background: none; border: none; padding-block: clamp(40px, 6vw, 90px); }
.quote-card p { font-size: clamp(28px, 4.2vw, 58px); font-weight: 300; letter-spacing: -.03em; line-height: 1.15; }
.quote-card cite { font-weight: 300; color: rgba(255,255,255,.45); }

/* stat blocks: Penta counters are 120px, weight 400, leading-none, no boxes */
.stat-card, .glass.stat-card { background: none; border: none; padding: 0; }
.stat-card .num, .stat-num {
  font-weight: 400; letter-spacing: -.04em; line-height: 1;
  font-size: clamp(42px, 6.4vw, 108px); color: #fff;
}
.stat-label { font-weight: 300; text-transform: none; letter-spacing: 0; font-size: 15px; color: var(--muted); margin-top: 12px; }
.stats-band { gap: clamp(24px, 4vw, 64px); }

/* ---------- oversized footer ---------- */
.footer { border-top: 1px solid var(--border); padding-block: clamp(64px, 8vw, 120px) 40px; background: var(--bg); }
.ft-grid { grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 110px); align-items: start; }
.ft-contact { grid-column: 1; }                    /* contact tucks under the brand block */
.ft-contact h4 { font-size: 12.5px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--muted-2); }
.ft-mega { display: flex; flex-direction: column; align-items: flex-end; gap: clamp(4px, .8vw, 12px); text-align: right; }
.ft-mega a {
  font-family: var(--font-head); font-weight: 300;
  font-size: clamp(28px, 3.7vw, 54px); letter-spacing: -.03em; line-height: 1.16;
  color: rgba(255,255,255,.62); transition: color .3s ease;
}
.ft-mega a:hover { color: #fff; }
.ft-mega .btn { margin-top: 26px; font-size: 15px; }
.ft-brand .nav-logo svg, .ft-brand .nav-logo img { height: 46px; }
.ft-desc { font-weight: 300; color: var(--muted); max-width: 420px; }
.ft-contact-row a, .ft-contact-row span { font-weight: 300; }
.ft-social { gap: 14px; }
.ft-social a { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border); display: grid; place-items: center; color: rgba(255,255,255,.6); transition: color .3s, border-color .3s; }
.ft-social a:hover { color: #fff; border-color: var(--border-strong); }
.ft-bottom { border-top: 1px solid var(--border); margin-top: clamp(40px, 5vw, 72px); padding-top: 28px; }
.ft-copy, .ft-legal a { font-weight: 300; font-size: 13.5px; color: var(--muted-2); }
@media (max-width: 820px) {
  .ft-grid { grid-template-columns: 1fr; }
  .ft-mega { align-items: flex-start; text-align: left; }
}

/* ---------- fullscreen menu (the burger now opens it at every size) ---------- */
.mob-overlay {
  background: rgba(9,11,16,.975);
  backdrop-filter: blur(26px); -webkit-backdrop-filter: blur(26px);
  padding: 34px var(--pad-x) 40px;
  transform: none; opacity: 0; visibility: hidden;
  transition: opacity .45s ease, visibility .45s;
}
.mob-overlay.open { transform: none; opacity: 1; visibility: visible; }
.mob-top { margin-bottom: clamp(34px, 5vw, 70px); }
.mob-close { width: 62px; height: 62px; border-radius: 50%; background: rgba(255,255,255,.06); }
.mob-nav { max-width: var(--container); width: 100%; margin-inline: auto; }
.mob-nav > a, .mob-acc-h {
  font-family: var(--font-head); font-weight: 300;
  font-size: clamp(23px, 2.9vw, 42px); letter-spacing: -.03em; line-height: 1.2;
  padding: clamp(5px, .7vw, 10px) 0; border-bottom: none;
  color: rgba(255,255,255,.62); transition: color .3s ease, padding-left .35s cubic-bezier(.16,1,.3,1);
}
.mob-nav > a:hover, .mob-acc-h:hover { color: #fff; padding-left: 16px; }
.mob-acc-ic { width: 22px; height: 22px; opacity: .5; }
.mob-acc.open .mob-acc-h { color: #fff; }
.mob-acc-body a { border-bottom: none; font-weight: 300; font-size: clamp(15px, 1.3vw, 18px); padding: 9px 0 9px 22px; color: rgba(255,255,255,.5); }
.mob-acc-body a.mob-acc-all { color: var(--lilac); font-weight: 400; }
.mob-lang { gap: 10px; margin-top: clamp(26px, 3vw, 44px); max-width: 220px; }
.mob-lang button { border-radius: 999px; font-weight: 400; }
.mob-lang button.active { background: var(--grad-btn); }
.mob-bottom { max-width: var(--container); width: 100%; margin-inline: auto; }
.mob-bottom .btn-block { width: auto; align-self: flex-start; padding-inline: 40px; }

/* ---------- floating action button ---------- */
.wa-float {
  width: 58px; height: 58px; border-radius: 50%;
  background: var(--grad-btn); box-shadow: 0 10px 34px -8px rgba(60,67,221,.7);
}
.wa-float svg { width: 25px; height: 25px; }

/* ---------- misc alignment with the reference ---------- */
.trusted-label { font-weight: 300; letter-spacing: .02em; text-transform: none; font-size: 15px; color: var(--muted); }
.faq-item { background: transparent; border: none; border-bottom: 1px solid var(--border); border-radius: 0; }
.faq-q { font-weight: 400; font-size: clamp(16px, 1.5vw, 20px); padding-block: 26px; }
.faq-a-inner { font-weight: 300; color: var(--muted); }
.section + .section { padding-top: var(--section); }

/* ---------- responsive corrections ---------- */
/* Tablet & phone: the hero video carries a bright watermark that lands right on
   the headline once the layout stacks. Deepen the scrim so type stays legible
   and the footage reads as texture, the way Penta darkens its hero photo. */
@media (max-width: 960px) {
  .hero-has-video .hero-scrim {
    display: block;
    background:
      linear-gradient(180deg,
        rgba(9,11,16,.88) 0%,
        rgba(9,11,16,.72) 24%,
        rgba(9,11,16,.76) 55%,
        rgba(9,11,16,.94) 86%,
        #090B10 100%),
      linear-gradient(90deg, rgba(9,11,16,.55) 0%, rgba(9,11,16,.18) 70%, rgba(9,11,16,0) 100%);
  }
  .hero-has-video .hero-title { text-shadow: 0 2px 26px rgba(9,11,16,.75); }
  .hero-has-video .lead { color: rgba(255,255,255,.72); text-shadow: 0 1px 14px rgba(9,11,16,.8); }
  .hero-has-video .hero-eyebrow { text-shadow: 0 1px 14px rgba(9,11,16,.8); }
}

/* stacked hero: tighten the vertical rhythm so the fold isn't mostly empty */
@media (max-width: 640px) {
  .hero, .hero-pro, .hero-has-video { padding-top: clamp(76px, 20vw, 104px); padding-bottom: clamp(56px, 14vw, 88px); }
  .hero-has-video .hero-title { font-size: clamp(31px, 8.6vw, 44px); margin-bottom: 18px; }
  .hero-has-video .hero-eyebrow { font-size: clamp(15px, 4.2vw, 19px); margin-bottom: 12px; }
  .hero-has-video .lead { font-size: 14.5px; margin-bottom: 26px; }
  .statement { min-height: 0; padding-block: clamp(72px, 18vw, 120px); }
  .statement-cta { margin-top: 32px; }
  .prefs { gap: 28px; }
  .pref-metric { left: 18px; bottom: 16px; }
  /* keep the legal row clear of the floating action button */
  .footer { padding-bottom: 104px; }
  .ft-bottom { flex-direction: column; align-items: flex-start; gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-title .type-caret, .hero-scroll::after { animation: none !important; }
  .statement-text .w { color: #fff !important; }
}