/* ═══════════════════════════════════════════════════════
   ANNAS DORFGLANZ  ·  styles.css  v4.0  (2026)
   Premium Design · Full Security · Mobile-First
   ═══════════════════════════════════════════════════════ */

/* ── Design Tokens ───────────────────────────────────────── */
:root {
  /* Brand colours */
  --gold:        #c8965a;
  --gold-lt:     #ddb27c;
  --gold-dk:     #a8723a;
  --gold-glow:   rgba(200,150,90,0.28);
  --cream:       #f7f3ee;
  --cream-dk:    #ede7de;
  --warm:        #faf7f3;
  --dark:        #1a1510;
  --dark2:       #2a221a;
  --mid:         #5c4f42;
  --muted:       #9a8c7e;
  --subtle:      #c2b5a6;
  --white:       #ffffff;

  /* Borders */
  --border:      rgba(200,150,90,0.16);
  --border-dk:   rgba(200,150,90,0.28);

  /* Shadows */
  --sh-xs:   0 1px  6px rgba(0,0,0,0.05);
  --sh-sm:   0 3px 14px rgba(0,0,0,0.07);
  --sh-md:   0 8px 32px rgba(0,0,0,0.10);
  --sh-lg:   0 20px 60px rgba(0,0,0,0.13);
  --sh-xl:   0 40px 100px rgba(0,0,0,0.16);
  --sh-gold: 0 8px 36px rgba(200,150,90,0.32);

  /* Easing */
  --spring:  cubic-bezier(0.34,1.56,0.64,1);
  --ease:    cubic-bezier(0.16,1,0.30,1);
  --smooth:  cubic-bezier(0.40,0,0.20,1);
  --snappy:  cubic-bezier(0.25,0.46,0.45,0.94);

  /* Layout */
  --nav-h:    72px;
  --r-xs:      6px;
  --r-sm:     12px;
  --r-md:     18px;
  --r-lg:     26px;
  --r-xl:     36px;
  --r-2xl:    48px;
  --py:       clamp(72px, 10vw, 120px);
  --gutter:   clamp(18px, 5vw, 44px);
  --maxw:     1200px;
}

/* ── Reset ───────────────────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html {
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body {
  font-family:'Inter', system-ui, -apple-system, sans-serif;
  font-size: clamp(0.9375rem, 1.8vw, 1rem);
  line-height: 1.75;
  color: var(--mid);
  background: var(--white);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img  { display:block; max-width:100%; height:auto; }
a    { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; }
::selection { background:rgba(200,150,90,0.22); color:var(--dark); }

/* ── Custom scrollbar ────────────────────────────────────── */
::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--gold); border-radius:4px; }
::-webkit-scrollbar-thumb:hover { background:var(--gold-dk); }

/* ── Container ───────────────────────────────────────────── */
.container { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter); }

/* ── Focus ring ─────────────────────────────────────────── */
:focus-visible { outline:2px solid var(--gold); outline-offset:3px; border-radius:var(--r-xs); }

/* ─────────────────────────────────────────────────────────
   SCROLL PROGRESS BAR
───────────────────────────────────────────────────────── */
#scrollProgress {
  position:fixed; top:0; left:0; z-index:9999;
  width:0%; height:2px;
  background: linear-gradient(90deg, var(--gold-lt), var(--gold), var(--gold-dk));
  transition: width 80ms linear;
  pointer-events:none;
  box-shadow: 0 0 10px rgba(200,150,90,0.6);
}

/* ─────────────────────────────────────────────────────────
   NAVBAR
───────────────────────────────────────────────────────── */
.navbar {
  position:fixed; inset:0 0 auto 0;
  height:var(--nav-h); z-index:900;
  background:rgba(255,255,255,0.75);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border-bottom:1px solid transparent;
  transition:background .35s var(--smooth), border-color .35s, box-shadow .35s;
}
.navbar.scrolled {
  background:rgba(255,252,248,0.97);
  border-bottom-color:rgba(200,150,90,.12);
  box-shadow:0 1px 0 rgba(200,150,90,.08), 0 4px 24px rgba(0,0,0,.06);
}

.nav-container {
  max-width:var(--maxw); margin:0 auto; padding:0 var(--gutter);
  height:100%; display:flex; align-items:center; justify-content:space-between; gap:clamp(.5rem,2vw,2rem);
}

/* Logo */
.nav-logo {
  display:flex; align-items:center; flex-shrink:0;
  text-decoration:none;
}
.nav-brand-logo {
  height:42px; width:auto; max-width:190px;
  display:block; flex-shrink:0;
  transition:transform .38s var(--spring), opacity .25s, filter .25s;
  opacity:.9;
}
.nav-logo:hover .nav-brand-logo {
  transform:scale(1.04);
  opacity:1;
}

/* Nav links */
.nav-menu { display:flex; list-style:none; gap:clamp(.5rem,1.4vw,1.6rem); align-items:center; margin-left:auto; }
.nav-link {
  color:var(--mid); font-size:.85rem; font-weight:500; letter-spacing:.02em;
  position:relative; padding:.28rem 0;
  transition:color .25s, opacity .25s;
  white-space:nowrap;
}
.nav-link::after {
  content:''; position:absolute; bottom:-2px; left:0;
  width:0; height:1.5px;
  background:linear-gradient(90deg, var(--gold-lt), var(--gold), var(--gold-dk));
  border-radius:2px;
  transition:width .35s cubic-bezier(.16,1,.3,1);
  transform-origin:left;
}
.nav-link:hover, .nav-link.active { color:var(--dark); }
.nav-link:hover::after, .nav-link.active::after { width:100%; }

/* Back link in nav */
.nav-link-back {
  color:var(--gold) !important;
  font-size:.82rem; opacity:.8;
  padding:.3rem .65rem;
  background:rgba(200,150,90,0.08);
  border-radius:999px;
  border:1px solid rgba(200,150,90,0.18);
  transition:opacity .2s, background .2s, border-color .2s !important;
}
.nav-link-back::after { display:none !important; }
.nav-link-back:hover { opacity:1; background:rgba(200,150,90,0.14); border-color:rgba(200,150,90,0.35); }

/* Hamburger */
.hamburger {
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:42px; height:42px; padding:7px;
  border-radius:var(--r-sm);
  transition:background .22s;
  -webkit-tap-highlight-color:transparent;
  z-index:901; position:relative;
}
.hamburger:hover { background:rgba(200,150,90,.09); }
.bar {
  width:100%; height:1.8px; background:var(--dark); border-radius:2px;
  transition:transform .38s var(--ease), opacity .28s, background .22s;
}
.hamburger.open .bar:nth-child(1) { transform:translateY(6.8px) rotate(45deg); }
.hamburger.open .bar:nth-child(2) { opacity:0; transform:scaleX(0); }
.hamburger.open .bar:nth-child(3) { transform:translateY(-6.8px) rotate(-45deg); }

/* Mobile nav overlay */
/* old mobile nav removed – see new version below */

/* Floating back button */
#backToStart {
  position:fixed; bottom:1.5rem; left:1.2rem; z-index:800;
  display:flex; align-items:center; gap:.45rem;
  padding:.55rem .95rem;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1.5px solid var(--border-dk);
  border-radius:999px; color:var(--gold-dk);
  font-size:.78rem; font-weight:600; letter-spacing:.02em;
  box-shadow:var(--sh-sm);
  opacity:0; transform:translateY(10px) scale(.95);
  transition:opacity .32s var(--ease), transform .32s var(--spring), box-shadow .28s;
  pointer-events:none; text-decoration:none;
}
#backToStart.show {
  opacity:1; transform:translateY(0) scale(1);
  pointer-events:auto;
}
#backToStart:hover {
  background:#fff; border-color:var(--gold);
  box-shadow:var(--sh-gold); transform:translateY(-2px) scale(1.02);
}

/* ─────────────────────────────────────────────────────────
   HERO
───────────────────────────────────────────────────────── */
.hero {
  position:relative; min-height:100svh;
  display:flex; align-items:center;
  padding-top:var(--nav-h); overflow:hidden;
  background:var(--warm);
}

#heroBg {
  position:absolute; inset:0; width:100%; height:100%;
  display:block; z-index:0; pointer-events:none;
}

/* Layered gradient mesh */
.hero-gradient {
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 80% 55% at 72% 25%, rgba(200,150,90,0.22) 0%, transparent 58%),
    radial-gradient(ellipse 55% 75% at 18% 82%, rgba(168,114,58,0.15) 0%, transparent 55%),
    radial-gradient(ellipse 45% 50% at 48% 50%, rgba(255,255,255,0.55) 0%, transparent 65%),
    linear-gradient(160deg, #f7f3ee 0%, #f0ebe2 55%, #e8e0d4 100%);
  animation:gradMeshA 12s ease-in-out infinite alternate;
}
@keyframes gradMeshA {
  0%   { opacity:.80; transform:scale(1)    rotate(0deg);    filter:hue-rotate(0deg); }
  25%  { opacity:.95; transform:scale(1.04) rotate(.25deg);  }
  50%  { opacity:1;   transform:scale(1.02) rotate(-.2deg);  filter:hue-rotate(6deg); }
  75%  { opacity:.92; transform:scale(1.05) rotate(.3deg);   }
  100% { opacity:.88; transform:scale(1.01) rotate(0deg);    filter:hue-rotate(0deg); }
}

/* CSS orbs */
.hero-orb {
  position:absolute; border-radius:50%;
  filter:blur(65px); pointer-events:none; z-index:0;
  animation:orbDrift linear infinite;
}
.orb-1 {
  width:clamp(300px,52vw,680px); height:clamp(300px,52vw,680px);
  background:radial-gradient(circle, rgba(200,150,90,0.32) 0%, rgba(200,150,90,0.12) 45%, transparent 70%);
  top:-15%; right:-8%; animation-duration:16s;
}
.orb-2 {
  width:clamp(240px,38vw,500px); height:clamp(240px,38vw,500px);
  background:radial-gradient(circle, rgba(168,114,58,0.28) 0%, rgba(168,114,58,0.10) 50%, transparent 70%);
  bottom:-5%; left:-8%; animation-duration:20s; animation-delay:-6s;
}
.orb-3 {
  width:clamp(160px,22vw,300px); height:clamp(160px,22vw,300px);
  background:radial-gradient(circle, rgba(221,178,124,0.42) 0%, rgba(221,178,124,0.15) 50%, transparent 70%);
  top:35%; left:22%; animation-duration:11s; animation-delay:-3s;
}
.orb-4 {
  width:clamp(180px,28vw,360px); height:clamp(180px,28vw,360px);
  background:radial-gradient(circle, rgba(200,150,90,0.25) 0%, rgba(200,150,90,0.08) 55%, transparent 70%);
  top:55%; right:3%; animation-duration:14s; animation-delay:-8s;
}
.orb-5 {
  width:clamp(120px,14vw,200px); height:clamp(120px,14vw,200px);
  background:radial-gradient(circle, rgba(232,200,150,0.38) 0%, transparent 70%);
  bottom:-6%; left:38%; animation-duration:9s; animation-delay:-2s;
}
@keyframes orbDrift {
  0%   { transform:translate(0,0)     scale(1);    opacity:.9; }
  20%  { transform:translate(5%,6%)   scale(1.08); opacity:1;  }
  40%  { transform:translate(-4%,3%)  scale(.93);  opacity:.85;}
  60%  { transform:translate(6%,-4%)  scale(1.06); opacity:.95;}
  80%  { transform:translate(-3%,5%)  scale(.97);  opacity:1;  }
  100% { transform:translate(2%,-2%)  scale(1.04); opacity:.9; }
}

/* Diagonal shimmer lines */
.hero-shimmer {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:repeating-linear-gradient(
    112deg,
    transparent 0px, transparent 140px,
    rgba(200,150,90,0.032) 141px, rgba(200,150,90,0.032) 142px
  );
  animation:shimmerDrift 30s linear infinite;
}
@keyframes shimmerDrift {
  from { background-position:0 0; }
  to   { background-position:400px 400px; }
}

/* Hero layout */
.hero-content {
  position:relative; z-index:1;
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(2rem,5vw,5rem); align-items:center;
  width:100%; max-width:var(--maxw); margin:0 auto;
  padding:clamp(3rem,6vw,5.5rem) var(--gutter);
}

/* Hero text */
.hero-text {
  opacity:0; transform:translateY(48px);
  animation:fadeUp .95s var(--ease) .2s forwards;
}

.brand-logo {
  display:flex; flex-direction:column; align-items:flex-start; gap:.5rem;
  margin-bottom:clamp(1.6rem,3vw,2.6rem);
}

.brand-script {
  font-family:'Allura', cursive;
  font-size:clamp(4rem,10vw,8.5rem);
  font-weight:400; line-height:.9; color:var(--dark);
  animation:floatScript 7s ease-in-out 1.8s infinite;
}
@keyframes floatScript {
  0%,100% { transform:translateY(0); }
  50%     { transform:translateY(-14px); }
}

.brand-divider {
  width:clamp(200px,40vw,520px); height:1px;
  background:linear-gradient(90deg, var(--dark), rgba(26,21,16,0.12));
  position:relative;
}
/* Animated gold pulse on divider */
.brand-divider::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, var(--gold) 40%, transparent);
  animation:dividerPulse 4s ease-in-out 2s infinite;
  opacity:0;
}
@keyframes dividerPulse {
  0%,100% { opacity:0; transform:scaleX(0); }
  50%     { opacity:.7; transform:scaleX(1); }
}

.brand-sub {
  font-family:'Inter', sans-serif; font-weight:300;
  font-size:clamp(.88rem,2.5vw,1.9rem);
  letter-spacing:clamp(.3rem,.7vw,.46rem);
  color:var(--dark); opacity:.72; text-transform:uppercase;
}

.hero-tagline-main {
  font-family:'Inter', system-ui, sans-serif;
  font-size:clamp(1rem,2.2vw,1.45rem);
  font-weight:400; color:var(--mid); margin-bottom:.55rem;
  opacity:0; animation:fadeUp .8s var(--ease) .72s forwards;
}

.hero-tagline {
  font-size:clamp(.88rem,1.8vw,1.05rem); color:var(--muted);
  line-height:1.75; margin-bottom:clamp(2rem,4vw,3rem);
  opacity:0; animation:fadeUp .8s var(--ease) .96s forwards;
}

/* Scroll CTA */
.hero-cta { opacity:0; animation:fadeUp .8s var(--ease) 1.2s forwards; }
.scroll-btn {
  display:inline-flex; flex-direction:column; align-items:center; gap:.6rem;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
  transition:transform .32s var(--spring);
}
.scroll-btn:hover { transform:translateY(-6px); }
.scroll-label {
  font-size:.73rem; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:var(--muted);
}
.scroll-ring {
  width:46px; height:46px; border-radius:50%;
  border:1.5px solid rgba(200,150,90,0.45);
  display:flex; align-items:center; justify-content:center;
  color:var(--gold-dk); font-size:.8rem;
  transition:background .3s, border-color .3s, color .3s, box-shadow .3s;
  animation:bounceCta 3s ease-in-out 2.2s infinite;
}
.scroll-btn:hover .scroll-ring {
  background:var(--gold); border-color:var(--gold); color:#fff;
  box-shadow:0 8px 24px rgba(200,150,90,0.45);
}
@keyframes bounceCta {
  0%,100% { transform:translateY(0); }
  40%     { transform:translateY(-10px); }
  60%     { transform:translateY(-4px); }
}

/* Hero visual */
.hero-visual {
  position:relative; display:flex;
  align-items:center; justify-content:center; min-height:360px;
  opacity:0; animation:fadeLeft .95s var(--ease) .4s forwards;
}

.hero-logo-ring {
  position:relative; display:flex; align-items:center; justify-content:center;
}

/* Multi-ring design */
.ring-outer {
  position:absolute;
  width:clamp(210px,30vw,350px); height:clamp(210px,30vw,350px);
  border-radius:50%;
  border:1px dashed rgba(200,150,90,0.38);
  animation:spinCW 32s linear infinite;
}
.ring-mid {
  position:absolute;
  width:clamp(178px,25vw,295px); height:clamp(178px,25vw,295px);
  border-radius:50%;
  background:conic-gradient(
    rgba(200,150,90,0.0) 0deg,
    rgba(200,150,90,0.30) 60deg,
    rgba(200,150,90,0.0) 120deg,
    rgba(200,150,90,0.22) 180deg,
    rgba(200,150,90,0.0) 240deg,
    rgba(200,150,90,0.18) 300deg,
    rgba(200,150,90,0.0) 360deg
  );
  filter:blur(3px);
  animation:spinCCW 12s linear infinite;
}
.ring-inner {
  position:absolute;
  width:clamp(152px,22vw,252px); height:clamp(152px,22vw,252px);
  border-radius:50%;
  border:1px solid rgba(200,150,90,0.18);
  animation:spinCCW 20s linear infinite;
}
@keyframes spinCW  { to { transform:rotate(360deg); } }
@keyframes spinCCW { to { transform:rotate(-360deg); } }

/* Hero logo image */
.hero-logo-img {
  width:clamp(140px,20vw,230px); height:clamp(140px,20vw,230px);
  border-radius:50%; object-fit:cover;
  border:5px solid rgba(255,255,255,0.85);
  box-shadow:var(--sh-gold), 0 0 0 1px rgba(200,150,90,0.12);
  position:relative; z-index:1;
  animation:floatScript 7s ease-in-out 2s infinite;
  transition:transform .45s var(--spring), box-shadow .4s;
}
.hero-logo-ring:hover .hero-logo-img {
  transform:scale(1.06) rotate(3deg);
  box-shadow:0 20px 60px rgba(200,150,90,0.55), 0 0 0 1px rgba(200,150,90,0.25);
}

/* Orbiting dots */
.orbit-dot {
  position:absolute; border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 10px rgba(200,150,90,0.7);
  animation:orbitPath linear infinite;
}
.orbit-dot:nth-child(2) { width:9px; height:9px; animation-duration:9s; }
.orbit-dot:nth-child(3) { width:6px; height:6px; animation-duration:14s; animation-delay:-5s; background:var(--gold-lt); }
.orbit-dot:nth-child(4) { width:5px; height:5px; animation-duration:11s; animation-delay:-7s; }
@keyframes orbitPath {
  from { transform:rotate(0deg) translateX(clamp(100px,14vw,165px)) rotate(0deg); }
  to   { transform:rotate(360deg) translateX(clamp(100px,14vw,165px)) rotate(-360deg); }
}

/* Hero mobile */
@media (max-width:767px) {
  .hero-content {
    grid-template-columns:1fr; text-align:center;
    gap:1.6rem; padding-top:1.5rem; padding-bottom:3rem;
  }
  .brand-logo { align-items:center; }
  .brand-divider { background:linear-gradient(90deg,transparent,var(--dark) 50%,transparent); width:min(260px,70vw); }
  .ring-outer, .ring-mid, .ring-inner, .orbit-dot { display:none; }
  .hero-orb { display:none; }
  .hero-shimmer { display:none; }
  .hero-visual { min-height:unset; order:-1; }
  .hero-logo-img { width:clamp(110px,36vw,165px); height:clamp(110px,36vw,165px); }
  .hero-cta { display:flex; justify-content:center; }
}

/* ─────────────────────────────────────────────────────────
   SECTION SKELETON  +  REVEAL SYSTEM
───────────────────────────────────────────────────────── */
section { padding:var(--py) 0; position:relative; overflow:hidden; }

.section-header {
  text-align:center; margin-bottom:clamp(2.8rem,5vw,4.5rem);
  position:relative; z-index:1;
}

/* Eye-brow label above title */
.section-eyebrow {
  font-size:.72rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold-dk);
  margin-bottom:.7rem; display:block;
  opacity:0; animation:fadeUp .6s var(--ease) .1s forwards;
}

/* section-title */
.section-title {
  font-size:clamp(1.9rem,4.5vw,3.1rem);
  font-weight:700; color:var(--dark); line-height:1.18; margin-bottom:1rem; letter-spacing:-.02em;
}

/* Animated title decoration */
.title-bar {
  display:inline-flex; align-items:center; gap:8px;
}
.title-bar::before,
.title-bar::after {
  content:''; display:block; height:1px; width:28px;
  background:linear-gradient(90deg,transparent,var(--gold));
  opacity:.55;
}
.title-bar::after {
  background:linear-gradient(270deg,transparent,var(--gold));
}
.title-dot {
  display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 8px rgba(200,150,90,0.5);
  animation:pulseDot 2.8s ease-in-out infinite;
}
@keyframes pulseDot {
  0%,100% { transform:scale(1); box-shadow:0 0 8px rgba(200,150,90,0.5); }
  50%     { transform:scale(1.4); box-shadow:0 0 14px rgba(200,150,90,0.8); }
}

/* Scroll reveal */
.js-ready .revel {
  opacity:0; transform:translateY(40px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.js-ready .revel.from-l { transform:translateX(-48px); }
.js-ready .revel.from-r { transform:translateX(48px); }
.js-ready .revel.scale  { transform:scale(.92) translateY(18px); }
.revel.in { opacity:1 !important; transform:none !important; }
.revel[data-d="1"] { transition-delay:.06s; }
.revel[data-d="2"] { transition-delay:.15s; }
.revel[data-d="3"] { transition-delay:.24s; }
.revel[data-d="4"] { transition-delay:.33s; }
.revel[data-d="5"] { transition-delay:.42s; }

/* Section background orbs */
.s-orb {
  position:absolute; border-radius:50%;
  filter:blur(80px); pointer-events:none; z-index:0;
}

/* ─────────────────────────────────────────────────────────
   ABOUT
───────────────────────────────────────────────────────── */
.about { background:var(--white); }
.about .s-orb-1 {
  width:440px; height:440px;
  background:radial-gradient(circle, rgba(200,150,90,0.09), transparent);
  top:-100px; right:-100px;
  animation:blobShift 14s ease-in-out infinite alternate;
}
.about .s-orb-2 {
  width:320px; height:320px;
  background:radial-gradient(circle, rgba(247,243,238,0.9), transparent);
  bottom:-60px; left:-60px;
  animation:blobShift 18s ease-in-out infinite alternate-reverse;
}
@keyframes blobShift {
  from { transform:scale(1) translate(0,0); }
  to   { transform:scale(1.15) translate(4%,3%); }
}

.about-grid {
  display:grid; grid-template-columns:1.55fr 1fr;
  gap:clamp(2.2rem,5vw,5rem); align-items:start;
  position:relative; z-index:1;
}

.about-card {
  background:var(--cream);
  padding:clamp(2rem,4vw,3.2rem);
  border-radius:var(--r-2xl);
  border:1px solid var(--border);
  box-shadow:var(--sh-md), inset 0 1px 0 rgba(255,255,255,0.7);
  position:relative; overflow:hidden;
  transition:box-shadow .4s var(--smooth), transform .4s var(--spring);
}
.about-card:hover { box-shadow:var(--sh-lg); }

/* Top gradient bar */
.about-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--gold-lt), var(--gold), var(--gold-dk), var(--gold), var(--gold-lt));
  background-size:200% 100%;
  animation:barSlide 5s linear infinite;
}
@keyframes barSlide { from { background-position:0% 0; } to { background-position:200% 0; } }

/* Inner glow */
.about-card::after {
  content:''; position:absolute; inset:0; border-radius:inherit;
  background:radial-gradient(ellipse 75% 45% at 50% 0%, rgba(200,150,90,0.07), transparent);
  pointer-events:none;
}

.about-card h3 {
  font-size:clamp(1.25rem,2.4vw,1.7rem);
  font-weight:700; letter-spacing:-.025em;
  color:var(--dark); margin-bottom:1.2rem; line-height:1.25;
}
.about-card p { color:var(--mid); line-height:1.82; margin-bottom:1.3rem; }

/* Stats */
.stats { display:flex; gap:.85rem; margin:1.5rem 0 1.8rem; flex-wrap:wrap; }
.stat {
  flex:1; min-width:105px;
  padding:1.2rem 1rem; text-align:center;
  background:var(--white); border-radius:var(--r-lg);
  border:1px solid rgba(200,150,90,0.11);
  box-shadow:var(--sh-xs);
  transition:transform .32s var(--spring), box-shadow .32s, border-color .25s;
}
.stat:hover { transform:translateY(-6px); box-shadow:var(--sh-gold); border-color:rgba(200,150,90,0.3); }
.stat-number {
  font-size:clamp(1.35rem,3vw,2rem);
  font-weight:700; color:var(--gold-dk); line-height:1; margin-bottom:.35rem;
}
.stat-label { font-size:.72rem; color:var(--muted); font-weight:500; letter-spacing:.04em; text-transform:uppercase; }

/* Profile image column */
.about-image { display:flex; justify-content:center; align-items:flex-start; padding-top:.4rem; }

.profile-wrap {
  position:relative; display:flex; align-items:center; justify-content:center;
}

.profile-ring-outer {
  position:absolute;
  width:calc(clamp(200px,28vw,290px) + 40px);
  height:calc(clamp(200px,28vw,290px) + 40px);
  border-radius:50%;
  border:1px dashed rgba(200,150,90,0.35);
  animation:spinCW 28s linear infinite;
}
.profile-ring-inner {
  position:absolute;
  width:calc(clamp(200px,28vw,290px) + 16px);
  height:calc(clamp(200px,28vw,290px) + 16px);
  border-radius:50%;
  background:conic-gradient(
    rgba(200,150,90,0.35), rgba(200,150,90,0.05),
    rgba(200,150,90,0.35), rgba(200,150,90,0.05),
    rgba(200,150,90,0.35)
  );
  animation:spinCCW 10s linear infinite;
  filter:blur(5px);
}

.profile-img-wrap {
  width:clamp(200px,28vw,290px); height:clamp(200px,28vw,290px);
  border-radius:50%; overflow:hidden;
  border:5px solid var(--white); box-shadow:var(--sh-gold);
  transition:transform .5s var(--spring), box-shadow .4s;
  position:relative; z-index:1; cursor:pointer;
}
.profile-img-wrap:hover { transform:scale(1.04) rotate(2.5deg); box-shadow:0 28px 72px rgba(200,150,90,0.45); }
.profile-img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--smooth); }
.profile-img-wrap:hover .profile-img { transform:scale(1.09); }

.profile-img-wrap--logo {
  border-radius:32px;
  overflow:visible;
  border:none;
  background:transparent;
  box-shadow:none;
}
.profile-img-wrap--logo:hover {
  transform:scale(1.02);
  box-shadow:none;
}
.profile-img--logo {
  object-fit:contain;
  padding:clamp(10px,2vw,18px);
  background:transparent;
}
.profile-img-wrap--logo:hover .profile-img--logo {
  transform:none;
}


/* Gold CTA button */
.btn {
  display:inline-flex; align-items:center; gap:.6rem;
  background:linear-gradient(135deg, var(--gold-lt), var(--gold-dk));
  color:#fff; padding:.85rem 1.7rem; border-radius:999px;
  font-size:.9rem; font-weight:600; letter-spacing:.025em;
  position:relative; overflow:hidden;
  box-shadow:0 5px 20px rgba(200,150,90,0.36);
  transition:transform .32s var(--spring), box-shadow .32s;
  -webkit-tap-highlight-color:transparent;
}
.btn::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
  transform:translateX(-110%); transition:transform .55s ease;
}
.btn:hover::before { transform:translateX(110%); }
.btn:hover { transform:translateY(-2px) scale(1.025); box-shadow:0 12px 36px rgba(200,150,90,0.48); }
.btn:active { transform:scale(.97); }

@media (max-width:767px) {
  .about-grid { grid-template-columns:1fr; }
  .about-image { display:none; }
}

/* ─────────────────────────────────────────────────────────
   PODCAST
───────────────────────────────────────────────────────── */
.podcast { background:var(--cream); }
.podcast::before {
  content:''; position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 65% 58% at 2% 52%, rgba(200,150,90,0.12) 0%, transparent 58%),
    radial-gradient(ellipse 50% 65% at 98% 22%, rgba(168,114,58,0.09) 0%, transparent 55%);
  animation:gradMesh 20s ease-in-out infinite alternate-reverse;
}

.podcast-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(2rem,5vw,4.5rem); align-items:start;
  position:relative; z-index:1;
}

.podcast-info h3 {
  font-size:clamp(1.2rem,2.4vw,1.6rem);
  font-weight:700; letter-spacing:-.02em;
  color:var(--dark); margin-bottom:1.25rem; line-height:1.25;
}
.podcast-info > p { color:var(--mid); line-height:1.82; margin-bottom:1.9rem; }

.platform-links { display:flex; flex-direction:column; gap:.75rem; }

.platform-link {
  display:flex; align-items:center; gap:1rem;
  padding:.95rem 1.3rem;
  background:var(--white); border-radius:var(--r-md);
  color:var(--dark); font-weight:500; font-size:.92rem;
  box-shadow:var(--sh-xs); border:1px solid rgba(0,0,0,.04);
  transition:transform .32s var(--spring), box-shadow .32s, background .28s, color .28s, border-color .28s;
  will-change:transform; position:relative; overflow:hidden;
}
.platform-link::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  transform:translateX(-110%); transition:transform .5s ease;
}
.platform-link:hover::before { transform:translateX(110%); }
.platform-link i { font-size:1.3rem; transition:transform .32s var(--spring); flex-shrink:0; }
.platform-link:hover i { transform:scale(1.18) rotate(-6deg); }
.platform-link:hover { transform:translateX(8px) translateY(-2px); box-shadow:var(--sh-md); }
.platform-link.spotify:hover  { background:#1DB954; color:#fff; border-color:#1DB954; box-shadow:0 8px 28px rgba(29,185,84,.32); }
.platform-link.amazon:hover   { background:#FF9900; color:#fff; border-color:#FF9900; box-shadow:0 8px 28px rgba(255,153,0,.32); }
.platform-link.audible:hover  { background:#F56500; color:#fff; border-color:#F56500; box-shadow:0 8px 28px rgba(245,101,0,.32); }

/* Form card */
.form-card {
  background:var(--white);
  padding:clamp(1.9rem,3.8vw,2.8rem);
  border-radius:var(--r-2xl);
  box-shadow:var(--sh-md), inset 0 1px 0 rgba(255,255,255,0.8);
  border:1px solid var(--border);
  position:relative; overflow:hidden;
  transition:box-shadow .4s;
}
.form-card:hover { box-shadow:var(--sh-lg); }
.form-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--gold-lt), var(--gold), var(--gold-dk), var(--gold), var(--gold-lt));
  background-size:200% 100%; animation:barSlide 5s linear infinite;
}
.form-card h4 {
  font-size:clamp(1.1rem,2.2vw,1.38rem);
  font-weight:700; letter-spacing:-.018em;
  color:var(--dark); margin-bottom:.65rem;
}
.form-card > p { color:var(--muted); margin-bottom:1.6rem; font-size:.92rem; line-height:1.65; }

/* Form fields */
.form-stack { display:flex; flex-direction:column; gap:.88rem; }

input, textarea, select {
  width:100%; padding:.92rem 1.15rem;
  border:1.5px solid #e2dcd6; border-radius:var(--r-md);
  font-family:inherit; font-size:.92rem; background:#faf8f6;
  color:var(--dark); outline:none;
  transition:border-color .25s, box-shadow .25s, background .22s, transform .2s;
  -webkit-appearance:none;
}
input:focus, textarea:focus, select:focus {
  border-color:var(--gold);
  background:var(--white);
  box-shadow:0 0 0 4px rgba(200,150,90,0.14);
  transform:translateY(-1px);
}
input.input-error, textarea.input-error {
  border-color:rgba(220,38,38,.52) !important;
  box-shadow:0 0 0 3px rgba(220,38,38,.08) !important;
  background:rgba(254,242,242,.55);
  animation:shake .38s cubic-bezier(.36,.07,.19,.97);
}
@keyframes shake {
  0%,100% { transform:translateX(0); }
  20% { transform:translateX(-6px); }
  40% { transform:translateX(5px); }
  60% { transform:translateX(-3px); }
  80% { transform:translateX(3px); }
}
textarea { resize:vertical; min-height:115px; }
input::placeholder, textarea::placeholder { color:var(--subtle); opacity:.9; }

.submit-btn {
  width:100%; display:flex; align-items:center; justify-content:center; gap:.55rem;
  background:linear-gradient(135deg, var(--gold-lt), var(--gold-dk));
  color:#fff; border-radius:var(--r-md);
  padding:1.05rem 1.8rem; font-size:.97rem; font-weight:600; letter-spacing:.02em;
  position:relative; overflow:hidden;
  box-shadow:0 5px 22px rgba(200,150,90,0.34);
  transition:transform .32s var(--spring), box-shadow .32s;
  -webkit-tap-highlight-color:transparent; margin-top:.2rem;
}
.submit-btn::before {
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.26), transparent);
  transform:translateX(-110%); transition:transform .55s ease;
}
.submit-btn:hover::before { transform:translateX(110%); }
.submit-btn:hover { transform:translateY(-2px) scale(1.016); box-shadow:0 12px 36px rgba(200,150,90,0.46); }
.submit-btn:active { transform:scale(.97); }

/* Form feedback */
.form-feedback {
  display:none; align-items:flex-start; gap:.65rem;
  padding:.88rem 1.1rem; border-radius:var(--r-sm);
  font-size:.88rem; font-weight:500; line-height:1.5;
  animation:popIn .38s var(--spring) forwards;
}
.form-feedback.show { display:flex; }
.form-feedback.success { background:rgba(22,163,74,.09); border:1px solid rgba(22,163,74,.28); color:#14532d; }
.form-feedback.error   { background:rgba(220,38,38,.07);  border:1px solid rgba(220,38,38,.22); color:#7f1d1d; }
.form-feedback i { margin-top:2px; flex-shrink:0; }

/* Button loading state */
.submit-btn.loading .btn-label-txt { display:none; }
.submit-btn.loading .btn-spinner   { display:inline-flex; align-items:center; gap:.45rem; }
.btn-spinner { display:none; }
.submit-btn.loading { pointer-events:none; opacity:.82; }

@media (max-width:767px) { .podcast-grid { grid-template-columns:1fr; } }

/* ─────────────────────────────────────────────────────────
   DEKO
───────────────────────────────────────────────────────── */
.deko { background:var(--white); }
.deko::before {
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 55% 68% at 100% 58%, rgba(200,150,90,0.07) 0%, transparent 55%),
    radial-gradient(ellipse 48% 52% at 3%  28%, rgba(200,150,90,0.06) 0%, transparent 50%);
}

.deko-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(2rem,5vw,4.5rem); align-items:start;
  position:relative; z-index:1;
}

.deko-info h3 {
  font-size:clamp(1.15rem,2.3vw,1.55rem);
  font-weight:700; letter-spacing:-.02em;
  color:var(--dark); margin-bottom:1.2rem; line-height:1.25;
}
.deko-info p { color:var(--mid); line-height:1.82; margin-bottom:1.1rem; }
.deko-info strong { color:var(--dark-2); }

.feature-list { list-style:none; margin:.9rem 0 1.5rem; }
.feature-list li {
  padding:.62rem 0; color:var(--dark); font-size:.94rem;
  border-bottom:1px solid rgba(200,150,90,0.1);
  transition:padding-left .25s var(--ease), color .2s;
  cursor:default;
}
.feature-list li:hover { padding-left:7px; color:var(--gold-dk); }
.feature-list li:last-child { border-bottom:none; }

/* Gallery */
.gallery { display:grid; grid-template-columns:1fr; gap:1.4rem; }
.gallery--single { max-width:min(100%, 520px); margin-inline:auto; }

.gallery-item {
  border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--sh-md); position:relative; cursor:zoom-in;
  transition:transform .48s var(--ease), box-shadow .48s;
  will-change:transform;
}
.gallery-item:hover { transform:translateY(-10px) scale(1.012); box-shadow:0 30px 64px rgba(0,0,0,.17); }
.gallery-item img {
  width:100%; height:clamp(250px,40vw,460px);
  object-fit:cover; display:block; transition:transform .65s var(--smooth);
}
.gallery-item:hover img { transform:scale(1.08); }
.gallery-item::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(26,21,16,.58) 0%, transparent 50%);
  opacity:0; transition:opacity .4s;
}
.gallery-item:hover::after { opacity:1; }
.gallery-item .zoom-icon {
  position:absolute; bottom:1.2rem; right:1.2rem; z-index:2;
  width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.9); display:flex; align-items:center; justify-content:center;
  color:var(--dark); font-size:.85rem;
  opacity:0; transform:scale(.7);
  transition:opacity .32s, transform .32s var(--spring), box-shadow .28s;
}
.gallery-item:hover .zoom-icon { opacity:1; transform:scale(1); box-shadow:var(--sh-sm); }

@media (max-width:767px) {
  .deko-grid { grid-template-columns:1fr; }
  .gallery { grid-template-columns:1fr 1fr; gap:.75rem; }
  .gallery-item img { height:clamp(200px,60vw,320px); }
  .gallery-item .zoom-icon { opacity:1; transform:scale(1); width:32px; height:32px; font-size:.75rem; bottom:.7rem; right:.7rem; }
}

/* ─────────────────────────────────────────────────────────
   COOPERATION
───────────────────────────────────────────────────────── */
.cooperation { background:var(--cream); }
.cooperation::before {
  content:''; position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 60% 52% at 96% 46%, rgba(200,150,90,0.12) 0%, transparent 55%),
    radial-gradient(ellipse 48% 62% at 2%  72%, rgba(168,114,58,0.09) 0%, transparent 55%);
  animation:gradMesh 22s ease-in-out infinite alternate;
}

.coop-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(2rem,5vw,4.5rem); align-items:start;
  position:relative; z-index:1;
}

.coop-info h3 {
  font-size:clamp(1.2rem,2.4vw,1.65rem); font-weight:700; letter-spacing:-.022em; color:var(--dark); margin-bottom:1.2rem;
}
.coop-info > p { color:var(--mid); line-height:1.82; margin-bottom:1.9rem; }

.coop-features { display:flex; flex-direction:column; gap:.85rem; }
.coop-feature {
  display:flex; align-items:flex-start; gap:1rem;
  padding:1rem 1.2rem; background:var(--white); border-radius:var(--r-md);
  border:1px solid var(--border); box-shadow:var(--sh-xs);
  transition:transform .32s var(--spring), box-shadow .32s, border-color .28s;
}
.coop-feature:hover {
  transform:translateX(8px); box-shadow:var(--sh-sm);
  border-color:rgba(200,150,90,0.32);
}
.coop-icon {
  width:44px; height:44px; flex-shrink:0; border-radius:var(--r-sm);
  background:linear-gradient(135deg, rgba(200,150,90,0.16), rgba(168,114,58,0.10));
  display:flex; align-items:center; justify-content:center;
  color:var(--gold-dk); font-size:1.1rem;
  transition:transform .32s var(--spring), background .28s, color .28s;
}
.coop-feature:hover .coop-icon {
  transform:scale(1.12) rotate(-5deg);
  background:linear-gradient(135deg, var(--gold-lt), var(--gold-dk));
  color:#fff;
}
.coop-feature h4 {
  font-size:.93rem; font-weight:600; letter-spacing:-.012em; color:var(--dark); margin-bottom:.18rem;
}
.coop-feature p { font-size:.83rem; color:var(--muted); line-height:1.45; }

@media (max-width:767px) { .coop-grid { grid-template-columns:1fr; } }

/* ─────────────────────────────────────────────────────────
   FOOTER
───────────────────────────────────────────────────────── */
.footer {
  background:var(--dark2); color:#b2a99e;
  padding:clamp(3rem,7vw,5rem) 0 2rem;
  position:relative; overflow:hidden;
}
.footer::before {
  content:''; position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse 75% 55% at 50% -5%, rgba(200,150,90,0.08) 0%, transparent 55%);
}
/* Subtle top border glow */
.footer::after {
  content:''; position:absolute; top:0; left:10%; right:10%;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(200,150,90,0.45), transparent);
}

.footer-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(1.5rem,4vw,3rem); margin-bottom:2.8rem;
  position:relative; z-index:1;
}
.footer-col h4 {
  font-size:1rem; font-weight:600; letter-spacing:.01em;
  color:var(--gold-lt); margin-bottom:1rem;
}
.footer-col p  { color:#9a9088; line-height:1.72; margin-bottom:.45rem; font-size:.88rem; }
.footer-col ul { list-style:none; }
.footer-col li { margin-bottom:.42rem; }
.footer-col li a {
  color:#9a9088; font-size:.88rem;
  display:inline-flex; align-items:center; gap:.35rem;
  transition:color .22s, padding-left .22s;
}
.footer-col li a::before { content:''; display:block; width:0; height:1px; background:var(--gold); transition:width .22s; }
.footer-col li a:hover { color:var(--gold-lt); padding-left:5px; }
.footer-col li a:hover::before { width:12px; }

.socials { display:flex; gap:.65rem; margin-top:1rem; flex-wrap:wrap; }
.social-btn {
  width:40px; height:40px; border-radius:50%;
  background:rgba(200,150,90,0.1);
  color:var(--gold-lt); font-size:.9rem;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(200,150,90,0.18);
  transition:background .28s, transform .32s var(--spring), color .28s, border-color .28s, box-shadow .28s;
}
.social-btn:hover {
  background:var(--gold); color:#fff; border-color:var(--gold);
  transform:translateY(-3px) scale(1.1);
  box-shadow:0 8px 22px rgba(200,150,90,0.42);
}

.footer-bottom {
  border-top:1px solid rgba(255,255,255,.05); padding-top:1.6rem;
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:.8rem;
  position:relative; z-index:1;
}
.footer-bottom p { color:#6e6560; font-size:.82rem; margin:0; }
.impressum-link a {
  color:rgba(200,150,90,0.75); font-size:.82rem;
  transition:color .22s;
}
.impressum-link a:hover { color:var(--gold-lt); }

@media (max-width:767px) {
  .footer-grid { grid-template-columns:1fr; text-align:center; }
  .socials { justify-content:center; }
  .footer-bottom { flex-direction:column; text-align:center; }
}

/* ─────────────────────────────────────────────────────────
   MODAL
───────────────────────────────────────────────────────── */
.modal {
  display:none; position:fixed; inset:0; z-index:2000;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  align-items:center; justify-content:center; padding:1rem;
}
.modal.open { display:flex; animation:fadeIn .28s ease forwards; }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.modal-box {
  background:var(--white); border-radius:var(--r-2xl);
  padding:clamp(1.8rem,4vw,2.8rem);
  width:100%; max-width:560px; max-height:90vh;
  overflow-y:auto; position:relative;
  box-shadow:var(--sh-xl);
  animation:popIn .42s var(--spring) forwards;
  border:1px solid var(--border);
}
.modal-close {
  position:absolute; right:1rem; top:1rem;
  width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.25rem; color:var(--muted); cursor:pointer;
  transition:background .22s, color .22s, transform .32s var(--spring);
}
.modal-close:hover { background:rgba(0,0,0,0.06); color:var(--gold-dk); transform:rotate(90deg) scale(1.1); }
.modal-box h2 {
  font-size:1.55rem; font-weight:700; letter-spacing:-.03em; color:var(--dark); margin-bottom:1.4rem;
}
.impressum-content p { color:var(--mid); line-height:1.75; margin-bottom:.9rem; font-size:.91rem; }
.impressum-content a { color:var(--gold-dk); }
.impressum-content a:hover { text-decoration:underline; }

/* Lightbox */
.lightbox {
  display:none; position:fixed; inset:0; z-index:3000;
  background:rgba(0,0,0,.94); cursor:zoom-out;
  align-items:center; justify-content:center; padding:1rem;
}
.lightbox.open { display:flex; animation:fadeIn .28s ease forwards; }
.lightbox img {
  max-width:92vw; max-height:90vh; border-radius:var(--r-md);
  box-shadow:0 32px 80px rgba(0,0,0,.5); object-fit:contain;
  animation:popIn .38s var(--spring) forwards;
}

/* ─────────────────────────────────────────────────────────
   KEYFRAMES
───────────────────────────────────────────────────────── */
@keyframes fadeUp   { from { opacity:0; transform:translateY(48px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeLeft { from { opacity:0; transform:translateX(48px); } to { opacity:1; transform:translateX(0); } }
@keyframes popIn    { from { opacity:0; transform:scale(.88) translateY(28px); } to { opacity:1; transform:scale(1) translateY(0); } }

/* Ripple */
.ripple-dot {
  position:absolute; border-radius:50%;
  background:rgba(255,255,255,0.30); pointer-events:none;
  transform:scale(0); animation:rippleOut .6s ease-out forwards;
}
@keyframes rippleOut { to { transform:scale(2.5); opacity:0; } }

/* ─────────────────────────────────────────────────────────
   CURSOR FOLLOWER  (desktop only)
───────────────────────────────────────────────────────── */
#cursor {
  position:fixed; width:10px; height:10px; border-radius:50%;
  background:var(--gold); pointer-events:none; z-index:9998;
  transform:translate(-50%,-50%) scale(1);
  transition:transform .12s, opacity .3s, width .3s var(--spring), height .3s var(--spring), background .2s;
  opacity:0; mix-blend-mode:multiply;
}
#cursor-ring {
  position:fixed; width:34px; height:34px; border-radius:50%;
  border:1.5px solid rgba(200,150,90,0.55); pointer-events:none; z-index:9997;
  transform:translate(-50%,-50%);
  transition:transform .18s var(--smooth), opacity .3s, width .35s var(--spring), height .35s var(--spring);
  opacity:0;
}
body:hover #cursor,
body:hover #cursor-ring { opacity:1; }
.cursor-grow { width:28px !important; height:28px !important; }
.ring-grow    { width:56px !important; height:56px !important; border-color:rgba(200,150,90,0.7) !important; }
@media (pointer:coarse) { #cursor, #cursor-ring { display:none !important; } }

/* ─────────────────────────────────────────────────────────
   REDUCED MOTION
───────────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .js-ready .revel { opacity:1 !important; transform:none !important; }
  #heroBg, .hero-shimmer { display:none !important; }
  #cursor, #cursor-ring { display:none !important; }
}

/* ─────────────────────────────────────────────────────────
   ADDITIONS  v4.0
───────────────────────────────────────────────────────── */

/* Page overlay for transitions */
#pageOverlay { position:fixed; inset:0; z-index:9990; background:var(--warm); pointer-events:none; }

/* Nav logo two-line text */


/* Hero badges */
.hero-badges {
  display:flex; gap:.55rem; flex-wrap:wrap;
  margin-bottom:clamp(1.6rem,3.5vw,2.4rem);
}
.hero-badge {
  display:inline-flex; align-items:center; gap:.38rem;
  padding:.38rem .85rem; border-radius:999px;
  background:rgba(255,255,255,0.65);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(200,150,90,.22);
  font-size:.75rem; font-weight:500; color:var(--dark);
  box-shadow:var(--sh-xs);
}
.hero-badge i { color:var(--gold-dk); font-size:.7rem; }
.hero-badge { text-decoration:none; cursor:pointer; transition:transform .24s var(--spring), box-shadow .24s var(--ease), background .24s var(--ease), border-color .24s var(--ease); }
.hero-badge:hover, .hero-badge:focus-visible { transform:translateY(-2px); background:rgba(255,255,255,.88); border-color:rgba(200,150,90,.42); box-shadow:0 12px 28px rgba(0,0,0,.08); }
.hero-badge:focus-visible { outline:none; }
@media (max-width:767px) {
  .hero-badges { justify-content:center; }
}

/* Footer brand row */
.footer-brand {
  display:flex; align-items:center; gap:.7rem; margin-bottom:.85rem;
}
.footer-logo {
  width:38px; height:38px; border-radius:50%; object-fit:cover;
  border:2px solid rgba(200,150,90,.25);
  opacity:.85;
}
.footer-brand h4 { margin-bottom:0 !important; }

/* Footer contact links */
.footer-contact-link {
  display:inline-flex; align-items:center; gap:.4rem;
  color:#9a9088 !important; font-size:.88rem;
  transition:color .22s !important;
}
.footer-contact-link:hover { color:var(--gold-lt) !important; }
.footer-contact-link i { font-size:.8rem; }

/* Footer podcast mini links */
.footer-pod-links { display:flex; gap:.5rem; }
.footer-pod-btn {
  width:34px; height:34px; border-radius:var(--r-sm);
  background:rgba(200,150,90,.1); border:1px solid rgba(200,150,90,.18);
  color:var(--gold-lt); font-size:.88rem;
  display:flex; align-items:center; justify-content:center;
  transition:background .25s, transform .28s var(--spring), box-shadow .25s;
}
.footer-pod-btn:hover {
  background:var(--gold); color:#fff;
  transform:translateY(-2px) scale(1.08);
  box-shadow:0 6px 18px rgba(200,150,90,.4);
}

/* Footer quick-link chevrons */
.footer-col li a i { font-size:.55rem; opacity:.5; transition:transform .22s, opacity .22s; }
.footer-col li a:hover i { transform:translateX(3px); opacity:.8; }

/* Lightbox close button */
.lightbox-close {
  position:fixed; top:1.2rem; right:1.4rem; z-index:1;
  width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,.1); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.2);
  color:#fff; font-size:1.4rem; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .22s, transform .32s var(--spring);
}
.lightbox-close:hover { background:rgba(255,255,255,.2); transform:rotate(90deg) scale(1.1); }

/* Section eyebrow animation */
.section-eyebrow {
  display:inline-block;
  font-size:.72rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold-dk);
  margin-bottom:.75rem;
}


/* ═══════════════════════════════════════════════════════════
   LOGO IMAGE STYLES  (replaces text branding everywhere)
═══════════════════════════════════════════════════════════ */

/* nav-brand-logo defined above */

/* Hero brand logo */
.hero-brand-logo {
  width:clamp(240px, 40vw, 440px);
  height:auto;
  display:block;
  margin-bottom:clamp(.6rem, 1.5vw, 1rem);
  opacity:0;
  animation:
    heroLogoIn .9s cubic-bezier(.16,1,.3,1) .4s forwards,
    floatScript 7s ease-in-out 2.2s infinite;
}
@keyframes heroLogoIn {
  from { opacity:0; transform:translateY(18px) scale(.97); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}
@media (max-width:767px) {
  .hero-brand-logo { width:clamp(190px, 70vw, 290px); }
}

/* Footer brand logo */
.footer-brand-logo {
  height:44px; width:auto; max-width:190px;
  display:block; margin-bottom:.9rem;
  opacity:.82;
  transition:opacity .28s, transform .32s cubic-bezier(.34,1.56,.64,1);
}
.footer-brand-logo:hover { opacity:1; transform:scale(1.03); }

/* ═══════════════════════════════════════════════════════════
   MOBILE MENU
═══════════════════════════════════════════════════════════ */
@media (max-width:767px) {
  .hamburger {
    display:flex; width:48px; height:48px; padding:10px; border-radius:16px;
    background:rgba(255,255,255,.72); border:1px solid rgba(200,150,90,.18);
    box-shadow:0 10px 26px rgba(0,0,0,.06); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  }
  .bar { height:2px; border-radius:999px; }
  .nav-menu { display:flex; }
  .nav-menu {
    position:fixed; inset:0; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:.4rem;
    background:linear-gradient(180deg, rgba(249,245,239,.98) 0%, rgba(240,233,223,.98) 100%);
    backdrop-filter:blur(22px) saturate(180%); -webkit-backdrop-filter:blur(22px) saturate(180%);
    transform:translateY(-18px); opacity:0; visibility:hidden; pointer-events:none;
    transition:transform .34s cubic-bezier(.22,1,.36,1), opacity .28s ease, visibility .28s;
    padding:calc(var(--nav-h) + 1rem) 1.1rem 2rem; overflow-y:auto; z-index:800;
  }
  .nav-menu.open { transform:translateY(0); opacity:1; visibility:visible; pointer-events:auto; }
  .nav-menu li {
    opacity:0; transform:translateY(14px);
    transition:opacity .28s ease, transform .28s ease;
    border-bottom:none;
  }
  .nav-menu.open li { opacity:1; transform:translateY(0); }
  .nav-menu.open li:nth-child(1) { transition-delay:.04s; }
  .nav-menu.open li:nth-child(2) { transition-delay:.08s; }
  .nav-menu.open li:nth-child(3) { transition-delay:.12s; }
  .nav-menu.open li:nth-child(4) { transition-delay:.16s; }
  .nav-menu.open li:nth-child(5) { transition-delay:.20s; }
  .nav-menu.open li:nth-child(6) { transition-delay:.24s; }
  .nav-link {
    display:flex; align-items:center; justify-content:space-between;
    padding:1rem 1.05rem; font-size:1.05rem; font-weight:600; color:var(--dark);
    letter-spacing:-.01em; border-radius:20px; background:rgba(255,255,255,.72);
    border:1px solid rgba(200,150,90,.14); box-shadow:0 10px 24px rgba(0,0,0,.04);
  }
  .nav-link::after { display:none !important; }
  .nav-link:not(.nav-link-back)::before { display:none !important; }
  .nav-link:hover, .nav-link:focus-visible, .nav-link.active {
    background:rgba(255,255,255,.96); border-color:rgba(200,150,90,.32); color:var(--gold-dk);
  }
  .nav-link-back { justify-content:center; margin-top:.9rem; padding:.9rem 1.2rem !important; }
  .nav-link-back i { display:none; }
  .hamburger.open .bar { background:var(--gold-dk); }
}



.deko-banner{display:block;width:min(100%,520px);height:auto;margin:1rem auto 0;border-radius:24px;box-shadow:0 12px 30px rgba(0,0,0,.08);object-fit:cover;}


.mobile-about-logo {
  display:none;
  padding:0 0 clamp(1.2rem, 5vw, 2rem);
  background:var(--warm);
}
.mobile-about-logo-wrap {
  position:relative;
  width:min(82vw, 360px);
  aspect-ratio:1/1;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
}
 .mobile-about-logo-img {
  width:82%;
  height:82%;
  object-fit:contain;
  position:relative;
  z-index:2;
  filter:drop-shadow(0 14px 32px rgba(200,150,90,.18));
}
.mobile-about-ring {
  position:absolute;
  inset:0;
  border-radius:50%;
}
.mobile-about-ring--outer {
  border:1px dashed rgba(200,150,90,.38);
  animation:spinCW 22s linear infinite;
}
.mobile-about-ring--inner {
  inset:12px;
  background:conic-gradient(
    rgba(200,150,90,.26),
    rgba(200,150,90,.04),
    rgba(200,150,90,.26),
    rgba(200,150,90,.05),
    rgba(200,150,90,.26)
  );
  filter:blur(6px);
  animation:spinCCW 12s linear infinite;
}
.mobile-about-ring--glow {
  inset:28px;
  border:1px solid rgba(255,255,255,.75);
  box-shadow:0 10px 40px rgba(200,150,90,.14), inset 0 0 18px rgba(255,255,255,.72);
}

@media (max-width:767px) {
  .mobile-about-logo { display:block; }
  #deko { padding-top:clamp(2.2rem, 8vw, 3.2rem); }
  .deko-banner { margin-top:.85rem; }
}

.form-feedback a { color:inherit; text-decoration:underline; }


.form-note{margin-top:.85rem;font-size:.88rem;line-height:1.55;color:var(--muted);}
