/* ============================================================
   INCREDIBLE KARNATAKA — V2  |  site-core.css
   Worldwide Media Corporation Group, USA
   Consolidated from the 22.07.2026 build. No stray HTML tags.
   ============================================================ */


/* ===== BASE / ROOT / NAV / SECTIONS ===== */

:root {
    --blush: #f5c8e7;
    --lavender: #d9d0f0;
    --sky: #c8e8f7;
    --mint: #c8f0e8;
    --gold: #96681c;
    --gold-bright: #ce9744;
    --gold-light: #f0dcb8;
    --pearl: #faf8f5;
    --ink: #1a1420;
    --ink-soft: #3a2e48;
    --mist: #f5f0fa;
    --cyan: #a8dce8;
    --rose: #e8b0c8;
    --lilac: #c8b8e8;
    --butter: #f5e8c8;
  }
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  html { scroll-behavior: smooth; }

  a { text-decoration: none; }

  body {
    font-family: 'DM Sans', sans-serif;
font-size: 20px;
line-height: 1.65;
    background: var(--pearl);
    color: var(--ink);
    overflow-x: hidden;
  }

  /* NAV */
 nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  background:var(--surface);
  box-shadow: none;
  border-bottom: 1px solid var(--line);
  overflow: hidden;
}
.nav-bottom {
  position: fixed;
  top: 134px;
  left: 0; right: 0;
  z-index: 998;
  background:var(--surface);
  border-top: none;
  border-bottom: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 2rem;
  transition: transform 0.4s ease;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
overflow: visible;
}
nav.scrolled {
  background: rgba(250,248,245,0.99);
}
.nav-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3rem 2.5rem;
  border-bottom: 1px solid rgba(212,169,106,0.1);
}
.nav-left {
  display: flex;
  align-items: center;
  gap: 16px;
}
.nav-right {
  display: flex;
  align-items: center;
  gap: 1.2rem;
}
.nav-logo {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.1rem;
  font-weight: 300;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ink);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.nav-logo span { color: var(--gold); }
.nav-bottom {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 2rem;
}
.nav-group {
  position: relative;
}
.nav-group-btn {
  background: none;
  border: none;
  padding: 0.65rem 1rem;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  /* was #000000 - black on the dark-mode bar is 1.26:1, i.e. invisible.
     The ink token is near-black in light and near-white in dark. */
  color: var(--ink, #000000);
  font-weight: 400;
  cursor: pointer;
  transition: color 0.3s;
  white-space: nowrap;
}
.nav-group:hover .nav-group-btn { color: var(--gold); }
.mega-menu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 260px;
  background: rgba(250,248,245,0.99);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(212,169,106,0.15);
  border-top: 2px solid var(--gold);
  padding: 1rem 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: all 0.25s ease;
  z-index: 2000;
}
.nav-group:hover .mega-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.mega-menu a {
  display: block;
  padding: 0.6rem 1.4rem; line-height: 1.6;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  font-weight: 300;
  transition: all 0.2s;
  font-family: 'DM Sans', sans-serif;
}
.mega-menu a:hover {
  color: var(--gold);
  padding-left: 1.8rem;
}
.subscribe-btn {
  background: #000;
  color: #fff;
  border: none;
  padding: 9px 20px;
  font-size: 9px;
  letter-spacing: 3px;
  text-transform: uppercase;
  cursor: pointer;
  font-family: 'DM Sans', sans-serif;
  transition: all .3s ease;
}
.subscribe-btn:hover { background: #333; }
.profile-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: .3s;
}
.profile-btn:hover { transform: translateY(-2px); }
.home-btn {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: .3s;
}
.home-btn:hover { transform: translateY(-2px); }

  /* HERO */
  .hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    padding: 8rem 3rem 4rem;
    overflow: visible;
  }

  /* Floating orbs */
  .orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    animation: float 8s ease-in-out infinite;
  }
  .orb-1 {
    width: 420px; height: 420px;
    background: radial-gradient(circle, rgba(216,208,240,0.5) 0%, transparent 70%);
    top: -80px; right: -100px;
    animation-delay: 0s;
  }
  .orb-2 {
    width: 300px; height: 300px;
    background: radial-gradient(circle, rgba(200,232,247,0.45) 0%, transparent 70%);
    bottom: 10%; left: -80px;
    animation-delay: -3s;
  }
  .orb-3 {
    width: 200px; height: 200px;
    background: radial-gradient(circle, rgba(240,220,184,0.4) 0%, transparent 70%);
    top: 30%; left: 20%;
    animation-delay: -5s;
  }
  @keyframes float {
    0%, 100% { transform: translateY(0px) scale(1); }
    33% { transform: translateY(-20px) scale(1.02); }
    66% { transform: translateY(10px) scale(0.98); }
  }

.hero-inner{
    position:relative;
    z-index:2;
    transform:translateY(0px);

    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
}
	
.hero-line {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background: #cfcfcf;
    top: 190px;
    z-index: 10;
}
	
.hero-eyebrow{
    width:900px;
    max-width:90%;
    margin:0 auto;

    font-size:1rem;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--gold);
}
.header-divider{
    display:none;
}
.hero-full-line{
    width:65%;
    height:1px;
    background:#000;
    margin:15px auto 0;
}
	.top-actions{
    position:absolute;
    top:70px;
    right:70px;

    display:flex;
    align-items:center;
    gap:28px;

    z-index:999;
}
.menu-btn{
    font-size:28px;
    font-weight:300;
    cursor:pointer;
    color:var(--ink);
    display:flex;
    align-items:center;
}
.subscribe-btn{
    background:#000;
    color:#fff;

    border:none;

    padding:12px 24px;

    font-size:10px;
    letter-spacing:3px;
    text-transform:uppercase;

    cursor:pointer;

    transition:all .3s ease;
}

.subscribe-btn:hover{
    background:#222;
}
	.profile-btn{
    font-size:36px !important;
}

.search-btn{
    background:none;
    border:none;
    display:flex;
    align-items:center;
    gap:10px;
    font-size:18px;
}
.profile-btn{
    background:none;
    border:none;

    font-size:32px;

    color:var(--ink);

    cursor:pointer;

    transition:.3s;
}

.search-btn:hover,
.profile-btn:hover{
    transform:translateY(-2px);
}
	
  .hero-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(5rem, 12vw, 10rem);
    font-weight: 300;
    line-height: 0.9;
    color: var(--ink);
    letter-spacing: -0.02em;
    opacity: 0;
    transform: translateY(30px);
    animation: fadeUp 1.2s ease 0.5s forwards;
  }
  .hero-title .title-Karnataka {
    display: block;
    font-style: italic;
    background: linear-gradient(135deg, #c8a0d8 0%, #a0c0e8 40%, #a8dce8 70%, #c8e8d0 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }
  .hero-subtitle {
    font-size: 0.75rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--ink-soft);
    margin-top: 2rem;
    font-weight: 200;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeUp 1s ease 0.9s forwards;
  }
  .hero-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.5rem;
    margin-top: 3rem;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeUp 1s ease 1.2s forwards;
  }
  .hero-meta-item {
    text-align: center;
  }
  .hero-meta-label {
    font-size: 0.6rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--gold);
    display: block;
    margin-bottom: 0.3rem;
  }
  .hero-meta-val {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.1rem;
    font-weight: 400;
    color: var(--ink);
  }
  .hero-divider {
    width: 1px;
    height: 40px;
    background: linear-gradient(to bottom, transparent, var(--gold), transparent);
  }
  .hero-cta {
    margin-top: 3.5rem;
    opacity: 0;
    animation: fadeUp 1s ease 1.5s forwards;
  }
  .btn-primary {
    display: inline-block;
    padding: 0.9rem 3rem;
    border: 1px solid var(--gold);
    font-size: 0.68rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--ink);
    font-family: 'DM Sans', sans-serif;
    font-weight: 300;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background: none;
  }
  .btn-primary::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(216,208,240,0.4), rgba(200,232,247,0.4));
    transform: translateX(-100%);
    transition: transform 0.4s ease;
  }
  .btn-primary:hover::before { transform: translateX(0); }
  .btn-primary:hover { transform: scale(1.05); }
	#heroLink { transition: transform 0.3s ease; display: inline-block; }
#heroLink:hover { transform: scale(1.08); }
  .scroll-hint {
    position: absolute;
    bottom: 2.5rem;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    opacity: 0;
    animation: fadeUp 1s ease 2s forwards;
  }
  .scroll-line {
    width: 1px;
    height: 50px;
    background: linear-gradient(to bottom, var(--gold), transparent);
    margin: 0 auto 0.5rem;
    animation: scrollDown 1.8s ease-in-out infinite;
  }
  @keyframes scrollDown {
    0% { transform: scaleY(0); transform-origin: top; }
    50% { transform: scaleY(1); transform-origin: top; }
    51% { transform: scaleY(1); transform-origin: bottom; }
    100% { transform: scaleY(0); transform-origin: bottom; }
  }
  .scroll-hint span {
    font-size: 0.58rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold);
  }

  @keyframes fadeUp {
    to { opacity: 1; transform: translateY(0); }
  }

  /* SECTION WRAPPER */
  section {
    position: relative;
    z-index: 1;
  }

  /* COVER STORY BAND */
  .cover-band {
    padding: 4rem 8rem;
    background:var(--surface);
}
  .section-label {
    font-size: 0.62rem;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: var(--gold);
    text-align: center;
    margin-bottom: 0.8rem;
    font-weight: 300;
  }
  .section-heading {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 300;
    text-align: center;
    color: var(--ink);
    margin-bottom: 1rem;
    line-height: 1.1;
  }
  .section-heading em { font-style: italic; color: var(--ink-soft); }
  .section-rule {
    width: 60px;
    height: 1px;
    background: linear-gradient(to right, transparent, var(--gold), transparent);
    margin: 1.5rem auto 4rem;
  }

  /* COVER HERO CARD */
  .cover-card {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
  }
  .cover-visual {
    position: relative;
  }
  .cover-frame {
    aspect-ratio: 3/4;
    background: linear-gradient(145deg, var(--lavender), var(--sky), var(--blush));
    border-radius: 2px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 40px 80px rgba(100,80,140,0.12), 0 8px 20px rgba(100,80,140,0.08);
  }
  .cover-frame::before {
    content: 'INCREDIBLE Karnataka';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.5rem;
    font-weight: 300;
    color: rgba(26,20,32,0.12);
    white-space: nowrap;
    letter-spacing: 0.1em;
  }
  .cover-badge {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    background: rgba(250,248,245,0.9);
    backdrop-filter: blur(8px);
    padding: 0.6rem 1rem;
    border: 1px solid rgba(212,169,106,0.3);
  }
  .cover-badge-text {
    font-size: 0.58rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold);
    display: block;
  }
  .cover-badge-num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 300;
    color: var(--ink);
    line-height: 1;
  }
  .cover-tag {
    position: absolute;
    bottom: 1.5rem;
    left: 1.5rem;
    right: 1.5rem;
  }
  .cover-tag-inner {
    background: rgba(26,20,32,0.75);
    backdrop-filter: blur(10px);
    padding: 1rem 1.2rem;
    border-left: 2px solid var(--gold);
  }
  .cover-tag-label {
    font-size: 0.58rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold);
    display: block;
    margin-bottom: 0.3rem;
  }
  .cover-tag-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
    font-weight: 300;
    color: #fff;
    line-height: 1.2;
  }
  .cover-content h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.2rem;
    font-weight: 300;
    color: var(--ink);
    line-height: 1.1;
    margin-bottom: 1.5rem;
  }
  .cover-content h2 em { font-style: italic; }
  .cover-content p {
    font-size: 0.85rem;
    line-height: 1.9;
    color: var(--ink-soft);
    font-weight: 300;
    margin-bottom: 2rem;
    letter-spacing: 0.02em;
  }
  .cover-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-bottom: 2.5rem;
  }
  .tag {
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    padding: 0.4rem 1rem;
    border: 1px solid;
    font-weight: 300;
    cursor: default;
    transition: all 0.3s;
  }
  .tag-purple { border-color: rgba(200,184,232,0.7); color: #8060b8; background: rgba(216,208,240,0.15); }
  .tag-blue   { border-color: rgba(168,220,232,0.7); color: #3080a0; background: rgba(200,232,247,0.15); }
  .tag-rose   { border-color: rgba(232,176,200,0.7); color: #a04070; background: rgba(240,214,232,0.15); }
  .tag:hover { background: rgba(212,169,106,0.08); border-color: var(--gold); color: var(--gold); }

  /* FEATURE STORIES GRID */
  .stories-section {
    padding: 6rem 3rem;
  }
  .stories-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border: 1px solid rgba(212,169,106,0.15);
  }
  .story-card {
    padding: 3rem 2.5rem;
    border-right: 1px solid rgba(212,169,106,0.15);
    border-bottom: 1px solid rgba(212,169,106,0.15);
    transition: all 0.4s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .story-card:last-child,
  .story-card:nth-child(3),
  .story-card:nth-child(6) {
    border-right: none;
  }
  .story-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(216,208,240,0.0) 0%, rgba(200,232,247,0.0) 100%);
    transition: all 0.4s ease;
  }
  .story-card:hover::before {
    background: linear-gradient(135deg, rgba(216,208,240,0.12) 0%, rgba(200,232,247,0.08) 100%);
  }
  .story-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(100,80,140,0.08);
  }
  .story-num {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.5rem;
    font-weight: 300;
    line-height: 1;
    margin-bottom: 1.5rem;
    position: relative;
    z-index: 1;
  }
  .story-category {
    font-size: 0.58rem;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    margin-bottom: 0.8rem;
    font-weight: 300;
    position: relative;
    z-index: 1;
  }
  .story-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.3;
    color: var(--ink);
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
  }
  .story-excerpt {
    font-size: 0.78rem;
    line-height: 1.8;
    color: var(--ink-soft);
    font-weight: 300;
    position: relative;
    z-index: 1;
    letter-spacing: 0.01em;
  }
  .story-arrow {
    display: inline-block;
    margin-top: 1.2rem;
    font-size: 0.6rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 300;
    position: relative;
    z-index: 1;
    transition: letter-spacing 0.3s;
  }
  .story-card:hover .story-arrow { letter-spacing: 0.45em; }

  /* COLOR-CODED CATEGORIES */
  .cat-lifestyle .story-num { color: #b890d0; }
  .cat-lifestyle .story-category { color: #b890d0; }
  .cat-luxury .story-num { color: #80a8d0; }
  .cat-luxury .story-category { color: #80a8d0; }
  .cat-healthcare .story-num { color: #70c0a0; }
  .cat-healthcare .story-category { color: #70c0a0; }
  .cat-travel .story-num { color: #c08090; }
  .cat-travel .story-category { color: #c08090; }
  .cat-business .story-num { color: #a090c8; }
  .cat-business .story-category { color: #a090c8; }
  .cat-culture .story-num { color: #d0a070; }
  .cat-culture .story-category { color: #d0a070; }

  /* MARQUEE */
  .marquee-band {
    padding: 1.5rem 0;
    background: var(--ink);
    overflow: hidden;
    position: relative;
  }
  .marquee-track {
    display: flex;
    gap: 4rem;
    white-space: nowrap;
    animation: marquee 25s linear infinite;
  }
  .marquee-item {
    font-size: 0.62rem;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: rgba(240,220,184,0.6);
    font-weight: 200;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 1.5rem;
  }
  .marquee-item::after {
    content: '✦';
    color: var(--gold);
    font-size: 0.5rem;
  }
  @keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
  }

  /* COVER STORY FEATURES */
  .features-section {
    padding: 4rem 6rem;
    background: linear-gradient(180deg, transparent 0%, rgba(200,232,247,0.08) 50%, transparent 100%);
  }
  .features-hero {
    max-width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 5rem;
    align-items: start;
  }
  .feature-main {
    position: relative;
  }
  .feature-main-img {
    aspect-ratio: 4/3;
    background: linear-gradient(145deg, #c8b8e0, #a8d0e8, #c8e0d0);
    position: relative;
    overflow: hidden;
    margin-bottom: 2rem;
  }
  .feature-main-img::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(26,20,32,0.5) 0%, transparent 50%);
  }
  .feature-img-label {
    position: absolute;
    bottom: 1.5rem;
    left: 1.5rem;
    z-index: 1;
    font-family: 'Cormorant Garamond', serif;
    font-size: 2rem;
    font-weight: 300;
    color: #fff;
    line-height: 1.1;
    font-style: italic;
  }
  .feature-stack {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
  }
  .feature-small {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 1.5rem;
    align-items: start;
    cursor: pointer;
    padding: 1.2rem;
    transition: all 0.3s;
    border: 1px solid transparent;
  }
  .feature-small:hover {
    border-color: rgba(212,169,106,0.2);
    background: rgba(250,240,220,0.05);
  }
  .feature-small-img {
    aspect-ratio: 1;
    background: linear-gradient(135deg, var(--lavender), var(--sky));
  }
  .feature-small-cat {
    font-size: 0.58rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold);
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 300;
  }
  .feature-small-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.3;
    color: var(--ink);
    margin-bottom: 0.5rem;
  }
  .feature-small-text {
    font-size: 0.75rem;
    line-height: 1.7;
    color: var(--ink-soft);
    font-weight: 300;
  }

  /* SUBSCRIPTION BAND */
  .subscribe-band {
    padding: 8rem 3rem;
    background: var(--ink);
    text-align: center;
    position: relative;
    overflow: hidden;
  }
  .subscribe-band::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 80% 60% at 20% 50%, rgba(200,184,232,0.12) 0%, transparent 60%),
      radial-gradient(ellipse 60% 80% at 80% 50%, rgba(168,220,232,0.1) 0%, transparent 60%);
    pointer-events: none;
  }
  .subscribe-band .section-label { color: var(--gold); }
  .subscribe-band .section-heading {
    color: #fff;
    font-size: clamp(2.5rem, 5vw, 4rem);
  }
  .subscribe-band .section-rule {
    background: linear-gradient(to right, transparent, rgba(212,169,106,0.6), transparent);
  }
  .subscribe-band p {
    color: rgba(255,255,255,0.5);
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    margin-bottom: 3rem;
    font-weight: 200;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
  }
  .pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    max-width: 800px;
    margin: 0 auto 3rem;
  }
  .price-card {
    border: 1px solid rgba(212,169,106,0.2);
    padding: 2.5rem 1.5rem;
    text-align: center;
    position: relative;
    transition: all 0.4s;
    cursor: pointer;
    background: rgba(255,255,255,0.02);
  }
  .price-card:hover {
    border-color: rgba(212,169,106,0.5);
    background: rgba(212,169,106,0.05);
    transform: translateY(-5px);
  }
  .price-card.featured {
    border-color: var(--gold);
    background: rgba(212,169,106,0.06);
  }
  .price-card.featured::before {
    content: 'MOST POPULAR';
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gold);
    color: var(--ink);
    font-size: 0.55rem;
    letter-spacing: 0.25em;
    padding: 0.35rem 1rem;
    font-weight: 400;
  }
  .price-region {
    font-size: 0.6rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: rgba(212,169,106,0.7);
    margin-bottom: 1rem;
    font-weight: 300;
  }
  .price-amount {
    font-family: 'Cormorant Garamond', serif;
    font-size: 3rem;
    font-weight: 300;
    color: #fff;
    line-height: 1;
    margin-bottom: 0.3rem;
  }
  .price-period {
    font-size: 0.62rem;
    letter-spacing: 0.2em;
    color: rgba(255,255,255,0.4);
    font-weight: 200;
  }
  .price-features {
    margin-top: 1.5rem;
    list-style: none;
    text-align: left;
  }
  .price-features li {
    font-size: 0.72rem;
    color: rgba(255,255,255,0.55);
    padding: 0.4rem 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    font-weight: 200;
    letter-spacing: 0.05em;
    display: flex;
    gap: 0.6rem;
    align-items: center;
  }
  .price-features li::before { content: '—'; color: var(--gold); font-size: 0.7rem; }

  /* EDITORS SECTION */
  .editors-section {
    padding: 6rem 3rem;
  }
  .editors-grid {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2.5rem;
  }
  .editor-card {
    text-align: center;
    cursor: pointer;
  }
  .editor-avatar {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: 0 auto 1.2rem;
    position: relative;
    overflow: hidden;
    border: 2px solid rgba(212,169,106,0.2);
    transition: all 0.4s;
  }
  .editor-avatar-inner {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.8rem;
    font-weight: 300;
    color: rgba(26,20,32,0.5);
  }
  .editor-card:hover .editor-avatar {
    border-color: var(--gold);
    transform: scale(1.05);
  }
  .editor-name {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1rem;
    font-weight: 400;
    color: var(--ink);
    margin-bottom: 0.2rem;
  }
  .editor-role {
    font-size: 0.6rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 300;
  }

  /* QUOTE SECTION */
  .quote-section {
    padding: 7rem 3rem;
    text-align: center;
    background: linear-gradient(180deg, transparent 0%, rgba(216,208,240,0.08) 50%, transparent 100%);
  }
  .quote-mark {
    font-family: 'Cormorant Garamond', serif;
    font-size: 8rem;
    line-height: 0.5;
    color: var(--gold);
    opacity: 0.3;
    display: block;
    margin-bottom: 1.5rem;
  }
  .quote-text {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.5rem, 3vw, 2.5rem);
    font-weight: 300;
    font-style: italic;
    color: var(--ink);
    line-height: 1.5;
    max-width: 800px;
    margin: 0 auto 2rem;
  }
  .quote-attribution {
    font-size: 0.65rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 300;
  }

  /* DISTRIBUTION */
  .distribution-section {
    padding: 6rem 3rem;
    background: var(--ink);
    position: relative;
    overflow: hidden;
  }
  .distribution-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 80% at 50% 50%, rgba(168,220,232,0.06) 0%, transparent 70%);
    pointer-events: none;
  }
  .distribution-section .section-label { color: var(--gold); }
  .distribution-section .section-heading { color: #fff; }
  .distribution-section .section-rule {
    background: linear-gradient(to right, transparent, rgba(212,169,106,0.5), transparent);
  }
  .dist-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1px;
    max-width: 900px;
    margin: 0 auto;
    background: rgba(212,169,106,0.15);
  }
  .dist-item {
    background: var(--ink);
    padding: 2.5rem 1rem;
    text-align: center;
    transition: all 0.3s;
    cursor: default;
  }
  .dist-item:hover {
    background: rgba(212,169,106,0.05);
  }
  .dist-price {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.8rem;
    font-weight: 300;
    color: #fff;
    display: block;
    margin-bottom: 0.3rem;
  }
  .dist-region {
    font-size: 0.58rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(212,169,106,0.6);
    font-weight: 300;
  }

  /* FOOTER */
  footer {
    background: #120e18;
    padding: 5rem 3rem 3rem;
    position: relative;
  }
  .footer-top {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 4rem;
    max-width: 1100px;
    margin: 0 auto 4rem;
    padding-bottom: 4rem;
    border-bottom: 1px solid rgba(212,169,106,0.1);
  }
  .footer-brand {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.8rem;
    font-weight: 300;
    color: #fff;
    margin-bottom: 1rem;
    letter-spacing: 0.05em;
  }
  .footer-brand span { color: var(--gold); }
  .footer-tagline {
    font-size: 0.72rem;
    color: rgba(255,255,255,0.35);
    line-height: 1.8;
    font-weight: 200;
    letter-spacing: 0.05em;
    margin-bottom: 2rem;
  }
  .footer-social {
    display: flex;
    gap: 1rem;
  }
  .social-btn {
    width: 36px;
    height: 36px;
    border: 1px solid rgba(212,169,106,0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    color: rgba(212,169,106,0.6);
    cursor: pointer;
    transition: all 0.3s;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 400;
    text-decoration: none;
  }
  .social-btn:hover {
    background: rgba(212,169,106,0.1);
    color: var(--gold);
    border-color: var(--gold);
  }
  .footer-col-title {
    font-size: 0.6rem;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 300;
    margin-bottom: 1.5rem;
  }
  .footer-links {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
  }
  .footer-links a {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.4);
    text-decoration: none;
    font-weight: 200;
    letter-spacing: 0.05em;
    transition: color 0.3s;
  }
  .footer-links a:hover { color: rgba(212,169,106,0.8); }
  .footer-bottom {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .footer-copy {
    font-size: 0.65rem;
    color: rgba(255,255,255,0.25);
    letter-spacing: 0.08em;
    font-weight: 200;
  }
  .footer-legal {
    display: flex;
    gap: 2rem;
  }
  .footer-legal a {
    font-size: 0.62rem;
    color: rgba(255,255,255,0.25);
    text-decoration: none;
    letter-spacing: 0.08em;
    font-weight: 200;
    transition: color 0.3s;
  }
  .footer-legal a:hover { color: rgba(212,169,106,0.6); }

  /* SCROLL ANIMATIONS */
  .reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.9s ease, transform 0.9s ease;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}
  .reveal-delay-1 { transition-delay: 0.1s; }
  .reveal-delay-2 { transition-delay: 0.2s; }
  .reveal-delay-3 { transition-delay: 0.3s; }

  /* CURSOR GLOW */
  .cursor-glow {
    position: fixed;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(200,184,232,0.08) 0%, transparent 70%);
    pointer-events: none;
    z-index: 9999;
    transform: translate(-50%, -50%);
    transition: left 0.1s ease, top 0.1s ease;
  }

  /* TABLET */
@media (max-width: 1024px) {
  nav { padding: 0 1.5rem; }
  .nav-bottom { overflow-x: auto; justify-content: flex-start; }
  .nav-group-btn { padding: 0.65rem 0.7rem; font-size: 0.55rem; }
  section[style*="padding:5rem 6rem"],
  section[style*="padding:4rem 6rem"],
  section[style*="padding:6rem"] { padding: 3rem 2.5rem !important; }
  section[style*="margin:0 6rem"],
  section[style*="margin:4rem 6rem"] { margin: 2rem !important; }
  section[style*="padding:1rem 4rem"] { padding: 1rem 1.5rem !important; }
  section[style*="padding:2rem 10rem"] { padding: 2rem 2.5rem !important; }
}

/* MOBILE */
@media (max-width: 768px) {
  nav { padding: 0 1rem; }
  .nav-top { padding: 0.8rem 1rem; }
  .nav-logo img { height: 45px !important; width: auto; }
  .nav-logo p { display: none; }
  .nav-bottom { display: none; }
  .subscribe-btn { padding: 7px 12px; font-size: 8px; letter-spacing: 2px; }

  section[style*="padding:5rem 6rem"],
  section[style*="padding:4rem 6rem"],
  section[style*="padding:6rem"],
  section[style*="padding:3rem 6rem"] { padding: 2.5rem 1.2rem !important; }
  section[style*="margin:0 6rem"],
  section[style*="margin:4rem 6rem"] { margin: 0 !important; }
  section[style*="padding:1rem 4rem"],
  section[style*="padding:0 2rem 2rem 2rem;margin-top:160px"],
  section[style*="padding:3rem 4rem"] { padding: 1rem 1.2rem 0 !important; }

  div[style*="grid-template-columns:repeat(3"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns:repeat(4"] { grid-template-columns: repeat(2,1fr) !important; }
  div[style*="grid-template-columns:repeat(5"] { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  div[style*="grid-template-columns:repeat(6"] { grid-template-columns: repeat(2,1fr) !important; }
  div[style*="grid-template-columns:1.4fr"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns:1.6fr"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns:1.5fr"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns:1fr 1fr 0.7fr"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns:1fr 1px 1fr"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns:1.2fr 0.8fr"] { grid-template-columns: 1fr !important; }

  div[style*="height:88vh"] { height: 60vh !important; }
  div[style*="height:520px"] { height: 280px !important; }
  div[style*="height:480px"] { height: 260px !important; }
  div[style*="height:380px"] { height: 220px !important; }
  div[style*="height:340px"] { height: 200px !important; }
  div[style*="height:300px"] { height: 200px !important; }
  div[style*="height:560px"] { height: 320px !important; }
  div[style*="height:500px"] { height: 280px !important; }

  h2[style*="font-size:4rem"] { font-size: 2.2rem !important; }
  h2[style*="font-size:3rem"] { font-size: 2rem !important; }
  h1[style*="font-size:3.5rem"] { font-size: 2rem !important; }

  .cover-card { grid-template-columns: 1fr; gap: 2rem; }
  .stories-grid { grid-template-columns: 1fr; }
  .story-card { border-right: none; }
  .features-hero { grid-template-columns: 1fr; gap: 3rem; }
  .pricing-grid { grid-template-columns: 1fr; }
  .editors-grid { grid-template-columns: repeat(2,1fr); }
  .dist-grid { grid-template-columns: repeat(2,1fr); }
  .footer-top { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; gap: 1rem; text-align: center; }
  .cover-band, .stories-section, .features-section, .editors-section, .distribution-section { padding: 3rem 1.2rem; }
  .subscribe-band { padding: 3rem 1.2rem; }
  .footer-legal { flex-wrap: wrap; justify-content: center; }

  div[style*="bottom:5rem;left:6rem"] { left: 1.2rem !important; right: 1.2rem !important; bottom: 1.5rem !important; max-width: none !important; }
  div[style*="top:50%;left:5rem"] { left: 1.5rem !important; max-width: 85% !important; }
  div[style*="bottom:3rem;left:3rem"] { left: 1.2rem !important; bottom: 1.5rem !important; }

  /* HERO cover-feature fix on phones */
  #mainNav .nav-top { min-height: 84px; padding: 0.6rem 1rem !important; }
  #mainNav .nav-logo { width: 148px; text-align: center; }
  #mainNav .nav-logo img { height: 52px !important; width: auto; max-width: 100%; }
  #mainNav .nav-left { gap: 10px; }
  #mainNav .menu-btn { margin-right: 0 !important; }
  .homepage-hero { padding: 1rem !important; margin-top: 84px !important; }
  .homepage-hero .hero-frame { height: 390px !important; }
  .homepage-hero .hero-copy { left: 1.5rem !important; right: 1.5rem !important; bottom: 3.8rem !important; max-width: none !important; }
  #heroTitle { font-size: 2rem !important; line-height: 1.08 !important; margin-bottom: 0.5rem !important; }
  #heroTitle span { font-size: 0.43em !important; margin-top: 7px !important; }
  #heroDesc { display: none; }
  #heroLink { padding: 0.75rem 1.4rem !important; font-size: 0.65rem !important; }
  .hero-dots { bottom: 1.25rem !important; gap: 9px; }
  .hero-dots .dot { width: 9px; height: 9px; }

  .latest-issue { flex-direction: column !important; align-items: center !important; gap: 2rem !important; padding: 3rem 1.5rem !important; text-align: center; }
  .latest-issue-cover { width: min(72vw,260px) !important; height: auto !important; aspect-ratio: 11 / 15; }
  .latest-issue-copy { width: 100%; max-width: 420px; }
  .latest-issue-copy h2 { font-size: 2.35rem !important; }
  .latest-issue-copy > div { justify-content: center; }
}

  /* PARTICLE DOTS */
  .particle-field {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
  }
  .particle {
    position: absolute;
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: rgba(212,169,106,0.4);
    animation: particleDrift linear infinite;
  }
  @keyframes particleDrift {
    0% { transform: translateY(100vh) translateX(0px); opacity: 0; }
    10% { opacity: 1; }
    90% { opacity: 1; }
    100% { transform: translateY(-100px) translateX(var(--drift)); opacity: 0; }
  }

  /* GRADIENT TEXT UTILITY */
  .grad-text {
    background: linear-gradient(135deg, #c8a0d8 0%, #a0c0e8 50%, #a8dce8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }
body {
  background:var(--surface);
}

.feature-small {
  display: grid;
  grid-template-columns: 140px 1fr;
}

	.hero-dots {
    position: absolute;
    bottom: 45px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
    z-index: 20;
}

.hero-dots .dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255,255,255,0.45);
    cursor: pointer;
    transition: all .3s ease;
}

.hero-dots .dot.active {
    background:var(--surface);
    transform: scale(1.25);
}
@media (max-width: 768px) {
  .hero-dots { bottom: 1.25rem !important; gap: 9px; }
  .hero-dots .dot { width: 9px; height: 9px; }
}
#heroImage {
    transition: opacity 0.8s ease;
}
.hero-fade {
    opacity: 0 !important;
}

	.read-online-btn {
  transition: all 0.3s ease;
}
.read-online-btn:hover {
  background:var(--band) !important;
  color:#fff !important;
  border-color:var(--ink) !important;
}

/* ===== HERO FLIP ===== */

.homepage-hero .hero-frame{perspective:2600px;}
  .hero-flip-page{position:absolute;inset:0;z-index:7;transform-origin:left center;
    backface-visibility:hidden;-webkit-backface-visibility:hidden;display:none;overflow:hidden;
    will-change:transform;box-shadow:0 0 40px rgba(0,0,0,.12);}
  .hero-flip-page img{width:100%;height:100%;object-fit:cover;display:block;}
  .hero-flip-shade{position:absolute;inset:0;pointer-events:none;opacity:0;
    background:linear-gradient(90deg,rgba(15,8,4,0) 0%,rgba(15,8,4,.12) 55%,rgba(15,8,4,.5) 100%);}

/* ===== EDITORS PICKS MOSAIC ===== */

.gmo-sec{padding:3.5rem 6rem 4rem;background:var(--surface);}
  .gmo{display:grid;grid-template-columns:1fr 1.7fr 1fr;gap:1.3rem;}
  .gmo-col{display:grid;grid-template-rows:1fr 1fr;gap:1.3rem;}
  .gtile{position:relative;overflow:hidden;display:block;background:#e8e4e0;min-height:236px;}
  .gmo-center .gtile{height:100%;min-height:485px;}
  .gtile img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .6s ease;}
  .gtile:hover img{transform:scale(1.05);}
  .gtile.ph2{background:#dcdcdc;}
  .gtile.ph2::before{content:"Image Placeholder";position:absolute;top:38%;left:0;right:0;text-align:center;color:#b0aaa2;font-family:'DM Sans',sans-serif;font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;z-index:0;}
  .gth .thi.phg{background:#dcdcdc;}
  .gtile::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(15,10,14,.86) 0%,rgba(15,10,14,.15) 55%,transparent 100%);z-index:1;}
  .gtag{position:absolute;top:1rem;left:1rem;z-index:2;background:var(--gold);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:.54rem;letter-spacing:.16em;text-transform:uppercase;padding:.3rem .7rem;}
  .gcap{position:absolute;left:1.3rem;right:1.3rem;bottom:1.2rem;z-index:2;}
  /* keep tag + caption pinned over the image (overrides .ph > :not(img){position:relative}) */
  .gtile .gtag{position:absolute;top:1rem;left:1rem;z-index:3;}
  .gtile .gcap{position:absolute;left:.8rem;right:.8rem;bottom:.8rem;z-index:3;padding:.7rem .9rem;background:transparent;transition:background .3s ease;}
  .gtile .gcap h2,.gtile .gcap .by{color:#fff !important;}
  .gtile:hover .gcap{background:#b3151b;}
  .gcap h2{font-family:'Cormorant Garamond',serif;font-weight:500;color:#fff;line-height:1.22;}
  .gtile-sm .gcap h2{font-size:1.12rem;}
  .gmo-center .gcap h2{font-size:2rem;font-weight:500;}
  .gcap .by{font-family:'DM Sans',sans-serif;font-size:.6rem;letter-spacing:.1em;color:rgba(255,255,255,.75);margin-top:.5rem;}
  /* thumbnail strip */
  .gthumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:1.6rem;margin-top:1.6rem;padding-top:1.6rem;border-top:1px solid var(--line);}
  .gth{display:grid;grid-template-columns:64px 1fr;gap:.9rem;align-items:center;cursor:pointer;}
  .gth .thi{width:64px;height:64px;overflow:hidden;background:#e8e4e0;}
  .gth .thi img{width:100%;height:100%;object-fit:cover;}
  .gth .tc{font-size:.5rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;margin-bottom:.25rem;}
  .gth h3{font-family:'Cormorant Garamond',serif;font-size:.92rem;font-weight:500;color:var(--ink);line-height:1.25;transition:color .2s;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
  .gth .tc{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
  .gth:hover h3{color:var(--gold);}
  @media(max-width:900px){
    .gmo-sec{padding:2.6rem 1.3rem 3rem;}
    .gmo{grid-template-columns:1fr;}
    .gmo-center{order:-1;}
    .gmo-center .gtile{min-height:300px;}
    .gthumbs{grid-template-columns:1fr 1fr;gap:1.2rem;}
  }

/* ===== TODAYS SPOTLIGHT + SIDEBAR ===== */

.gsp-sec{padding:4.5rem 6rem;background:var(--bg-alt);}
  .gsp-wrap{display:grid;grid-template-columns:1fr 320px;gap:3.5rem;align-items:start;}
  .gsp-hd{margin-bottom:2rem;}
  .gsp-hd h2{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:400;color:var(--ink);position:relative;display:inline-block;padding-bottom:.7rem;}
  .gsp-hd h2::after{content:"";position:absolute;left:0;bottom:0;width:46px;height:2px;background:var(--gold);}
  .gsp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8rem;}
  .gsp-c{cursor:pointer;background:var(--surface);border:1px solid #ece4d6;transition:box-shadow .3s,transform .3s;}
  .gsp-c:hover{box-shadow:0 24px 48px rgba(26,20,32,.12);transform:translateY(-4px);}
  .gsp-c .gi{aspect-ratio:4/3;overflow:hidden;background:#e8e4e0;}
  .gsp-c .gi img{width:100%;height:100%;object-fit:cover;transition:transform .55s;}
  .gsp-c:hover .gi img{transform:scale(1.05);}
  .gsp-c .gb{padding:1.2rem 1.2rem 1.4rem;}
  .gsp-c .gt{font-size:.54rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;margin-bottom:.5rem;}
  .gsp-c h3{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:500;line-height:1.3;color:var(--ink);margin-bottom:.6rem;}
  .gsp-c .gm{font-size:.62rem;letter-spacing:.08em;color:#b8aec4;font-family:'DM Sans',sans-serif;}
  /* sidebar */
  .gsd-h{font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink);font-family:'DM Sans',sans-serif;padding-bottom:.7rem;border-bottom:2px solid var(--gold);margin-bottom:1.2rem;}
  .gsc{display:flex;gap:1.6rem;align-items:center;margin-bottom:2.4rem;}
  .gsc a{color:var(--ink);transition:opacity .2s;display:block;}
  .gsc a:hover{opacity:.5;}
  .gsc svg{width:22px;height:22px;display:block;fill:currentColor;}
  .grv{display:flex;gap:1rem;align-items:center;padding:.9rem 0;border-bottom:1px solid #ece4d6;cursor:pointer;}
  .grv .ri{position:relative;width:64px;height:56px;flex-shrink:0;overflow:hidden;background:#e8e4e0;}
  .grv .ri img{width:100%;height:100%;object-fit:cover;}
  .grv .rb{position:absolute;top:0;left:0;background:var(--gold);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:.52rem;font-weight:600;padding:.1rem .3rem;}
  .grv h3{font-family:'Cormorant Garamond',serif;font-size:.98rem;font-weight:500;color:var(--ink);line-height:1.25;transition:color .2s;}
  .grv:hover h3{color:var(--gold);}
  .grv .rm{font-size:.58rem;color:#b8aec4;font-family:'DM Sans',sans-serif;margin-top:.2rem;}
  @media(max-width:900px){
    .gsp-sec{padding:2.8rem 1.3rem;}
    .gsp-wrap{grid-template-columns:1fr;gap:2.5rem;}
    .gsp-cards{grid-template-columns:1fr;}
  }

/* ===== SPOTLIGHT DEEP READS ===== */

.spot-hero{display:grid;grid-template-columns:1fr 1.1fr;gap:4.5rem;align-items:center;max-width:1200px;margin:0 auto 4.5rem;}
    .spot-copy .eye{font-size:0.6rem;letter-spacing:0.32em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:1rem;font-weight:300;font-family:'DM Sans',sans-serif;}
    .spot-copy h3{font-family:'Cormorant Garamond',serif;font-size:2.6rem;font-weight:300;color:var(--ink);line-height:1.15;margin-bottom:1.2rem;}
    .spot-copy p{font-size:0.92rem;line-height:1.95;color:var(--ink-soft);font-weight:300;margin-bottom:1.8rem;max-width:520px;font-family:'DM Sans',sans-serif;}
    .spot-img{aspect-ratio:4/3;overflow:hidden;background:#ece7e0;}
    .spot-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
    .spot-hero:hover .spot-img img{transform:scale(1.04);}
    .spot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2.4rem;max-width:1200px;margin:0 auto;}
    .spot-c{cursor:pointer;}
    .spot-c .si{aspect-ratio:3/2;overflow:hidden;background:#ece7e0;margin-bottom:1rem;}
    .spot-c .si img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease;}
    .spot-c:hover .si img{transform:scale(1.05);}
    .spot-c .sc{font-size:0.56rem;letter-spacing:0.26em;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:0.5rem;font-weight:300;font-family:'DM Sans',sans-serif;}
    .spot-c h4{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:500;line-height:1.25;color:var(--ink);margin-bottom:0.5rem;transition:color .2s;}
    .spot-c:hover h4{color:var(--gold);}
    .spot-c p{font-size:0.78rem;line-height:1.7;color:var(--ink-soft);font-weight:300;font-family:'DM Sans',sans-serif;}
    @media(max-width:900px){
      .spot-hero{grid-template-columns:1fr;gap:2rem;margin-bottom:3rem;}
      .spot-copy h3{font-size:2rem;}
      .spot-grid{grid-template-columns:1fr 1fr;gap:2rem;}
    }
    @media(max-width:560px){.spot-grid{grid-template-columns:1fr;}}

/* ===== HOT TOPICS + FEATURED/POPULAR ===== */

.kt-sec{padding:5.5rem 6rem;background:var(--surface);}
  .kt-head{text-align:center;margin-bottom:3.2rem;}
  .kt-head .eye{font-size:0.6rem;letter-spacing:0.4em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;margin-bottom:0.9rem;}
  .kt-head h2{font-family:'Playfair Display',serif;font-size:2.8rem;font-weight:400;color:var(--ink);}
  .kt-head h2 em{font-style:italic;color:var(--gold);}
  .kt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem 2.6rem;max-width:1200px;margin:0 auto;}
  .kt-card{cursor:pointer;}
  .kt-card .kt-img{position:relative;aspect-ratio:3/2;overflow:hidden;background:#ece7e0;}
  .kt-card .kt-img img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease;}
  .kt-card:hover .kt-img img{transform:scale(1.05);}
  .kt-card .kt-no{position:absolute;top:0;left:0;background:var(--band);color:#fff;width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-family:'DM Sans',sans-serif;font-size:.7rem;letter-spacing:.05em;}
  .kt-cat{font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;margin:1.1rem 0 .55rem;}
  .kt-card h3{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:500;line-height:1.25;color:var(--ink);margin-bottom:.55rem;transition:color .2s;}
  .kt-card:hover h3{color:var(--gold);}
  .kt-card p{font-size:.86rem;font-weight:300;line-height:1.7;color:var(--muted);font-family:'DM Sans',sans-serif;margin-bottom:.9rem;}
  .kt-by{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:#b8aec4;font-family:'DM Sans',sans-serif;}
  .kt-by span{color:var(--ink);}
  /* FEATURED + POPULAR */
  .pp-sec{padding:5.5rem 6rem;background:var(--bg-alt);}
  .pp-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:3.5rem;max-width:1200px;margin:0 auto;align-items:start;}
  .pp-main .pp-img{aspect-ratio:16/10;overflow:hidden;background:#ece7e0;}
  .pp-main .pp-img img{width:100%;height:100%;object-fit:cover;transition:transform .55s;}
  .pp-main:hover .pp-img img{transform:scale(1.04);}
  .pp-cat{font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;margin:1.3rem 0 .7rem;}
  .pp-main h3{font-family:'Playfair Display',serif;font-size:2.1rem;font-weight:400;line-height:1.18;color:var(--ink);margin-bottom:.9rem;}
  .pp-main p{font-size:.92rem;font-weight:300;line-height:1.8;color:var(--muted);font-family:'DM Sans',sans-serif;margin-bottom:1.3rem;max-width:560px;}
  .pp-link{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);font-family:'DM Sans',sans-serif;border-bottom:1px solid #ce9744;padding-bottom:.3rem;}
  .pp-link:hover{color:var(--gold);}
  .pp-aside .pp-h{font-family:'Playfair Display',serif;font-size:1.4rem;color:var(--ink);margin-bottom:1.6rem;padding-bottom:.9rem;border-bottom:2px solid #ce9744;}
  .pp-item{display:flex;gap:1.1rem;align-items:flex-start;padding:1rem 0;border-bottom:1px solid var(--line);cursor:pointer;}
  .pp-item:last-child{border-bottom:none;}
  .pp-item .pp-rank{font-family:'Playfair Display',serif;font-size:1.9rem;font-style:italic;color:#dcd3c4;line-height:1;min-width:38px;}
  .pp-item .pp-cat2{font-size:.56rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;margin-bottom:.3rem;}
  .pp-item h4{font-family:'Cormorant Garamond',serif;font-size:1.15rem;font-weight:500;line-height:1.3;color:var(--ink);transition:color .2s;}
  .pp-item:hover h4{color:var(--gold);}
  @media(max-width:900px){
    .kt-sec,.pp-sec{padding:3.2rem 1.3rem;}
    .kt-grid{grid-template-columns:1fr;gap:2.4rem;}
    .kt-head h2{font-size:2.1rem;}
    .pp-grid{grid-template-columns:1fr;gap:2.6rem;}
    .pp-main h3{font-size:1.7rem;}
  }

/* ===== HERITAGE + TRAVEL ===== */

.her-sec{padding:6rem 6rem;background:var(--bg-alt);}
  .mag-hd{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:3.4rem;border-bottom:1px solid var(--line);padding-bottom:1.1rem;}
  .mag-hd .eye{font-size:0.6rem;letter-spacing:0.34em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;margin-bottom:0.45rem;}
  .mag-hd h2{font-family:'Cormorant Garamond',serif;font-size:2.7rem;font-weight:400;color:var(--ink);line-height:1;}
  .mag-hd .viewall{font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--ink);font-family:'DM Sans',sans-serif;border-bottom:1px solid var(--gold);padding-bottom:2px;white-space:nowrap;}
  .mag-hd .viewall:hover{color:var(--gold);}
  .her-wrap{display:grid;grid-template-columns:1.55fr 1fr;gap:4.5rem;align-items:center;}
  .her-lead .himg{aspect-ratio:4/3;overflow:hidden;background:#e8e4e0;}
  .her-lead .himg img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease;}
  .her-lead:hover .himg img{transform:scale(1.04);}
  .her-plate{background:var(--surface);padding:2.1rem 2.3rem 1.9rem;box-shadow:0 34px 64px rgba(26,20,32,.14);width:80%;margin:-5.2rem 0 0 3.2rem;position:relative;z-index:2;border-top:2px solid var(--gold);}
  .her-plate .eye{font-size:0.56rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;}
  .her-plate h3{font-family:'Cormorant Garamond',serif;font-size:1.85rem;font-weight:400;color:var(--ink);line-height:1.2;margin:0.55rem 0 0.7rem;}
  .her-plate .dek{font-size:0.82rem;line-height:1.85;color:var(--ink-soft);font-weight:300;font-family:'DM Sans',sans-serif;margin-bottom:1rem;}
  .her-plate .rm,.her-item .rm{font-size:0.58rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--ink);font-family:'DM Sans',sans-serif;border-bottom:1px solid var(--gold);padding-bottom:2px;}
  .her-list{display:flex;flex-direction:column;}
  .her-item{display:grid;grid-template-columns:auto 1fr;gap:1.4rem;padding:1.7rem 0;border-top:1px solid var(--line);align-items:start;cursor:pointer;}
  .her-item:first-child{border-top:none;padding-top:0;}
  .her-item .num{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.8rem;color:var(--gold);line-height:1;}
  .her-item .eye{font-size:0.54rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;}
  .her-item h4{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:400;color:var(--ink);line-height:1.25;margin:0.35rem 0 0.45rem;transition:color .2s;}
  .her-item:hover h4{color:var(--gold);}
  .her-item .dek{font-size:0.76rem;line-height:1.7;color:var(--ink-soft);font-weight:300;font-family:'DM Sans',sans-serif;}
  /* TRAVEL */
  .trv-sec{padding:6rem 6rem;background:var(--surface);}
  .trv-hero{position:relative;margin-bottom:4rem;}
  .trv-hero>img{width:100%;height:540px;object-fit:cover;display:block;}
  .trv-hero .plate{position:absolute;left:0;bottom:0;background:var(--ink);color:#fff;padding:2.1rem 2.8rem;max-width:580px;border-top:2px solid var(--gold);}
  .trv-hero .plate .eye{font-size:0.58rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;}
  .trv-hero .plate h3{font-family:'Cormorant Garamond',serif;font-size:2.1rem;font-weight:400;color:#fff;line-height:1.18;margin:0.5rem 0 0.9rem;}
  .trv-hero .plate .rm{font-size:0.58rem;letter-spacing:0.2em;text-transform:uppercase;color:#fff;font-family:'DM Sans',sans-serif;border-bottom:1px solid var(--gold);padding-bottom:2px;}
  .trv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.6rem;}
  .trv-c{position:relative;cursor:pointer;}
  .trv-c .ti{aspect-ratio:3/2;overflow:hidden;background:#e8e4e0;margin-bottom:1.1rem;}
  .trv-c .ti img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
  .trv-c:hover .ti img{transform:scale(1.05);}
  .trv-c .idx{position:absolute;top:0;left:0;background:var(--gold);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:0.62rem;letter-spacing:0.06em;padding:0.35rem 0.65rem;z-index:2;}
  .trv-c .eye{font-size:0.56rem;letter-spacing:0.26em;text-transform:uppercase;color:var(--gold);font-family:'DM Sans',sans-serif;}
  .trv-c h4{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:400;color:var(--ink);line-height:1.25;margin-top:0.4rem;transition:color .2s;}
  .trv-c:hover h4{color:var(--gold);}
  @media(max-width:900px){
    .her-sec,.trv-sec{padding:3.4rem 1.3rem;}
    .her-wrap{grid-template-columns:1fr;gap:1rem;}
    .her-plate{width:auto;margin:-3.5rem 1rem 0;}
    .trv-hero>img{height:300px;}
    .trv-hero .plate{position:static;max-width:none;}
    .trv-grid{grid-template-columns:1fr;gap:2.4rem;}
    .mag-hd h2{font-size:2rem;}
  }

/* ===== FOOTER ===== */

.ftr{background:var(--band);color:#cfc7d6;padding:4rem 2.5rem 2rem;font-family:'DM Sans',sans-serif}
.ftr-top{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.3fr 2.1fr 1fr 1fr 1.3fr;gap:2.5rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.12)}
.ftr-brand{font-family:'Cormorant Garamond',serif;font-size:1.7rem;font-weight:300;letter-spacing:.04em;color:#fff;margin-bottom:1rem}
.ftr-brand span{color:var(--gold)}
.ftr-tag{font-size:.72rem;font-weight:300;line-height:1.8;color:#b8aec4;margin-bottom:1.4rem}
.ftr-social{display:flex;gap:.5rem}
.ftr-social a{width:34px;height:34px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;color:#cfc7d6;transition:all .25s;text-decoration:none}
.ftr-social a:hover{background:#ce9744;border-color:var(--gold);color:var(--ink)}
.ftr-h{font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:1.2rem}
.ftr-top ul{list-style:none;margin:0;padding:0}
.ftr-top li{margin-bottom:.7rem}
.ftr-top li a{font-size:.78rem;font-weight:300;color:#cfc7d6;transition:color .2s;text-decoration:none}
.ftr-top li a:hover{color:#fff}
.ftr-news-t{font-size:.74rem;font-weight:300;line-height:1.7;color:#b8aec4;margin-bottom:1rem}
.ftr-news form{display:flex;border:1px solid rgba(255,255,255,.2)}
.ftr-news input{flex:1;background:none;border:none;padding:.7rem .8rem;color:#fff;font-family:'DM Sans',sans-serif;font-size:.75rem;outline:none}
.ftr-news button{background:#ce9744;color:var(--ink);border:none;padding:0 1rem;font-size:.7rem;cursor:pointer;font-family:'DM Sans',sans-serif}
.ftr-bottom{max-width:1200px;margin:0 auto;padding-top:1.8rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}
.ftr-copy{font-size:.68rem;font-weight:300;color:#b8aec4}
.ftr-copy span{color:#7d7488}
.ftr-legal a{font-size:.66rem;letter-spacing:.06em;color:#b8aec4;margin-left:1.4rem;transition:color .2s;text-decoration:none}
.ftr-legal a:hover{color:var(--gold)}
@media(max-width:900px){.ftr-top{grid-template-columns:1fr 1fr;gap:2rem}.ftr-bottom{flex-direction:column;text-align:center}.ftr-legal a{margin:0 .7rem}}

/* ===== SEARCH OVERLAY ===== */

#searchOverlay { display:none; position:fixed; top:0; left:0; right:0; background:var(--surface); z-index:99998; box-shadow:0 4px 12px rgba(0,0,0,0.1); }
.search-topbar { display:flex; align-items:center; gap:1rem; padding:1.5rem 3rem; }
#searchInput { flex:1; border:none; border-bottom:1px solid #000; padding:0.5rem 0; font-size:1.2rem; font-family:"Cormorant Garamond",serif; font-weight:300; outline:none; color:var(--ink); background:transparent; }
#searchResults { max-height:420px; overflow-y:auto; border-top:1px solid var(--line-soft); }
.search-result-item { display:flex; align-items:center; gap:1.2rem; padding:1rem 3rem; text-decoration:none; color:var(--ink); transition:background 0.2s; cursor:pointer; border-bottom:1px solid #f8f5f0; }
.search-result-item:hover { background:var(--bg-alt); }
.search-result-item:hover .sri-title { color:var(--gold); }
.sri-icon { width:36px; height:36px; display:flex; align-items:center; justify-content:center; background:#f5f0ea; flex-shrink:0; }
.sri-cat { font-family:"DM Sans",sans-serif; font-size:0.52rem; letter-spacing:0.25em; text-transform:uppercase; color:var(--gold); margin-bottom:3px; }
.sri-title { font-family:"Cormorant Garamond",serif; font-size:1rem; font-weight:400; color:var(--ink); transition:color 0.2s; }
.search-empty { padding:2rem 3rem; font-family:"DM Sans",sans-serif; font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--meta); }
.search-trending { padding:1rem 3rem 0.5rem; font-family:"DM Sans",sans-serif; font-size:0.52rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold); }

/* ===== FULL MENU ===== */

#fullMenu {
  position: fixed;
  top: 0;
  left: 0;
  width: 25%;
  height: 100%;
  background:var(--surface);
  z-index: 99999;
  overflow-y: auto;
  transform: translateX(-100%);
  transition: transform 0.5s cubic-bezier(0.77,0,0.175,1);
  box-shadow: 4px 0 30px rgba(0,0,0,0.12);
}
#fullMenu.open { transform: translateX(0); }
.fm-inner {
  padding: 2rem 1.8rem 4rem;
}
.fm-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--line);
  margin-bottom: 2.5rem;
}
.fm-close {
  background: none;
  border: none;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.62rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color:var(--ink);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: color 0.2s;
}
.fm-close:hover { color:var(--gold); }
.fm-section {
  border-bottom: 1px solid var(--line);
}
.fm-section-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: none;
  border: none;
  padding: 1.2rem 0;
  cursor: pointer;
  text-align: left;
}
.fm-section-label {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 1.3rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color:var(--ink);
  transition: color 0.2s;
}
.fm-section-btn:hover .fm-section-label { color:var(--gold); }
.fm-plus {
  font-size: 1.4rem;
  color:var(--ink);
  transition: transform 0.3s, color 0.2s;
  line-height: 1;
}
.fm-section-btn.active .fm-plus { transform: rotate(45deg); color:var(--gold); }
.fm-section-btn.active .fm-section-label { color:var(--gold); }
.fm-sub {
  display: none;
  padding: 0 0 1.2rem 0;
}
.fm-sub.open { display: block; }
.fm-sub a {
  display: block;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #3a2e48;
  text-decoration: none;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--line-soft);
  transition: color 0.2s, padding-left 0.2s;
}
.fm-sub a:hover { color:var(--gold); padding-left: 0.5rem; }
.fm-more {
  margin-top: 2.5rem;
}
.fm-more-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.55rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color:var(--gold);
  margin-bottom: 1rem;
}
.fm-more-links {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.fm-more-links a {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color:var(--meta);
  text-decoration: none;
  padding: 0.5rem 0;
  transition: color 0.2s;
}
.fm-more-links a:hover { color:var(--gold); }

/* ===== THEME SWITCH + MOBILE ===== */

.theme-switch{background:none;border:none;cursor:pointer;padding:0;margin-right:16px;display:inline-flex;align-items:center;vertical-align:middle}
.ts-track{width:46px;height:24px;border-radius:12px;background:#e3dfe8;position:relative;display:inline-block;transition:background .25s}
.ts-thumb{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.35);transition:left .25s;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--gold)}
html[data-theme="dark"] .ts-track{background:#4a4060}
html[data-theme="dark"] .ts-thumb{left:24px}
html[data-theme="dark"] nav svg circle,html[data-theme="dark"] nav svg path{stroke:#e7e2ef !important}
html[data-theme="dark"] .menu-btn{color:#e7e2ef !important}
html[data-theme="dark"] .subscribe-btn{background:#ce9744 !important;color:var(--ink) !important}
@media (max-width: 768px) {
  html, body { overflow-x: hidden; }

  /* Keep only the essential header controls on a phone. */
  #mainNav .nav-top { min-height: 92px; padding: 0.45rem 1rem !important; }
  #mainNav .nav-left { gap: 8px; }
  #mainNav .nav-left svg { width: 21px; height: 21px; margin-left: 4px !important; }
  #mainNav .menu-btn { font-size: 26px !important; margin-right: 0 !important; }
  #mainNav .nav-logo { width: 128px; left: 50%; transform: translateX(-50%); }
  #mainNav .nav-logo img { height: 46px !important; width: auto; max-width: 128px; }
  #mainNav .nav-logo p {
    display: block !important;
    position: absolute;
    top: 49px;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    margin: 0 !important;
    white-space: nowrap;
    font-size: 0.32rem !important;
    letter-spacing: 0.04em !important;
    line-height: 1.2 !important;
  }
  #mainNav .nav-right { margin-left: auto; gap: 0; }
  #mainNav .home-btn,
  #mainNav .profile-btn,
  #mainNav .theme-switch { display: none !important; }
  #mainNav .subscribe-btn { padding: 9px 11px !important; font-size: 0.5rem !important; letter-spacing: 0.14em !important; }

  /* Keep the category navigation visible and scrollable on phones. */
  .nav-bottom {
    display: flex !important;
    position: fixed !important;
    top: 92px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 0.45rem !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 3px 8px rgba(0,0,0,0.06) !important;
    transform: translateY(0) !important;
  }
  .nav-bottom::-webkit-scrollbar { display: none; }
  .nav-group { flex: 0 0 auto; }
  .nav-group-btn { padding: 0.65rem 0.7rem !important; font-size: 0.48rem !important; letter-spacing: 0.12em !important; }
  .nav-group:focus-within .mega-menu,
  .nav-group.mobile-open .mega-menu { opacity: 1; visibility: visible; transform: translateY(0); }
  .nav-bottom .mega-menu {
    position: fixed !important;
    top: 134px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    min-width: 0 !important;
    max-height: min(55dvh, 360px) !important;
    overflow-y: auto !important;
    padding: 0.65rem 1.25rem 1rem !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.14) !important;
  }
  .nav-bottom .mega-menu a { padding: 0.75rem 0 !important; font-size: 0.68rem !important; }

  /* A shorter, calmer mobile hero with readable type. */
  .homepage-hero { padding: 1rem !important; margin-top: 134px !important; }
  .homepage-hero .hero-frame { height: 360px !important; }
  .homepage-hero .hero-copy { left: 1.4rem !important; right: 1.4rem !important; bottom: 3.3rem !important; }
  .homepage-hero .hero-copy > span { font-size: 1.1rem !important; margin-bottom: 0.65rem !important; }
  #heroTitle { font-size: 1.65rem !important; line-height: 1.1 !important; }
  #heroTitle span { font-size: 0.45em !important; line-height: 1.25 !important; }
  #heroLink { padding: 0.65rem 1.2rem !important; font-size: 0.58rem !important; }
  .hero-dots { bottom: 1rem !important; }

  /* The navigation is an intentional full-screen layer on phones. */
  #fullMenu { width: 100vw !important; height: 100dvh !important; max-width: none !important; }
  #fullMenu .fm-inner { padding: 1.15rem 1.35rem 3rem !important; }
  #fullMenu .fm-topbar { margin-bottom: 1.25rem !important; padding-bottom: 1rem !important; }
  #fullMenu .fm-topbar img { height: 42px !important; }
  #fullMenu .fm-section-label { font-size: 1.08rem !important; }
  #fullMenu .fm-section-btn { padding: 1rem 0 !important; }

  /* Stack and compact Trending Stories instead of retaining the desktop columns. */
  .trending-stories { padding: 2.75rem 1.25rem !important; }
  .trending-stories > div:first-child { align-items: flex-start !important; gap: 0.8rem !important; margin-bottom: 1.6rem !important; }
  .trending-stories > div:first-child h2 { font-size: 2rem !important; }
  .trending-stories > div:first-child a { font-size: 0.52rem !important; white-space: nowrap; }
  .trending-stories > div:nth-of-type(2) { display: block !important; }
  .trending-stories > div:nth-of-type(2) > div:nth-child(2) { display: none !important; }
  .trending-stories > div:nth-of-type(2) > div:not(:nth-child(2)) { display: flex !important; flex-direction: column !important; }
  .trending-stories > div:nth-of-type(2) > div:not(:nth-child(2)) > div { padding: 1.15rem 0 !important; gap: 0.9rem !important; align-items: flex-start !important; }
  .trending-stories > div:nth-of-type(2) span { min-width: 48px !important; font-size: 2rem !important; }
  .trending-stories > div:nth-of-type(2) p { font-size: 0.5rem !important; letter-spacing: 0.15em !important; margin-bottom: 0.3rem !important; }
  .trending-stories > div:nth-of-type(2) h4 { font-size: 1.02rem !important; line-height: 1.3 !important; }
}

/* ===== EXTRA 11 ===== */

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #ce9744 !important;outline-offset:2px}.itn-cc{position:fixed;left:0;right:0;bottom:0;z-index:100001;background:var(--band);color:#e8e4ef;padding:.9rem 1.2rem;display:none;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;font-family:system-ui,sans-serif;font-size:.78rem}.itn-cc a{color:var(--gold);text-decoration:underline}.itn-cc button{background:#ce9744;color:var(--ink);border:none;padding:.5rem 1.2rem;font-size:.66rem;letter-spacing:.15em;text-transform:uppercase;cursor:pointer}


/* ===== V2 PLACEHOLDER SYSTEM ===== */
.ph{position:relative;background:#000 !important;overflow:hidden;display:block;}
.ph::after{content:"";position:absolute;inset:0;pointer-events:none;background:none;}
.ph-dark{background:#000 !important;}

/* Tiles that carry white caption text keep a scrim so the text stays readable */
.gtile.ph::after{background:linear-gradient(to top,rgba(15,10,14,.86) 0%,rgba(15,10,14,.15) 55%,transparent 100%);z-index:1;}
.ph-fill{width:100%;height:100%;}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid #ce9744;outline-offset:2px;}

/* ===== V2 CONTRAST TOKENS =====
   --gold is the AA-compliant gold for light backgrounds (4.89:1 on white).
   Dark containers below re-scope it to the brighter original (6.98:1 on ink). */
.ftr,
.distribution-section,
.subscribe-band,
.quote-section,
.marquee-band,
.hero-copy,
.gcap,
.gtile,
.trv-hero .plate,
.dark-band{--gold:#ce9744;}

/* ===== SKIP LINK (WCAG 2.4.1) ===== */
.skip-link{position:absolute;left:-9999px;top:0;z-index:100000;background:var(--band);color:#fff;
  padding:.8rem 1.4rem;font-family:'DM Sans',sans-serif;font-size:.7rem;letter-spacing:.18em;
  text-transform:uppercase;text-decoration:none;}
.skip-link:focus{left:0;}
main{display:block;}

/* ===== DROP-IN IMAGE RULE =====
   Every black placeholder reserves its exact box. Put a real <img> inside the
   placeholder element and it fills that box with no layout shift:
       <span class="img"><img src="..." alt="..." width="700" height="440"></span>
   Always set width= and height= on the tag. IMAGE-SPECS.txt lists the size
   required for every slot. */
.img > img,
.ph > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  display:block;z-index:0;}
.img,.ph{position:relative;}

/* A picture dropped into a placeholder is absolutely positioned, so whatever
   was already in the box - the Hot Topics number badge, a caption - has to be
   lifted above it. */
.ph > :not(img),
.img > :not(img){position:relative;z-index:1;}

/* Any image given a height alone keeps its own shape - the width attribute
   must never become the used width. */
.anav-logo img,.nav-logo img,.ftr-logo img{width:auto;}

/* Mobile section menus must escape the horizontal nav strip. */
@media (max-width: 768px){
  .nav-bottom{transform:none !important;overflow-x:auto !important;overflow-y:visible !important;}
  .nav-bottom .mega-menu{z-index:10000 !important;}
}

/* Site-wide white page background */
:root{--pearl:#fff;--surface:#fff;--bg-alt:#fff;}
html,body{background:#fff !important;}


/* Adobe Fave Script Pro quotations */
.quote-text,.quote-section blockquote,.quote-section q{font-family:'fave-script-pro',sans-serif !important;font-weight:400;font-style:normal;}

