/* =============================================
   DESIGN POLISH LAYER
   Surfaces · Typography · Motion · Interaction
   ============================================= */

/* ─── 1. SURFACE TEXTURE & DEPTH ─── */

/* Subtle grain texture via SVG noise for tactile, premium feel */
body.page-home::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: 0.028;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 200px 200px;
  mix-blend-mode: multiply;
}

/* Warmer, more luminous gold accent */
body.page-home {
  --home-gold: #c4944a;
  --home-gold-glow: rgba(196, 148, 74, 0.22);
  --home-gold-soft: rgba(196, 148, 74, 0.14);
  --home-cyan-glow: rgba(136, 206, 217, 0.18);
  --home-glass: rgba(255, 252, 247, 0.62);
  --home-glass-strong: rgba(255, 252, 247, 0.82);
  --ease-premium: cubic-bezier(0.16, 0.84, 0.24, 1);
  --ease-bounce: cubic-bezier(0.34, 1.46, 0.64, 1);

  /* ── Pass 3: Duration scale ── */
  --dur-fast: 180ms;
  --dur-base: 260ms;
  --dur-slow: 380ms;
  --dur-entrance: 520ms;

  /* ── Pass 3: Unified text-opacity scale (light-on-dark) ── */
  --light-muted: rgba(255, 246, 236, 0.64);
  --light-subtle: rgba(255, 246, 236, 0.44);

  /* ── Pass 3: Warm ambient glow for light sections ── */
  --section-glow-gold: radial-gradient(ellipse 50% 40% at 10% 20%, rgba(196, 148, 74, 0.05), transparent 70%);
  --section-glow-cyan: radial-gradient(ellipse 40% 50% at 90% 80%, rgba(136, 206, 217, 0.04), transparent 70%);
}


/* ─── 2. SCROLL PROGRESS REFINEMENT ─── */

.page-home .scroll-progress {
  height: 2px;
  background: linear-gradient(90deg,
    rgba(196, 148, 74, 0.92),
    rgba(136, 206, 217, 0.88) 60%,
    rgba(196, 148, 74, 0.78));
  box-shadow:
    0 0 18px rgba(196, 148, 74, 0.4),
    0 0 6px rgba(136, 206, 217, 0.3);
}


/* ─── 3. TYPOGRAPHY REFINEMENTS ─── */

.page-home .section-kicker {
  font-size: 11.5px;
  letter-spacing: 0.22em;
  font-weight: 800;
}

.page-home .section-kicker::before {
  width: 48px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--home-gold), rgba(136, 206, 217, 0.4));
}

.page-home .section-head p {
  font-size: 17.5px;
  line-height: 1.78;
}

.page-home .lead {
  font-size: 18.5px;
  line-height: 1.76;
  letter-spacing: 0.003em;
}


/* ─── 4. SECTION FLOW — SOFT TRANSITIONS ─── */

/* Top gradient bridge after hero into angebot */
.page-home #angebot::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 120px;
  background: linear-gradient(180deg,
    rgba(11, 36, 49, 0.06),
    rgba(247, 239, 227, 0.0) 100%);
  pointer-events: none;
  z-index: 0;
}

/* Transition bridge: ablauf (dark) → messung (light) */
.page-home #messung::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 100px;
  background: linear-gradient(180deg,
    rgba(11, 36, 49, 0.05),
    transparent 100%);
  pointer-events: none;
  z-index: 0;
}

/* Transition bridge: garantie → map-check */
.page-home #map-check::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 80px;
  background: linear-gradient(180deg,
    rgba(245, 237, 224, 0.3),
    transparent 100%);
  pointer-events: none;
  z-index: 0;
}


/* ─── 4b. MISSING SECTION BRIDGES (Pass 3) ─── */

/* Bridge: angebot (light) → ablauf (dark) — fade warm into navy */
.page-home #ablauf::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 100px;
  background: linear-gradient(180deg,
    rgba(247, 239, 227, 0.06),
    transparent 100%);
  pointer-events: none;
  z-index: 0;
}

/* Bridge: messung (light) → garantie (light) — subtle warmth shift */
.page-home #garantie::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 60px;
  background: linear-gradient(180deg,
    rgba(255, 252, 247, 0.4),
    transparent 100%);
  pointer-events: none;
  z-index: 0;
}

/* Bridge: faq (light) → cta-final (dark) — paper fading into navy */
.page-home .cta-final::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  height: 90px;
  background: linear-gradient(180deg,
    rgba(247, 239, 227, 0.05),
    transparent 100%);
  pointer-events: none;
  z-index: 0;
}

.page-home .cta-final {
  position: relative;
}


/* ─── 4c. FLAT SECTION ELEVATION (Pass 3) ─── */

/* Messung: ambient dual-glow to match angebot's depth */
.page-home #messung {
  position: relative;
}

.page-home #messung::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    var(--section-glow-gold),
    var(--section-glow-cyan);
  pointer-events: none;
  z-index: 0;
}

/* Garantie: ambient gold warmth at section level */
.page-home #garantie {
  position: relative;
}

.page-home #garantie::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 50% at 85% 30%,
    rgba(196, 148, 74, 0.04), transparent 65%);
  pointer-events: none;
  z-index: 0;
}

/* FAQ: warm background wash + subtle container presence */
.page-home #faq {
  position: relative;
  background: linear-gradient(180deg,
    rgba(255, 252, 247, 0.6),
    rgba(247, 239, 227, 0.3) 50%,
    rgba(255, 252, 247, 0.5));
}

.page-home #faq::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 50% 40% at 8% 60%, rgba(136, 206, 217, 0.03), transparent 60%),
    radial-gradient(ellipse 40% 50% at 92% 30%, rgba(196, 148, 74, 0.04), transparent 60%);
  pointer-events: none;
  z-index: 0;
}

/* FAQ shell: restore subtle visual envelope */
.page-home .faq-shell {
  border-radius: 28px;
  background: rgba(255, 252, 247, 0.38);
  border: 1px solid rgba(21, 39, 52, 0.04);
  box-shadow: 0 8px 32px rgba(10, 25, 34, 0.03);
}


/* ─── 5. BUTTON PREMIUM ─── */

.page-home .btn-primary {
  position: relative;
  isolation: isolate;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* Premium glow on hover */
.page-home .btn-primary::before {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(135deg,
    rgba(196, 148, 74, 0.3),
    rgba(136, 206, 217, 0.2));
  opacity: 0;
  z-index: -1;
  filter: blur(14px);
  transition: opacity 380ms var(--ease-premium);
}

.page-home .btn-primary:hover::before,
.page-home .btn-primary:focus-visible::before {
  opacity: 1;
}

/* Better hover transform */
.page-home .btn-primary:hover {
  transform: translateY(-3px);
  box-shadow:
    0 26px 56px rgba(8, 28, 39, 0.24),
    0 0 0 5px rgba(136, 206, 217, 0.1),
    0 0 36px rgba(196, 148, 74, 0.12);
}

.page-home .btn-primary:active {
  transform: translateY(-1px);
  transition-duration: 80ms;
}

/* Ghost button refinement */
.page-home .btn-ghost {
  backdrop-filter: blur(12px);
  transition:
    background 220ms ease,
    border-color 280ms ease,
    box-shadow 280ms ease,
    transform 220ms ease,
    color 180ms ease;
}

.page-home .btn-ghost:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(10, 25, 34, 0.08);
  border-color: rgba(21, 39, 52, 0.18);
}


/* ─── 6. CARD HOVER PREMIUM ─── */

/* Directional light effect on card hover */
.page-home #angebot .card {
  transition:
    transform 320ms var(--ease-premium),
    background 320ms var(--ease-premium),
    box-shadow 320ms var(--ease-premium),
    border-color 280ms ease;
}

.page-home #angebot .card:hover {
  background: linear-gradient(180deg,
    rgba(255, 255, 255, 0.12),
    rgba(255, 252, 247, 0.04));
}

/* Step cards: premium hover with glow ring on index */
/* Pass 3: Give steps a base visual presence (not transparent/flat) */
.page-home .step {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 22px;
  padding-left: 24px;
  border-left: 2px solid rgba(255, 255, 255, 0.06);
  transition:
    transform 320ms var(--ease-premium),
    background 320ms var(--ease-premium),
    box-shadow 320ms var(--ease-premium),
    border-left-color var(--dur-base) ease;
}

.page-home .step:hover {
  background: rgba(255, 255, 255, 0.06);
  border-left-color: rgba(196, 148, 74, 0.3);
  box-shadow: 0 8px 28px rgba(6, 20, 29, 0.12);
}

.page-home .step-highlight {
  border-left-color: rgba(196, 148, 74, 0.2);
}

.page-home .step-dark {
  border-left-color: rgba(136, 206, 217, 0.15);
}

.page-home .step-dark:hover {
  border-left-color: rgba(136, 206, 217, 0.35);
}

/* Step index badge: subtle glow on hover */
.page-home .step-index {
  transition:
    background var(--dur-base) ease,
    box-shadow var(--dur-slow) ease;
}

.page-home .step:hover .step-index {
  box-shadow: 0 0 16px rgba(196, 148, 74, 0.2);
}

/* Guarantee lanes: subtle highlight sweep */
.page-home .guarantee-lane {
  transition:
    background 320ms var(--ease-premium),
    transform var(--dur-base) var(--ease-premium),
    box-shadow var(--dur-base) ease;
}

.page-home .guarantee-lane:hover {
  background: linear-gradient(135deg,
    rgba(196, 148, 74, 0.04),
    rgba(136, 206, 217, 0.04));
  transform: translateX(3px);
  box-shadow: -3px 0 18px rgba(10, 25, 34, 0.03);
}


/* ─── 6b. MEASURE SECTION REFINEMENTS (Pass 3) ─── */

/* Measure-ledger: Proper card treatment instead of afterthought */
.page-home .measure-ledger {
  margin-top: 32px;
  padding: 28px 32px;
  border-radius: 22px;
  background: rgba(255, 252, 247, 0.52);
  border: 1px solid rgba(21, 39, 52, 0.05);
  box-shadow: 0 6px 24px rgba(10, 25, 34, 0.03);
}

.page-home .measure-legend-item {
  transition: background var(--dur-fast) ease;
  padding: 6px 10px;
  margin: -6px -10px;
  border-radius: 10px;
}

.page-home .measure-legend-item:hover {
  background: rgba(196, 148, 74, 0.06);
}

/* Measure-legend dot: subtle gold tint */
.page-home .measure-legend-dot {
  background: var(--home-gold);
  opacity: 0.6;
}

/* Measure-lane hover refinement */
.page-home .measure-lane {
  transition:
    transform var(--dur-base) var(--ease-premium),
    box-shadow var(--dur-base) ease;
}

.page-home .measure-lane:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(10, 25, 34, 0.07);
}


/* ─── 7. FORM — COMPATIBLE POLISH ─── */

/* Subtle radial accent in bottom-left corner */
.page-home .form {
  background:
    radial-gradient(circle at 0% 100%, rgba(196, 148, 74, 0.05), transparent 40%),
    linear-gradient(180deg, rgba(255, 253, 248, 0.98), rgba(249, 243, 233, 0.94));
}

/* Lift the submit button slightly more */
.page-home .form .btn-primary {
  box-shadow:
    0 16px 36px rgba(10, 25, 34, 0.12),
    0 0 0 1px rgba(196, 148, 74, 0.1);
}


/* ─── 8. FAQ — COMPATIBLE POLISH ─── */

/* Add missing hover transitions on FAQ items (none exist in base) */
.page-home .faq-item {
  transition: background 220ms ease;
}

.page-home .faq-item:hover {
  background: rgba(247, 239, 227, 0.18);
}

/* Sidecard point hover polish */
.page-home .faq-sidecard-point {
  transition: transform 260ms var(--ease-premium);
}

.page-home .faq-sidecard-point:hover {
  transform: translateX(3px);
}

/* Pass 3: FAQ group heads — subtle visual hierarchy marker */
.page-home .faq-group-head {
  transition: background var(--dur-base) ease;
  padding: 12px 16px;
  margin: -12px -16px;
  border-radius: 16px;
}

.page-home .faq-group-head:hover {
  background: rgba(196, 148, 74, 0.04);
}

/* Pass 3: FAQ group index — warm accent on hover */
.page-home .faq-group-index {
  transition:
    background var(--dur-base) ease,
    box-shadow var(--dur-slow) ease;
}

.page-home .faq-group-head:hover .faq-group-index {
  box-shadow: 0 0 14px rgba(196, 148, 74, 0.15);
}

/* Pass 3: FAQ item summary — refined hover with left accent */
.page-home .faq-item summary {
  position: relative;
  transition: padding-left var(--dur-base) var(--ease-premium);
}

.page-home .faq-item:hover summary {
  padding-left: 4px;
}

/* Pass 3: FAQ icon rotation refinement */
.page-home .faq-icon {
  transition: transform var(--dur-base) var(--ease-premium);
}


/* ─── 9. CTA — COMPATIBLE POLISH ─── */

/* Add missing hover transitions to decision items (dark CTA section) */
.page-home .cta-decision-item {
  transition:
    background 220ms ease,
    border-color 220ms ease,
    transform 260ms var(--ease-premium);
}

.page-home .cta-decision-item:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.08);
  transform: translateY(-1px);
}

/* Sidecard point index glow on hover */
.page-home .cta-sidecard-point {
  transition: transform 260ms var(--ease-premium);
}

.page-home .cta-sidecard-point:hover {
  transform: translateX(3px);
}

.page-home .cta-sidecard-index {
  transition: background 260ms ease, box-shadow 260ms ease;
}

.page-home .cta-sidecard-point:hover .cta-sidecard-index {
  background: rgba(255, 255, 255, 0.14);
  box-shadow: 0 0 14px rgba(196, 148, 74, 0.18);
}

/* Add smooth transition to CTA ghost buttons (currently instant) */
.page-home .cta-actions .btn-ghost {
  transition:
    background 220ms ease,
    border-color 220ms ease,
    color 180ms ease,
    transform 260ms var(--ease-premium);
}

.page-home .cta-actions .btn-ghost:hover {
  transform: translateY(-2px);
}


/* ─── 10. FOOTER — COMPATIBLE POLISH ─── */

/* Add missing hover transitions to footer links (base has none) */
.page-home .footer-link {
  transition:
    color var(--dur-fast) ease,
    transform 220ms var(--ease-premium);
}

.page-home .footer-link:hover {
  color: #fffaf4;
  transform: translateX(4px);
}

/* Subtle hover effect on footer facts */
.page-home .footer-fact {
  padding: 8px 10px;
  margin: -8px -10px;
  border-radius: 12px;
  transition: background 220ms ease;
}

.page-home .footer-fact:hover {
  background: rgba(255, 255, 255, 0.03);
}

/* Pass 3: Desktop footer columns — elevated from plain text to structured sections */
.page-home .footer-utility-columns {
  gap: 0;
}

.page-home .footer-column {
  padding: 24px 28px;
  border-radius: 20px;
  transition: background var(--dur-base) ease;
}

.page-home .footer-column:hover {
  background: rgba(255, 255, 255, 0.025);
}

/* Footer heading: subtle bottom accent */
.page-home .footer-heading {
  position: relative;
  padding-bottom: 12px;
  margin-bottom: 16px;
}

.page-home .footer-heading::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 32px;
  height: 1.5px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--home-gold), transparent);
  opacity: 0.5;
}

/* Footer topline: refined separator presence */
.page-home .footer-topline {
  padding-bottom: 24px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Footer bottom: subtle upper divider */
.page-home .footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  padding-top: 20px;
}


/* ─── 11. FOCUS STATES ─── */

.page-home *:focus-visible {
  outline: 2px solid rgba(136, 206, 217, 0.54);
  outline-offset: 3px;
}

.page-home .btn:focus-visible {
  outline: 2px solid rgba(136, 206, 217, 0.6);
  outline-offset: 4px;
  box-shadow:
    0 0 0 4px rgba(136, 206, 217, 0.12),
    0 18px 40px rgba(8, 28, 39, 0.18);
}


/* ─── 12. ENHANCED SCROLL REVEALS ─── */

.page-home .reveal-up {
  opacity: 0;
  transform: translateY(32px);
  transition:
    opacity 680ms var(--ease-premium),
    transform 720ms var(--ease-premium);
  transition-delay: var(--reveal-delay, 0ms);
}

.page-home .reveal-up.is-visible {
  opacity: 1;
  transform: none;
}

/* Staggered reveals for child elements within visible containers */
.page-home .is-visible .hero-ledger-item,
.page-home .is-visible .offer-qualifier,
.page-home .is-visible .cta-decision-item,
.page-home .is-visible .guarantee-ledger-item,
.page-home .is-visible .measure-legend-item,
.page-home .is-visible .faq-sidecard-point,
.page-home .is-visible .cta-sidecard-point,
.page-home .is-visible .footer-fact {
  animation: stagger-in 520ms var(--ease-premium) both;
}

.page-home .is-visible .hero-ledger-item:nth-child(1),
.page-home .is-visible .offer-qualifier:nth-child(1),
.page-home .is-visible .cta-decision-item:nth-child(1),
.page-home .is-visible .guarantee-ledger-item:nth-child(1),
.page-home .is-visible .faq-sidecard-point:nth-child(1),
.page-home .is-visible .cta-sidecard-point:nth-child(1),
.page-home .is-visible .footer-fact:nth-child(1) { animation-delay: 60ms; }

.page-home .is-visible .hero-ledger-item:nth-child(2),
.page-home .is-visible .offer-qualifier:nth-child(2),
.page-home .is-visible .cta-decision-item:nth-child(2),
.page-home .is-visible .guarantee-ledger-item:nth-child(2),
.page-home .is-visible .faq-sidecard-point:nth-child(2),
.page-home .is-visible .cta-sidecard-point:nth-child(2),
.page-home .is-visible .footer-fact:nth-child(2) { animation-delay: 120ms; }

.page-home .is-visible .hero-ledger-item:nth-child(3),
.page-home .is-visible .offer-qualifier:nth-child(3),
.page-home .is-visible .cta-decision-item:nth-child(3),
.page-home .is-visible .guarantee-ledger-item:nth-child(3),
.page-home .is-visible .faq-sidecard-point:nth-child(3),
.page-home .is-visible .cta-sidecard-point:nth-child(3),
.page-home .is-visible .footer-fact:nth-child(3) { animation-delay: 180ms; }

.page-home .is-visible .hero-ledger-item:nth-child(4),
.page-home .is-visible .cta-decision-item:nth-child(4),
.page-home .is-visible .guarantee-ledger-item:nth-child(4) { animation-delay: 240ms; }

@keyframes stagger-in {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Offer cards stagger on desktop */
@media (min-width: 981px) {
  .page-home .is-visible .card:nth-child(1) {
    animation: card-rise 580ms var(--ease-premium) 80ms both;
  }
  .page-home .is-visible .card:nth-child(2) {
    animation: card-rise 580ms var(--ease-premium) 180ms both;
  }
  .page-home .is-visible .card:nth-child(3) {
    animation: card-rise 580ms var(--ease-premium) 260ms both;
  }
}

@keyframes card-rise {
  from {
    opacity: 0;
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}


/* ─── 12b. PASS 3: STAGGERED ENTRANCES FOR DEEPER SECTIONS ─── */

/* Timeline steps: staggered slide-in from left */
.page-home .is-visible .step:nth-child(1) {
  animation: step-slide var(--dur-entrance) var(--ease-premium) 60ms both;
}
.page-home .is-visible .step:nth-child(2) {
  animation: step-slide var(--dur-entrance) var(--ease-premium) 140ms both;
}
.page-home .is-visible .step:nth-child(3) {
  animation: step-slide var(--dur-entrance) var(--ease-premium) 220ms both;
}
.page-home .is-visible .step:nth-child(4) {
  animation: step-slide var(--dur-entrance) var(--ease-premium) 300ms both;
}

@keyframes step-slide {
  from {
    opacity: 0;
    transform: translateX(-16px) translateY(10px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Measure lanes: staggered rise */
.page-home .is-visible .measure-lane:nth-child(1) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 80ms both;
}
.page-home .is-visible .measure-lane:nth-child(2) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 160ms both;
}
.page-home .is-visible .measure-lane:nth-child(3) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 240ms both;
}
.page-home .is-visible .measure-lane:nth-child(4) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 320ms both;
}

/* Guarantee lanes: staggered rise */
.page-home .is-visible .guarantee-lane:nth-child(1) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 80ms both;
}
.page-home .is-visible .guarantee-lane:nth-child(2) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 170ms both;
}
.page-home .is-visible .guarantee-lane:nth-child(3) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 260ms both;
}

/* FAQ groups: staggered entrance */
.page-home .is-visible .faq-group:nth-child(1) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 60ms both;
}
.page-home .is-visible .faq-group:nth-child(2) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 150ms both;
}
.page-home .is-visible .faq-group:nth-child(3) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 240ms both;
}

/* Method cards (map-check): staggered entrance */
.page-home .is-visible .method-card:nth-child(1) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 80ms both;
}
.page-home .is-visible .method-card:nth-child(2) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 180ms both;
}
.page-home .is-visible .method-card:nth-child(3) {
  animation: card-rise var(--dur-entrance) var(--ease-premium) 260ms both;
}


/* ─── 13. HERO LEDGER POLISH ─── */

.page-home .hero-ledger {
  gap: 0;
  padding: 0;
  margin-top: 36px;
  border-top: 0;
  border-radius: 28px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.page-home .hero-ledger-item {
  gap: 6px;
  padding: 18px 22px;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  transition: background 260ms ease;
}

.page-home .hero-ledger-item:last-child {
  border-right: 0;
}

.page-home .hero-ledger-item:hover {
  background: rgba(255, 255, 255, 0.04);
}

.page-home .hero-ledger-k {
  font-size: 10.5px;
}

.page-home .hero-ledger-v {
  font-size: 14.5px;
  line-height: 1.5;
}


/* ─── 14. MAP CHECK SECTION POLISH ─── */

.page-home .method-card {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(21, 39, 52, 0.08);
  background: rgba(255, 252, 247, 0.86);
  box-shadow: 0 16px 34px rgba(10, 25, 34, 0.05);
  transition:
    transform 280ms var(--ease-premium),
    box-shadow 280ms var(--ease-premium),
    border-color 260ms ease;
}

.page-home .method-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 42px rgba(10, 25, 34, 0.08);
  border-color: rgba(21, 39, 52, 0.12);
}

.page-home .method-card-dark {
  background: linear-gradient(160deg, #0b2532, #123747);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 20px 46px rgba(6, 20, 29, 0.18);
}

.page-home .method-card-dark:hover {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 26px 56px rgba(6, 20, 29, 0.22);
}


/* ─── 16. SCROLL-TO-TOP BUTTON ─── */

.page-home .scroll-top {
  border-radius: 50%;
  width: 48px;
  height: 48px;
  background: rgba(255, 252, 247, 0.92);
  border: 1px solid rgba(21, 39, 52, 0.1);
  box-shadow: 0 12px 28px rgba(10, 25, 34, 0.1);
  color: var(--home-ink);
  transition:
    transform 260ms var(--ease-premium),
    box-shadow 260ms ease,
    background 220ms ease;
}

.page-home .scroll-top:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 36px rgba(10, 25, 34, 0.14);
  background: #fffaf4;
}


/* ─── 17. COOKIE BANNER REFINEMENT ─── */

.page-home .cookie-banner {
  border-radius: 24px 24px 0 0;
  border: 1px solid rgba(21, 39, 52, 0.08);
  border-bottom: 0;
  background: rgba(255, 252, 247, 0.96);
  backdrop-filter: blur(24px);
  box-shadow: 0 -18px 48px rgba(10, 25, 34, 0.1);
}


/* ─── 18. OFFER CONTEXT LINKS ─── */

.page-home .offer-context-link {
  position: relative;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    transform 220ms var(--ease-premium);
}

.page-home .offer-context-link-primary:hover {
  transform: translateX(3px);
}


/* ─── 19. GUARANTEE BADGES DIFFERENTIATION ─── */

.page-home .guarantee-lane-success {
  border-left: 3px solid rgba(136, 206, 217, 0.5);
}

.page-home .guarantee-lane-partial {
  border-left: 3px solid rgba(196, 148, 74, 0.5);
}

.page-home .guarantee-lane-full {
  border-left: 3px solid rgba(21, 39, 52, 0.2);
}


/* ─── 20. SCOPE VISUAL ENHANCEMENTS ─── */

.page-home .scope-ring {
  animation: scope-ring-glow 6s ease-in-out infinite;
}

.page-home .scope-ring-lg { animation-delay: 0s; }
.page-home .scope-ring-md { animation-delay: 2s; }
.page-home .scope-ring-sm { animation-delay: 4s; }

.page-home .scope-node {
  transition:
    transform 420ms cubic-bezier(0.18, 0.82, 0.24, 1),
    box-shadow 420ms ease,
    background 420ms ease;
}

.page-home .scope-node:hover {
  box-shadow: 0 20px 34px rgba(5, 17, 24, 0.18);
  transform: translate3d(var(--hero-shift-x-lg), var(--hero-shift-y-lg), 0) scale(1.06);
}


/* ─── RESPONSIVE REFINEMENTS ─── */

@media (max-width: 980px) {
  .page-home .hero-ledger {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .page-home .hero-ledger {
    grid-template-columns: 1fr;
    border-radius: 22px;
  }

  .page-home .hero-ledger-item {
    padding: 14px 18px;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }

  .page-home .hero-ledger-item:last-child {
    border-bottom: 0;
  }

  .page-home .guarantee-ledger {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 420px) {
  .page-home .guarantee-ledger {
    grid-template-columns: 1fr;
  }
}


/* ─── REDUCED MOTION ─── */

@media (prefers-reduced-motion: reduce) {
  .page-home .reveal-up {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .page-home .is-visible .hero-ledger-item,
  .page-home .is-visible .offer-qualifier,
  .page-home .is-visible .cta-decision-item,
  .page-home .is-visible .guarantee-ledger-item,
  .page-home .is-visible .measure-legend-item,
  .page-home .is-visible .faq-sidecard-point,
  .page-home .is-visible .cta-sidecard-point,
  .page-home .is-visible .footer-fact,
  .page-home .is-visible .card,
  .page-home .is-visible .step,
  .page-home .is-visible .measure-lane,
  .page-home .is-visible .guarantee-lane,
  .page-home .is-visible .faq-group,
  .page-home .is-visible .method-card {
    animation: none;
  }

  body.page-home::after {
    display: none;
  }

  .page-home .scope-ring {
    animation: none;
  }
}