/*
 * Nest English — Phase 6 / World-Class Design System
 * Warm Editorial / Modern Luxury
 *
 * Design goals:
 * - warm, quiet surfaces instead of cold utility-gray
 * - editorial typography with generous breathing room
 * - restrained glass / ambient depth
 * - GPU-friendly motion (transform + opacity only)
 * - RTL/LTR parity without mirrored decorative hacks
 * - accessible focus + reduced-motion support
 */

:root {
  /* Palette */
  --nest-paper: #f7f3eb;
  --nest-paper-deep: #eee8dc;
  --nest-ink: #1b2420;
  --nest-ink-soft: #59615c;
  --nest-ink-faint: #7f8882;
  --nest-surface: rgba(255,255,255,.72);
  --nest-surface-strong: #fffdfa;
  --nest-line: rgba(42,61,50,.12);
  --nest-line-strong: rgba(42,61,50,.20);
  --nest-forest: #1f5f4a;
  --nest-forest-deep: #174736;
  --nest-sage: #5f8a76;
  --nest-sage-soft: #e8efe9;
  --nest-gold: #b58a56;
  --nest-gold-soft: #f4eadb;
  --nest-rose: #b96f62;
  --nest-rose-soft: #f5e6e2;
  --nest-dark: #0d1511;
  --nest-dark-surface: rgba(20,29,24,.78);
  --nest-dark-surface-strong: #17201b;
  --nest-dark-line: rgba(220,233,226,.12);

  /* Typography */
  --nest-display: 'Lora', Georgia, serif;
  --nest-body: var(--nest-sans, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  --nest-body-ar: var(--nest-sans-ar, system-ui, sans-serif);

  /* Shape */
  --nest-radius-sm: 12px;
  --nest-radius-md: 18px;
  --nest-radius-lg: 24px;
  --nest-radius-xl: 32px;
  --nest-radius-pill: 999px;

  /* Shadows */
  --nest-shadow-sm: 0 6px 18px rgba(30,49,39,.06), inset 0 1px 0 rgba(255,255,255,.55);
  --nest-shadow-md: 0 18px 40px rgba(30,49,39,.10), inset 0 1px 0 rgba(255,255,255,.55);
  --nest-shadow-lg: 0 28px 70px rgba(30,49,39,.13), inset 0 1px 0 rgba(255,255,255,.58);
  --nest-shadow-dark: 0 26px 64px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.07);

  /* Motion */
  --nest-ease: cubic-bezier(.16,1,.3,1);
  --nest-ease-soft: cubic-bezier(.22,1,.36,1);
  --nest-fast: 140ms;
  --nest-mid: 240ms;
  --nest-slow: 520ms;
}

html:not(.dark) body.nest-editorial {
  background:
    radial-gradient(900px 420px at 12% 2%, rgba(181,138,86,.08), transparent 65%),
    radial-gradient(800px 420px at 92% 18%, rgba(95,138,118,.10), transparent 65%),
    linear-gradient(180deg, var(--nest-paper) 0%, #fbf8f3 42%, #f6f1e8 100%);
  color: var(--nest-ink);
}

html.dark body.nest-editorial {
  background:
    radial-gradient(900px 420px at 8% 0%, rgba(83,126,107,.14), transparent 66%),
    radial-gradient(800px 460px at 95% 20%, rgba(181,138,86,.07), transparent 64%),
    linear-gradient(180deg, #0c1310 0%, #101813 46%, #0d1511 100%);
  color: #eef4f0;
}

body.nest-editorial,
body.nest-editorial button,
body.nest-editorial input,
body.nest-editorial select,
body.nest-editorial textarea {
  font-family: var(--nest-body);
}

html[dir='rtl'] body.nest-editorial,
html[dir='rtl'] body.nest-editorial button,
html[dir='rtl'] body.nest-editorial input,
html[dir='rtl'] body.nest-editorial select,
html[dir='rtl'] body.nest-editorial textarea {
  font-family: var(--nest-body-ar);
}

html[dir='ltr'] body.nest-editorial h1,
html[dir='ltr'] body.nest-editorial h2,
html[dir='ltr'] body.nest-editorial h3,
html[dir='ltr'] body.nest-editorial .font-display,
html[dir='ltr'] body.nest-editorial .brand-name {
  font-family: var(--nest-display);
}

html[dir='rtl'] body.nest-editorial h1,
html[dir='rtl'] body.nest-editorial h2,
html[dir='rtl'] body.nest-editorial h3,
html[dir='rtl'] body.nest-editorial .font-display,
html[dir='rtl'] body.nest-editorial .brand-name {
  font-family: var(--nest-body-ar);
}

/* Core editorial type scale */
body.nest-editorial h1 {
  font-weight: 700;
  letter-spacing: -.035em;
}
body.nest-editorial h2 {
  font-weight: 650;
  letter-spacing: -.025em;
}
body.nest-editorial h3 {
  font-weight: 650;
}
body.nest-editorial p,
body.nest-editorial li {
  color: var(--nest-ink-soft);
}
html.dark body.nest-editorial p,
html.dark body.nest-editorial li {
  color: #aab7ae;
}

/* Quiet global focus */
body.nest-editorial :where(button,a,input,select,textarea,summary,[tabindex]):focus-visible {
  outline: 2px solid rgba(181,138,86,.88);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(181,138,86,.14);
}

/* Premium nav */
body.nest-editorial nav.glass-panel {
  background: rgba(250,248,243,.76);
  border-bottom-color: var(--nest-line) !important;
  box-shadow: 0 12px 36px rgba(31,54,42,.08), inset 0 -1px 0 rgba(255,255,255,.42);
  backdrop-filter: blur(18px) saturate(145%);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
}
html.dark body.nest-editorial nav.glass-panel {
  background: rgba(13,21,17,.76);
  border-bottom-color: var(--nest-dark-line) !important;
  box-shadow: 0 16px 38px rgba(0,0,0,.25), inset 0 -1px 0 rgba(255,255,255,.04);
}
body.nest-editorial nav .brand-name {
  font-size: clamp(1.1rem, 2vw, 1.48rem);
  letter-spacing: -.025em;
}
body.nest-editorial nav .brand-eng {
  color: var(--nest-forest) !important;
}
html.dark body.nest-editorial nav .brand-eng {
  color: #9ac6ad !important;
}
body.nest-editorial nav .brand-mark {
  filter: drop-shadow(0 8px 16px rgba(31,95,74,.10));
}
body.nest-editorial nav .hover\:text-indigo-600:hover,
body.nest-editorial nav .hover\:text-indigo-400:hover {
  color: var(--nest-forest) !important;
}
body.nest-editorial nav #nav-start-btn-desktop,
body.nest-editorial nav .bg-indigo-600 {
  background: linear-gradient(135deg, var(--nest-forest) 0%, #2c735a 100%) !important;
  box-shadow: 0 10px 24px rgba(31,95,74,.20) !important;
  border-color: transparent !important;
}
body.nest-editorial nav #nav-start-btn-desktop:hover,
body.nest-editorial nav .bg-indigo-600:hover {
  background: linear-gradient(135deg, var(--nest-forest-deep) 0%, var(--nest-forest) 100%) !important;
  transform: translateY(-1px);
}
body.nest-editorial nav #nav-dark-toggle-btn,
body.nest-editorial nav #nav-lang-btn,
body.nest-editorial nav #mobile-menu-btn,
body.nest-editorial nav #nav-xp-pill-btn {
  background: rgba(255,255,255,.66) !important;
  border: 1px solid var(--nest-line) !important;
  box-shadow: var(--nest-shadow-sm);
}
html.dark body.nest-editorial nav #nav-dark-toggle-btn,
html.dark body.nest-editorial nav #nav-lang-btn,
html.dark body.nest-editorial nav #mobile-menu-btn,
html.dark body.nest-editorial nav #nav-xp-pill-btn {
  background: rgba(255,255,255,.05) !important;
  border-color: var(--nest-dark-line) !important;
}
body.nest-editorial #mobile-menu-panel {
  background: rgba(250,248,243,.88) !important;
  border-top-color: var(--nest-line) !important;
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}
html.dark body.nest-editorial #mobile-menu-panel {
  background: rgba(14,21,17,.88) !important;
}

/* Design-system primitives for future screens */
.nest-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  min-height: 28px;
  padding: 0 .75rem;
  border-radius: var(--nest-radius-pill);
  border: 1px solid rgba(181,138,86,.24);
  background: rgba(244,234,219,.68);
  color: #7f623e;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
html.dark .nest-eyebrow {
  background: rgba(181,138,86,.10);
  border-color: rgba(181,138,86,.20);
  color: #d5b589;
}
.nest-surface-card {
  background: var(--nest-surface);
  border: 1px solid var(--nest-line);
  border-radius: var(--nest-radius-lg);
  box-shadow: var(--nest-shadow-md);
  backdrop-filter: blur(14px) saturate(135%);
  -webkit-backdrop-filter: blur(14px) saturate(135%);
}
html.dark .nest-surface-card {
  background: var(--nest-dark-surface);
  border-color: var(--nest-dark-line);
  box-shadow: var(--nest-shadow-dark);
}
.nest-btn-primary,
.nest-btn-secondary,
.nest-btn-quiet {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  gap: .55rem;
  padding: .75rem 1.05rem;
  border-radius: var(--nest-radius-sm);
  font-weight: 750;
  cursor: pointer;
  transition: transform var(--nest-mid) var(--nest-ease), box-shadow var(--nest-mid) var(--nest-ease), background-color var(--nest-mid) ease, border-color var(--nest-mid) ease, color var(--nest-mid) ease;
  will-change: transform;
}
.nest-btn-primary {
  color: #fff;
  border: 1px solid transparent;
  background: linear-gradient(135deg, var(--nest-forest) 0%, #2d755b 100%);
  box-shadow: 0 14px 28px rgba(31,95,74,.18);
}
.nest-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(31,95,74,.24); }
.nest-btn-primary:active { transform: translateY(0) scale(.99); }
.nest-btn-secondary {
  color: var(--nest-ink);
  background: rgba(255,255,255,.70);
  border: 1px solid var(--nest-line-strong);
  box-shadow: var(--nest-shadow-sm);
}
html.dark .nest-btn-secondary { color: #edf4ef; background: rgba(255,255,255,.04); border-color: var(--nest-dark-line); }
.nest-btn-secondary:hover { transform: translateY(-2px); box-shadow: var(--nest-shadow-md); }
.nest-btn-quiet { color: var(--nest-forest); background: transparent; border: 1px solid transparent; }
.nest-btn-quiet:hover { background: var(--nest-sage-soft); }

/* Landing canvas */
body.nest-editorial #landing-section {
  position: relative;
  isolation: isolate;
}
body.nest-editorial #landing-section::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -2;
  opacity: .35;
  background-image:
    linear-gradient(rgba(31,95,74,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,95,74,.035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, black, transparent 72%);
}
html.dark body.nest-editorial #landing-section::before {
  opacity: .10;
  background-image:
    linear-gradient(rgba(220,233,226,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(220,233,226,.07) 1px, transparent 1px);
}

/* Hero */
body.nest-editorial #landing-section > header {
  padding-top: clamp(4.2rem, 8vw, 7rem);
  padding-bottom: clamp(3.3rem, 6vw, 5.2rem);
}
body.nest-editorial #landing-section > header::after {
  content: '';
  position: absolute;
  inset-inline: 8%;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--nest-line-strong), transparent);
}
body.nest-editorial #hero-text-wrap > span:first-child {
  background: rgba(244,234,219,.72) !important;
  border-color: rgba(181,138,86,.24) !important;
  color: #7f623e !important;
  letter-spacing: .02em;
  box-shadow: 0 8px 20px rgba(181,138,86,.07);
}
html.dark body.nest-editorial #hero-text-wrap > span:first-child {
  background: rgba(181,138,86,.10) !important;
  border-color: rgba(181,138,86,.20) !important;
  color: #d9bb90 !important;
}
body.nest-editorial #hero-text-wrap h1 {
  font-size: clamp(3rem, 7vw, 6rem);
  line-height: .98;
  max-width: 10ch;
  text-wrap: balance;
  margin-top: .75rem;
}
body.nest-editorial .gradient-text {
  background: linear-gradient(120deg, #a97c4d 0%, #c09563 28%, var(--nest-forest) 74%, #3f856a 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
html.dark body.nest-editorial .gradient-text {
  background: linear-gradient(120deg, #e1bf90 0%, #b79360 34%, #a9d1ba 78%, #78ae91 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
body.nest-editorial #hero-text-wrap > p {
  max-width: 35rem;
  margin-top: 1.4rem;
  color: var(--nest-ink-soft) !important;
  font-size: clamp(.96rem, 1.4vw, 1.08rem);
  line-height: 1.85;
}
html.dark body.nest-editorial #hero-text-wrap > p { color: #aab7ae !important; }
body.nest-editorial .hero-cta-row { margin-top: 2rem !important; }
body.nest-editorial #hero-cta-btn,
body.nest-editorial .pulse-cta {
  background: linear-gradient(135deg, var(--nest-forest) 0%, #2f785d 100%) !important;
  box-shadow: 0 18px 36px rgba(31,95,74,.20) !important;
  border: 1px solid rgba(255,255,255,.10);
  min-height: 56px;
  padding-inline: 1.45rem !important;
  border-radius: 16px !important;
  transition: transform var(--nest-mid) var(--nest-ease), box-shadow var(--nest-mid) var(--nest-ease), filter var(--nest-mid) var(--nest-ease);
  will-change: transform;
}
body.nest-editorial #hero-cta-btn:hover,
body.nest-editorial .pulse-cta:hover { transform: translateY(-3px) !important; filter: saturate(1.04); box-shadow: 0 22px 42px rgba(31,95,74,.26) !important; }
body.nest-editorial #hero-cta-btn:active,
body.nest-editorial .pulse-cta:active { transform: translateY(0) scale(.99) !important; }
body.nest-editorial #hero-text-wrap .hero-cta-row > button:nth-child(2) {
  min-height: 56px;
  border-width: 1px !important;
  border-color: var(--nest-line-strong) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.72) !important;
  color: var(--nest-ink) !important;
  box-shadow: var(--nest-shadow-sm);
}
html.dark body.nest-editorial #hero-text-wrap .hero-cta-row > button:nth-child(2) {
  background: rgba(255,255,255,.045) !important;
  color: #edf4ef !important;
  border-color: var(--nest-dark-line) !important;
}
body.nest-editorial #hero-text-wrap .hero-cta-row > button:nth-child(2):hover {
  transform: translateY(-2px);
  border-color: rgba(31,95,74,.28) !important;
  box-shadow: var(--nest-shadow-md);
}
body.nest-editorial .hero-fineprint { margin-top: 2.25rem !important; }
body.nest-editorial .hero-fineprint .text-emerald-500 { color: var(--nest-forest) !important; }
body.nest-editorial .hero-fineprint .text-amber-600,
body.nest-editorial .hero-fineprint .text-amber-500 { color: #9b774d !important; }
body.nest-editorial .hero-fineprint p { line-height: 1.75; }

/* Hero card / glass */
body.nest-editorial .hero-card-entrance,
body.nest-editorial .glass-panel {
  background: rgba(255,255,255,.66) !important;
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-md) !important;
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}
html.dark body.nest-editorial .hero-card-entrance,
html.dark body.nest-editorial .glass-panel {
  background: rgba(21,31,26,.76) !important;
  border-color: var(--nest-dark-line) !important;
  box-shadow: var(--nest-shadow-dark) !important;
}
body.nest-editorial .hero-card-entrance {
  border-radius: var(--nest-radius-xl) !important;
  padding: 1.6rem !important;
}
body.nest-editorial .hero-card-entrance::before {
  content: '';
  position: absolute;
  inset: 10px;
  border-radius: calc(var(--nest-radius-xl) - 6px);
  border: 1px solid rgba(181,138,86,.10);
  pointer-events: none;
}
body.nest-editorial .hero-card-entrance .bg-slate-50,
body.nest-editorial .hero-card-entrance .dark\:bg-slate-900\/50 {
  background: rgba(244,241,235,.62) !important;
}
html.dark body.nest-editorial .hero-card-entrance .bg-slate-50,
html.dark body.nest-editorial .hero-card-entrance .dark\:bg-slate-900\/50 {
  background: rgba(255,255,255,.035) !important;
}

/* Stats + cards */
body.nest-editorial .reveal-grid > .glass-panel,
body.nest-editorial .interactive-card {
  border-radius: var(--nest-radius-md) !important;
  transition: transform var(--nest-mid) var(--nest-ease), box-shadow var(--nest-mid) var(--nest-ease), border-color var(--nest-mid) ease, background-color var(--nest-mid) ease !important;
  will-change: transform;
}
body.nest-editorial .reveal-grid > .glass-panel:hover,
body.nest-editorial .interactive-card:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(31,95,74,.18) !important;
  box-shadow: var(--nest-shadow-lg) !important;
}
body.nest-editorial .reveal-grid .text-indigo-600,
body.nest-editorial .text-indigo-600 { color: var(--nest-forest) !important; }
body.nest-editorial .text-indigo-400 { color: #6ea187 !important; }
body.nest-editorial .bg-indigo-50 { background: #edf3ef !important; }
body.nest-editorial .bg-emerald-50 { background: #e8f0eb !important; }
body.nest-editorial .bg-rose-50 { background: #f4e9e5 !important; }
body.nest-editorial .bg-amber-50 { background: #f4eadb !important; }
html.dark body.nest-editorial .bg-indigo-950\/50 { background: rgba(95,138,118,.12) !important; }
html.dark body.nest-editorial .bg-emerald-950\/50 { background: rgba(95,138,118,.12) !important; }

/* Step / feature rhythm */
body.nest-editorial #landing-section .rounded-2xl {
  border-radius: 18px;
}
body.nest-editorial #landing-section .space-y-5 > .text-center,
body.nest-editorial #landing-section .space-y-6 > .text-center {
  margin-bottom: .25rem;
}
body.nest-editorial #landing-section h2 {
  font-size: clamp(1.65rem, 3vw, 2.35rem);
}
body.nest-editorial #landing-section h2 + p,
body.nest-editorial #landing-section h2 ~ p {
  color: var(--nest-ink-faint) !important;
}
html.dark body.nest-editorial #landing-section h2 + p,
html.dark body.nest-editorial #landing-section h2 ~ p {
  color: #87958c !important;
}

/* Soft divider */
body.nest-editorial .nest-divider { height: 44px; }
body.nest-editorial .nest-divider::before {
  background: linear-gradient(90deg, transparent, rgba(181,138,86,.22), rgba(31,95,74,.16), transparent) !important;
  top: 50% !important;
}

/* Existing glow becomes calmer, slower and warmer */
body.nest-editorial .hero-glow {
  opacity: .85;
  filter: blur(3px);
  animation: nestPhase6Glow 18s ease-in-out infinite alternate;
}
@keyframes nestPhase6Glow {
  0% { transform: translate3d(-1%,0,0) scale(1); opacity: .72; }
  100% { transform: translate3d(1.5%,1%,0) scale(1.03); opacity: .92; }
}

/* Remove bounce-heavy feel from generic reveal; favor calm entrance */
body.nest-editorial .animate__bounceIn,
body.nest-editorial .animate__bounceInUp,
body.nest-editorial .animate__bounceInDown,
body.nest-editorial .animate__bounceInLeft,
body.nest-editorial .animate__bounceInRight {
  animation-timing-function: var(--nest-ease) !important;
}
body.nest-editorial .page-section.active-section {
  animation: nestPhase6PageIn var(--nest-slow) var(--nest-ease) both;
}
@keyframes nestPhase6PageIn {
  from { opacity: 0; transform: translate3d(0, 10px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
body.nest-editorial .page-section.section-leaving {
  animation: nestPhase6PageOut 160ms ease-out both !important;
}
@keyframes nestPhase6PageOut {
  from { opacity: 1; transform: translate3d(0,0,0); }
  to { opacity: 0; transform: translate3d(0,-4px,0); }
}

/* Luxury motion — only transform/opacity for the moving layer */
@media (hover:hover) {
  body.nest-editorial a,
  body.nest-editorial button {
    transition-property: transform, background-color, color, border-color, box-shadow, opacity;
  }
}

/* Mobile: preserve breathing room without making the hero too tall */
@media (max-width: 760px) {
  body.nest-editorial #landing-section > header {
    padding-top: 3rem;
    padding-bottom: 2.8rem;
  }
  body.nest-editorial #hero-text-wrap h1 {
    max-width: 12ch;
    font-size: clamp(2.6rem, 12vw, 4rem);
  }
  body.nest-editorial #hero-text-wrap > p {
    font-size: .94rem;
    line-height: 1.75;
  }
  body.nest-editorial .hero-card-entrance { margin-top: .5rem; }
  body.nest-editorial .reveal-grid > .glass-panel,
  body.nest-editorial .interactive-card { box-shadow: var(--nest-shadow-sm) !important; }
}

@media (max-width: 480px) {
  body.nest-editorial nav .max-w-6xl { height: 68px; }
  body.nest-editorial #landing-section .px-6 { padding-inline: 1.15rem; }
  body.nest-editorial #hero-text-wrap h1 { font-size: 2.85rem; }
  body.nest-editorial #hero-text-wrap > p { max-width: 32rem; }
}

/* RTL micro adjustments — no hard-coded left/right decorative coordinates */
html[dir='rtl'] body.nest-editorial #hero-text-wrap h1 { line-height: 1.12; }
html[dir='rtl'] body.nest-editorial .hero-fineprint { text-align: right; }
html[dir='rtl'] body.nest-editorial .nest-eyebrow { letter-spacing: normal; }

/* Reduced motion: remove decorative movement, preserve state changes */
@media (prefers-reduced-motion: reduce) {
  body.nest-editorial *,
  body.nest-editorial *::before,
  body.nest-editorial *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
  body.nest-editorial .reveal-grid > .glass-panel:hover,
  body.nest-editorial .interactive-card:hover,
  body.nest-editorial #hero-cta-btn:hover,
  body.nest-editorial .pulse-cta:hover,
  body.nest-editorial nav #nav-start-btn-desktop:hover {
    transform: none !important;
  }
}

/* Print remains simple and paper-like */
@media print {
  html:not(.dark) body.nest-editorial { background: #fff !important; }
  body.nest-editorial::before { display: none !important; }
  body.nest-editorial .glass-panel,
  body.nest-editorial .nest-surface-card { box-shadow: none !important; backdrop-filter: none !important; }
}
