/* ==========================================================================
   Not An Atlas 3.0.0 — "Evolution" layer.
   Same identity as 2.x (Cormorant + Jost, forest, sand, graphite, paper), refined:
   1. Readable text: no 300-weight Jost below 17px; small Cormorant gets weight.
   2. One rhythm: two darks (graphite, night), one light ground, one sand.
   3. Cover: quieter Ask panel, stronger shade for bright photos, nav that never wraps.
   4. House promos become editorial ribbons, not boxed ads.
   5. Long-form reading: 19px Jost 400, 68ch, proper heading rhythm.
   6. Motion: scroll reveals, photo hover, page-to-page transitions (all off for reduced motion).
   Loaded last; overrides only.
   ========================================================================== */

:root{
  --e-ground:#fbfaf7;
  --e-sand:#ede8df;
  --e-graphite:#161817;
  --e-night:#0e1412;
  --e-ink:#151716;
  --e-ink-2:#3b403d;
  --e-ink-3:#6b716d;
  --e-rule:rgba(21,23,22,.12);
  --e-ease:cubic-bezier(.2,.7,.2,1);
}

/* ---------- 1. Type: legibility without changing the voice ---------- */
body{color:var(--e-ink)}
.cv-dek,.h2-lead-d,.h2-card p,.naa-num-desc,.af-dek,.af-list-head p,.af-note,.h2-dek,.h2-hc p,
.h2-pop p,.au-dek,.naa-trav-card p,.h2-nl p,.nl-disclaimer,.h2-pitch p,.footer-desc,.footer-copy,
.footer-legal a,.np-p,.npd-dek,.cv-field-text,.cv-chips button,.naa-ask-chips button,
.naa-article-dek,.naa-prose p,.naa-prose li{font-weight:400}
.h2-card p,.h2-hc p,.h2-pop p,.naa-trav-card p,.naa-num-desc{color:var(--e-ink-2)}
.cv-tab span,.cv-ask-label{font-weight:400}
.h2-bl-t b,.nb-title,.h2-pop-h,.naa-trav-card h3{font-weight:500}
h1,h2,h3,.cv-title,.naa-article-title{text-wrap:balance}
p,li{text-wrap:pretty}
/* tracked labels: a touch larger, a touch darker */
.h2-k,.h2-kicker,.naa-house-k,.af-k,.h2-sec .h2-k{letter-spacing:.2em}

/* ---------- 2. Header ---------- */
.cv-links a{white-space:nowrap}
.cv-links{gap:28px}

/* ---------- 3. Cover ---------- */
/* a second shade so headlines hold on snow, sand and sky */
.cv-shade{background:
  linear-gradient(90deg,rgba(10,12,11,.72) 0%,rgba(10,12,11,.42) 38%,rgba(10,12,11,0) 66%),
  linear-gradient(180deg,rgba(10,12,11,.45) 0%,rgba(10,12,11,0) 22%,rgba(10,12,11,0) 58%,rgba(10,12,11,.78) 100%)!important}
.cv-title{text-shadow:0 2px 30px rgba(0,0,0,.25)}
.cv-dek{color:rgba(244,241,234,.92);max-width:56ch}
/* Ask panel: lighter frame, sits on the headline's band instead of floating at the top */
.cv-panel{top:auto;bottom:168px;width:340px;background:rgba(14,16,15,.42);border-color:rgba(244,241,234,.14);border-radius:2px}
.cv-panel .cv-brief,.cv-panel .cv-panel-head{display:none}
.cv-ask{border-top:0;background:transparent;padding:18px 20px 16px}
.cv-ask-label{font-size:21px}
.cv-chips button:nth-child(n+3){display:none}
.cv-field{background:rgba(244,241,234,.12)}
.cv-coord{letter-spacing:.14em}
@media (max-width:1100px){.cv-panel{display:none}}

/* ---------- 4. Section rhythm ---------- */
#main{background:var(--e-ground)}
.h2-sec,.h2-listen,.naa-board,.h2-ig{background:var(--e-ground)}
.h2-sand,.naa-trav.pg-home{background:var(--e-sand)}
.naa-numbers{background:var(--e-ground);border-color:var(--e-rule)}
.h2-dark,.site-footer{background:var(--e-graphite)}
.af{background:var(--e-graphite)}

/* house promos: full-bleed editorial ribbons */
.naa-ad--leader.naa-house{background:transparent;padding:0;margin:0;min-height:0}
.naa-ad--leader.naa-house .naa-ad-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.naa-ad--leader.naa-house .naa-house-in{max-width:none;width:100%;margin:0;border-radius:0;border:0;
  display:grid;grid-template-columns:minmax(140px,220px) minmax(0,1fr) auto;align-items:center;gap:8px 40px;
  padding:34px max(24px,calc((100vw - 1240px)/2 + 24px))}
.naa-ad--leader.naa-house.is-forest .naa-house-in{background:#1f2c22}
.naa-ad--leader.naa-house.is-paper .naa-house-in{background:var(--e-sand);border-top:0}
.naa-ad--leader.naa-house .naa-house-k{grid-row:span 2}
.naa-ad--leader.naa-house .naa-house-h{font-size:clamp(26px,2.4vw,34px)}
.naa-ad--leader.naa-house .naa-house-b{grid-row:1 / span 2;grid-column:3}
.naa-ad--leader.naa-house .naa-house-in:hover .naa-house-b{transform:translateX(4px)}
.naa-house-b{transition:transform .4s var(--e-ease)}
/* a promo directly beside a dark section joins it */
.af + .naa-ad--leader.naa-house.is-forest .naa-house-in,.naa-ad--leader.naa-house.is-forest:has(+ .af) .naa-house-in{background:#1b241e}
@media (max-width:760px){
  .naa-ad--leader.naa-house .naa-house-in{grid-template-columns:1fr;padding:28px 20px;gap:8px}
  .naa-ad--leader.naa-house .naa-house-k{grid-row:auto}
  .naa-ad--leader.naa-house .naa-house-b{grid-row:auto;grid-column:auto;justify-self:start;margin-top:10px}
}

/* ---------- 5. Cards and photographs ---------- */
.h2-card img,.h2-lead img,.h2-hc img,.naa-trav-card img,.nb-thumb img,.h2-pop img,.fn-tile img{transition:transform 1.4s var(--e-ease),filter .6s}
.h2-card:hover img,.h2-lead:hover img,.h2-hc:hover img,.naa-trav-card:hover img,.h2-pop:hover img{transform:scale(1.035)}
.h2-card a:hover h3,.h2-lead a:hover h2,.nb-title:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}

/* ---------- 6. Long-form reading ---------- */
.naa-prose{max-width:68ch}
.naa-prose p,.naa-prose li{font-size:19px;line-height:1.72;color:#1f2321}
.naa-prose h2{font-size:clamp(30px,2.6vw,38px);font-weight:400;line-height:1.12;margin:1.9em 0 .55em}
.naa-prose h2 + p{margin-top:0}
.naa-prose strong{font-weight:500;color:var(--e-ink)}
.naa-prose a{text-decoration-color:rgba(74,103,65,.55);text-decoration-thickness:1.5px;text-underline-offset:.2em;transition:text-decoration-color .3s}
.naa-prose a:hover{text-decoration-color:currentColor}
.naa-prose ul{padding-left:1.1em}
.naa-prose li{margin:0 0 .7em}
.naa-prose li::marker{color:var(--moss,#4a6741)}
.naa-article-hero::before{background:linear-gradient(180deg,rgba(10,12,11,.45) 0%,rgba(10,12,11,.2) 35%,rgba(10,12,11,.82) 100%)}
.naa-article-dek{color:rgba(244,241,234,.9);max-width:60ch}
@media (max-width:600px){.naa-prose p,.naa-prose li{font-size:17.5px;line-height:1.68}}

/* ---------- 7. Motion ---------- */
@media (prefers-reduced-motion:no-preference){
  .e-rise{opacity:0;transform:translateY(22px);transition:opacity .9s var(--e-ease),transform .9s var(--e-ease)}
  .e-rise.is-in{opacity:1;transform:none}
  @view-transition{navigation:auto}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.38s;animation-timing-function:var(--e-ease)}
  .cv-nav{view-transition-name:site-nav}
}

/* ---------- 8. The advisor brief (inc/brief.php) ---------- */
.naa-read{display:grid;grid-template-columns:minmax(0,700px) 300px;gap:72px;justify-content:center;align-items:start;max-width:1240px;margin:0 auto;padding:0 40px}
.naa-read > .naa-prose{grid-column:1;grid-row:1;margin-left:0;margin-right:0;padding-left:0;padding-right:0;max-width:none}
/* 3.0.3: one copy of the advice. In the story it reads as a card; on desktop evolve.js moves it to the sidebar. */
.naa-brief{background:var(--e-sand);padding:24px 24px 20px;border-top:3px solid var(--forest,#1c2b1e);margin:44px 0}
.naa-read > .naa-brief{grid-column:2;grid-row:1;position:sticky;top:104px;margin:var(--e-brief-top,72px) 0 0;max-height:calc(100vh - 128px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.naa-prose .naa-brief h2.naa-brief-k,.naa-brief-k{font-family:var(--ff-body);font-size:10.5px;font-weight:500;line-height:1.4;letter-spacing:.2em;text-transform:uppercase;color:var(--moss,#4a6741);margin:0 0 14px;padding:0;border:0}
.naa-prose .naa-brief h2.naa-brief-k::before,.naa-prose .naa-brief h2.naa-brief-k::after{content:none;display:none}
.naa-brief dd a{color:inherit;text-decoration:underline;text-underline-offset:.2em}
.naa-prose .naa-brief dl,.naa-prose .naa-brief dd{max-width:none}
.naa-prose .naa-brief-foot,.naa-prose .naa-brief-coord{display:none}
.naa-prose .naa-brief .naa-brief-row:last-child{padding-bottom:0}
.naa-brief-list{margin:0}
.naa-brief-row{padding:12px 0;border-top:1px solid var(--e-rule)}
.naa-brief-row:first-child{border-top:0;padding-top:0}
.naa-brief dt{font-family:var(--ff-display);font-size:19px;font-weight:500;line-height:1.2;color:var(--e-ink);margin-bottom:4px}
.naa-brief dd{margin:0;font-family:var(--ff-body);font-size:14px;line-height:1.55;color:var(--e-ink-2)}
.naa-brief-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;margin-top:14px;padding-top:14px;border-top:1px solid var(--e-rule)}
.naa-brief-foot a{font-family:var(--ff-body);font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--e-ink);text-decoration:none}
.naa-brief-foot a:hover{text-decoration:underline;text-underline-offset:.25em}
.naa-brief-coord{margin-top:12px;font-family:var(--ff-body);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--e-ink-3)}
#for-advisors,#sources{scroll-margin-top:100px}
@media (max-width:1100px){
  .naa-read{display:block;padding:0}
  .naa-read > .naa-prose{margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px;padding-top:40px;max-width:68ch}
}
@media (min-width:1101px){article:has(.naa-read) .naa-article-hero-in{max-width:1136px}}
@media (max-width:700px){.naa-article-hero::before{background:linear-gradient(180deg,rgba(10,12,11,.55) 0%,rgba(10,12,11,.55) 40%,rgba(10,12,11,.88) 100%)}}

/* ---------- 9. Dates to know: All view and region nudge (3.0.1) ---------- */
/* fewer dates fill the row instead of leaving empty columns */
@media (min-width:1101px){[data-naa-dates] .h2-clock{grid-template-columns:repeat(min(var(--h2-cols,5),5),minmax(0,1fr))}}
[data-naa-dates] .h2-clock .h2-date.is-last{border-right:0}
.h2-mk{align-self:flex-start;margin:-4px 0 10px;font-family:var(--ff-body);font-size:9.5px;font-weight:500;letter-spacing:.18em;color:rgba(244,241,234,.55)}
.h2-mk[hidden]{display:none}
.h2-dhint{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin:-6px 0 18px;font-family:var(--ff-body);font-size:13px;color:rgba(244,241,234,.7);
  opacity:0;transform:translateY(-4px);transition:opacity .6s var(--e-ease),transform .6s var(--e-ease)}
[data-naa-dates].is-seen .h2-dhint{opacity:1;transform:none;transition-delay:.9s}
.h2-dhint[hidden]{display:none}
.h2-dhint-go{border:0;background:none;padding:0;font:500 13px var(--ff-body);color:var(--paper-warm,#f4f1ea);text-decoration:underline;text-underline-offset:.25em;cursor:pointer}
.h2-dhint-x{border:0;background:none;color:rgba(244,241,234,.45);font-size:18px;line-height:1;cursor:pointer;padding:0 2px}
.h2-dhint-x:hover{color:var(--paper-warm,#f4f1ea)}
.h2-seg button.is-nudge{position:relative}
.h2-seg button.is-nudge::after{content:"";position:absolute;inset:1px;border-radius:30px;box-shadow:0 0 0 1px rgba(244,241,234,.75);opacity:0}
[data-naa-dates].is-seen .h2-seg button.is-nudge::after{animation:eNudge 1.8s var(--e-ease) 1.1s 3}
@keyframes eNudge{0%{opacity:0;transform:scale(.92)}35%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.12)}}
@media (prefers-reduced-motion:reduce){[data-naa-dates].is-seen .h2-seg button.is-nudge::after{animation:none;opacity:1;transform:none}.h2-dhint{transition:none}}
@media (max-width:760px){.h2-dhint{justify-content:flex-start;flex-wrap:wrap;margin:0 0 14px}}
/* logged-in editors: clear the admin bar too */
.admin-bar .naa-read > .naa-brief{top:136px;max-height:calc(100vh - 160px)}

/* 10. 3.0.2: By the numbers leads with what's new */
.naa-figs-new{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-family:var(--ff-body);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--sage-lt)}
.naa-figs-dot{width:7px;height:7px;border-radius:50%;background:var(--sage-lt);box-shadow:0 0 0 0 rgba(168,190,160,.6);animation:eFigPulse 2.4s ease-out infinite}
@keyframes eFigPulse{0%{box-shadow:0 0 0 0 rgba(168,190,160,.55)}70%{box-shadow:0 0 0 9px rgba(168,190,160,0)}100%{box-shadow:0 0 0 0 rgba(168,190,160,0)}}
.naa-fig.is-new{border-color:rgba(244,241,234,.32)}
.naa-fig.is-new .naa-fig-meta::before{content:"New";display:inline-block;margin-right:10px;padding:2px 7px;border-radius:3px;background:var(--sage-lt);color:var(--forest);letter-spacing:.14em}
@media (prefers-reduced-motion:reduce){.naa-figs-dot{animation:none}}

/* 11. 3.0.5: the getaways web. "Make a weekend of it" on stories, guide links on getaway picks */
.gw-web{max-width:700px;margin:8px auto 40px;padding:0 24px}
.gw-web-k{font-family:var(--ff-body);font-size:10.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--moss,#4a6741);padding-top:18px;border-top:3px solid var(--forest,#1c2b1e);margin-bottom:6px}
.gw-web-list{list-style:none;margin:0;padding:0}
.gw-web-list li{border-bottom:1px solid var(--e-rule,rgba(22,24,23,.12))}
.gw-web-list a{display:grid;grid-template-columns:136px minmax(0,1fr) auto;gap:2px 16px;align-items:baseline;padding:14px 0;color:var(--e-ink,#161817);text-decoration:none}
.gw-web-list a:hover .gw-web-to{text-decoration:underline;text-underline-offset:.2em}
.gw-web-from{white-space:nowrap;font-family:var(--ff-body);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--e-ink-3,#6b6f6c)}
.gw-web-to{font-family:var(--ff-display);font-size:21px;line-height:1.2}
.gw-web-time{font-family:var(--ff-body);font-size:13px;color:var(--e-ink-2,#3b3f3c);white-space:nowrap}
.gw-web-when{grid-column:2 / -1;font-family:var(--ff-body);font-size:13px;color:var(--e-ink-3,#6b6f6c)}
.gw-web-all{display:inline-block;margin-top:12px;font-family:var(--ff-body);font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--e-ink,#161817);text-decoration:none}
@media (max-width:600px){.gw-web{padding:0 20px}.gw-web-list a{grid-template-columns:minmax(0,1fr) auto}.gw-web-from{grid-column:1 / -1}.gw-web-when{grid-column:1 / -1}}
.gw-read a.is-guide b{font-weight:500}

/* 3.0.12: photo credits drawn from data-credit, so link previews and readers don't take them as the story's first text. */
.naa-article-credit[data-credit]::before,.gw-hero-credit[data-credit]::before{content:attr(data-credit)}
