*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

/* Stardom Font */
@font-face {
  font-family: 'Stardom';
  src: url('Stardom-Regular.woff2') format('woff2'),
       url('Stardom-Regular.woff') format('woff');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

:root {
  --accent: #D4A853;
  --accent-light: #E8C97A;
  --accent-deep: #B8862D;
  --accent-pale: #F0D99A;
  --accent-red: #CC1E1E;
  --gradient: linear-gradient(90deg, var(--accent-deep), var(--accent-red));
  --dark: #080808;
  --dark2: #0c0c0c;
  --dark3: #101010;
  --white: #ffffff;
  --gray: rgba(255,255,255,0.45);
  --gray-dim: rgba(255,255,255,0.2);
  --font-display: 'Stardom', serif;
  --font-body: 'Outfit', sans-serif;
  --font-script: 'Dancing Script', cursive;
}

/* Stardom weight variations */
.sd-bold { -webkit-text-stroke: 0.6px currentColor; }
.sd-light { letter-spacing: 0.08em; -webkit-text-stroke: 0; }

/* BOLD — big impact headlines */
.hero__heading,
.hero__word-carousel .word,
.services__title,
.section-title,
.cform__title {
  -webkit-text-stroke: 0.6px currentColor;
}

/* LIGHT — numbers, labels, small decorative */
.services__counter,
.card__num,
.stats-ticker__num,
.process__step-num,
.seo-card__num,
.blog__card-num {
  letter-spacing: 0.06em;
}

html { scroll-behavior: smooth; }
body { background: var(--dark); overflow-x: hidden; color: var(--white); }

/* ══════════════════════════════════════
   PAGE TRANSITION OVERLAY
   ══════════════════════════════════════ */
.page-transition {
  position: fixed; inset: 0; z-index: 9999;
  pointer-events: none;
  display: flex;
}
.page-transition .col {
  flex: 1;
  background: var(--dark);
  transform: scaleY(0);
  transform-origin: bottom;
}

/* ══════════════════════════════════════
   SECTION MORPH ANIMATIONS
   ══════════════════════════════════════ */
.morph-section {
  position: relative; z-index: 1;
  opacity: 1 !important;
  transform: none !important;
}
.morph-section.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Scroll Reveal System ── */
.reveal {
  opacity: 1 !important; transform: none !important;
  transition: opacity 0.8s cubic-bezier(0.16,1,0.3,1),
              transform 0.8s cubic-bezier(0.16,1,0.3,1),
              filter 0.8s cubic-bezier(0.16,1,0.3,1);
}
.reveal.visible { opacity: 1; transform: translateY(0) translateX(0) scale(1); filter: blur(0); }

/* Animation variants */
.reveal--left { transform: none !important; }
.reveal--right { transform: none !important; }
.reveal--scale { transform: none !important; }
.reveal--blur { filter: none !important; }
.reveal--zoom { transform: none !important; opacity: 1 !important; }

/* Headings — slide up with slight blur */
.section-title.reveal { transform: none !important; filter: none !important; }
.section-title.reveal.visible { filter: blur(0); }

/* Labels — fade left */
.section-label.reveal { transform: none !important; opacity: 1 !important; }

/* Buttons — scale pop */
.card__explore.reveal,
.cform__submit.reveal,
.gallery__panel-link.reveal { transform: none !important; }

/* Stagger children */
.stagger { 
  opacity: 1 !important; transform: none !important;
  transition: opacity 0.7s cubic-bezier(0.16,1,0.3,1), transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.morph-section.visible .stagger,
.stagger.visible { opacity: 1; transform: translateY(0); }
.morph-section.visible .stagger:nth-child(1), .stagger-1.visible { transition-delay: 0.08s; }
.morph-section.visible .stagger:nth-child(2), .stagger-2.visible { transition-delay: 0.16s; }
.morph-section.visible .stagger:nth-child(3), .stagger-3.visible { transition-delay: 0.24s; }
.morph-section.visible .stagger:nth-child(4), .stagger-4.visible { transition-delay: 0.32s; }
.morph-section.visible .stagger:nth-child(5), .stagger-5.visible { transition-delay: 0.40s; }
.morph-section.visible .stagger:nth-child(6), .stagger-6.visible { transition-delay: 0.48s; }
.morph-section.visible .stagger:nth-child(7), .stagger-7.visible { transition-delay: 0.56s; }
.morph-section.visible .stagger:nth-child(8), .stagger-8.visible { transition-delay: 0.64s; }
.morph-section.visible .stagger:nth-child(9) { transition-delay: 0.72s; }
.morph-section.visible .stagger:nth-child(10) { transition-delay: 0.80s; }
.morph-section.visible .stagger:nth-child(11) { transition-delay: 0.88s; }
.morph-section.visible .stagger:nth-child(12) { transition-delay: 0.96s; }

/* Card hover lift — only after reveal */
.card.visible, .seo-card.visible, .blog__card.visible {
  transition: opacity 0.7s, transform 0.7s, background 0.4s, box-shadow 0.4s;
}
.card.visible:hover { transform: translateY(-3px); }

/* FAQ items slide in from left */
.faq__item.reveal { transform: translateX(-20px); }

/* Review cards */
.review-card.reveal { transform: translateY(20px) scale(0.97); }

/* Contact card */
.contact__card.reveal { transform: translateX(30px); filter: blur(2px); }
.contact__card.reveal.visible { filter: blur(0); }

/* Stats ticker */
.stats-ticker.reveal { transform: translateY(15px); opacity: 0; }

/* Process steps */
.process.reveal { transform: translateY(20px); }

/* ══════════════════════════════════════
   HERO SECTION
   ══════════════════════════════════════ */
.hero {
  position: relative; width: 100%; height: 100vh;
  min-height: 600px; overflow: hidden; background: #080808;
}
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg video, .hero__bg img { width: 100%; height: 100%; object-fit: cover; display: none; }
.hero__overlay {
  position: absolute; inset: 0;
  background: transparent;
  z-index: 1;
}
.hero__content {
  position: relative; z-index: 2;
  display: flex; flex-direction: column; justify-content: space-between;
  height: 100%; padding: 2.5rem 3.5rem 3.5rem;
}
.hero__top { display: flex; justify-content: space-between; align-items: flex-start; }
/* Side labels — always visible */
.hero__dots__beam {
  position: absolute; right: 4px;
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 8px 2px rgba(212,168,83,0.4);
  opacity: 0; pointer-events: none;
  transition: top 0.6s cubic-bezier(0.25,0.1,0.25,1), opacity 0.3s;
}
.hero__dots__beam.moving { opacity: 1; }
.hero__dot {
  width: 10px; height: 10px; border-radius: 50%;
  cursor: pointer;
  transition: background 0.3s, transform 0.3s, box-shadow 0.3s;
  position: relative; display: flex; align-items: center;
}
.hero__dot:nth-child(1) { background: rgba(230,210,170,0.15); }
.hero__dot:nth-child(2) { background: rgba(224,191,149,0.15); }
.hero__dot:nth-child(3) { background: rgba(219,172,128,0.15); }
.hero__dot:nth-child(4) { background: rgba(213,153,108,0.16); }
.hero__dot:nth-child(5) { background: rgba(207,133,87,0.16); }
.hero__dot:nth-child(6) { background: rgba(202,114,66,0.17); }
.hero__dot:nth-child(7) { background: rgba(196,95,45,0.18); }
.hero__dot:nth-child(8) { background: rgba(196,95,45,0.18); }
.hero__dot-label {
  position: absolute; right: 22px; top: 50%; transform: translateY(-50%);
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 400;
  letter-spacing: 0.05em;
  white-space: nowrap; text-decoration: none;
  padding: 0.3rem 0.8rem;
  transition: color 0.3s, text-shadow 0.3s;
}
/* Gradient: subtle white → gold → red (top to bottom) */
.hero__dot:nth-child(1) .hero__dot-label { color: rgba(230,210,170,0.2); }
.hero__dot:nth-child(2) .hero__dot-label { color: rgba(224,191,149,0.2); }
.hero__dot:nth-child(3) .hero__dot-label { color: rgba(219,172,128,0.22); }
.hero__dot:nth-child(4) .hero__dot-label { color: rgba(213,153,108,0.24); }
.hero__dot:nth-child(5) .hero__dot-label { color: rgba(207,133,87,0.26); }
.hero__dot:nth-child(6) .hero__dot-label { color: rgba(202,114,66,0.28); }
.hero__dot:nth-child(7) .hero__dot-label { color: rgba(196,95,45,0.3); }
.hero__dot:nth-child(8) .hero__dot-label { color: rgba(196,95,45,0.3); }
.hero__dot-label:hover {
  color: rgba(255,255,255,0.5);
}

/* Active state — dot + label glow */
.hero__dot--active { box-shadow: 0 0 12px rgba(212,168,83,0.5); }
.hero__dot:nth-child(1).hero__dot--active { background: rgba(230,210,170,0.6); }
.hero__dot:nth-child(2).hero__dot--active { background: rgba(224,191,149,0.62); }
.hero__dot:nth-child(3).hero__dot--active { background: rgba(219,172,128,0.64); }
.hero__dot:nth-child(4).hero__dot--active { background: rgba(213,153,108,0.65); }
.hero__dot:nth-child(5).hero__dot--active { background: rgba(207,133,87,0.67); }
.hero__dot:nth-child(6).hero__dot--active { background: rgba(202,114,66,0.68); }
.hero__dot:nth-child(7).hero__dot--active { background: rgba(196,95,45,0.7); box-shadow: 0 0 10px rgba(196,95,45,0.3); }
.hero__dot:nth-child(8).hero__dot--active { background: rgba(196,95,45,0.7); box-shadow: 0 0 10px rgba(196,95,45,0.3); }

.hero__dot--active .hero__dot-label {
  text-shadow: 0 0 4px rgba(212,168,83,0.1);
}
.hero__dot:nth-child(1).hero__dot--active .hero__dot-label { color: rgba(230,210,170,0.55); }
.hero__dot:nth-child(2).hero__dot--active .hero__dot-label { color: rgba(224,191,149,0.55); }
.hero__dot:nth-child(3).hero__dot--active .hero__dot-label { color: rgba(219,172,128,0.55); }
.hero__dot:nth-child(4).hero__dot--active .hero__dot-label { color: rgba(213,153,108,0.55); }
.hero__dot:nth-child(5).hero__dot--active .hero__dot-label { color: rgba(207,133,87,0.55); }
.hero__dot:nth-child(6).hero__dot--active .hero__dot-label { color: rgba(202,114,66,0.55); }
.hero__dot:nth-child(7).hero__dot--active .hero__dot-label { color: rgba(196,95,45,0.6); text-shadow: 0 0 4px rgba(196,95,45,0.1); }
.hero__dot:nth-child(8).hero__dot--active .hero__dot-label { color: rgba(196,95,45,0.6); text-shadow: 0 0 4px rgba(196,95,45,0.1); }
.hero__dot--active .hero__dot-label.pulse {
  animation: labelPulse 1.2s ease-in-out;
}
@keyframes labelPulse {
  0%   { transform: translateY(-50%) scale(1); }
  40%  { transform: translateY(-50%) scale(1.02); }
  100% { transform: translateY(-50%) scale(1); }
}

/* Close dot — not needed */

.hero__dot.dot-pulse { animation: dotGrow 3s ease-out forwards; }
@keyframes dotGrow {
  0%   { transform: scale(1); }
  15%  { transform: scale(1.15); }
  100% { transform: scale(1); }
}
.hero__dot:hover { background: rgba(255,255,255,0.35); }

/* KVKK Cookie Notice */
.kvkk {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 300;
  background: rgba(12,12,12,0.95); backdrop-filter: blur(12px);
  border-top: 1px solid rgba(255,255,255,0.04);
  padding: 1.2rem 2rem; display: flex; align-items: center; justify-content: center;
  gap: 1.5rem; flex-wrap: wrap;
  transform: translateY(100%); transition: transform 0.5s cubic-bezier(0.25,0.1,0.25,1);
}
.kvkk.show { transform: translateY(0); }
.kvkk__text {
  font-family: var(--font-body); font-size: 0.65rem; font-weight: 300;
  color: rgba(255,255,255,0.35); max-width: 500px; line-height: 1.5;
}
.kvkk__btn {
  padding: 0.5rem 1.5rem; background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.08); color: rgba(255,255,255,0.6);
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 600;
  letter-spacing: 0.08em; cursor: pointer; transition: all 0.3s;
}
.kvkk__btn:hover { background: rgba(255,255,255,0.1); color: var(--white); }
.hero__logo {
  position: fixed; top: 1.5rem; right: 3.5rem; z-index: 130;
  opacity: 0; animation: fadeIn 1s 0.3s forwards;
}
.hero__logo img {
  height: 52px; width: auto;
  opacity: 0.7;
  transition: opacity 0.3s;
}
.hero__logo:hover img { opacity: 1; }

.ig-fixed {
  position: fixed; top: 1.8rem; left: 3.5rem; z-index: 130;
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 10px;
  background: linear-gradient(135deg, rgba(131,58,180,0.15), rgba(8,8,8,0.6));
  border: 1px solid rgba(131,58,180,0.2);
  backdrop-filter: blur(12px);
  text-decoration: none; cursor: pointer;
  transition: all 0.3s ease-out;
  opacity: 0; animation: fadeIn 1s 1s forwards;
  overflow: hidden;
}
.ig-fixed::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(253,29,29,0.15), transparent);
  transform: translateX(-100%);
  transition: transform 0.7s ease-out;
}
.ig-fixed:hover::before { transform: translateX(100%); }
.ig-fixed svg { position: relative; z-index: 2; width: 18px; height: 18px; color: rgba(255,255,255,0.7); stroke: rgba(255,255,255,0.7); transition: color 0.3s; }
.ig-fixed:hover svg { color: #fff; stroke: #fff; }
.ig-fixed:hover {
  transform: scale(1.12) rotate(2deg);
  border-color: rgba(131,58,180,0.5);
  background: linear-gradient(135deg, rgba(131,58,180,0.2), rgba(8,8,8,0.5));
  box-shadow: 0 4px 20px rgba(131,58,180,0.25), 0 0 30px rgba(253,29,29,0.1);
}
.ig-fixed:active { transform: scale(0.95) rotate(0deg); }
.hero__main {
  flex: 1; display: flex; flex-direction: column;
  justify-content: center; align-items: center; gap: 1.8rem;
}
.hero__subtitle {
  font-family: var(--font-script); font-size: clamp(2.8rem, 6vw, 5.5rem);
  font-weight: 600; letter-spacing: 0.02em;
  background: linear-gradient(90deg, var(--accent-deep), var(--accent-red));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  text-align: center; width: 100%; opacity: 1;
}
.hero__heading {
  font-family: var(--font-display); font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  width: 100%;
}
.hero__word-carousel {
  position: relative; width: 100%; text-align: center;
  height: 0; overflow: hidden; opacity: 0;
}
.hero__word-carousel .word {
  position: absolute; left: 0; right: 0; top: 0;
  text-align: center;
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  letter-spacing: 0.15em; text-transform: uppercase;
  opacity: 0; transform: translateY(30px);
  transition: transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.4s ease;
}
.hero__word-carousel .word.above {
  transform: translateY(-30px); opacity: 0;
}
.hero__word-carousel .word.active {
  transform: translateY(0); opacity: 1;
}
.hero__word-carousel .word:nth-child(1) { color: var(--accent-pale); }
.hero__word-carousel .word:nth-child(2) { color: var(--accent); }
.hero__word-carousel .word:nth-child(3) { color: var(--accent-deep); }
.hero__desc {
  font-family: var(--font-body); font-size: clamp(0.9rem, 1.2vw, 1.05rem);
  font-weight: 300; line-height: 1.7; color: var(--gray);
  max-width: 520px; text-align: center;
  opacity: 1;
}
@keyframes revealCenter {
  to { clip-path: inset(0 0% 0 0%); opacity: 1; }
}
.hero__cta {
  position: fixed; left: 3.5rem; bottom: 8%; transform: none;
  z-index: 100;
  display: flex; flex-direction: column; align-items: center;
  font-family: var(--font-body); font-size: 0.45rem; font-weight: 600;
  color: rgba(212,168,83,0.35); text-decoration: none; cursor: pointer;
  letter-spacing: 0.15em; text-transform: uppercase;
  opacity: 0; animation: fadeIn 0.6s 2.2s forwards, ctaFloat 3s ease-in-out 3s infinite;
  transition: color 0.3s, opacity 2s ease-in-out;
}
.hero__cta--hidden { opacity: 0 !important; pointer-events: none; }
.hero__cta--clicked {
  opacity: 0 !important; pointer-events: none;
  transition: opacity 2s ease-in-out !important;
}
@keyframes ctaFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-4px)} }
.hero__cta-letters {
  display: flex; flex-direction: column; align-items: center;
  gap: 10px;
}
.hero__cta-stem {
  width: 2px; height: 20px; background: rgba(212,168,83,0.35);
  margin-top: -6px; margin-left: -1px;
  transition: height 0.4s ease;
}
.hero__cta-arrow {
  width: 0; height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 7px solid rgba(212,168,83,0.35);
  margin-top: -1px; margin-left: -1px;
}
.hero__cta:hover { color: var(--accent-pale); }
.hero__cta:hover .hero__cta-stem { height: 30px; background: var(--accent-pale); }
.hero__cta:hover .hero__cta-arrow { border-top-color: var(--accent-pale); }
.hero__scroll {
  font-family: var(--font-body); font-size: 0.7rem;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gray); writing-mode: vertical-rl;
  display: flex; align-items: center; gap: 8px;
}
.hero__scroll::after {
  content: ''; width: 1px; height: 40px;
  background: var(--accent); animation: scrollPulse 2s infinite;
}
/* Craft quote — hero only */
.craft-quote {
  position: absolute; top: 48%; left: 49%; transform: translate(-50%, -50%);
  z-index: 90; text-align: center;
  max-width: 380px;
  font-family: var(--font-body); font-size: 0.8rem; font-weight: 300;
  color: rgba(255,255,255,0.3);
  line-height: 1.8; letter-spacing: 0.03em;
  transition: opacity 2s ease-in-out;
}
.craft-quote--hidden { opacity: 0 !important; pointer-events: none; }
.craft-quote--vapor .cq-part,
.craft-quote--vapor .cq-part--3 { opacity: 0; }
.craft-quote--vapor .cq-vapor { opacity: 1; }
.cq-vapor {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none; opacity: 0;
}
.cq-part { display: inline; }
.cq-part--1 { padding-left: 0.8em; }
.lamp-bg--fade {
  animation: lampFadeOut 3.1s ease-in-out forwards;
}
@keyframes lampFadeOut {
  0%   { opacity: 1; }
  60%  { opacity: 0.4; }
  100% { opacity: 0; }
}
/* Trust badge */
.trust-badge {
  position: fixed; bottom: 2rem; left: 50%; transform: translateX(-50%);
  z-index: 90;
  display: inline-flex; align-items: center;
  background: rgba(8,8,8,0.6); border: 1px solid rgba(255,255,255,0.04);
  backdrop-filter: blur(10px);
  border-radius: 50px; padding: 0.3rem 0.8rem 0.3rem 0.3rem;
  gap: 0.5rem;
  opacity: 0; animation: fadeIn 0.8s 3s forwards;
}
.trust-badge__avatars {
  display: flex;
}
.trust-badge__avatars img {
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid rgba(8,8,8,0.8);
  object-fit: cover;
  margin-left: -6px;
}
.trust-badge__avatars img:first-child { margin-left: 0; }
.trust-badge__text {
  font-family: var(--font-body); font-size: 0.55rem; font-weight: 400;
  color: rgba(255,255,255,0.3); letter-spacing: 0.02em; white-space: nowrap;
}
.trust-badge__text strong {
  font-weight: 600; color: rgba(212,168,83,0.5);
}
.trust-badge__star {
  color: rgba(212,168,83,0.6); font-size: 0.5rem;
}
.craft-quote__cycle {
  display: inline-block; position: relative;
  min-width: 3.5em; height: 2em;
  vertical-align: baseline;
}
.craft-quote__cycle .cw {
  position: absolute; left: 3px; right: 0; bottom: -8px; text-align: left;
  font-weight: 500;
  background: linear-gradient(90deg, var(--accent-deep), var(--accent-red));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  opacity: 0; transform: translateY(1.2em) rotateX(-40deg);
  transform-origin: center top;
  transition: transform 0.5s cubic-bezier(0.25, 0.1, 0.25, 1), opacity 0.3s ease;
}
.craft-quote__cycle .cw.active {
  opacity: 1; transform: translateY(0) rotateX(0deg);
}
.craft-quote__cycle .cw.above {
  opacity: 0; transform: translateY(-1.2em) rotateX(40deg);
  transform-origin: center bottom;
}

/* International notice */
.hero__intl {
  position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 0.7rem;
  padding: 0.65rem 1.3rem;
  background: rgba(184,134,45,0.03);
  border: 1px solid rgba(184,134,45,0.08);
  border-radius: 2px; white-space: nowrap;
  opacity: 0; animation: fadeIn 1s 2.5s forwards;
}
.hero__intl svg {
  width: 15px; height: 15px; flex-shrink: 0;
  color: var(--accent-deep); opacity: 0.5;
}
.hero__intl span {
  font-family: var(--font-body); font-size: 0.62rem; font-weight: 400;
  letter-spacing: 0.03em; color: rgba(255,255,255,0.35);
}
.hero__intl-tag {
  font-family: var(--font-body); font-size: 0.55rem; font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--accent-red); opacity: 0.6;
  margin-left: 0.2rem;
}

/* ══════════════════════════════════════
   DOT NAV
   ══════════════════════════════════════ */
.hero__dots {
  position: fixed; right: 3.5rem; top: 50%; transform: translateY(-50%);
  display: flex; flex-direction: column; gap: 28px; z-index: 100;
  opacity: 0; animation: fadeIn 1s 1.3s forwards;
}
/* ══════════════════════════════════════
   SERVICES SECTION
   ══════════════════════════════════════ */
.services {
  position: relative; min-height: 100vh;
  background: var(--dark2); padding: 10rem 5rem 8rem;
  overflow: hidden;
}

/* 3D ambient background — digital mesh */
.services__room {
  position: absolute; inset: 0; z-index: 0;
  overflow: hidden;
}
.services__room-inner {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 30%, rgba(212,168,83,0.02) 0%, transparent 60%);
}

/* ── Vertical rain columns (dashed segments) ── */
.services__rain {
  position: absolute; inset: 0; overflow: hidden;
}
.services__rain-col {
  position: absolute; top: -100%; width: 1.5px; height: 200%;
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 4px,
    rgba(212,168,83,0.18) 4px, rgba(212,168,83,0.18) 14px,
    transparent 14px, transparent 20px
  );
  animation: rainDrop linear infinite;
}
.services__rain-col:nth-child(1)  { left: 3%;  animation-duration: 10s; }
.services__rain-col:nth-child(2)  { left: 7%;  animation-duration: 14s; animation-delay: -3s; }
.services__rain-col:nth-child(3)  { left: 11%; animation-duration: 11s; animation-delay: -7s; }
.services__rain-col:nth-child(4)  { left: 15%; animation-duration: 16s; animation-delay: -2s; }
.services__rain-col:nth-child(5)  { left: 19%; animation-duration: 12s; animation-delay: -9s; }
.services__rain-col:nth-child(6)  { left: 23%; animation-duration: 18s; animation-delay: -5s; }
.services__rain-col:nth-child(7)  { left: 27%; animation-duration: 13s; animation-delay: -11s; }
.services__rain-col:nth-child(8)  { left: 73%; animation-duration: 15s; animation-delay: -1s; }
.services__rain-col:nth-child(9)  { left: 77%; animation-duration: 11s; animation-delay: -6s; }
.services__rain-col:nth-child(10) { left: 81%; animation-duration: 17s; animation-delay: -4s; }
.services__rain-col:nth-child(11) { left: 85%; animation-duration: 12s; animation-delay: -8s; }
.services__rain-col:nth-child(12) { left: 89%; animation-duration: 14s; animation-delay: -10s; }
.services__rain-col:nth-child(13) { left: 93%; animation-duration: 16s; animation-delay: -3s; }
.services__rain-col:nth-child(14) { left: 97%; animation-duration: 11s; animation-delay: -7s; }
/* Red-tinted columns */
.services__rain-col:nth-child(3),
.services__rain-col:nth-child(6),
.services__rain-col:nth-child(9),
.services__rain-col:nth-child(12) {
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 5px,
    rgba(204,30,30,0.13) 5px, rgba(204,30,30,0.13) 15px,
    transparent 15px, transparent 22px
  );
}
@keyframes rainDrop {
  0%   { transform: translateY(-50%); }
  100% { transform: translateY(0%); }
}

/* ── Horizontal sweep lines ── */
.services__sweep {
  position: absolute; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.2), rgba(204,30,30,0.12), transparent);
  animation: sweepH linear infinite;
}
.services__sweep--1 { top: 15%; left: -40%; width: 40%; animation-duration: 7s; }
.services__sweep--2 { top: 42%; left: -30%; width: 30%; animation-duration: 11s; animation-delay: -4s; }
.services__sweep--3 { top: 68%; left: -35%; width: 35%; animation-duration: 9s; animation-delay: -6s; }
.services__sweep--4 { top: 88%; left: -25%; width: 45%; animation-duration: 13s; animation-delay: -2s; }
.services__sweep--5 { top: 30%; left: -20%; width: 25%; animation-duration: 15s; animation-delay: -8s; }
@keyframes sweepH {
  0%   { left: -45%; }
  100% { left: 110%; }
}

/* ── Corner brackets (circuit-board decoration) ── */
.services__bracket {
  position: absolute; width: 50px; height: 50px;
  border: 1px solid rgba(212,168,83,0.12);
  pointer-events: none;
  animation: bracketPulse 6s ease-in-out infinite;
}
.services__bracket--tl { top: 8%; left: 6%; border-right: none; border-bottom: none; }
.services__bracket--tr { top: 8%; right: 6%; border-left: none; border-bottom: none; animation-delay: -1.5s; }
.services__bracket--bl { bottom: 12%; left: 6%; border-right: none; border-top: none; animation-delay: -3s; }
.services__bracket--br { bottom: 12%; right: 6%; border-left: none; border-top: none; animation-delay: -4.5s; }
/* Inner brackets — smaller, offset */
.services__bracket--inner1 { top: 15%; left: 12%; width: 24px; height: 24px; border-right: none; border-bottom: none; border-color: rgba(204,30,30,0.06); animation-delay: -2s; }
.services__bracket--inner2 { bottom: 18%; right: 12%; width: 24px; height: 24px; border-left: none; border-top: none; border-color: rgba(204,30,30,0.06); animation-delay: -5s; }
@keyframes bracketPulse {
  0%, 100% { opacity: 0.4; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}

/* ── Center depth rectangles ── */
.services__depth {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  pointer-events: none;
}
.services__depth-rect {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  border: 1px solid rgba(212,168,83,0.035);
  animation: depthPulse 10s ease-in-out infinite;
}
.services__depth-rect:nth-child(1) { width: 500px; height: 300px; animation-delay: 0s; }
.services__depth-rect:nth-child(2) { width: 400px; height: 240px; animation-delay: -2s; border-color: rgba(204,30,30,0.03); }
.services__depth-rect:nth-child(3) { width: 300px; height: 180px; animation-delay: -4s; }
.services__depth-rect:nth-child(4) { width: 200px; height: 120px; animation-delay: -6s; border-color: rgba(204,30,30,0.03); }
@keyframes depthPulse {
  0%, 100% { opacity: 0.5; transform: translate(-50%, -50%) scale(1); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.04); }
}

/* ── Floating dots ── */
.services__dot {
  position: absolute; width: 2px; height: 2px; border-radius: 50%;
  background: rgba(212,168,83,0.25); pointer-events: none;
}
.services__dot--1 { top: 20%; left: 18%; animation: dotFloat 8s ease-in-out infinite; }
.services__dot--2 { top: 55%; left: 78%; animation: dotFloat 11s ease-in-out infinite -3s; }
.services__dot--3 { top: 75%; left: 30%; animation: dotFloat 9s ease-in-out infinite -6s; }
.services__dot--4 { top: 30%; left: 60%; animation: dotFloat 13s ease-in-out infinite -2s; background: rgba(204,30,30,0.2); }
.services__dot--5 { top: 65%; left: 90%; animation: dotFloat 10s ease-in-out infinite -8s; }
@keyframes dotFloat {
  0%, 100% { opacity: 0; transform: translateY(0); }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { opacity: 0; transform: translateY(-30px); }
}

.services__header {
  position: relative; z-index: 1;
  text-align: left; margin-bottom: 6rem;
  max-width: 1200px; margin-left: auto; margin-right: auto;
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 2rem;
}
.services__header-left { flex: 1; }
.services__counter {
  font-family: var(--font-display); font-size: clamp(6rem, 14vw, 12rem);
  font-weight: 900; color: rgba(212,168,83,0.03);
  position: absolute; top: -5rem; right: 0; z-index: 0;
  letter-spacing: -0.04em; line-height: 0.8;
  user-select: none;
}
.services__label {
  font-family: var(--font-body); font-size: 0.6rem;
  letter-spacing: 0.35em; text-transform: uppercase;
  background: var(--gradient); -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; background-clip: text;
  margin-bottom: 1.5rem; display: block;
}
.social-proof {
  display: inline-flex; align-items: center; gap: 0.5rem;
  margin-bottom: 1.5rem; position: relative; z-index: 1;
}
.social-proof__dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: #25d366;
  animation: proofPulse 2s ease-in-out infinite;
}
@keyframes proofPulse { 0%,100%{opacity:0.4;box-shadow:0 0 0 rgba(37,211,102,0)} 50%{opacity:1;box-shadow:0 0 8px rgba(37,211,102,0.3)} }
.social-proof__text {
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 300;
  color: rgba(255,255,255,0.2); letter-spacing: 0.03em;
}
.social-proof__text strong {
  font-weight: 600; color: rgba(255,255,255,0.4);
}
.services__title {
  font-family: var(--font-display); font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  font-weight: 700; color: var(--white); line-height: 1.08;
  letter-spacing: -0.01em;
}
.services__subtitle {
  font-family: var(--font-body); font-size: 0.88rem; font-weight: 300;
  color: rgba(255,255,255,0.3); max-width: 320px;
  line-height: 1.7; text-align: right;
}

/* ── Asymmetric Card Grid ── */
.cards-main {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 1px;
  max-width: 1200px; margin: 0 auto 6rem;
  background: rgba(255,255,255,0.03);
}
/* First row: 3 cards */
/* Second row: 2 cards spanning */

.card {
  position: relative; padding: 3rem 2.5rem 2.5rem;
  background: var(--dark2);
  border: none; cursor: pointer;
  overflow: hidden;
  transition: background 0.8s cubic-bezier(0.25,0.1,0.25,1);
}
.card::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: 0; height: 1px;
  background: var(--gradient);
  transition: width 0.8s cubic-bezier(0.25,0.1,0.25,1);
}
.card:hover::before { width: 100%; }
.card:hover {
  background: rgba(255,255,255,0.02);
}

/* Remove old reflection */
.card::after { display: none; }

.card__num {
  font-family: var(--font-display); font-size: 0.7rem; font-weight: 400;
  color: rgba(255,255,255,0.12);
  letter-spacing: 0.05em;
  margin-bottom: 2.5rem;
  transition: color 0.6s;
}
.card:hover .card__num { color: var(--accent-red); }

.card__icon {
  width: 32px; height: 32px; margin-bottom: 1.8rem;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,0.06); border-radius: 0;
  color: rgba(255,255,255,0.25); transition: all 0.6s;
}
.card:hover .card__icon {
  border-color: rgba(204,30,30,0.2);
  color: var(--accent-red);
}
.card__icon svg { width: 15px; height: 15px; }

.card__title {
  font-family: var(--font-display); font-size: clamp(1.15rem, 1.5vw, 1.35rem);
  font-weight: 700;
  color: var(--white); margin-bottom: 1rem;
  letter-spacing: -0.01em; line-height: 1.2;
  transition: color 0.5s;
}
.card__title a { color: inherit; text-decoration: none; -webkit-text-fill-color: inherit; }
.card__title a:hover { color: var(--accent); }
.card:hover .card__title,
.card:hover .card__title a {
  background: var(--gradient); -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; background-clip: text;
}

.card__desc {
  font-family: var(--font-body); font-size: 0.8rem; font-weight: 300;
  color: rgba(255,255,255,0.28); line-height: 1.75;
  max-width: 300px;
  transition: color 0.5s;
}
.card:hover .card__desc { color: rgba(255,255,255,0.45); }

.card__explore {
  position: relative; display: inline-flex; align-items: center; gap: 0.5rem;
  margin-top: 2rem; font-family: var(--font-body); font-size: 0.65rem;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--accent-deep); text-decoration: none;
  padding: 0.6em 1.4em;
  border: 1px solid rgba(212,168,83,0.2);
  border-radius: 0.3em;
  background-color: transparent;
  opacity: 0; transform: translateX(-8px);
  transition: opacity 0.5s 0.1s, transform 0.5s 0.1s, color 0.3s, box-shadow 1s, border-color 0.5s;
  overflow: hidden;
}
.card__explore::before {
  content: ""; position: absolute; top: 80%; left: 3%;
  width: 95%; height: 40%;
  background-color: #0c0c0c;
  transition: transform 0.5s; transform-origin: center;
}
.card__explore::after {
  content: ""; position: absolute; top: -10px; left: 3%;
  width: 95%; height: 40%;
  background-color: #0c0c0c;
  transition: transform 0.5s; transform-origin: center;
}
.card__explore:hover::before,
.card__explore:hover::after { transform: scale(0); }
.card__explore:hover {
  box-shadow: inset 0 0 20px rgba(212,168,83,0.15);
  border-color: var(--accent);
  color: var(--white);
}
.card:hover .card__explore { opacity: 1; transform: translateX(0); }
.card__explore svg { position: relative; z-index: 2; width: 12px; height: 12px; stroke: currentColor; }
.card__explore span { position: relative; z-index: 2; }

/* ══════════════════════════════════════
   STATS TICKER
   ══════════════════════════════════════ */
.stats-ticker {
  position: relative; z-index: 1;
  max-width: 100%; margin: 0 0 5rem;
  overflow: hidden;
  border-top: 1px solid rgba(255,255,255,0.03);
  border-bottom: 1px solid rgba(255,255,255,0.03);
  padding: 2.5rem 0;
}
.stats-ticker__track {
  display: flex; align-items: center;
  gap: clamp(4rem, 10vw, 8rem);
  animation: tickerScroll 20s linear infinite;
  width: max-content;
}
.stats-ticker__item {
  display: flex; align-items: baseline; gap: 0.8rem;
  white-space: nowrap; flex-shrink: 0;
}
.stats-ticker__num {
  font-family: var(--font-display); font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 700; letter-spacing: -0.02em;
  background: var(--gradient); -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; background-clip: text;
  opacity: 0.5;
}
.stats-ticker__label {
  font-family: var(--font-body); font-size: 0.65rem;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(255,255,255,0.2);
}
.stats-ticker__dot {
  width: 4px; height: 4px; border-radius: 50%;
  background: rgba(255,255,255,0.08); flex-shrink: 0;
}

@keyframes tickerScroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ══════════════════════════════════════
   PROCESS STEPS
   ══════════════════════════════════════ */
.process {
  position: relative; z-index: 1;
  max-width: 1200px; margin: 0 auto 5rem;
}
.process__header {
  display: flex; align-items: center; gap: 1.5rem;
  margin-bottom: 3rem;
}
.process__line {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(204,30,30,0.15), rgba(184,134,45,0.15), transparent);
}
.process__label {
  font-family: var(--font-body); font-size: 0.65rem;
  letter-spacing: 0.3em; text-transform: uppercase; color: var(--gray);
  white-space: nowrap;
}
.process__steps {
  display: flex; align-items: flex-start; justify-content: center;
  position: relative;
}

/* Step */
.process__step {
  text-align: center; padding: 0 0.5rem;
  flex: 0 0 auto; width: 160px;
}
.process__step-num {
  width: 56px; height: 56px; margin: 0 auto 1.2rem;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: 1.1rem; font-weight: 700;
  color: rgba(255,255,255,0.4);
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  position: relative; z-index: 2;
  transition: all 0.8s cubic-bezier(0.25,0.1,0.25,1);
}

/* Active state */
.process__step-num.step-active {
  color: var(--white);
  background: linear-gradient(135deg, rgba(184,134,45,0.2), rgba(204,30,30,0.2));
  border-color: rgba(204,30,30,0.35);
  box-shadow: 0 0 30px rgba(204,30,30,0.15), 0 0 60px rgba(184,134,45,0.05);
}

/* Ripple ring */
.process__step-num::before {
  content: ''; position: absolute; inset: -6px;
  border-radius: 50%; border: 1px solid rgba(204,30,30,0.3);
  opacity: 0; transform: scale(0.8);
  transition: all 0.6s;
}
.process__step-num.step-active::before {
  animation: stepRipple 2s ease-out infinite;
}
@keyframes stepRipple {
  0%   { opacity: 0.4; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.6); }
}

/* Second ripple ring */
.process__step-num::after {
  content: ''; position: absolute; inset: -3px;
  border-radius: 50%; border: 1px solid rgba(184,134,45,0.2);
  opacity: 0;
}
.process__step-num.step-active::after {
  animation: stepRipple 2s 0.5s ease-out infinite;
}

.process__step-title {
  font-family: var(--font-display); font-size: 1rem; font-weight: 700;
  color: rgba(255,255,255,0.35); margin-bottom: 0.4rem;
  transition: all 0.8s;
}
.process__step.step-done .process__step-title { color: var(--white); }
.process__step-desc {
  font-family: var(--font-body); font-size: 0.75rem; font-weight: 300;
  color: rgba(255,255,255,0.15); line-height: 1.5;
  transition: all 0.8s;
}
.process__step.step-done .process__step-desc { color: var(--gray); }

/* ── Connecting Lines ── */
.process__connector {
  flex: 1; height: 56px; display: flex; align-items: center;
  position: relative; min-width: 60px;
}
.process__connector-line {
  width: 100%; height: 2px; position: relative;
  background: rgba(255,255,255,0.04); border-radius: 1px;
  overflow: hidden;
}

/* Fill animation */
.process__connector-line::before {
  content: ''; position: absolute; inset: 0;
  background: var(--gradient);
  transform: scaleX(0); transform-origin: left;
  transition: transform 1.2s cubic-bezier(0.25,0.1,0.25,1);
  border-radius: 1px;
}
.process__connector.line-active .process__connector-line::before {
  transform: scaleX(1);
}

/* Traveling particle */
.process__connector-line::after {
  content: ''; position: absolute; top: -3px;
  width: 8px; height: 8px; border-radius: 50%;
  background: radial-gradient(circle, rgba(204,30,30,0.8), rgba(184,134,45,0.6));
  box-shadow: 0 0 12px rgba(204,30,30,0.5), 0 0 25px rgba(184,134,45,0.3);
  opacity: 0; left: -8px;
}
.process__connector.line-active .process__connector-line::after {
  animation: particleTravel 1.2s cubic-bezier(0.25,0.1,0.25,1) forwards;
}
@keyframes particleTravel {
  0%   { left: -8px; opacity: 0; }
  10%  { opacity: 1; }
  85%  { opacity: 1; }
  100% { left: calc(100% + 8px); opacity: 0; }
}

/* Spark burst at connector midpoint */
.process__connector-spark {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 0; height: 0; opacity: 0;
}
.process__connector.line-active .process__connector-spark {
  animation: sparkBurst 0.6s 0.6s ease-out forwards;
}
@keyframes sparkBurst {
  0%   { width: 0; height: 0; opacity: 0;
         box-shadow: 0 0 0 rgba(204,30,30,0); }
  50%  { width: 4px; height: 4px; opacity: 1;
         box-shadow: 0 0 15px rgba(204,30,30,0.5), 0 0 30px rgba(184,134,45,0.3); }
  100% { width: 0; height: 0; opacity: 0;
         box-shadow: 0 0 0 rgba(204,30,30,0); }
}

@media (max-width: 768px) {
  .stats-ticker__track { gap: 3rem; }
  .process__steps { flex-wrap: wrap; gap: 1.5rem; }
  .process__connector { display: none; }
}

/* ══════════════════════════════════════
   SEO SUB-CARDS — Tüm Göçük Onarım Hizmetleri
   ══════════════════════════════════════ */
.seo-section {
  position: relative; z-index: 1;
  max-width: 1200px; margin: 0 auto;
  padding-top: 4rem;
}
.seo-section__header {
  display: flex; align-items: center; gap: 2.5rem;
  margin-bottom: 4rem;
}
.seo-section__line {
  flex: 1; height: 1px;
  background: rgba(255,255,255,0.03);
}
.seo-section__label {
  font-family: var(--font-body); font-size: 0.65rem; font-weight: 600;
  letter-spacing: 0.35em; text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  white-space: nowrap; position: relative;
  overflow: hidden; padding: 0.3rem 0;
}
/* Light sweep beam */
.seo-section__label::after {
  content: ''; position: absolute;
  top: 0; left: -100%; width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.4), rgba(204,30,30,0.3), transparent);
  filter: blur(4px);
  opacity: 0;
  pointer-events: none;
}
.seo-section__label.sweep::after {
  animation: labelSweep 2.5s cubic-bezier(0.25,0.1,0.25,1) infinite;
}
@keyframes labelSweep {
  0%   { left: -100%; opacity: 0; }
  8%   { opacity: 1; }
  60%  { left: 30%; opacity: 1; }
  75%  { left: 60%; opacity: 0.7; }
  85%  { left: 110%; opacity: 0; }
  100% { left: 110%; opacity: 0; }
}

.seo-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 1px; background: rgba(255,255,255,0.025);
}

.seo-card {
  padding: 2.8rem 2.2rem 2.5rem;
  background: var(--dark2);
  transition: background 0.4s cubic-bezier(0.25,0.1,0.25,1);
  cursor: default; position: relative;
}
.seo-card::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: 0; height: 1px;
  background: var(--gradient);
  transition: width 0.6s cubic-bezier(0.25,0.1,0.25,1);
}
.seo-card:hover::before { width: 100%; }
.seo-card:hover {
  background: rgba(255,255,255,0.012);
}

.seo-card__num {
  font-family: var(--font-display); font-size: 0.6rem; font-weight: 400;
  letter-spacing: 0.05em;
  color: rgba(255,255,255,0.08);
  margin-bottom: 1.5rem;
  transition: color 0.4s;
}
.seo-card:hover .seo-card__num { color: var(--accent-red); }

.seo-card h3 {
  font-family: var(--font-display); font-size: clamp(0.9rem, 1.1vw, 1.05rem);
  font-weight: 700;
  color: rgba(255,255,255,0.55); margin-bottom: 0.8rem;
  letter-spacing: -0.01em; line-height: 1.3;
  transition: color 0.4s;
}
.seo-card:hover h3 { color: rgba(255,255,255,0.9); }

.seo-card p {
  font-family: var(--font-body); font-size: 0.72rem; font-weight: 300;
  color: rgba(255,255,255,0.15); line-height: 1.7;
  transition: color 0.4s;
}
.seo-card:hover p { color: rgba(255,255,255,0.3); }

/* ══════════════════════════════════════
   GALLERY — Interactive Bento Grid
   ══════════════════════════════════════ */
.gallery {
  position: relative; width: 100%; min-height: 100vh;
  background: #040404; overflow: hidden;
  padding: 5rem 2rem; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
}
.gallery__glow {
  position: absolute; width: 45%; height: 50%; top: 25%; left: 27.5%;
  background: radial-gradient(ellipse, rgba(184,134,45,0.04) 0%, rgba(204,30,30,0.02) 40%, transparent 65%);
  filter: blur(80px); pointer-events: none; z-index: 0;
}

.gallery__bento {
  position: relative; z-index: 3;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 80px;
  gap: 8px;
  width: 90%; max-width: 1000px;
}
.gallery__bento-item {
  position: relative; overflow: hidden; border-radius: 12px;
  cursor: pointer;
  opacity: 1; transform: none;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.gallery__bento-item.revealed {
  opacity: 1; transform: translateY(0) scale(1);
}
.gallery__bento-item:hover { z-index: 5; }
.gallery__bento-item img {
  width: 100%; height: 100%; object-fit: cover;
  filter: brightness(0.5) saturate(0.7);
  transition: filter 0.5s, transform 0.5s;
}
.gallery__bento-item:hover img {
  filter: brightness(0.7) saturate(1);
  transform: scale(1.05);
}
.gallery__bento-overlay {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 1rem;
  background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 50%, transparent 100%);
  opacity: 0; transition: opacity 0.3s;
}
.gallery__bento-item:hover .gallery__bento-overlay { opacity: 1; }
.gallery__bento-tag {
  font-family: var(--font-body); font-size: 0.45rem; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--accent-red); margin-bottom: 0.3rem;
}
.gallery__bento-title {
  font-family: var(--font-display); font-size: 0.85rem; font-weight: 700;
  color: var(--white);
}
.gallery__bento-num {
  position: absolute; top: 0.8rem; left: 0.8rem; z-index: 3;
  font-family: var(--font-body); font-size: 0.5rem; font-weight: 400;
  color: rgba(255,255,255,0.08); letter-spacing: 0.1em;
}
/* Bento spans */
.bento-span-1 { grid-column: span 1; grid-row: span 3; }
.bento-span-2 { grid-column: span 2; grid-row: span 2; }
.bento-span-3 { grid-column: span 1; grid-row: span 3; }
.bento-span-4 { grid-column: span 2; grid-row: span 2; }
.bento-span-5 { grid-column: span 2; grid-row: span 3; }

/* Gallery Modal */
.gallery__modal {
  position: fixed; inset: 0; z-index: 9000;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.85); backdrop-filter: blur(12px);
  opacity: 0; visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}
.gallery__modal.open { opacity: 1; visibility: visible; }
.gallery__modal-inner {
  position: relative; max-width: 85vw; max-height: 80vh;
  border-radius: 16px; overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
  transform: scale(0.95) translateY(20px);
  transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1);
}
.gallery__modal.open .gallery__modal-inner {
  transform: scale(1) translateY(0);
}
.gallery__modal-inner img {
  width: 100%; max-height: 80vh; object-fit: contain; display: block;
}
.gallery__modal-info {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 1.5rem;
  background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
}
.gallery__modal-info h3 {
  font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; color: var(--white);
}
.gallery__modal-info p {
  font-family: var(--font-body); font-size: 0.75rem; color: rgba(255,255,255,0.6); margin-top: 0.3rem;
}
.gallery__modal-close {
  position: absolute; top: 1rem; right: 1rem;
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(255,255,255,0.1); border: none;
  color: #fff; font-size: 1rem; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.3s;
}
.gallery__modal-close:hover { background: rgba(255,255,255,0.2); }
.gallery__modal-link {
  display: inline-flex; align-items: center; gap: 0.4rem;
  margin-top: 0.6rem;
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--accent); text-decoration: none;
  transition: color 0.3s;
}
.gallery__modal-link:hover { color: var(--white); }

/* ── Video play ── */
.gallery__panel--video .gallery__play {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 4;
  width: 52px; height: 52px; border-radius: 50%;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(8px); opacity: 0;
  transition: opacity 0.6s 0.5s, background 0.4s, transform 0.4s;
}
.gallery__panel--video .gallery__play svg { width: 16px; height: 16px; color: rgba(255,255,255,0.6); }
.gallery__panel.active .gallery__play { opacity: 1; }
.gallery__panel.active .gallery__play:hover {
  background: rgba(204,30,30,0.25); border-color: rgba(204,30,30,0.35);
  transform: translate(-50%,-50%) scale(1.06);
}
/* Diagonal Ribbon — 3D orbit wrapping around panels */

/* Back layer — passes BEHIND panels */
.gallery__ribbon-back {
  position: absolute; z-index: 1; top: 50%; left: -20%; width: 140%;
  transform: rotate(-15deg) translateY(-50%);
  overflow: visible; pointer-events: none; padding: 0.8rem 0;
}
.gallery__ribbon-back .gallery__ribbon-track {
  display: flex; align-items: center;
  animation: ribbonScroll 25s linear infinite;
  width: max-content; white-space: nowrap;
}

/* Front layer — passes IN FRONT on the edges */
.gallery__ribbon-front {
  position: absolute; z-index: 10; top: 50%; left: -20%; width: 140%;
  transform: rotate(-15deg) translateY(-50%);
  overflow: visible; pointer-events: none; padding: 0.8rem 0;
  -webkit-mask-image: linear-gradient(to right, black 0%, black 6%, transparent 13%, transparent 87%, black 94%, black 100%);
  mask-image: linear-gradient(to right, black 0%, black 6%, transparent 13%, transparent 87%, black 94%, black 100%);
}
.gallery__ribbon-front .gallery__ribbon-track {
  display: flex; align-items: center;
  animation: ribbonScroll 25s linear infinite;
  width: max-content; white-space: nowrap;
}

/* Shared ribbon item styles */
.gallery__ribbon-item {
  font-family: var(--font-body); font-size: clamp(0.75rem, 1.1vw, 1rem); font-weight: 600;
  letter-spacing: 0.25em; text-transform: uppercase;
  padding: 0 3rem; flex-shrink: 0;
}
/* Back items — dim, ghostly */
.gallery__ribbon-back .gallery__ribbon-item {
  color: rgba(255,255,255,0.04);
  text-shadow: 0 0 30px rgba(184,134,45,0.02);
}
/* Front items — clearly in front */
.gallery__ribbon-front .gallery__ribbon-item {
  color: rgba(255,255,255,0.3);
  text-shadow: 0 0 25px rgba(184,134,45,0.08);
}
.gallery__ribbon-dot {
  width: 3px; height: 3px; border-radius: 50%; flex-shrink: 0;
}
.gallery__ribbon-back .gallery__ribbon-dot { background: rgba(255,255,255,0.03); }
.gallery__ribbon-front .gallery__ribbon-dot { background: rgba(255,255,255,0.15); }

@keyframes ribbonScroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* Second orbit ring — opposite direction, deeper */
.gallery__ribbon2-back {
  position: absolute; z-index: 1; top: 50%; left: -20%; width: 140%;
  transform: rotate(12deg) translateY(-20%);
  overflow: visible; pointer-events: none; padding: 0.6rem 0;
}
.gallery__ribbon2-back .gallery__ribbon-track {
  animation: ribbonScroll2 35s linear infinite;
}
.gallery__ribbon2-front {
  position: absolute; z-index: 10; top: 50%; left: -20%; width: 140%;
  transform: rotate(12deg) translateY(-20%);
  overflow: visible; pointer-events: none; padding: 0.6rem 0;
  -webkit-mask-image: linear-gradient(to right, black 0%, black 5%, transparent 12%, transparent 88%, black 95%, black 100%);
  mask-image: linear-gradient(to right, black 0%, black 5%, transparent 12%, transparent 88%, black 95%, black 100%);
}
.gallery__ribbon2-front .gallery__ribbon-track {
  animation: ribbonScroll2 35s linear infinite;
}
.gallery__ribbon2-back .gallery__ribbon-item,
.gallery__ribbon2-front .gallery__ribbon-item {
  font-size: clamp(0.7rem, 1vw, 0.85rem); letter-spacing: 0.3em;
}
.gallery__ribbon2-back .gallery__ribbon-item { color: rgba(255,255,255,0.03); }
.gallery__ribbon2-front .gallery__ribbon-item { color: rgba(255,255,255,0.15); }
.gallery__ribbon2-back .gallery__ribbon-dot { background: rgba(184,134,45,0.03); width: 4px; height: 4px; }
.gallery__ribbon2-front .gallery__ribbon-dot { background: rgba(184,134,45,0.12); width: 4px; height: 4px; }

@keyframes ribbonScroll2 { 0%{transform:translateX(-50%)} 100%{transform:translateX(0)} }
/* Progress dots */
.gallery__dots {
  position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%); z-index: 6;
  display: flex; gap: 16px;
}
.gallery__gdot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(255,255,255,0.08); cursor: pointer;
  transition: all 0.6s cubic-bezier(0.22, 0.9, 0.3, 1);
}
.gallery__gdot.active {
  background: rgba(255,255,255,0.5);
  box-shadow: 0 0 8px rgba(255,255,255,0.1);
}

@media (max-width: 768px) {
  .gallery__bento { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 60px; width: 95%; }
  .gallery__dots { gap: 12px; bottom: 1.5rem; }
}

/* Shared section utilities */
.section-label {
  font-family: var(--font-body); font-size: 0.6rem; letter-spacing: 0.35em;
  text-transform: uppercase; margin-bottom: 1rem; display: block;
  background: var(--gradient); -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; background-clip: text;
}
.section-title {
  font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 700; color: var(--white); line-height: 1.08; letter-spacing: -0.01em;
}
.section-header { text-align: center; margin-bottom: 4rem; }

/* ══════════════════════════════════════
   REVIEWS
   ══════════════════════════════════════ */
.reviews { background: var(--dark2); padding: 8rem 3.5rem; overflow: hidden; position: relative; }

/* Reviews digital mesh */
.reviews__mesh {
  position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
}
.reviews__mesh-col {
  position: absolute; top: -100%; width: 1.5px; height: 200%;
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 5px,
    rgba(212,168,83,0.14) 5px, rgba(212,168,83,0.14) 13px,
    transparent 13px, transparent 20px
  );
  animation: rainDrop linear infinite;
}
.reviews__mesh-col:nth-child(1)  { left: 2%;  animation-duration: 14s; }
.reviews__mesh-col:nth-child(2)  { left: 6%;  animation-duration: 17s; animation-delay: -3s; }
.reviews__mesh-col:nth-child(3)  { left: 10%; animation-duration: 12s; animation-delay: -7s; }
.reviews__mesh-col:nth-child(4)  { left: 14%; animation-duration: 16s; animation-delay: -1s; }
.reviews__mesh-col:nth-child(5)  { left: 18%; animation-duration: 13s; animation-delay: -9s; }
.reviews__mesh-col:nth-child(6)  { left: 22%; animation-duration: 15s; animation-delay: -5s; }
.reviews__mesh-col:nth-child(7)  { left: 78%; animation-duration: 13s; animation-delay: -2s; }
.reviews__mesh-col:nth-child(8)  { left: 82%; animation-duration: 16s; animation-delay: -8s; }
.reviews__mesh-col:nth-child(9)  { left: 86%; animation-duration: 12s; animation-delay: -4s; }
.reviews__mesh-col:nth-child(10) { left: 90%; animation-duration: 15s; animation-delay: -6s; }
.reviews__mesh-col:nth-child(11) { left: 94%; animation-duration: 14s; animation-delay: -10s; }
.reviews__mesh-col:nth-child(12) { left: 98%; animation-duration: 11s; animation-delay: -11s; }
.reviews__mesh-col:nth-child(2),
.reviews__mesh-col:nth-child(7),
.reviews__mesh-col:nth-child(10) {
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 6px,
    rgba(204,30,30,0.1) 6px, rgba(204,30,30,0.1) 14px,
    transparent 14px, transparent 22px
  );
}
.reviews__mesh-sweep {
  position: absolute; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.15), rgba(204,30,30,0.1), transparent);
  animation: sweepH linear infinite;
}
.reviews__mesh-sweep--1 { top: 25%; width: 32%; animation-duration: 9s; }
.reviews__mesh-sweep--2 { top: 70%; width: 28%; animation-duration: 12s; animation-delay: -5s; }
.reviews__mesh-bracket {
  position: absolute; width: 35px; height: 35px;
  border: 1px solid rgba(212,168,83,0.1);
  pointer-events: none; animation: bracketPulse 6s ease-in-out infinite;
}
.reviews__mesh-bracket--tl { top: 6%; left: 4%; border-right: none; border-bottom: none; }
.reviews__mesh-bracket--tr { top: 6%; right: 4%; border-left: none; border-bottom: none; animation-delay: -2s; }
.reviews__mesh-bracket--bl { bottom: 6%; left: 4%; border-right: none; border-top: none; animation-delay: -3s; }
.reviews__mesh-bracket--br { bottom: 6%; right: 4%; border-left: none; border-top: none; animation-delay: -5s; }

/* Reviews mesh flash */
.mesh-flash .reviews__mesh-col {
  animation: none !important; background: rgba(212,168,83,0.8) !important;
  width: 2.5px !important; filter: blur(1px); transition: all 0.5s; opacity: 1 !important;
}
.mesh-flash .reviews__mesh-sweep {
  animation: none !important;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.7), rgba(204,30,30,0.5), transparent) !important;
  width: 100% !important; left: 0 !important; height: 2px !important;
  transition: all 0.5s; opacity: 1 !important;
}
.mesh-flash .reviews__mesh-bracket {
  border-color: rgba(212,168,83,0.6) !important; animation: none !important;
  transition: all 0.5s; opacity: 1 !important;
}
.mesh-exit .reviews__mesh-col {
  animation: none !important; transform: translateY(-30vh) !important;
  opacity: 0 !important; transition: transform 3.5s cubic-bezier(0.15,0,0.4,1), opacity 3s ease-out !important;
}
.mesh-exit .reviews__mesh-sweep {
  animation: none !important; transform: translateY(-20vh) !important;
  opacity: 0 !important; transition: transform 3s cubic-bezier(0.15,0,0.4,1), opacity 2.8s ease-out !important;
}
.mesh-exit .reviews__mesh-bracket {
  animation: none !important; transform: translateY(-15vh) scale(1.1) !important;
  opacity: 0 !important; transition: transform 3s cubic-bezier(0.15,0,0.4,1), opacity 2.8s ease-out !important;
}
.mesh-resume .reviews__mesh-col,
.mesh-resume .reviews__mesh-sweep,
.mesh-resume .reviews__mesh-bracket {
  transition: opacity 1.5s, transform 0s !important;
  opacity: 1; transform: none !important;
}
.reviews__track-wrapper { overflow: hidden; max-width: 1200px; margin: 0 auto; position: relative; z-index: 1; }
.reviews__track {
  display: flex; gap: 2rem;
  animation: reviewScroll 30s linear infinite;
  width: max-content;
}
.reviews__track:hover { animation-play-state: paused; }
@keyframes reviewScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.review-card {
  flex: 0 0 340px; padding: 2rem; position: relative;
  background: rgba(255,255,255,0.015);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 2px; transition: border-color 0.4s;
}
.review-card:hover { border-color: rgba(204,30,30,0.15); }
.review-card__stars {
  display: flex; gap: 3px; margin-bottom: 1rem;
}
.review-card__star { color: var(--accent); font-size: 0.85rem; }
.review-card__text {
  font-family: var(--font-body); font-size: 0.85rem; font-weight: 300;
  color: var(--gray); line-height: 1.7; margin-bottom: 1.5rem;
  font-style: italic;
}
.review-card__author {
  font-family: var(--font-body); font-size: 0.8rem; font-weight: 500; color: var(--white);
}
.review-card__source {
  font-family: var(--font-body); font-size: 0.6rem;
  letter-spacing: 0.1em; color: rgba(255,255,255,0.2); margin-top: 0.2rem;
}
.review-card__quote {
  position: absolute; top: 1.5rem; right: 1.5rem;
  font-family: var(--font-display); font-size: 3rem; line-height: 1;
  background: var(--gradient); -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; background-clip: text;
  opacity: 0.1;
}
.reviews__badge {
  display: flex; align-items: center; gap: 0.6rem;
  margin-top: 1.2rem; position: relative; z-index: 1;
}
.reviews__badge-stars { color: #FBBC05; font-size: 0.85rem; letter-spacing: 1px; }
.reviews__badge-text {
  font-family: var(--font-body); font-size: 0.65rem; font-weight: 400;
  color: rgba(255,255,255,0.3); letter-spacing: 0.03em;
}

/* ══════════════════════════════════════
   TEAM — fullscreen 25% | 50% | 25%
   ══════════════════════════════════════ */
.team {
  background: var(--dark); padding: 5rem 0;
  width: 100%; min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  overflow: visible;
}
.team__scroll-wrap {
  width: 100%; max-width: 1200px; margin: 0 auto;
  perspective: 1000px;
}
.team__scroll-card {
  transform: rotateX(20deg) scale(1.05);
  transform-origin: center top;
  transition: transform 0.1s linear;
  border: 2px solid rgba(108,108,108,0.15);
  border-radius: 24px;
  padding: 4px;
  background: rgba(34,34,34,0.5);
  box-shadow: 0 0 #0000004d, 0 9px 20px #0000004a, 0 37px 37px #00000042, 0 84px 50px #00000026;
}
.team__scroll-inner {
  border-radius: 20px; overflow: hidden;
}
.team__beams {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; transition: opacity 0.8s ease;
  pointer-events: none; z-index: 5;
}
.team__beams.visible { opacity: 1; }
.team__layout {
  display: grid; grid-template-columns: 1fr 2fr 1fr;
  width: 100%; height: 70vh; min-height: 500px;
}

/* ── Person cards ── */
.team-card {
  position: relative; overflow: hidden; cursor: pointer;
  display: flex; flex-direction: column; justify-content: flex-end;
}
.team-card__bg {
  position: absolute; inset: 0; z-index: 0;
}
.team-card__bg img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 25%;
  filter: grayscale(1) brightness(0.25) contrast(1.15);
  transition: filter 0.8s cubic-bezier(0.25,0.1,0.25,1),
              transform 0.8s cubic-bezier(0.25,0.1,0.25,1);
}
.team-card:hover .team-card__bg img {
  filter: grayscale(0.8) brightness(0.4) contrast(1.1);
  transform: scale(1.03);
}
/* Per-person fine-tuning */
.team-card:first-child .team-card__bg img { object-position: 45% 30%; }
.team-card:last-child .team-card__bg img { object-position: center 22%; }

/* Gradient overlay — heavier at bottom for text readability */
.team-card__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(
    to top,
    rgba(8,8,8,0.98) 0%,
    rgba(8,8,8,0.7) 25%,
    rgba(8,8,8,0.25) 50%,
    rgba(8,8,8,0.08) 100%
  );
  transition: background 0.5s;
}
.team-card:hover .team-card__overlay {
  background: linear-gradient(
    to top,
    rgba(8,8,8,0.95) 0%,
    rgba(8,8,8,0.55) 25%,
    rgba(8,8,8,0.15) 50%,
    rgba(8,8,8,0.02) 100%
  );
}

/* Content — generous bottom padding, tight hierarchy */
.team-card__content {
  position: relative; z-index: 2;
  padding: 0 2.2rem 3rem;
}

.team-card__name {
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 1.8vw, 1.6rem);
  font-weight: 700; color: var(--white);
  letter-spacing: -0.01em; line-height: 1.15;
  margin-bottom: 0.6rem;
  transition: color 0.4s;
}

.team-card__role {
  font-family: var(--font-body); font-size: 0.5rem; font-weight: 500;
  letter-spacing: 0.25em; text-transform: uppercase;
  color: rgba(255,255,255,0.18);
  margin-bottom: 1.2rem;
  transition: color 0.4s;
}
.team-card:hover .team-card__role { color: var(--accent-deep); }

.team-card__quote {
  font-family: var(--font-body); font-size: 0.75rem; font-weight: 300;
  color: rgba(255,255,255,0.2); line-height: 1.65;
  max-width: 240px;
  transition: color 0.4s;
}
.team-card:hover .team-card__quote { color: rgba(255,255,255,0.45); }

/* Top accent line on hover — restrained */
.team-card::after {
  content: ''; position: absolute; top: 0; left: 0;
  width: 0; height: 1px; z-index: 3;
  background: var(--gradient); opacity: 0;
  transition: width 0.6s cubic-bezier(0.25,0.1,0.25,1), opacity 0.6s;
}
.team-card:hover::after {
  width: 100%; opacity: 0.4;
}

/* Divider between panels — barely visible */
.team-card + .team-video,
.team-video + .team-card {
  border-left: 1px solid rgba(255,255,255,0.03);
}

/* ── Center video ── */
.team-video {
  position: relative; overflow: hidden; cursor: pointer;
}
.team-video video, .team-video img {
  width: 100%; height: 100%; object-fit: cover;
  filter: brightness(0.4) saturate(0.8);
  transition: filter 0.6s cubic-bezier(0.25,0.1,0.25,1),
              transform 0.8s cubic-bezier(0.25,0.1,0.25,1);
}
.team-video:hover video, .team-video:hover img {
  filter: brightness(0.55) saturate(0.95);
  transform: scale(1.02);
}

.team-video__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(
    to top,
    rgba(8,8,8,0.85) 0%,
    transparent 30%,
    transparent 70%,
    rgba(8,8,8,0.2) 100%
  );
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 0.8rem;
}
.team-video__play {
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(8px);
  transition: all 0.4s cubic-bezier(0.25,0.1,0.25,1);
}
.team-video__play svg { width: 18px; height: 18px; color: rgba(255,255,255,0.5); transition: color 0.4s; }
.team-video:hover .team-video__play {
  background: rgba(204,30,30,0.2); border-color: rgba(204,30,30,0.35);
  box-shadow: 0 0 30px rgba(204,30,30,0.12);
  transform: scale(1.05);
}
.team-video:hover .team-video__play svg { color: var(--white); }
.team-video__label {
  font-family: var(--font-body); font-size: 0.7rem; font-weight: 300;
  color: rgba(255,255,255,0.3); letter-spacing: 0.08em;
  transition: color 0.4s;
}
.team-video:hover .team-video__label { color: rgba(255,255,255,0.5); }

.team-video__footer {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 2;
  padding: 2.5rem 3rem; display: flex; align-items: center; gap: 1.2rem;
}
.team-video__footer-line {
  width: 2px; height: 32px; border-radius: 1px;
  background: var(--gradient); flex-shrink: 0;
  opacity: 0.5;
}
.team-video__name {
  font-family: var(--font-display); font-size: 1rem; font-weight: 700;
  color: var(--white); letter-spacing: -0.01em;
}
.team-video__role {
  font-family: var(--font-body); font-size: 0.5rem; font-weight: 500;
  letter-spacing: 0.25em; text-transform: uppercase;
  color: rgba(255,255,255,0.18);
}

@media (max-width: 768px) {
  .team { height: auto; min-height: auto; flex-direction: column; }
  .team__layout { grid-template-columns: 1fr; grid-template-rows: 45vh 50vh 45vh; height: auto; min-height: auto; }
  .team-card { min-height: 45vh; }
  .team-video { min-height: 50vh; }
  .team-card__content { padding: 0 1.5rem 2.5rem; }
  .team-card + .team-video, .team-video + .team-card { border-left: none; border-top: 1px solid rgba(255,255,255,0.03); }
  .team-video__footer { padding: 2rem 1.5rem; }
}

/* ══════════════════════════════════════
   FAQ
   ══════════════════════════════════════ */
.faq {
  background: var(--dark2); padding: 10rem 5rem;
  position: relative; overflow: hidden;
}

/* FAQ digital mesh background */
.faq__mesh {
  position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
}
.faq__mesh-col {
  position: absolute; top: -100%; width: 1.5px; height: 200%;
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 5px,
    rgba(212,168,83,0.14) 5px, rgba(212,168,83,0.14) 13px,
    transparent 13px, transparent 20px
  );
  animation: rainDrop linear infinite;
}
/* Left edge columns */
.faq__mesh-col:nth-child(1)  { left: 2%;  animation-duration: 12s; }
.faq__mesh-col:nth-child(2)  { left: 6%;  animation-duration: 15s; animation-delay: -4s; }
.faq__mesh-col:nth-child(3)  { left: 10%; animation-duration: 11s; animation-delay: -8s; }
.faq__mesh-col:nth-child(4)  { left: 14%; animation-duration: 17s; animation-delay: -2s; }
.faq__mesh-col:nth-child(5)  { left: 18%; animation-duration: 13s; animation-delay: -6s; }
.faq__mesh-col:nth-child(6)  { left: 22%; animation-duration: 16s; animation-delay: -10s; }
/* Right edge columns */
.faq__mesh-col:nth-child(7)  { left: 78%; animation-duration: 14s; animation-delay: -3s; }
.faq__mesh-col:nth-child(8)  { left: 82%; animation-duration: 11s; animation-delay: -7s; }
.faq__mesh-col:nth-child(9)  { left: 86%; animation-duration: 16s; animation-delay: -1s; }
.faq__mesh-col:nth-child(10) { left: 90%; animation-duration: 12s; animation-delay: -9s; }
.faq__mesh-col:nth-child(11) { left: 94%; animation-duration: 15s; animation-delay: -5s; }
.faq__mesh-col:nth-child(12) { left: 98%; animation-duration: 13s; animation-delay: -11s; }
/* Red tinted */
.faq__mesh-col:nth-child(3),
.faq__mesh-col:nth-child(8),
.faq__mesh-col:nth-child(11) {
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 6px,
    rgba(204,30,30,0.1) 6px, rgba(204,30,30,0.1) 14px,
    transparent 14px, transparent 22px
  );
}
/* FAQ sweeps */
.faq__mesh-sweep {
  position: absolute; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.15), rgba(204,30,30,0.1), transparent);
  animation: sweepH linear infinite;
}
.faq__mesh-sweep--1 { top: 20%; width: 35%; animation-duration: 9s; }
.faq__mesh-sweep--2 { top: 55%; width: 28%; animation-duration: 13s; animation-delay: -5s; }
.faq__mesh-sweep--3 { top: 80%; width: 40%; animation-duration: 8s; animation-delay: -3s; }
/* FAQ brackets */
.faq__mesh-bracket {
  position: absolute; width: 35px; height: 35px;
  border: 1px solid rgba(212,168,83,0.1);
  pointer-events: none; animation: bracketPulse 6s ease-in-out infinite;
}
.faq__mesh-bracket--tl { top: 6%; left: 4%; border-right: none; border-bottom: none; }
.faq__mesh-bracket--tr { top: 6%; right: 4%; border-left: none; border-bottom: none; animation-delay: -2s; }
.faq__mesh-bracket--bl { bottom: 6%; left: 4%; border-right: none; border-top: none; animation-delay: -4s; }
.faq__mesh-bracket--br { bottom: 6%; right: 4%; border-left: none; border-top: none; animation-delay: -1s; }

.faq .section-header {
  position: relative; z-index: 1;
  text-align: left; margin-bottom: 5rem;
  max-width: 720px; margin-left: auto; margin-right: auto;
}
.faq__list { max-width: 720px; margin: 0 auto; position: relative; z-index: 1; }
.faq__search-wrap { max-width: 720px; margin: 0 auto 2rem; position: relative; z-index: 1; }
.faq__search {
  width: 100%; padding: 0.9rem 0; background: transparent;
  border: none; border-bottom: 1px solid rgba(255,255,255,0.04);
  font-family: var(--font-body); font-size: 0.8rem; font-weight: 300;
  color: var(--white); outline: none; caret-color: var(--accent);
  transition: border-color 0.3s;
}
.faq__search::placeholder { color: rgba(255,255,255,0.1); }
.faq__search:focus { border-color: rgba(184,134,45,0.15); }
.faq__item.faq-hidden { display: none; }

.faq__item {
  border-top: 1px solid rgba(255,255,255,0.04);
  position: relative; z-index: 1;
}
.faq__item:last-child {
  border-bottom: 1px solid rgba(255,255,255,0.04);
}

.faq__q {
  width: 100%; padding: 2rem 0; display: flex; justify-content: space-between;
  align-items: center; gap: 2rem;
  background: none; border: none; cursor: pointer;
  text-align: left; transition: all 0.3s;
}
.faq__q h3 {
  font-family: var(--font-display); font-size: clamp(0.95rem, 1.3vw, 1.1rem);
  font-weight: 700; color: rgba(255,255,255,0.7);
  letter-spacing: -0.01em; line-height: 1.35;
  transition: color 0.3s;
  margin: 0;
}
.faq__q:hover h3 { color: var(--white); }
.faq__item.open .faq__q h3 { color: var(--white); }

/* Plus/minus icon */
.faq__icon {
  width: 20px; height: 20px; flex-shrink: 0; position: relative;
}
.faq__icon::before, .faq__icon::after {
  content: ''; position: absolute;
  background: rgba(255,255,255,0.15);
  border-radius: 0.5px;
  transition: all 0.35s cubic-bezier(0.25,0.1,0.25,1);
}
.faq__icon::before { width: 12px; height: 1px; top: 9.5px; left: 4px; }
.faq__icon::after { width: 1px; height: 12px; top: 4px; left: 9.5px; }
.faq__q:hover .faq__icon::before,
.faq__q:hover .faq__icon::after { background: var(--accent-red); }
.faq__item.open .faq__icon::before { background: var(--accent-red); }
.faq__item.open .faq__icon::after {
  transform: rotate(90deg); opacity: 0;
}

/* Answer */
.faq__a {
  max-height: 0; overflow: hidden;
  transition: max-height 0.4s cubic-bezier(0.25,0.1,0.25,1),
              padding 0.4s cubic-bezier(0.25,0.1,0.25,1);
}
.faq__item.open .faq__a {
  max-height: 300px;
  padding-bottom: 2.5rem;
}
.faq__a p {
  font-family: var(--font-body); font-size: 0.82rem; font-weight: 300;
  color: rgba(255,255,255,0.3); line-height: 1.85;
  max-width: 600px;
  padding-left: 0;
}

@media (max-width: 768px) {
  .faq { padding: 5rem 1.5rem; }
  .faq .section-header { text-align: center; }
}

/* ══════════════════════════════════════
   BLOG / İÇERİK TEASERs
   ══════════════════════════════════════ */
.blog {
  background: var(--dark); padding: 8rem 5rem;
  position: relative; overflow: hidden;
}
.blog__mesh {
  position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
}
.blog__mesh-col {
  position: absolute; top: -100%; width: 1.5px; height: 200%;
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 5px,
    rgba(212,168,83,0.14) 5px, rgba(212,168,83,0.14) 13px,
    transparent 13px, transparent 20px
  );
  animation: rainDrop linear infinite;
}
.blog__mesh-col:nth-child(1)  { left: 3%;  animation-duration: 13s; }
.blog__mesh-col:nth-child(2)  { left: 7%;  animation-duration: 16s; animation-delay: -4s; }
.blog__mesh-col:nth-child(3)  { left: 11%; animation-duration: 11s; animation-delay: -8s; }
.blog__mesh-col:nth-child(4)  { left: 15%; animation-duration: 17s; animation-delay: -2s; }
.blog__mesh-col:nth-child(5)  { left: 19%; animation-duration: 12s; animation-delay: -6s; }
.blog__mesh-col:nth-child(6)  { left: 23%; animation-duration: 15s; animation-delay: -10s; }
.blog__mesh-col:nth-child(7)  { left: 77%; animation-duration: 14s; animation-delay: -3s; }
.blog__mesh-col:nth-child(8)  { left: 81%; animation-duration: 12s; animation-delay: -7s; }
.blog__mesh-col:nth-child(9)  { left: 85%; animation-duration: 16s; animation-delay: -1s; }
.blog__mesh-col:nth-child(10) { left: 89%; animation-duration: 13s; animation-delay: -9s; }
.blog__mesh-col:nth-child(11) { left: 93%; animation-duration: 15s; animation-delay: -5s; }
.blog__mesh-col:nth-child(12) { left: 97%; animation-duration: 11s; animation-delay: -11s; }
.blog__mesh-col:nth-child(3),
.blog__mesh-col:nth-child(8),
.blog__mesh-col:nth-child(11) {
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 6px,
    rgba(204,30,30,0.1) 6px, rgba(204,30,30,0.1) 14px,
    transparent 14px, transparent 22px
  );
}
.blog__mesh-sweep {
  position: absolute; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.15), rgba(204,30,30,0.1), transparent);
  animation: sweepH linear infinite;
}
.blog__mesh-sweep--1 { top: 30%; width: 30%; animation-duration: 10s; }
.blog__mesh-sweep--2 { top: 65%; width: 35%; animation-duration: 8s; animation-delay: -4s; }
.blog__mesh-bracket {
  position: absolute; width: 35px; height: 35px;
  border: 1px solid rgba(212,168,83,0.1);
  pointer-events: none; animation: bracketPulse 6s ease-in-out infinite;
}
.blog__mesh-bracket--tl { top: 6%; left: 4%; border-right: none; border-bottom: none; }
.blog__mesh-bracket--tr { top: 6%; right: 4%; border-left: none; border-bottom: none; animation-delay: -2s; }
.blog__mesh-bracket--bl { bottom: 6%; left: 4%; border-right: none; border-top: none; animation-delay: -4s; }
.blog__mesh-bracket--br { bottom: 6%; right: 4%; border-left: none; border-top: none; animation-delay: -1s; }

/* Add blog to mesh flash system */
.mesh-flash .blog__mesh-col {
  animation: none !important;
  background: rgba(212,168,83,0.45) !important;
  width: 2px !important; filter: blur(0.5px);
  transition: all 0.6s; opacity: 1 !important;
}
.mesh-flash .blog__mesh-sweep {
  animation: none !important;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.35), rgba(204,30,30,0.2), transparent) !important;
  width: 100% !important; left: 0 !important; height: 1.5px !important;
  transition: all 0.6s; opacity: 1 !important;
}
.mesh-flash .blog__mesh-bracket {
  border-color: rgba(212,168,83,0.3) !important;
  animation: none !important; transition: all 0.6s; opacity: 1 !important;
}
.mesh-exit .blog__mesh-col {
  animation: none !important; transform: translateY(-30vh) !important;
  opacity: 0 !important; transition: transform 3.5s cubic-bezier(0.15,0,0.4,1), opacity 3s ease-out !important;
}
.mesh-exit .blog__mesh-sweep {
  animation: none !important; transform: translateY(-20vh) !important;
  opacity: 0 !important; transition: transform 3s cubic-bezier(0.15,0,0.4,1), opacity 2.8s ease-out !important;
}
.mesh-exit .blog__mesh-bracket {
  animation: none !important; transform: translateY(-15vh) scale(1.1) !important;
  opacity: 0 !important; transition: transform 3s cubic-bezier(0.15,0,0.4,1), opacity 2.8s ease-out !important;
}
.mesh-resume .blog__mesh-col,
.mesh-resume .blog__mesh-sweep,
.mesh-resume .blog__mesh-bracket {
  transition: opacity 1.5s, transform 0s !important;
  opacity: 1; transform: none !important;
}

.blog .section-header {
  text-align: center; margin-bottom: 4rem;
  position: relative; z-index: 1;
}
.blog__grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: rgba(255,255,255,0.025);
  max-width: 1100px; margin: 0 auto;
  position: relative; z-index: 1;
}
.blog__card {
  background: var(--dark); padding: 2.5rem 2rem;
  transition: background 0.4s; position: relative; cursor: pointer;
  text-decoration: none; display: block;
}
.blog__card::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: 0; height: 1px; background: var(--gradient);
  transition: width 0.5s;
}
.blog__card:hover::before { width: 100%; }
.blog__card:hover { background: rgba(255,255,255,0.01); }
.blog__card-num {
  font-family: var(--font-display); font-size: 0.55rem; font-weight: 400;
  color: rgba(255,255,255,0.06); margin-bottom: 1.2rem;
}
.blog__card:hover .blog__card-num { color: var(--accent-red); transition: color 0.4s; }
.blog__card-title {
  font-family: var(--font-display); font-size: clamp(0.95rem, 1.2vw, 1.1rem);
  font-weight: 700; color: rgba(255,255,255,0.55);
  line-height: 1.35; margin-bottom: 0.8rem;
  transition: color 0.4s;
}
.blog__card:hover .blog__card-title { color: var(--white); }
.blog__card-desc {
  font-family: var(--font-body); font-size: 0.72rem; font-weight: 300;
  color: rgba(255,255,255,0.15); line-height: 1.7;
  transition: color 0.4s;
}
.blog__card:hover .blog__card-desc { color: rgba(255,255,255,0.3); }
.blog__card-tag {
  display: inline-block; margin-top: 1.2rem;
  font-family: var(--font-body); font-size: 0.5rem; font-weight: 500;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--accent-deep); opacity: 0.5;
}

@media (max-width: 768px) {
  .blog { padding: 5rem 1.5rem; }
  .blog__grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════
   FORM — premium contact
   ══════════════════════════════════════ */
.cform {
  background: var(--dark); padding: 10rem 5rem;
  position: relative; overflow: hidden;
}
/* Subtle ambient glow */
.cform::before {
  content: ''; position: absolute;
  top: 30%; left: 50%; width: 400px; height: 400px;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(184,134,45,0.03) 0%, transparent 70%);
  pointer-events: none;
}

/* Form digital mesh */
.cform__mesh {
  position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none;
  transition: opacity 0.6s;
}
.cform__mesh-col {
  position: absolute; top: -100%; width: 1.5px; height: 200%;
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 5px,
    rgba(212,168,83,0.14) 5px, rgba(212,168,83,0.14) 13px,
    transparent 13px, transparent 20px
  );
  animation: rainDrop linear infinite;
}
.cform__mesh-col:nth-child(1)  { left: 2%;  animation-duration: 13s; }
.cform__mesh-col:nth-child(2)  { left: 6%;  animation-duration: 16s; animation-delay: -3s; }
.cform__mesh-col:nth-child(3)  { left: 10%; animation-duration: 11s; animation-delay: -7s; }
.cform__mesh-col:nth-child(4)  { left: 14%; animation-duration: 15s; animation-delay: -1s; }
.cform__mesh-col:nth-child(5)  { left: 18%; animation-duration: 12s; animation-delay: -9s; }
.cform__mesh-col:nth-child(6)  { left: 22%; animation-duration: 17s; animation-delay: -5s; }
.cform__mesh-col:nth-child(7)  { left: 78%; animation-duration: 14s; animation-delay: -2s; }
.cform__mesh-col:nth-child(8)  { left: 82%; animation-duration: 11s; animation-delay: -8s; }
.cform__mesh-col:nth-child(9)  { left: 86%; animation-duration: 16s; animation-delay: -4s; }
.cform__mesh-col:nth-child(10) { left: 90%; animation-duration: 13s; animation-delay: -6s; }
.cform__mesh-col:nth-child(11) { left: 94%; animation-duration: 15s; animation-delay: -10s; }
.cform__mesh-col:nth-child(12) { left: 98%; animation-duration: 12s; animation-delay: -11s; }
.cform__mesh-col:nth-child(2),
.cform__mesh-col:nth-child(7),
.cform__mesh-col:nth-child(10) {
  background: repeating-linear-gradient(180deg,
    transparent 0px, transparent 6px,
    rgba(204,30,30,0.1) 6px, rgba(204,30,30,0.1) 14px,
    transparent 14px, transparent 22px
  );
}
.cform__mesh-sweep {
  position: absolute; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.15), rgba(204,30,30,0.1), transparent);
  animation: sweepH linear infinite;
}
.cform__mesh-sweep--1 { top: 25%; width: 30%; animation-duration: 10s; }
.cform__mesh-sweep--2 { top: 60%; width: 35%; animation-duration: 8s; animation-delay: -4s; }
.cform__mesh-sweep--3 { top: 85%; width: 25%; animation-duration: 12s; animation-delay: -7s; }
.cform__mesh-bracket {
  position: absolute; width: 35px; height: 35px;
  border: 1px solid rgba(212,168,83,0.1);
  pointer-events: none; animation: bracketPulse 6s ease-in-out infinite;
}
.cform__mesh-bracket--tl { top: 5%; left: 3%; border-right: none; border-bottom: none; }
.cform__mesh-bracket--tr { top: 5%; right: 3%; border-left: none; border-bottom: none; animation-delay: -2s; }
.cform__mesh-bracket--bl { bottom: 5%; left: 3%; border-right: none; border-top: none; animation-delay: -3s; }
.cform__mesh-bracket--br { bottom: 5%; right: 3%; border-left: none; border-top: none; animation-delay: -5s; }

/* ── FINALE FLASH — all meshes ── */

/* Phase 1: FLASH — softer glow */
.mesh-flash .services__rain-col,
.mesh-flash .faq__mesh-col,
.mesh-flash .cform__mesh-col {
  animation: none !important;
  background: rgba(212,168,83,0.45) !important;
  width: 2px !important;
  filter: blur(0.5px);
  box-shadow: 0 0 6px rgba(212,168,83,0.15);
  transition: all 0.6s;
  opacity: 1 !important;
}
.mesh-flash .services__sweep,
.mesh-flash .faq__mesh-sweep,
.mesh-flash .cform__mesh-sweep {
  animation: none !important;
  background: linear-gradient(90deg, transparent, rgba(212,168,83,0.35), rgba(204,30,30,0.2), transparent) !important;
  width: 100% !important; left: 0 !important; height: 1.5px !important;
  transition: all 0.6s;
  opacity: 1 !important;
}
.mesh-flash .services__bracket,
.mesh-flash .faq__mesh-bracket,
.mesh-flash .cform__mesh-bracket {
  border-color: rgba(212,168,83,0.3) !important;
  box-shadow: 0 0 8px rgba(212,168,83,0.1);
  animation: none !important;
  transition: all 0.6s;
  opacity: 1 !important;
}
.mesh-flash .services__depth-rect {
  border-color: rgba(212,168,83,0.15) !important;
  box-shadow: 0 0 10px rgba(212,168,83,0.05);
  animation: none !important;
  transition: all 0.6s;
  opacity: 1 !important;
}
.mesh-flash .services__dot {
  background: rgba(212,168,83,0.5) !important;
  width: 3px !important; height: 3px !important;
  box-shadow: 0 0 6px rgba(212,168,83,0.25);
  animation: none !important;
  transition: all 0.6s;
  opacity: 1 !important;
}

/* Phase 2: EXIT — very slow drift upward + gentle fade */
.mesh-exit .services__rain-col,
.mesh-exit .faq__mesh-col,
.mesh-exit .cform__mesh-col {
  animation: none !important;
  transform: translateY(-30vh) !important;
  opacity: 0 !important;
  transition: transform 3.5s cubic-bezier(0.15, 0, 0.4, 1), opacity 3s ease-out !important;
}
.mesh-exit .services__sweep,
.mesh-exit .faq__mesh-sweep,
.mesh-exit .cform__mesh-sweep {
  animation: none !important;
  transform: translateY(-20vh) !important;
  opacity: 0 !important;
  transition: transform 3s cubic-bezier(0.15, 0, 0.4, 1), opacity 2.8s ease-out !important;
}
.mesh-exit .services__bracket,
.mesh-exit .faq__mesh-bracket,
.mesh-exit .cform__mesh-bracket {
  animation: none !important;
  transform: translateY(-15vh) scale(1.1) !important;
  opacity: 0 !important;
  transition: transform 3s cubic-bezier(0.15, 0, 0.4, 1), opacity 2.8s ease-out !important;
}
.mesh-exit .services__depth-rect {
  animation: none !important;
  transform: translate(-50%, -80%) scale(0.8) !important;
  opacity: 0 !important;
  transition: transform 3s cubic-bezier(0.15, 0, 0.4, 1), opacity 2.5s ease-out !important;
}
.mesh-exit .services__dot {
  animation: none !important;
  transform: translateY(-25vh) !important;
  opacity: 0 !important;
  transition: transform 2.8s cubic-bezier(0.15, 0, 0.4, 1), opacity 2.5s ease-out !important;
}

/* Resume state — smooth restart */
.mesh-resume .services__rain-col,
.mesh-resume .faq__mesh-col,
.mesh-resume .cform__mesh-col,
.mesh-resume .services__sweep,
.mesh-resume .faq__mesh-sweep,
.mesh-resume .cform__mesh-sweep,
.mesh-resume .services__bracket,
.mesh-resume .faq__mesh-bracket,
.mesh-resume .cform__mesh-bracket,
.mesh-resume .services__depth-rect,
.mesh-resume .services__dot {
  transition: opacity 1.5s, transform 0s !important;
  opacity: 1;
  transform: none !important;
}

.cform__inner {
  max-width: 480px; margin: 0 auto;
  position: relative; z-index: 1;
}

.cform__header {
  text-align: center; margin-bottom: 4rem;
}
.cform__label {
  font-family: var(--font-body); font-size: 0.55rem; font-weight: 500;
  letter-spacing: 0.35em; text-transform: uppercase;
  color: rgba(255,255,255,0.15); margin-bottom: 1.2rem; display: block;
}
.cform__title {
  font-family: var(--font-display); font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 700; color: var(--white); line-height: 1.15;
  letter-spacing: -0.01em;
}
.cform__sub {
  font-family: var(--font-body); font-size: 0.78rem; font-weight: 300;
  color: rgba(255,255,255,0.2); margin-top: 1rem;
}

/* Fields */
.cform__fields {
  display: flex; flex-direction: column; gap: 0;
}

.cform__field {
  position: relative;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: border-color 0.3s;
}
.cform__field:first-child {
  border-top: 1px solid rgba(255,255,255,0.04);
}
.cform__field:focus-within {
  border-color: rgba(184,134,45,0.15);
}

.cform__field-label {
  position: absolute; top: 1.6rem; left: 0;
  font-family: var(--font-body); font-size: 0.65rem; font-weight: 400;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(255,255,255,0.12);
  pointer-events: none;
  transition: all 0.3s cubic-bezier(0.25,0.1,0.25,1);
  transform-origin: left;
}
.cform__field:focus-within .cform__field-label,
.cform__field.has-value .cform__field-label {
  transform: translateY(-0.9rem) scale(0.75);
  color: var(--accent-deep);
}

.cform__input {
  width: 100%; padding: 2.2rem 0 1.2rem;
  background: transparent; border: none; outline: none;
  font-family: var(--font-body); font-size: 0.9rem; font-weight: 400;
  color: var(--white); letter-spacing: 0.01em;
  caret-color: var(--accent);
}
.cform__input::placeholder {
  color: rgba(255,255,255,0.08); font-weight: 300;
}

.cform__textarea {
  width: 100%; padding: 2.2rem 0 1.2rem;
  background: transparent; border: none; outline: none;
  font-family: var(--font-body); font-size: 0.9rem; font-weight: 400;
  color: var(--white); letter-spacing: 0.01em;
  caret-color: var(--accent);
  resize: none; min-height: 80px;
}
.cform__textarea::placeholder {
  color: rgba(255,255,255,0.08); font-weight: 300;
}

/* Optional tag */
.cform__optional {
  font-family: var(--font-body); font-size: 0.45rem; font-weight: 400;
  letter-spacing: 0.1em; color: rgba(255,255,255,0.08);
  position: absolute; top: 1.25rem; right: 0;
}

/* Submit */
.cform__submit {
  margin-top: 3rem; width: 100%;
  padding: 1.15rem 2rem;
  background: linear-gradient(90deg, var(--accent-deep), var(--accent));
  border: none; cursor: pointer;
  font-family: var(--font-body); font-size: 0.75rem; font-weight: 600;
  letter-spacing: 0.15em; text-transform: uppercase;
  color: #080808; position: relative; overflow: hidden;
  transition: all 0.3s cubic-bezier(0.25,0.1,0.25,1);
}
.cform__submit:hover {
  background: linear-gradient(90deg, var(--accent), var(--accent-light));
  transform: translateY(-1px);
  box-shadow: 0 8px 30px rgba(184,134,45,0.15);
}
.cform__submit .ripple {
  position: absolute; border-radius: 50%;
  background: rgba(255,255,255,0.3);
  transform: scale(0); animation: rippleAnim 0.6s ease-out forwards;
  pointer-events: none;
}
@keyframes rippleAnim { to { transform: scale(4); opacity: 0; } }

/* Bottom note */
.cform__note {
  text-align: center; margin-top: 2rem;
  font-family: var(--font-body); font-size: 0.55rem; font-weight: 300;
  color: rgba(255,255,255,0.1); letter-spacing: 0.03em;
}
.cform__success {
  text-align: center; margin-top: 1rem;
  font-family: var(--font-body); font-size: 0.7rem; font-weight: 500;
  color: var(--accent); letter-spacing: 0.03em;
  opacity: 0; max-height: 0; overflow: hidden;
  transition: opacity 0.4s, max-height 0.4s;
}
.cform__success.show {
  opacity: 1; max-height: 40px;
}

@media (max-width: 768px) {
  .cform { padding: 5rem 1.5rem; }
}

/* ══════════════════════════════════════
   CONTACT — fullscreen map + overlay card
   ══════════════════════════════════════ */
.contact {
  position: relative; width: 100%; height: 100vh; min-height: 650px;
  background: var(--dark); padding: 0; overflow: hidden;
}
.contact__map {
  position: absolute; inset: 0; z-index: 0;
}
.contact__map iframe {
  width: 100%; height: 100%; border: 0;
  filter: brightness(0.55) saturate(0.7) contrast(1.1);
  transition: filter 0.5s;
}
.contact:hover .contact__map iframe {
  filter: brightness(0.65) saturate(0.8) contrast(1.05);
}

/* Overlay card — refined */
.contact__card {
  position: absolute; z-index: 2;
  left: 4rem; bottom: 4rem;
  width: min(420px, calc(100% - 8rem));
  background: rgba(8,8,8,0.88);
  backdrop-filter: blur(24px);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 0; padding: 3rem 2.8rem;
}

/* Phone number — dominant element */
.contact__card-phone {
  margin-bottom: 2.5rem;
}
.contact__phone-wrap {
  position: relative; display: inline-block;
  padding: 0.8rem 1.5rem;
  border: 2px solid rgba(212,168,83,0.15);
  border-radius: 0.3em;
  background-color: transparent;
  transition: box-shadow 1s, border-color 0.5s;
  overflow: hidden;
}
.contact__phone-wrap::after {
  content: ""; position: absolute; top: -10px; left: 3%;
  width: 95%; height: 40%;
  background-color: rgba(12,12,12,0.88);
  transition: transform 0.5s; transform-origin: center;
}
.contact__phone-wrap::before {
  content: ""; position: absolute; top: 80%; left: 3%;
  width: 95%; height: 40%;
  background-color: rgba(12,12,12,0.88);
  transition: transform 0.5s; transform-origin: center;
}
.contact__phone-wrap:hover::before,
.contact__phone-wrap:hover::after { transform: scale(0); }
.contact__phone-wrap:hover {
  border-color: var(--accent);
  box-shadow: inset 0 0 25px rgba(212,168,83,0.12), 0 0 20px rgba(212,168,83,0.08);
}
.contact__card-phone-label {
  font-family: var(--font-body); font-size: 0.5rem; font-weight: 500;
  letter-spacing: 0.3em; text-transform: uppercase;
  color: rgba(255,255,255,0.15);
  margin-bottom: 0.8rem; display: block;
  opacity: 1;
}
.contact__card-phone-num {
  position: relative; z-index: 2;
  display: block; text-decoration: none; white-space: nowrap;
  font-family: var(--font-display); font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  font-weight: 700; color: var(--white);
  letter-spacing: 0.02em; line-height: 1;
  transition: color 0.4s;
  opacity: 1;
}
.contact__card-phone.sparkle-in .contact__card-phone-label {
  animation: sparkleIn 1.1s ease-out forwards;
}
.contact__card-phone.sparkle-in .contact__card-phone-num {
  animation: sparkleIn 1.1s 0.4s ease-out forwards;
}
@keyframes sparkleIn {
  0%   { opacity: 0; filter: brightness(0.3); text-shadow: none; }
  35%  { opacity: 1; filter: brightness(2.8); text-shadow: 0 0 12px rgba(212,168,83,0.6), 0 0 30px rgba(204,30,30,0.3); }
  100% { opacity: 1; filter: brightness(1); text-shadow: none; }
}
.contact__card-phone-num:hover {
  color: var(--accent);
}

/* Info items — secondary, compact */
.contact__card-items {
  display: flex; flex-direction: column; gap: 1.2rem;
  margin-bottom: 2.5rem;
  padding-top: 2.5rem;
  border-top: 1px solid rgba(255,255,255,0.04);
}

.contact__card-item {
  display: flex; align-items: flex-start; gap: 1rem;
}
.contact__card-item-icon {
  width: 28px; height: 28px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  opacity: 0.25;
}
.contact__card-item-icon svg { width: 14px; height: 14px; color: var(--white); }
.contact__card-item-label {
  font-family: var(--font-body); font-size: 0.5rem; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.15);
  margin-bottom: 0.25rem;
}
.contact__card-item-value {
  font-family: var(--font-body); font-size: 0.82rem; font-weight: 400;
  color: rgba(255,255,255,0.55); line-height: 1.5;
}

/* Divider — barely visible */
.contact__card-divider {
  width: 100%; height: 1px;
  background: rgba(255,255,255,0.03);
  margin: 0;
}

/* CTA buttons — refined */
.contact__card-actions {
  display: flex; gap: 0.6rem;
}
.contact__card-btn {
  flex: 1; display: inline-flex; align-items: center; justify-content: center;
  gap: 0.5rem; padding: 0.9rem 1rem;
  font-family: var(--font-body); font-size: 0.7rem; font-weight: 600;
  letter-spacing: 0.08em; border-radius: 0;
  text-decoration: none; cursor: pointer;
  transition: all 0.4s cubic-bezier(0.25,0.1,0.25,1);
}
.contact__card-btn svg { width: 14px; height: 14px; }

.contact__card-btn--primary {
  background: var(--gradient); color: var(--white); border: none;
}
.contact__card-btn--primary:hover {
  opacity: 0.88; transform: translateY(-1px);
}

.contact__card-btn--secondary {
  background: transparent; color: rgba(255,255,255,0.6);
  border: 1px solid rgba(255,255,255,0.06);
}
.contact__card-btn--secondary:hover {
  border-color: rgba(255,255,255,0.12);
  color: var(--white);
}
.contact__card-rating {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.8rem 0; border-top: 1px solid rgba(255,255,255,0.04);
}
.contact__card-rating-stars { color: #FBBC05; font-size: 0.75rem; letter-spacing: 1px; }
.contact__card-rating-score { font-family: var(--font-display); font-size: 0.85rem; font-weight: 700; color: var(--white); }
.contact__card-rating-text { font-family: var(--font-body); font-size: 0.6rem; color: rgba(255,255,255,0.25); }

/* Top + bottom gradient fades */
.contact__fade {
  position: absolute; top: 0; left: 0; right: 0; height: 160px; z-index: 1;
  background: linear-gradient(to bottom, var(--dark), transparent);
  pointer-events: none;
}
.contact::after {
  content: ''; position: absolute; bottom: 0; right: 0; width: 60%; height: 200px;
  z-index: 1; pointer-events: none;
  background: linear-gradient(to top left, rgba(8,8,8,0.6), transparent);
}

@media (max-width: 768px) {
  .contact__card {
    left: 1.5rem; right: 1.5rem; bottom: 1.5rem;
    width: auto; padding: 2.5rem 2rem;
  }
  .contact__card-actions { flex-direction: column; }
}

/* ══════════════════════════════════════
   FOOTER — minimal closing signature
   ══════════════════════════════════════ */
.footer {
  background: var(--dark); padding: 0;
  border-top: 1px solid rgba(255,255,255,0.04);
}
.footer__inner {
  max-width: 1200px; margin: 0 auto;
  padding: 3.5rem 5rem;
  display: flex; justify-content: space-between; align-items: center;
}

/* Left — brand logo */
.footer__logo {
  display: block; text-decoration: none;
}
.footer__logo img {
  height: 36px; width: auto;
  opacity: 0.35;
  transition: opacity 0.3s;
}
.footer__logo:hover img { opacity: 0.7; }

/* Center — nav links */
.footer__nav {
  display: flex; gap: 2.5rem;
}
.footer__nav a {
  font-family: var(--font-body); font-size: 0.65rem; font-weight: 400;
  letter-spacing: 0.08em; color: rgba(255,255,255,0.15);
  text-decoration: none;
  transition: color 0.3s;
}
.footer__nav a:hover { color: rgba(255,255,255,0.5); }

/* Right — phone + copy */
.footer__right {
  text-align: right;
}
.footer__phone {
  display: flex; flex-direction: column; align-items: flex-end;
  text-decoration: none; transition: all 0.3s;
  margin-bottom: 0.5rem;
}
.footer__phone-label {
  font-family: var(--font-body); font-size: 0.45rem; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(212,168,83,0.35);
  margin-bottom: 0.2rem;
  transition: color 0.3s;
}
.footer__phone-num {
  font-family: var(--font-body); font-size: 0.8rem; font-weight: 500;
  color: rgba(255,255,255,0.35); letter-spacing: 0.05em;
  transition: color 0.3s;
}
.footer__phone:hover .footer__phone-label { color: var(--accent); }
.footer__phone:hover .footer__phone-num { color: var(--white); }
.footer__copy {
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 400;
  color: rgba(255,255,255,0.25); letter-spacing: 0.08em;
}

@media (max-width: 768px) {
  .footer__inner {
    padding: 2.5rem 1.5rem;
    flex-direction: column; gap: 2rem; text-align: center;
  }
  .footer__right { text-align: center; }
  .footer__phone { align-items: center; }
  .footer__nav { gap: 1.5rem; flex-wrap: wrap; justify-content: center; }
}

/* ══════════════════════════════════════
   PHONE FLOAT BUTTON
   ══════════════════════════════════════ */
/* Call button — chevron slide effect */
.call-btn {
  position: relative; display: inline-flex; align-items: center;
  overflow: hidden; cursor: pointer;
}
.call-btn__text { transition: opacity 0.5s; padding-right: 1.5em; }
.call-btn:hover .call-btn__text { opacity: 0; }
.call-btn__slide {
  position: absolute; right: 2px; top: 2px; bottom: 2px;
  display: flex; align-items: center; justify-content: center;
  width: 22%; border-radius: inherit;
  background: rgba(212,168,83,0.06);
  transition: width 0.5s cubic-bezier(0.25,0.1,0.25,1);
}
.call-btn:hover .call-btn__slide { width: calc(100% - 4px); }
.call-btn:active .call-btn__slide { transform: scale(0.96); }
.call-btn__slide svg { width: 14px; height: 14px; color: var(--accent); opacity: 0.6; }

.phone-float {
  position: fixed; left: 5.5rem; bottom: 2rem; z-index: 100;
  text-decoration: none; display: flex; align-items: center; gap: 0.25rem;
  font-family: var(--font-body); font-size: 0.5rem; font-weight: 500;
  letter-spacing: 0.08em; color: rgba(212,168,83,0.6);
  background: rgba(8,8,8,0.7); border: 1px solid rgba(212,168,83,0.25);
  backdrop-filter: blur(8px); padding: 0.3rem 0.6rem;
  border-radius: 50px; cursor: pointer;
  will-change: transform, opacity, box-shadow; opacity: 0;
}
.phone-float:hover { background: rgba(212,168,83,0.15); }
.phone-float svg { width: 10px; height: 10px; flex-shrink: 0; }
.phone-float.shimmer::after {
  content: ''; position: absolute; inset: -2px; border-radius: 50px;
  background: linear-gradient(90deg, transparent 0%, rgba(212,168,83,0.15) 50%, transparent 100%);
  background-size: 200% 100%; animation: shimmer 1.5s ease-in-out infinite; pointer-events: none;
}
.phone-float.smoke-trail::before {
  content: ''; position: absolute; top: 20%; right: -8px;
  width: 60px; height: 60%;
  background: radial-gradient(ellipse at left center, rgba(212,168,83,0.12) 0%, rgba(212,168,83,0.04) 40%, transparent 70%);
  filter: blur(8px);
  pointer-events: none;
  animation: smokeTrail 2s ease-out forwards;
}
@keyframes smokeTrail {
  0%   { opacity: 0; width: 20px; right: -4px; }
  20%  { opacity: 0.8; width: 50px; }
  50%  { opacity: 0.5; width: 80px; right: -20px; }
  100% { opacity: 0; width: 120px; right: -40px; filter: blur(18px); }
}

/* ══════════════════════════════════════
   SCROLL PROGRESS BAR
   ══════════════════════════════════════ */
.scroll-progress {
  position: fixed; top: 0; left: 0; z-index: 200;
  width: 0; height: 3px;
  background: var(--gradient);
  transition: width 0.05s linear;
  pointer-events: none;
}

/* ══════════════════════════════════════
   WHATSAPP FLOAT
   ══════════════════════════════════════ */
.wa-float {
  position: fixed; bottom: 2rem; right: 2rem; z-index: 120;
  width: 50px; height: 50px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent-deep), var(--accent-red)); display: flex; align-items: center; justify-content: center;
  text-decoration: none; box-shadow: 0 4px 20px rgba(184,134,45,0.15);
  transition: box-shadow 0.3s; animation: waPulse 4s ease-in-out infinite;
}
.wa-float:hover { box-shadow: 0 6px 28px rgba(204,30,30,0.3); animation-play-state: paused; }
.wa-float svg { width: 24px; height: 24px; fill: #fff; }
@keyframes waPulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.12)} }

/* #17 WA Chat Tooltip */
.wa-float__tip {
  position: absolute; right: 60px; top: 50%; transform: translateY(-50%);
  background: rgba(8,8,8,0.85); backdrop-filter: blur(8px);
  border: 1px solid rgba(37,211,102,0.15);
  padding: 0.5rem 1rem; border-radius: 4px; white-space: nowrap;
  font-family: var(--font-body); font-size: 0.65rem; color: rgba(255,255,255,0.6);
  opacity: 0; pointer-events: none; transition: opacity 0.3s;
}
.wa-float:hover .wa-float__tip { opacity: 1; }

/* #16 Language Toggle */
.lang-toggle {
  position: fixed; top: 2rem; left: 50%; transform: translateX(-50%); z-index: 150;
  display: flex; gap: 0;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 20px; overflow: visible;
  opacity: 0; animation: fadeIn 1s 2s forwards;
  isolation: isolate;
}
.lang-toggle a {
  position: relative; z-index: 5; cursor: pointer;
  padding: 0.35rem 0.7rem; font-family: var(--font-body); font-size: 0.55rem;
  font-weight: 600; letter-spacing: 0.08em; text-decoration: none;
  color: rgba(255,255,255,0.25); transition: all 0.3s;
}
.lang-toggle a.active { background: rgba(255,255,255,0.05); color: var(--accent); }
.lang-toggle a:hover { color: rgba(255,255,255,0.6); }
/* Star orbit light */
.lang-toggle__light {
  position: absolute; z-index: 1; inset: 0; overflow: hidden; border-radius: 20px;
  pointer-events: none;
}
.lang-toggle__light::after {
  content: '';
  position: absolute;
  width: 60px; aspect-ratio: 1;
  background: radial-gradient(ellipse at center, var(--accent), rgba(212,168,83,0.4), transparent, transparent);
  offset-path: var(--toggle-path);
  offset-distance: 0%;
  animation: starOrbit 3s linear infinite;
}
@keyframes starOrbit {
  0% { offset-distance: 0%; }
  100% { offset-distance: 100%; }
}

/* #18 Reviews CTA link */
.reviews__cta {
  display: flex; justify-content: center; margin-top: 2rem;
}
.reviews__cta a {
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 500;
  letter-spacing: 0.1em; color: rgba(255,255,255,0.2); text-decoration: none;
  padding: 0.5rem 1.2rem; border: 1px solid rgba(255,255,255,0.04);
  transition: all 0.3s;
}
.reviews__cta a:hover { color: var(--accent); border-color: rgba(212,168,83,0.15); }

/* ══════════════════════════════════════
   SCROLL TO TOP
   ══════════════════════════════════════ */
.stt {
  position: fixed; bottom: 6.5rem; right: 2.8rem; z-index: 120;
  width: 44px; height: 44px; border-radius: 50%;
  background: transparent; border: 0; outline: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; opacity: 0; transform: translateY(10px);
  transition: opacity 0.3s, transform 0.3s; pointer-events: none;
  overflow: hidden;
}
.stt::before, .stt::after {
  content: ''; position: absolute; border-radius: 50%; inset: 4px;
}
.stt::before {
  border: 2px solid rgba(255,255,255,0.15);
  transition: opacity 0.4s cubic-bezier(0.77,0,0.175,1) 80ms,
              transform 0.5s cubic-bezier(0.455,0.03,0.515,0.955) 80ms;
}
.stt::after {
  border: 2px solid var(--accent);
  transform: scale(1.3); opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.165,0.84,0.44,1),
              transform 0.5s cubic-bezier(0.25,0.46,0.45,0.94);
}
.stt:hover::before, .stt:focus::before {
  opacity: 0; transform: scale(0.7);
  transition: opacity 0.4s cubic-bezier(0.165,0.84,0.44,1),
              transform 0.5s cubic-bezier(0.25,0.46,0.45,0.94);
}
.stt:hover::after, .stt:focus::after {
  opacity: 1; transform: scale(1);
  transition: opacity 0.4s cubic-bezier(0.77,0,0.175,1) 80ms,
              transform 0.5s cubic-bezier(0.455,0.03,0.515,0.955) 80ms;
}
.stt.show { opacity: 1; transform: translateY(0); pointer-events: all; animation: sttFloat 2.5s ease-in-out infinite; }
.stt:hover { animation-play-state: paused; }
.stt svg { position: relative; z-index: 2; width: 16px; height: 16px; color: rgba(255,255,255,0.35); transition: color 0.3s; }
.stt:hover svg { color: var(--accent); }
@keyframes sttFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }

/* ══════════════════════════════════════
   PAGE LOADER
   ══════════════════════════════════════ */
.loader { display: none; }

/* Lamp — permanent fixed background */
.lamp-bg {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none;
  background: #000; overflow: hidden;
}
#shaderCanvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0.12; z-index: 1;
}
/* Ghost photo cards */
.ghost-cards { position: absolute; inset: 0; z-index: 0; }
.ghost-card {
  position: absolute; border-radius: 8px; overflow: hidden;
  border: 1px solid rgba(212,168,83,0.04);
  box-shadow: 0 0 20px rgba(0,0,0,0.5);
  opacity: 0;
  animation: ghostFadeIn 3s 1.5s ease-out forwards;
}
.ghost-card img {
  width: 100%; height: 100%; object-fit: cover;
  filter: grayscale(0.8) brightness(0.3);
}
@keyframes ghostFadeIn { 0%{opacity:0} 100%{opacity:var(--gc-o,0.07)} }
@keyframes ghostDrift1 { 0%,100%{transform:translate(0,0) rotate(-2deg)} 50%{transform:translate(8px,-12px) rotate(1deg)} }
@keyframes ghostDrift2 { 0%,100%{transform:translate(0,0) rotate(2deg)} 50%{transform:translate(-10px,8px) rotate(-1deg)} }
@keyframes ghostDrift3 { 0%,100%{transform:translate(0,0) rotate(1deg)} 50%{transform:translate(6px,10px) rotate(-2deg)} }

.gc-1 { width:140px; height:100px; top:8%; left:6%; --gc-o:0.08;
  animation: ghostFadeIn 3s 1.5s ease-out forwards, ghostDrift1 20s 4s ease-in-out infinite; }
.gc-2 { width:160px; height:110px; top:12%; right:8%; --gc-o:0.06;
  animation: ghostFadeIn 3s 2s ease-out forwards, ghostDrift2 22s 4.5s ease-in-out infinite; }
.gc-3 { width:120px; height:90px; top:45%; left:4%; --gc-o:0.07;
  animation: ghostFadeIn 3s 2.5s ease-out forwards, ghostDrift3 18s 5s ease-in-out infinite; }
.gc-4 { width:130px; height:95px; top:35%; right:5%; --gc-o:0.05;
  animation: ghostFadeIn 3s 3s ease-out forwards, ghostDrift1 25s 5.5s ease-in-out infinite; }
.gc-5 { width:150px; height:105px; bottom:18%; left:8%; --gc-o:0.06;
  animation: ghostFadeIn 3s 3.5s ease-out forwards, ghostDrift2 19s 6s ease-in-out infinite; }
.gc-6 { width:135px; height:100px; bottom:12%; right:10%; --gc-o:0.08;
  animation: ghostFadeIn 3s 2.8s ease-out forwards, ghostDrift3 23s 5.2s ease-in-out infinite; }
.gc-7 { width:110px; height:80px; top:70%; left:35%; --gc-o:0.04;
  animation: ghostFadeIn 3s 4s ease-out forwards, ghostDrift1 21s 6.5s ease-in-out infinite; }
.lamp-bg .lamp__beam-l, .lamp-bg .lamp__beam-r {
  position: absolute; top: 43%; height: 220px; z-index: 2;
  opacity: 0;
  animation: lampExpand 1.5s 0.3s ease-in-out forwards;
}
.lamp-bg .lamp__beam-l {
  right: 50%;
  background-image: conic-gradient(from 70deg at center top, rgba(220,195,145,0.7), rgba(220,195,145,0.2), transparent);
}
.lamp-bg .lamp__beam-r {
  left: 50%;
  background-image: conic-gradient(from 290deg at center top, transparent, rgba(195,80,40,0.3), rgba(195,80,40,0.9));
}
.lamp-bg .lamp__beam-l::after, .lamp-bg .lamp__beam-r::after {
  content: ''; position: absolute; bottom: 0; width: 100%; height: 160px;
  background: #000;
  mask-image: linear-gradient(to top, #000, transparent);
  -webkit-mask-image: linear-gradient(to top, #000, transparent);
}
.lamp-bg .lamp__beam-l::before {
  content: ''; position: absolute; left: 0; width: 160px; height: 100%;
  background: #000;
  mask-image: linear-gradient(to right, #000, transparent);
  -webkit-mask-image: linear-gradient(to right, #000, transparent);
}
.lamp-bg .lamp__beam-r::before {
  content: ''; position: absolute; right: 0; width: 160px; height: 100%;
  background: #000;
  mask-image: linear-gradient(to left, #000, transparent);
  -webkit-mask-image: linear-gradient(to left, #000, transparent);
}
.lamp-bg .lamp__blur {
  position: absolute; top: calc(43% + 60px); left: 0; width: 100%; height: 190px;
  transform: scaleX(1.5); background: #000; filter: blur(20px); z-index: 3;
}
.lamp-bg .lamp__glow {
  position: absolute; top: calc(43% + 30px); left: 50%; transform: translateX(-50%);
  width: 0; height: 140px; border-radius: 50%; z-index: 3;
  background: radial-gradient(ellipse, rgba(195,80,40,0.2), rgba(220,195,145,0.08), transparent);
  opacity: 0; filter: blur(60px);
  animation: lampGlow 1.5s 0.5s ease-in-out forwards;
}
.lamp-bg .lamp__line { display: none; }
@keyframes lampExpand {
  0%   { width: 12rem; opacity: 0.3; }
  100% { width: 30rem; opacity: 0.8; }
}
@keyframes lampGlow {
  0%   { width: 6rem; opacity: 0; }
  100% { width: 22rem; opacity: 0.4; }
}
@keyframes lampLine {
  0%   { width: 0; }
  100% { width: 28rem; }
}

/* ══════════════════════════════════════
   KEYFRAMES
   ══════════════════════════════════════ */
@keyframes slideUp { to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { to { opacity: 1; } }
@keyframes scrollPulse { 0%, 100% { opacity: 0.4; height: 40px; } 50% { opacity: 1; height: 55px; } }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }

/* #8 Reduced motion support */

/* #12 Page transition */
.page-exit {
  animation: pageOut 0.4s ease-in forwards;
}
@keyframes pageOut {
  to { opacity: 0; transform: translateY(-10px); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  /* Hide heavy background animations */
  #shaderCanvas { display: none !important; }
  .ghost-cards, .ghost-card { display: none !important; }
  .lamp__beam-l, .lamp__beam-r, .lamp__blur, .lamp__glow { display: none !important; }
  .services__rain, .services__sweep,
  .faq__mesh, .faq__mesh-sweep,
  .cform__mesh, .cform__mesh-sweep,
  .blog__mesh, .blog__mesh-sweep { display: none !important; }
  .services__rain-col, .faq__mesh-col, .cform__mesh-col, .blog__mesh-col,
  .wa-float, .stt, .loader { animation: none !important; }
  .scroll-progress { transition: none !important; }
  .morph-section .stagger, .morph-section, .reveal { opacity: 1 !important; transform: none !important; filter: none !important; }
  /* Stop infinite animations */
  .craft-quote__cycle .cw,
  .hero__word-carousel .word { animation: none !important; transition: none !important; }
  .lang-toggle__light { display: none !important; }
  .team-beams svg { display: none !important; }
  .ig-fixed::before { display: none !important; }
  /* Disable 3D scroll on team */
  .team-scroll-card { transform: none !important; }
  /* Disable hand-drawn circle animation */
  /* Disable hover transforms */
  .ig-fixed:hover, .card:hover, .gallery__bento-item:hover,
  .seo-card:hover, .blog__card:hover { transform: none !important; }
  /* Cycling words: show only first */
  .craft-quote__cycle .cw { opacity: 0 !important; transform: none !important; position: absolute !important; }
  .craft-quote__cycle .cw.active { opacity: 1 !important; }
  /* Word carousel: show only active */
  .hero__word-carousel .word { opacity: 0 !important; }
  .hero__word-carousel .word.active { opacity: 1 !important; }
  /* Vapor canvas hidden */
  .cq-vapor { display: none !important; }
  /* Lamp fade: skip animation, just hide via class */
  .lamp-bg--fade { opacity: 0 !important; animation: none !important; }
  /* Smoke trail */
  .kvkk-smoke { display: none !important; }
  /* Star orbit */
  @keyframes starOrbit { from, to { offset-distance: 0%; } }
}

/* ══════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════ */
@media (max-width: 768px) {
  .hero__content { padding: 2rem 1.5rem 2.5rem; }
  .hero__dots { right: 1.5rem; gap: 18px; }
  .hero__dot { width: 8px; height: 8px; }
  .hero__main { gap: 1rem; }
  .hero__desc { font-size: 0.85rem; }
  .hero__scroll { display: none; }
  .hero__logo { right: 1.5rem; top: 1rem; }
  .hero__logo img { height: 40px; }
  .ig-fixed { left: 1.5rem; top: 1.2rem; font-size: 0.6rem; }
  .hero__intl { position: static; transform: none; white-space: normal; margin-top: 0.5rem; }
  .hero__word-carousel { width: 100%; }
  .services { padding: 5rem 1.5rem 4rem; }
  .services__header { flex-direction: column; align-items: flex-start; }
  .services__subtitle { text-align: left; max-width: 100%; }
  .cards-main { grid-template-columns: 1fr; gap: 1px; }
  .seo-grid { grid-template-columns: 1fr 1fr; }
  .gallery, .reviews, .faq { padding: 5rem 1.5rem; }
  .gallery__grid { grid-template-columns: 1fr 1fr; }
  .contact__grid { grid-template-columns: 1fr; gap: 3rem; }
  .phone-float { left: 1rem; bottom: 4.5rem; font-size: 0.6rem; padding: 0.4rem 0.75rem; }
  .hero__cta { left: 1.5rem; font-size: 0.6rem; }
  .hero__cta-letters { gap: 14px; }
  .services__counter { font-size: 5rem; }
  
  /* Hide heavy bg animations on mobile (perf) */
  #shaderCanvas { opacity: 0.06; }
  .ghost-card { display: none; }
  
  /* Craft quote — smaller, repositioned */
  .craft-quote { font-size: 0.7rem; max-width: 280px; padding: 0 1rem; line-height: 1.6; top: 50%; }
  
  /* Trust badge */
  .trust-badge { padding: 0.25rem 0.7rem 0.25rem 0.25rem; }
  .trust-badge__text { font-size: 0.5rem; }
  .trust-badge__avatars img { width: 18px; height: 18px; }
  
  /* Lang toggle — adjust for mobile */
  .lang-toggle { top: 1rem; }
  
  /* Bento grid — single column on mobile */
  .gallery__bento { grid-template-columns: 1fr; grid-auto-rows: 180px; }
  .bento-span-1, .bento-span-2, .bento-span-3, .bento-span-4, .bento-span-5 {
    grid-column: span 1; grid-row: span 1;
  }
  
  /* Team 3D scroll — disable on mobile */
  .team-scroll-card { transform: none !important; }
  
  /* Contact phone — smaller circle */
  .contact__phone-wrap { padding: 0.4rem 0.5rem; }
  
  /* Footer */
  .footer__inner { flex-direction: column; gap: 2rem; text-align: center; }
  .footer__nav { justify-content: center; }
  .footer__right { align-items: center; }
  
  /* Hide some heavy floats on small mobile */
  .stt { right: 1rem; bottom: 5rem; }
  .wa-float { right: 1rem; bottom: 1rem; }
}

/* Smaller screens — phones < 480px */
@media (max-width: 480px) {
  .hero__heading { font-size: 2.5rem; }
  .craft-quote { font-size: 0.65rem; line-height: 1.5; }
  .seo-grid { grid-template-columns: 1fr; }
  .contact__card { padding: 2rem 1.5rem; }
  .contact__card-phone-num.call-btn { font-size: 1.4rem; }
}

/* Touch device improvements — disable hover effects */
@media (hover: none) and (pointer: coarse) {
  .card:hover, .seo-card:hover, .blog__card:hover,
  .gallery__bento-item:hover, .ig-fixed:hover {
    transform: none !important;
  }
  .call-btn:hover .call-btn__slide { width: 24%; }
  .call-btn:hover .call-btn__text { opacity: 1; }
}

/* ══ NUCLEAR: Force all section content visible ══ */
section .reveal,
section .stagger,
section .gallery__bento-item,
section .contact__card-phone-label,
section .contact__card-phone-num,
section .contact__card-item,
section .services__intro,
section .card,
section .review-card,
section .team-card,
section .faq__item,
section .blog__card,
section .seo-card,
section .process__step,
section .section-label,
section .section-title,
section .stats-ticker {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  visibility: visible !important;
}