/* ════════════════════════════════════════════════════════════════════
   AgriNovel v4 — Definitive
   Canvas: warm charcoal #1a1b1b (Claude-adjacent, almost-black)
   Glass: liquid crystal — 4% white fill, 1px specular top, blur(24px)
   Type: Fraunces (editorial serif) + Bricolage Grotesque (grotesque)
   Scale: Nike / Puma — big words, radical white space, zero clutter
   Accents: sage green #7aaa82 + wheat gold #c4a86a only
   Philosophy: Jony Ive × Neville Brody × Olly Moss
════════════════════════════════════════════════════════════════════ */

/* ── Design Tokens ─────────────────────────────────────────────────── */
:root {
  /* Background family — warm charcoal */
  --bg:      #1a1b1b;
  --bg-2:    #202222;
  --bg-3:    #272a2a;
  --bg-4:    #2e3232;
  --bg-5:    #353b3b;

  /* Liquid glass system */
  --glass:      rgba(255,255,255,0.04);
  --glass-hov:  rgba(255,255,255,0.07);
  --glass-bdr:  rgba(255,255,255,0.09);
  --glass-top:  rgba(255,255,255,0.22);  /* specular highlight */
  --glass-glow: rgba(122,170,130,0.06);

  /* Typography scale */
  --t1: #f0ede8;   /* warm near-white — primary */
  --t2: #9a958d;   /* warm grey — secondary */
  --t3: #5c5752;   /* muted — tertiary */
  --t4: #3a3632;   /* barely visible */

  /* Accent — minimal, purposeful */
  --sage:     #7aaa82;
  --sage-lt:  rgba(122,170,130,0.10);
  --sage-bdr: rgba(122,170,130,0.22);
  --wheat:    #c4a86a;
  --wheat-lt: rgba(196,168,106,0.10);

  /* Structural */
  --rule:   rgba(255,255,255,0.07);
  --rule-2: rgba(255,255,255,0.04);

  /* Fonts */
  --display: 'Fraunces', Georgia, serif;
  --body:    'Bricolage Grotesque', system-ui, sans-serif;
  --mono:    'Space Mono', 'SF Mono', monospace;

  /* Layout */
  --W:       1400px;
  --pad:     clamp(20px, 5vw, 72px);
  --section: clamp(80px, 10vw, 160px);

  /* Motion */
  --spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --expo:   cubic-bezier(0.16, 1, 0.3, 1);
  --smooth: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Reset ────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color-scheme:dark}
.an-body{background:var(--bg);color:var(--t1);font-family:var(--body);font-size:16px;line-height:1.6;overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}
.an-wrap{max-width:var(--W);margin:0 auto;padding:0 var(--pad)}
.an-section{padding:var(--section) 0}
.an-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* ── Ambient background orbs ──────────────────────────────────────── */
.an-orb{position:fixed;pointer-events:none;z-index:0;border-radius:50%;filter:blur(80px)}
.an-orb--1{width:600px;height:600px;top:-200px;left:-200px;background:radial-gradient(circle,rgba(122,170,130,0.06) 0%,transparent 70%);animation:orb-pulse 12s ease-in-out infinite}
.an-orb--2{width:500px;height:500px;bottom:-100px;right:-100px;background:radial-gradient(circle,rgba(196,168,106,0.05) 0%,transparent 70%);animation:orb-pulse 16s ease-in-out infinite reverse}
.an-orb--3{width:300px;height:300px;top:40%;right:15%;background:radial-gradient(circle,rgba(122,170,130,0.04) 0%,transparent 70%);animation:orb-pulse 20s ease-in-out infinite}
@keyframes orb-pulse{0%,100%{transform:scale(1);opacity:0.8}50%{transform:scale(1.15);opacity:1}}

/* ── Film grain overlay ───────────────────────────────────────────── */
.an-grain{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:0.025;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px 200px;mix-blend-mode:overlay}

/* ── Custom cursor ────────────────────────────────────────────────── */
.an-cursor{position:fixed;z-index:9998;pointer-events:none;width:10px;height:10px;
  background:var(--t1);border-radius:50%;transform:translate(-50%,-50%);
  transition:width .25s var(--expo),height .25s var(--expo),background .2s;
  mix-blend-mode:difference}
body.an-over .an-cursor{width:44px;height:44px}
@media(pointer:coarse){.an-cursor{display:none}}

/* ── Liquid Glass component ───────────────────────────────────────── */
.an-glass{
  background:var(--glass);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border:1px solid var(--glass-bdr);
  border-radius:20px;
  position:relative;
  overflow:hidden;
}
/* Specular top-edge — Jony Ive signature */
.an-glass::before{
  content:'';position:absolute;top:0;left:10%;right:10%;height:1px;
  background:linear-gradient(90deg,transparent,var(--glass-top),transparent);
  pointer-events:none;
}
/* Light sweep on hover */
.an-glass::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,0.035) 50%,transparent 70%);
  opacity:0;transition:opacity .5s;pointer-events:none;
}
.an-glass:hover::after{opacity:1}

/* ── Category tag ─────────────────────────────────────────────────── */
.an-cat-tag{
  display:inline-flex;align-items:center;
  font-family:var(--mono);font-size:10px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--sage);background:var(--sage-lt);
  border:1px solid var(--sage-bdr);
  padding:4px 10px;border-radius:100px;
  transition:background .2s,color .2s;white-space:nowrap;
}
.an-cat-tag:hover{background:rgba(122,170,130,0.18)}
.an-cat-tag--sm{font-size:9px;padding:3px 8px}

/* ── Buttons ──────────────────────────────────────────────────────── */
.an-btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--body);font-weight:700;font-size:13px;letter-spacing:.05em;
  padding:13px 28px;border-radius:100px;
  transition:all .35s var(--expo);
  position:relative;overflow:hidden;white-space:nowrap;
}
.an-btn:active{transform:scale(.97)!important}
.an-btn svg{flex-shrink:0;transition:transform .3s var(--expo)}
.an-btn:hover svg{transform:translateX(3px)}

/* Solid — warm white pill */
.an-btn--solid{background:var(--t1);color:var(--bg);box-shadow:0 2px 20px rgba(0,0,0,.4)}
.an-btn--solid:hover{box-shadow:0 8px 32px rgba(0,0,0,.5);transform:translateY(-2px)}

/* Ghost — liquid glass */
.an-btn--ghost{background:var(--glass);color:var(--t2);border:1px solid var(--glass-bdr);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.an-btn--ghost:hover{background:var(--glass-hov);color:var(--t1);border-color:rgba(255,255,255,0.15)}

/* Outline light — for dark bg sections */
.an-btn--outline-light{background:transparent;color:var(--t1);border:1px solid rgba(255,255,255,.3);padding:15px 32px;font-size:14px}
.an-btn--outline-light:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.55)}

/* Section header ─────────────────────────────────────────────────── */
.an-section-hd{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:52px;gap:16px;flex-wrap:wrap}
.an-section-kicker{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);margin-bottom:8px;display:block}
.an-section-title{font-family:var(--display);font-size:clamp(30px,3.8vw,52px);font-weight:400;letter-spacing:-.02em;color:var(--t1);line-height:1.08}
.an-text-link{font-size:13px;font-weight:600;color:var(--t3);transition:color .2s;white-space:nowrap;padding-bottom:2px;border-bottom:1px solid var(--rule)}
.an-text-link:hover{color:var(--t1);border-bottom-color:var(--t2)}

/* ── Scroll reveal ────────────────────────────────────────────────── */
.an-reveal{opacity:0;transform:translateY(28px);transition:opacity .75s var(--expo),transform .75s var(--expo);transition-delay:var(--d,0s)}
.an-reveal.is-on{opacity:1;transform:none}

/* ══════════ NAVIGATION ════════════════════════════════════════════ */
.an-nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(26,27,27,0.88);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border-bottom:1px solid var(--rule);
  transition:background .4s var(--smooth);
}
.an-nav.is-scrolled{background:rgba(26,27,27,0.96)}
.an-nav-wrap{max-width:var(--W);margin:0 auto;padding:0 var(--pad);display:flex;align-items:center;height:64px;gap:32px}
.an-nav-logo{flex-shrink:0}
.an-logo-img{height:30px;width:auto;object-fit:contain;filter:brightness(0) invert(1);opacity:0.9;transition:opacity .2s}
.an-nav-logo:hover .an-logo-img{opacity:1}
.an-nav-links{display:flex;gap:28px;flex:1;justify-content:center}
.an-nav-links a{font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--t2);transition:color .2s}
.an-nav-links a:hover{color:var(--t1)}
.an-nav-end{display:flex;align-items:center;gap:16px;margin-left:auto}
.an-icon-btn{color:var(--t2);padding:6px;border-radius:8px;transition:color .2s,background .2s;display:flex}
.an-icon-btn:hover{color:var(--t1);background:var(--glass)}
.an-subscribe-btn{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:8px 18px;border-radius:100px;background:var(--sage);color:#fff;transition:background .2s,transform .15s}
.an-subscribe-btn:hover{background:#8fbc96;transform:translateY(-1px)}
.an-hamburger{display:none;flex-direction:column;gap:6px;padding:6px}
.an-hamburger span{display:block;width:22px;height:1.5px;background:var(--t2);border-radius:2px;transition:all .3s var(--expo)}
.an-hamburger.is-on span:first-child{transform:rotate(45deg) translate(5px,5px)}
.an-hamburger.is-on span:last-child{transform:rotate(-45deg) translate(5px,-5px)}

/* Search drawer */
.an-search-drawer{background:var(--bg-2);border-top:1px solid var(--rule);max-height:0;overflow:hidden;transition:max-height .4s var(--expo)}
.an-search-drawer.is-on{max-height:72px}
.an-search-inner{max-width:var(--W);margin:0 auto;padding:0 var(--pad);display:flex;align-items:center;gap:12px;height:64px}
.an-search-inner svg{flex-shrink:0;color:var(--t3)}
.an-search-inner input{flex:1;background:none;border:none;outline:none;font-family:var(--body);font-size:16px;color:var(--t1)}
.an-search-inner input::placeholder{color:var(--t3)}
#an-search-close{color:var(--t3);padding:4px;transition:color .2s;display:flex}
#an-search-close:hover{color:var(--t1)}

/* Mobile menu */
.an-mobile-menu{
  position:fixed;top:64px;left:0;right:0;bottom:0;
  background:var(--bg-2);z-index:999;
  padding:var(--pad);display:flex;flex-direction:column;gap:8px;
  transform:translateY(-100%);opacity:0;
  transition:transform .45s var(--expo),opacity .35s;
  pointer-events:none;
}
.an-mobile-menu.is-on{transform:translateY(0);opacity:1;pointer-events:auto}
.an-mobile-menu a{font-size:clamp(20px,5vw,32px);font-family:var(--display);font-weight:400;color:var(--t2);padding:8px 0;border-bottom:1px solid var(--rule);transition:color .2s}
.an-mobile-menu a:hover{color:var(--t1)}
.an-mobile-cta{color:var(--sage)!important;border:none!important;margin-top:16px;font-family:var(--body)!important;font-size:14px!important;font-weight:700;letter-spacing:.05em}

/* ══════════ TICKER ════════════════════════════════════════════════ */
.an-ticker{
  position:fixed;top:64px;left:0;right:0;z-index:999;
  height:30px;display:flex;align-items:center;overflow:hidden;
  background:var(--sage);color:#fff;
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
}
.an-ticker-label{flex-shrink:0;background:rgba(0,0,0,0.2);padding:0 16px;height:100%;display:flex;align-items:center;gap:8px}
.an-live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#fff;animation:live-blink 1.5s ease-in-out infinite}
@keyframes live-blink{0%,100%{opacity:1}50%{opacity:0.3}}
.an-ticker-runway{overflow:hidden;flex:1;white-space:nowrap}
.an-ticker-runway span{display:inline-block;animation:ticker-run 50s linear infinite;opacity:0.9;padding-left:40px}
@keyframes ticker-run{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ══════════ HERO SLIDER ═══════════════════════════════════════════ */
.an-hero{
  position:relative;height:100svh;min-height:640px;max-height:1000px;
  margin-top:94px; /* nav + ticker */
  overflow:hidden;background:var(--bg);
}
.an-hero-track{position:relative;width:100%;height:100%}
.an-hero-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s var(--smooth);pointer-events:none}
.an-hero-slide.is-active{opacity:1;pointer-events:auto}

/* Photo with Ken Burns */
.an-hero-photo{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  transform:scale(1.06);
  transition:transform 7s ease-in-out;
}
.an-hero-slide.is-active .an-hero-photo{transform:scale(1)}

/* Vignette */
.an-hero-vignette{
  position:absolute;inset:0;
  background:linear-gradient(140deg,rgba(26,27,27,0.78) 0%,rgba(26,27,27,0.35) 55%,rgba(26,27,27,0.12) 100%);
}

/* Liquid glass decorative panel — right side */
.an-hero-glass-panel{
  position:absolute;right:clamp(20px,4vw,60px);top:50%;transform:translateY(-50%);
  width:clamp(120px,16vw,240px);height:70%;
  background:rgba(255,255,255,0.03);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:24px;
  opacity:0;transition:opacity 1s .6s;
  pointer-events:none;overflow:hidden;
}
.an-hero-slide.is-active .an-hero-glass-panel{opacity:1}
.an-hgp-inner{position:absolute;inset:16px;display:flex;flex-direction:column;justify-content:space-between}
.an-hgp-line{height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.15),transparent)}
.an-hgp-line--2{width:60%;align-self:flex-end}

/* Hero content */
.an-hero-body{
  position:absolute;bottom:0;left:0;
  padding:clamp(32px,6vw,80px) clamp(24px,6vw,80px);
  max-width:760px;
  transform:translateY(16px);opacity:0;
  transition:transform .8s .3s var(--expo),opacity .8s .3s;
}
.an-hero-slide.is-active .an-hero-body{transform:translateY(0);opacity:1}

/* Ghost slide number */
.an-hero-ghost-num{
  font-family:var(--display);font-size:clamp(100px,18vw,220px);font-weight:900;
  color:rgba(255,255,255,0.04);line-height:1;
  position:absolute;right:clamp(20px,4vw,60px);bottom:0;pointer-events:none;
  letter-spacing:-.05em;
}

.an-hero-meta{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.an-hero-mins{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,0.55);letter-spacing:.1em}
.an-hero-date{font-family:var(--mono);font-size:10px;color:rgba(255,255,255,0.4);letter-spacing:.1em}

.an-hero-title{
  font-family:var(--display);
  font-size:clamp(32px,6vw,72px);
  line-height:1.04;letter-spacing:-.025em;
  margin-bottom:20px;color:#fff;
  display:flex;flex-direction:column;gap:4px;
}
.an-hero-line{display:block;opacity:0;transform:translateY(10px);transition:opacity .6s,transform .6s var(--expo)}
.an-hero-slide.is-active .an-hero-line{opacity:1;transform:none}
.an-hero-slide.is-active .an-hero-line:nth-child(2){transition-delay:.1s}
.an-hero-line--italic{font-style:italic;color:rgba(255,255,255,0.75)}

.an-hero-excerpt{font-size:clamp(14px,1.4vw,17px);color:rgba(255,255,255,0.65);line-height:1.75;margin-bottom:28px;max-width:520px}
.an-hero-actions{display:flex;gap:12px;flex-wrap:wrap}

/* Slide progress strip */
.an-slide-progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:rgba(255,255,255,0.08)}
.an-slide-progress-fill{height:100%;background:var(--sage);width:0;transition:width .1s linear}

/* Arrows */
.an-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:48px;height:48px;border-radius:50%;
  border:1px solid rgba(255,255,255,0.18);
  color:#fff;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,0.25);backdrop-filter:blur(8px);
  transition:background .2s,border-color .2s,transform .2s;z-index:10;
}
.an-arrow:hover{background:rgba(255,255,255,0.12);border-color:rgba(255,255,255,0.4);transform:translateY(-50%) scale(1.08)}
.an-arrow--prev{left:clamp(16px,3vw,40px)}
.an-arrow--next{right:clamp(16px,3vw,40px)}

/* Dots */
.an-hero-dots{position:absolute;bottom:clamp(24px,4vw,48px);left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:10}
.an-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,0.3);transition:all .35s var(--expo);cursor:pointer}
.an-dot.is-on{background:#fff;width:24px;border-radius:4px}

/* Scroll prompt */
.an-scroll-prompt{position:absolute;bottom:clamp(24px,4vw,48px);left:clamp(24px,5vw,60px);display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(255,255,255,0.4);font-family:var(--mono);font-size:9px;letter-spacing:.15em;text-transform:uppercase;animation:scroll-bob 2s ease-in-out infinite}
.an-scroll-track{width:1px;height:40px;background:rgba(255,255,255,0.15);overflow:hidden;border-radius:1px}
.an-scroll-indicator{width:1px;height:40%;background:rgba(255,255,255,0.5);animation:scroll-drip 2s ease-in-out infinite}
@keyframes scroll-bob{0%,100%{opacity:.5}50%{opacity:.9}}
@keyframes scroll-drip{0%{transform:translateY(-100%)}100%{transform:translateY(400%)}}

/* ══════════ MARQUEE ═══════════════════════════════════════════════ */
.an-marquee-strip{overflow:hidden;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--bg-2);padding:18px 0}
.an-marquee-strip--outline{background:transparent;border-top-color:var(--rule);border-bottom-color:transparent}
.an-marquee-inner{display:flex;white-space:nowrap;animation:marquee 55s linear infinite}
.an-marquee-inner--rev{animation-direction:reverse}
.an-marquee-inner span{font-family:var(--display);font-size:clamp(22px,2.8vw,38px);font-weight:400;font-style:italic;color:var(--t3);letter-spacing:-.01em}
.an-marquee-strip--outline .an-marquee-inner span{font-style:normal;font-family:var(--mono);font-size:clamp(10px,1.2vw,14px);letter-spacing:.12em;text-transform:uppercase;color:var(--t4)}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ══════════ NUMBERS / STATS ═══════════════════════════════════════ */
.an-numbers{border-top:1px solid var(--rule)}
.an-numbers-grid{display:grid;grid-template-columns:repeat(4,1fr);align-items:stretch}
.an-stat{position:relative;padding:clamp(32px,5vw,64px) clamp(20px,3vw,48px)}
.an-stat-rule{position:absolute;left:0;top:20%;height:60%;width:1px;background:var(--rule)}
.an-stat-body{display:flex;flex-direction:column;gap:8px}
.an-stat-n{font-family:var(--display);font-size:clamp(36px,4.5vw,64px);font-weight:900;color:var(--t1);letter-spacing:-.03em;line-height:1}
.an-stat-n sup{font-size:0.5em;color:var(--sage);vertical-align:super}
.an-stat-l{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--t3)}
.an-numbers-statement{border-top:1px solid var(--rule);padding:48px clamp(20px,3vw,48px);display:flex;flex-direction:column;gap:12px}
.an-numbers-statement p{font-family:var(--display);font-size:clamp(22px,2.5vw,36px);font-weight:400;font-style:italic;color:var(--t1);line-height:1.3;max-width:600px}
.an-numbers-statement span{font-size:15px;color:var(--t2);line-height:1.7;max-width:540px}

/* ══════════ TOPICS ════════════════════════════════════════════════ */
.an-topics{overflow:hidden}
.an-topics-scroll-wrap{position:relative;padding-left:var(--pad)}
.an-topics-scroll{display:flex;gap:16px;overflow-x:auto;padding-right:var(--pad);padding-bottom:8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.an-topics-scroll::-webkit-scrollbar{display:none}
.an-topic-card{flex-shrink:0;width:clamp(180px,22vw,260px);aspect-ratio:3/4;border-radius:20px;overflow:hidden;position:relative;scroll-snap-align:start;transition:transform .4s var(--expo)}
.an-topic-card:hover{transform:translateY(-6px)}
.an-topic-photo{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .6s var(--expo)}
.an-topic-card:hover .an-topic-photo{transform:scale(1.07)}
.an-topic-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(26,27,27,0.92) 0%,rgba(26,27,27,0.3) 60%,transparent 100%)}
.an-topic-index{position:absolute;top:16px;left:16px;font-family:var(--mono);font-size:10px;color:rgba(255,255,255,0.3);letter-spacing:.1em}
.an-topic-foot{position:absolute;bottom:20px;left:16px;right:48px;display:flex;flex-direction:column;gap:4px}
.an-topic-sub{font-family:var(--mono);font-size:9px;color:var(--sage);letter-spacing:.12em;text-transform:uppercase}
.an-topic-name{font-family:var(--display);font-size:clamp(18px,2vw,24px);font-weight:700;color:#fff;line-height:1.1}
.an-topic-count{font-family:var(--mono);font-size:9px;color:rgba(255,255,255,0.35);letter-spacing:.08em;margin-top:4px}
.an-topic-arrow{position:absolute;bottom:20px;right:16px;width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,0.15);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.5);transition:all .3s var(--expo)}
.an-topic-card:hover .an-topic-arrow{background:var(--sage);border-color:var(--sage);color:#fff;transform:translateX(2px)}

/* ══════════ EDITORIAL ═════════════════════════════════════════════ */
.an-editorial{border-top:1px solid var(--rule)}
.an-editorial-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,100px);align-items:center}

/* Figure */
.an-editorial-fig{position:relative;aspect-ratio:4/3}
.an-editorial-fig-link{display:block;position:relative;overflow:hidden;border-radius:20px;aspect-ratio:4/3}
.an-editorial-photo{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .7s var(--expo)}
.an-editorial-fig-link:hover .an-editorial-photo{transform:scale(1.04)}

/* Fractured mosaic overlay */
.an-editorial-mosaic{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:3px;opacity:0;transition:opacity .45s}
.an-editorial-fig-link:hover .an-editorial-mosaic{opacity:0.4}
.an-editorial-mosaic>div{background-size:200% 200%;background-repeat:no-repeat;transition:transform .4s var(--expo)}
.an-editorial-fig-link:hover .an-editorial-mosaic>div{transform:scale(1.04)}

/* Glass badge */
.an-editorial-badge{position:absolute;top:-16px;right:-16px;padding:14px 18px;display:flex;flex-direction:column;gap:4px;z-index:2}
.an-badge-kicker{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--sage)}
.an-badge-mins{font-family:var(--display);font-size:28px;font-weight:900;color:var(--t1);line-height:1}

/* Editorial text */
.an-editorial-kicker{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.an-editorial-date{font-family:var(--mono);font-size:10px;color:var(--t3);letter-spacing:.1em}
.an-editorial-headline{font-family:var(--display);font-size:clamp(24px,3.2vw,44px);font-weight:400;letter-spacing:-.025em;color:var(--t1);line-height:1.15;margin-bottom:20px}
.an-editorial-headline a{transition:color .2s}
.an-editorial-headline a:hover{color:var(--sage)}
.an-editorial-body{font-size:16px;color:var(--t2);line-height:1.8;margin-bottom:28px}
.an-editorial-author{display:flex;align-items:center;gap:12px;margin-bottom:28px}
.an-author-av{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--sage),#5fad76);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:#fff;flex-shrink:0}
.an-author-nm{font-size:14px;font-weight:600;color:var(--t1)}
.an-author-dt{font-family:var(--mono);font-size:10px;color:var(--t3);letter-spacing:.07em;margin-top:2px}

/* ══════════ LATEST GRID ═══════════════════════════════════════════ */
.an-latest{border-top:1px solid var(--rule)}
.an-latest-hd{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:52px;gap:24px;flex-wrap:wrap}
.an-filters{display:flex;gap:8px;flex-wrap:wrap}
.an-filter{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:8px 16px;border-radius:100px;border:1px solid var(--rule);color:var(--t3);transition:all .2s;white-space:nowrap}
.an-filter:hover{border-color:var(--sage);color:var(--sage)}
.an-filter.is-on{background:var(--t1);border-color:var(--t1);color:var(--bg)}

/* Grid */
.an-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.an-card--wide{grid-column:span 2}
.an-card{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;transition:transform .4s var(--expo)}
.an-card:hover{transform:translateY(-4px)}

/* Card media */
.an-card-media{display:block;position:relative;overflow:hidden;aspect-ratio:16/10;border-radius:16px}
.an-card--wide .an-card-media{aspect-ratio:2.2/1}
.an-card-photo{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .6s var(--expo)}
.an-card:hover .an-card-photo{transform:scale(1.05)}
.an-card-media-shim{position:absolute;inset:0;background:linear-gradient(to top,rgba(26,27,27,0.6) 0%,transparent 60%)}

/* Fracture overlay on hover */
.an-card-fracture{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:2px;opacity:0;transition:opacity .4s;z-index:1}
.an-card-media:hover .an-card-fracture{opacity:0.3}
.an-card-fracture>div{background-size:200% 200%;background-repeat:no-repeat}

/* Card body */
.an-card-body{padding:16px 0 0;flex:1;display:flex;flex-direction:column;gap:10px}
.an-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.an-card-mins{font-family:var(--mono);font-size:9px;color:var(--t3);letter-spacing:.1em}
.an-card-title{font-family:var(--display);font-size:clamp(15px,1.5vw,21px);font-weight:700;line-height:1.3;color:var(--t1);transition:color .2s;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.an-card-title:hover{color:var(--sage)}
.an-card-excerpt{font-size:14px;color:var(--t2);line-height:1.7;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.an-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:4px;border-top:1px solid var(--rule-2)}
.an-card-date{font-family:var(--mono);font-size:10px;color:var(--t3);letter-spacing:.07em}
.an-card-link{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--t3);display:flex;align-items:center;gap:5px;transition:color .2s}
.an-card-link:hover{color:var(--sage)}
.an-card-link svg{transition:transform .2s}
.an-card-link:hover svg{transform:translateX(3px)}

/* Load more */
.an-more-wrap{text-align:center;margin-top:56px}
.an-more-btn{display:inline-flex;align-items:center;gap:12px;padding:14px 36px;border-radius:100px;font-size:13px;font-weight:700;letter-spacing:.05em;color:var(--t2);border:1px solid var(--rule);cursor:pointer;transition:all .3s var(--expo)}
.an-more-btn:hover{color:var(--t1);border-color:rgba(255,255,255,0.2);background:var(--glass-hov)}
.an-more-spinner{display:none;width:14px;height:14px;border:2px solid transparent;border-top-color:var(--sage);border-radius:50%;animation:spin .6s linear infinite}
.an-more-btn.is-loading .an-more-spinner{display:block}
.an-more-btn.is-loading .an-more-label{opacity:0.4}
@keyframes spin{to{transform:rotate(360deg)}}

/* ══════════ BIG PICTURE ═══════════════════════════════════════════ */
.an-bigpicture{position:relative;padding:clamp(80px,14vw,200px) 0;overflow:hidden}
.an-bp-photo{position:absolute;inset:0;background-size:cover;background-position:center}
.an-bp-veil{position:absolute;inset:0;background:rgba(26,27,27,0.72)}
.an-bp-content{position:relative;max-width:800px;margin:0 auto;text-align:center}
.an-bp-kicker{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--wheat);margin-bottom:24px}
.an-bp-quote{font-family:var(--display);font-size:clamp(36px,6.5vw,88px);font-weight:900;line-height:1.04;color:#fff;letter-spacing:-.03em;margin-bottom:28px}
.an-bp-quote em{font-style:italic;color:var(--wheat)}
.an-bp-body{font-size:clamp(15px,1.6vw,19px);color:rgba(255,255,255,0.65);line-height:1.8;margin-bottom:36px;max-width:540px;margin-left:auto;margin-right:auto}

/* ══════════ NEWSLETTER ════════════════════════════════════════════ */
.an-newsletter{border-top:1px solid var(--rule)}
.an-nl-inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,120px);align-items:center}
.an-nl-kicker{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);margin-bottom:16px}
.an-nl-headline{font-family:var(--display);font-size:clamp(42px,5.5vw,80px);font-weight:900;line-height:1.0;letter-spacing:-.03em;color:var(--t1);margin-bottom:16px}
.an-nl-headline em{font-style:italic;color:var(--sage)}
.an-nl-sub{font-size:16px;color:var(--t2);line-height:1.75;margin-bottom:28px;max-width:420px}
/* Glass form */
.an-nl-form{display:flex;gap:4px;padding:6px;border-radius:100px;margin-bottom:16px;align-items:center}
.an-nl-input{flex:1;background:none;border:none;outline:none;font-family:var(--body);font-size:14px;color:var(--t1);padding:8px 16px}
.an-nl-input::placeholder{color:var(--t3)}
.an-nl-submit{flex-shrink:0;background:var(--t1);color:var(--bg);font-family:var(--body);font-size:13px;font-weight:700;padding:12px 22px;border-radius:100px;display:flex;align-items:center;gap:8px;transition:background .2s,transform .15s;cursor:pointer;border:none}
.an-nl-submit:hover{background:var(--sage);color:#fff;transform:translateY(-1px)}
.an-nl-submit svg{transition:transform .2s}
.an-nl-submit:hover svg{transform:translateX(3px)}
.an-nl-note{font-family:var(--mono);font-size:10px;color:var(--t4);letter-spacing:.08em;margin-bottom:24px}
.an-nl-readers{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--t2)}
.an-nl-faces{display:flex}
.an-nl-face{width:30px;height:30px;border-radius:50%;border:2px solid var(--bg);margin-left:-8px;background:hsl(var(--hue,120) 30% 35%)}
.an-nl-face:first-child{margin-left:0}

/* Collage — newsletter right */
.an-nl-right{opacity:0.95}
.an-nl-collage{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:8px;height:420px;border-radius:24px;overflow:hidden;position:relative}
.an-nl-cell{background-size:cover;background-position:center;transition:transform .5s var(--expo)}
.an-nl-cell--1{grid-row:1/3;border-radius:4px 0 0 4px}
.an-nl-cell--2{border-radius:0 4px 0 0}
.an-nl-cell--3{border-radius:0}
.an-nl-cell--4{border-radius:0 0 4px 0}
.an-nl-collage:hover .an-nl-cell{transform:scale(1.03)}
.an-nl-glass-panel{position:absolute;bottom:16px;right:8px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;max-width:140px}
.an-nl-gp-label{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sage)}
.an-nl-gp-title{font-size:12px;font-weight:600;color:var(--t1);line-height:1.4}

/* ══════════ FOOTER ════════════════════════════════════════════════ */
.an-footer{border-top:1px solid var(--rule);padding-top:clamp(48px,7vw,96px)}
.an-footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;padding-bottom:60px;border-bottom:1px solid var(--rule)}
.an-footer-logo{height:28px;width:auto;filter:brightness(0) invert(1);opacity:0.5;margin-bottom:12px;transition:opacity .2s}
.an-footer-brand a:hover .an-footer-logo{opacity:0.8}
.an-footer-tag{font-size:13px;color:var(--t3);margin-bottom:20px}
.an-socials{display:flex;gap:8px}
.an-social{width:34px;height:34px;border:1px solid var(--rule);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--t3);transition:border-color .2s,color .2s}
.an-social:hover{border-color:var(--sage);color:var(--sage)}
.an-footer-col h4{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--t3);margin-bottom:20px}
.an-footer-col a{display:block;font-size:14px;color:var(--t3);margin-bottom:10px;transition:color .2s}
.an-footer-col a:hover{color:var(--t1)}
/* Giant watermark wordmark */
.an-footer-wm{font-family:var(--display);font-size:clamp(40px,10vw,130px);font-weight:900;color:rgba(255,255,255,0.025);letter-spacing:-.04em;text-align:center;padding:24px 0;user-select:none;pointer-events:none;line-height:1;overflow:hidden;white-space:nowrap}
.an-footer-bar{display:flex;justify-content:space-between;align-items:center;padding:20px 0;font-family:var(--mono);font-size:10px;letter-spacing:.07em;color:var(--t4);gap:16px;flex-wrap:wrap}
.an-footer-bar a{color:var(--t4);transition:color .2s}
.an-footer-bar a:hover{color:var(--t2)}

/* ══════════ RESPONSIVE ════════════════════════════════════════════ */
@media(max-width:1100px){
  .an-numbers-grid{grid-template-columns:repeat(2,1fr)}
  .an-editorial-grid{grid-template-columns:1fr}
  .an-editorial-mosaic{display:none}
  .an-editorial-badge{top:auto;bottom:-16px;right:16px}
  .an-nl-inner{grid-template-columns:1fr}
  .an-nl-right{display:none}
  .an-footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .an-grid{grid-template-columns:repeat(2,1fr)}
  .an-card--wide{grid-column:span 2}
}
@media(max-width:768px){
  .an-nav-links{display:none}
  .an-hamburger{display:flex}
  .an-hero-ghost-num{display:none}
  .an-hero-glass-panel{display:none}
  .an-arrow{width:38px;height:38px}
  .an-arrow--prev{left:12px}
  .an-arrow--next{right:12px}
  .an-numbers-grid{grid-template-columns:1fr 1fr}
  .an-stat-rule{display:none}
  .an-grid{grid-template-columns:1fr}
  .an-card--wide{grid-column:span 1}
  .an-footer-grid{grid-template-columns:1fr;gap:24px}
  .an-footer-brand{margin-bottom:8px}
  .an-section-hd{flex-direction:column;align-items:flex-start;gap:8px}
  .an-latest-hd{flex-direction:column}
}
@media(max-width:480px){
  .an-hero{margin-top:94px}
  .an-hero-actions{flex-direction:column}
  .an-btn{width:100%;justify-content:center}
  .an-nl-form{flex-direction:column;border-radius:16px;padding:12px}
  .an-nl-submit{width:100%;justify-content:center}
}