/* =========================================================================
   WHEN THE MEDS DON'T WORK
   A fine-press literary health imprint.
   Signature: THE THRESHOLD - an engraved arch/doorway pressmark, carried
   as a system across the mark, the hero, section breaks and the partner card.
   Palette: inkwell indigo · burnt terracotta · warm ivory paper.
   Display: Fraunces  ·  Text: Spectral  ·  Utility: Hanken Grotesk
   ========================================================================= */

:root{
  /* paper (the page) */
  --paper:#f4f1ea;          /* warm ivory */
  --paper-2:#ebe5d8;        /* deeper panel on paper */
  --paper-hi:#fbfaf5;       /* raised card / near white */
  --ink:#242230;           /* warm near-black, faint plum */
  --ink-72:rgba(36,34,48,.74);
  --ink-52:rgba(36,34,48,.54);
  --ink-32:rgba(36,34,48,.34);
  --rule:#ddd5c5;          /* warm hairline */
  --rule-2:#cfc6b3;

  /* inkwell indigo (the dark ground - hero, footer, partner card) */
  --indigo:#242c46;
  --indigo-2:#2e3757;      /* raised panel */
  --indigo-3:#191f34;      /* deepest floor */
  --on-indigo:#efe9dd;     /* ivory on indigo */
  --on-indigo-72:rgba(239,233,221,.74);
  --on-indigo-45:rgba(239,233,221,.48);

  /* the one accent: burnt terracotta / rose madder */
  --clay:#a8442b;          /* deep terracotta for paper (passes AA on ivory) */
  --clay-ink:#933a24;      /* darker clay for small body links */
  --clay-lit:#d07a52;      /* brighter terracotta for text on indigo */
  --clay-line:rgba(208,122,82,.42);

  --display:'Fraunces','Spectral','Georgia',serif;
  --serif:'Spectral','Georgia',serif;
  --sans:'Hanken Grotesk','Helvetica Neue',system-ui,sans-serif;

  --measure:680px;
  --shell:1140px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--serif);
  background:var(--paper);
  color:var(--ink);
  font-size:19px;
  line-height:1.66;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-feature-settings:"kern" 1,"liga" 1,"onum" 1,"pnum" 1;
  font-kerning:normal;
  hanging-punctuation:first allow-end last;
  position:relative;
  overflow-x:hidden;
}
/* faint paper grain over the whole page - depth without noise */
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  opacity:.03;mix-blend-mode:multiply;
}
img,svg{max-width:100%}
img{display:block}
p{text-wrap:pretty}
h1,h2,h3,.faq-q,.toc-title,.standfirst{text-wrap:balance}

::selection{background:rgba(168,68,43,.18)}
a{color:var(--clay-ink);text-decoration:none}
a:focus-visible,button:focus-visible,.btn:focus-visible{
  outline:2px solid var(--clay);outline-offset:3px;border-radius:2px;
}

.wrap{max-width:var(--measure);margin:0 auto;padding:0 26px}
.shell{max-width:var(--shell);margin:0 auto;padding:0 34px}

/* =====================  MASTHEAD (light, letterpress plate)  =========== */
.mast{
  background:var(--paper);
  position:sticky;top:0;z-index:50;
  border-bottom:1px solid var(--rule);
  box-shadow:0 8px 24px -24px rgba(36,34,48,.5);
}
.mast::after{ /* thin clay hairline seam under the plate */
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,var(--clay-line) 22%,var(--clay-line) 78%,transparent);
}
.mast-in{
  max-width:var(--shell);margin:0 auto;padding:18px 34px 16px;
  display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;
}
.logo{display:inline-flex;align-items:center;gap:13px;color:var(--ink);line-height:1}
.logo .mark{width:31px;height:31px;flex:none;display:block;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.logo:hover .mark{transform:translateY(-1px)}
/* two-tone threshold colophon: ink arches, terracotta doorway at the core */
.mark .a-out,.mark .a-mid,.mark .a-base{stroke:var(--ink)}
.mark .a-in{stroke:var(--clay)}
.mark .a-mid{opacity:.9}
.foot-brand .mark .a-out,.foot-brand .mark .a-mid,.foot-brand .mark .a-base{stroke:var(--on-indigo)}
.foot-brand .mark .a-in{stroke:var(--clay-lit)}
.foot-brand .mark .a-mid{opacity:.85}
.logo .wm{
  font-family:var(--display);
  font-optical-sizing:auto;
  font-weight:500;
  font-size:23px;
  letter-spacing:.005em;
  line-height:1;
  font-variation-settings:"SOFT" 0,"WONK" 0;
}
.logo .wm .em{font-style:italic;font-weight:500;color:var(--clay)}
.mast-nav{display:flex;gap:28px;font-family:var(--sans);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.15em}
.mast-nav a{color:var(--ink-72);position:relative;padding-bottom:4px;transition:color .25s ease}
.mast-nav a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:1.5px;
  background:var(--clay);transition:right .3s ease;
}
.mast-nav a:hover,.mast-nav a:focus-visible{color:var(--clay)}
.mast-nav a:hover::after,.mast-nav a:focus-visible::after{right:0}

/* =====================  THE HERO / THRESHOLD (signature)  ============== */
.cover{
  color:var(--on-indigo);position:relative;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(120% 82% at 50% 128%, rgba(208,122,82,.26), rgba(208,122,82,.06) 38%, transparent 62%),
    radial-gradient(150% 120% at 50% -12%, var(--indigo-2), transparent 52%),
    linear-gradient(178deg, var(--indigo-2), var(--indigo) 46%, var(--indigo-3) 100%);
}
/* barely-there ruled weave */
.cover::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background-image:repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 5px);
}
.cover-inner{max-width:var(--shell);margin:0 auto;padding:70px 34px 78px;position:relative;z-index:2}
.cover.short .cover-inner{padding:40px 34px 56px}

/* the engraved arch, injected before the content frame */
.arch-bg{
  position:absolute;top:50%;right:max(2vw,calc(50% - 560px));
  transform:translateY(-50%);
  width:min(430px,42vw);height:auto;z-index:0;pointer-events:none;
  opacity:.9;
  filter:drop-shadow(0 26px 60px rgba(0,0,0,.35));
  animation:archIn 1.2s cubic-bezier(.2,.7,.2,1) both;
}
.cover.short .arch-bg{width:min(300px,32vw);opacity:.7}
@keyframes archIn{from{opacity:0;transform:translateY(-50%) scale(.965)}to{opacity:.9;transform:translateY(-50%) scale(1)}}

/* breadcrumb */
.crumb{
  font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--on-indigo-45);padding:0 0 26px;
}
.crumb a{color:var(--on-indigo-72);transition:color .2s ease}
.crumb a:hover{color:var(--clay-lit)}
.crumb .sep{margin:0 10px;color:var(--on-indigo-45)}

/* the content column - no border now; the arch is the signature, not a frame */
.cover-frame{max-width:760px;position:relative}

/* imprint / chapter line above the title */
.chapter{
  font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--clay-lit);display:flex;align-items:center;gap:14px;margin-bottom:28px;
}
.chapter .num{
  font-family:var(--display);font-style:italic;font-weight:500;font-size:20px;letter-spacing:0;
  color:var(--clay-lit);position:relative;padding-right:14px;
}
.chapter .num::after{content:"";position:absolute;right:0;top:50%;width:1px;height:16px;transform:translateY(-50%);background:var(--clay-line)}
.chapter .rule{flex:1;height:1px;background:linear-gradient(90deg,var(--clay-line),transparent);max-width:120px}

.cover h1{
  font-family:var(--display);
  font-optical-sizing:auto;
  font-weight:500;
  font-variation-settings:"SOFT" 30,"WONK" 0;
  font-size:clamp(39px,6vw,74px);
  line-height:1.03;
  letter-spacing:-.012em;
  color:var(--on-indigo);
  margin:0 0 24px;
  max-width:17ch;
}
.cover.short h1{font-size:clamp(33px,4.8vw,55px);max-width:19ch}
.cover h1 .gilt{font-style:italic;color:var(--clay-lit);font-variation-settings:"SOFT" 60,"WONK" 1}

.standfirst{
  font-family:var(--serif);
  font-size:clamp(19px,2.05vw,23px);
  line-height:1.52;
  color:var(--on-indigo-72);
  max-width:46ch;font-weight:400;
}
.standfirst em{font-style:italic;color:var(--on-indigo)}

.imprint{
  display:flex;align-items:center;gap:13px;margin-top:36px;
  font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.09em;
  color:var(--on-indigo-45);text-transform:uppercase;
}
.imprint .dawn{width:22px;height:22px;flex:none;opacity:.95}
.imprint .bar{width:30px;height:1px;background:var(--clay-line)}

/* =====================  ARTICLE BODY  ================================= */
article{padding:64px 0 20px}
article p{margin:0 0 22px}
article p.lead{
  font-family:var(--serif);
  font-size:clamp(21px,2.3vw,25px);
  line-height:1.5;color:var(--ink);margin-bottom:32px;font-weight:400;
}
article p.lead::first-letter{
  font-family:var(--display);
  font-weight:600;
  font-variation-settings:"SOFT" 40,"WONK" 0;
  font-size:3.3em;line-height:.78;float:left;
  margin:.05em .12em 0 0;color:var(--clay);
}
article strong{font-weight:600;color:var(--ink)}
article em{font-style:italic}

/* body links: clay with a terracotta underline that thickens */
article > p a,article > ul a,article > ol a,.faq-a a{
  color:var(--clay-ink);
  background-image:linear-gradient(var(--clay),var(--clay));
  background-size:100% 1px;background-repeat:no-repeat;background-position:0 1.08em;
  padding-bottom:1px;transition:background-size .25s ease,color .25s ease;
}
article > p a:hover,article > ul a:hover,article > ol a:hover,.faq-a a:hover{color:var(--clay);background-size:100% 2px}

article h2{
  font-family:var(--display);
  font-optical-sizing:auto;font-weight:500;
  font-variation-settings:"SOFT" 20,"WONK" 0;
  font-size:clamp(26px,3vw,34px);
  line-height:1.14;letter-spacing:-.008em;
  margin:56px 0 16px;color:var(--ink);position:relative;
}
/* section head marker: a clean engraved arch, left-aligned above the head */
article h2::before{
  content:"";display:block;width:34px;height:17px;margin-bottom:19px;
  background:no-repeat left center/contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 17'%3E%3Cpath d='M3.5 16V7.5a20 20 0 0 1 27 0V16' fill='none' stroke='%23a8442b' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.5 16V10a11 11 0 0 1 13 0V16' fill='none' stroke='%23a8442b' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
article h3{
  font-family:var(--sans);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.14em;
  color:var(--clay);margin:38px 0 10px;
}
article > ul,article > ol{margin:0 0 22px;padding:0;list-style:none}
article > ul > li,article > ol > li{position:relative;padding-left:30px;margin-bottom:13px}
article > ul > li::before{content:"";position:absolute;left:2px;top:.62em;width:12px;height:1.5px;background:var(--clay)}
article > ol{counter-reset:li}
article > ol > li{counter-increment:li}
article > ol > li::before{
  content:counter(li);position:absolute;left:0;top:.02em;
  font-family:var(--display);font-style:italic;font-weight:500;font-size:.85em;color:var(--clay);
}

blockquote{
  margin:40px 0;padding:6px 0 6px 32px;
  border-left:2px solid var(--clay);
  font-family:var(--display);font-optical-sizing:auto;
  font-weight:500;font-style:italic;
  font-variation-settings:"SOFT" 40,"WONK" 0;
  font-size:clamp(22px,2.7vw,29px);line-height:1.32;color:var(--ink);
}

/* =====================  FIELD NOTE (marginal note)  ================== */
.fieldnote{
  margin:44px 0;padding:28px 32px 30px;
  background:linear-gradient(180deg,var(--paper-hi),var(--paper-2));
  border:1px solid var(--rule);border-left:3px solid var(--clay);
  position:relative;
  box-shadow:0 22px 44px -38px rgba(36,34,48,.5);
}
.fn-label{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--clay);margin-bottom:14px;display:flex;align-items:center;gap:10px;
}
.fn-label::after{content:"";flex:1;height:1px;background:var(--rule)}
.fn-body{font-family:var(--serif);font-size:18px;line-height:1.56;color:var(--ink-72);margin:0}
.fn-fig{
  display:inline;font-family:var(--display);font-optical-sizing:auto;
  font-weight:600;font-style:normal;color:var(--clay);
  font-size:1.55em;line-height:1;margin-right:.3em;letter-spacing:.004em;
}

/* section rule with a centered arch dinkus */
hr.sec{border:0;height:auto;margin:56px auto;width:100%;position:relative;text-align:center}
hr.sec::before{content:"";display:block;height:1px;background:var(--rule)}
hr.sec::after{
  content:"";position:absolute;left:50%;top:50%;width:56px;height:20px;
  transform:translate(-50%,-50%);background:var(--paper) no-repeat center/34px 17px
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 17'%3E%3Cpath d='M3.5 16V7.5a20 20 0 0 1 27 0V16' fill='none' stroke='%23a8442b' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.5 16V10a11 11 0 0 1 13 0V16' fill='none' stroke='%23a8442b' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* =====================  FAQ  ========================================= */
.faq-list{margin-top:10px;counter-reset:faq}
.faq-item{
  border-top:1px solid var(--rule);padding:30px 22px 30px 20px;margin:0 -22px 0 -20px;
  display:grid;grid-template-columns:58px 1fr;gap:6px 4px;counter-increment:faq;
  transition:background .3s ease;position:relative;
}
.faq-item::before{
  content:"";position:absolute;left:0;top:-1px;bottom:0;width:2px;background:var(--clay);
  transform:scaleY(0);transform-origin:top;transition:transform .35s ease;
}
.faq-item:hover{background:linear-gradient(90deg,rgba(168,68,43,.05),transparent 70%)}
.faq-item:hover::before{transform:scaleY(1)}
.faq-item:last-of-type{border-bottom:1px solid var(--rule)}
.faq-num{
  font-family:var(--display);font-style:italic;font-weight:500;font-size:27px;color:var(--clay);
  grid-row:1 / span 2;padding-top:2px;line-height:1;transition:transform .35s ease;
}
.faq-item:hover .faq-num{transform:translateY(-1px)}
.faq-q{
  font-family:var(--display);font-optical-sizing:auto;font-weight:500;
  font-variation-settings:"SOFT" 20,"WONK" 0;
  font-size:clamp(20px,2.3vw,24px);line-height:1.22;color:var(--ink);margin:0 0 12px;
}
.faq-a{color:var(--ink-72);font-size:17.5px;line-height:1.62}
.faq-a p{margin:0}

/* =====================  BRC PARTNER CARD (indigo, arch-cornered)  ==== */
.help{background:var(--indigo);color:var(--on-indigo);margin:58px 0;padding:0;position:relative;overflow:hidden}
.help::after{ /* faint threshold glow at the base */
  content:"";position:absolute;left:50%;bottom:-40%;width:130%;height:80%;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(208,122,82,.22),transparent 72%);pointer-events:none;
}
.help-frame{padding:clamp(30px,4.2vw,46px);position:relative;z-index:1}
.help .lbl{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--clay-lit);margin-bottom:16px;display:flex;align-items:center;gap:11px;
}
.help .lbl svg.dawn{display:none}
.help .lbl::before{
  content:"";width:30px;height:15px;flex:none;
  background:no-repeat center/contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 17'%3E%3Cpath d='M3.5 16V7.5a20 20 0 0 1 27 0V16' fill='none' stroke='%23d07a52' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.5 16V10a11 11 0 0 1 13 0V16' fill='none' stroke='%23d07a52' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.help h3{
  font-family:var(--display);font-optical-sizing:auto;font-weight:500;
  font-variation-settings:"SOFT" 30,"WONK" 0;
  font-size:clamp(23px,2.7vw,29px);line-height:1.16;color:var(--on-indigo);
  margin:0 0 14px;text-transform:none;letter-spacing:0;
}
.help p{color:var(--on-indigo-72);font-size:16.5px;line-height:1.6;margin:0 0 24px;max-width:60ch}
.help .btn{
  display:inline-flex;align-items:center;gap:11px;
  font-family:var(--sans);font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--indigo-3);background:var(--clay-lit);
  padding:14px 28px;border:1px solid var(--clay-lit);border-radius:2px;
  transition:background .3s ease,color .3s ease,box-shadow .3s ease,transform .2s ease;
}
.help .btn .arw{transition:transform .3s ease}
.help .btn:hover{background:#dd8a63;border-color:#dd8a63;box-shadow:0 16px 34px -16px rgba(208,122,82,.7);transform:translateY(-1px)}
.help .btn:hover .arw{transform:translateX(4px)}
.help .disc{
  font-family:var(--sans);font-size:11.5px;line-height:1.6;color:var(--on-indigo-45);
  margin-top:22px;padding-top:20px;border-top:1px solid rgba(208,122,82,.28);max-width:70ch;
}

/* =====================  RELATED (contents)  ========================= */
.alsoin{margin:66px 0 0;border-top:2px solid var(--ink)}
.alsoin-head{
  font-family:var(--sans);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;
  color:var(--ink-52);padding:22px 0 6px;
}
.toc{list-style:none;counter-reset:toc}
.toc li{counter-increment:toc;border-top:1px solid var(--rule)}
.toc li:first-child{border-top:0}
.toc a{
  display:grid;grid-template-columns:46px 1fr auto;align-items:center;gap:18px;
  padding:20px 4px;color:var(--ink);transition:padding-left .3s ease;
}
.toc-num{font-family:var(--display);font-style:italic;font-weight:500;font-size:20px;color:var(--clay)}
.toc-body{display:block}
.toc-sec{
  font-family:var(--sans);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.16em;
  color:var(--clay);display:block;margin-bottom:4px;
}
.toc-title{font-family:var(--display);font-optical-sizing:auto;font-weight:500;font-size:clamp(18px,2vw,21px);line-height:1.24;color:var(--ink);display:block}
.toc-arw{font-family:var(--serif);font-size:20px;color:var(--ink-32);transition:color .3s ease,transform .3s ease}
.toc a:hover{padding-left:12px}
.toc a:hover .toc-arw{color:var(--clay);transform:translateX(4px)}
.toc a:hover .toc-title{color:var(--clay)}

/* =====================  CRISIS  ===================================== */
.crisis{
  background:var(--paper-2);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  padding:22px 0;margin-top:78px;
}
.crisis .wrap{
  display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  font-family:var(--sans);font-size:14.5px;color:var(--ink-72);
}
.crisis .tag{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--clay);display:inline-flex;align-items:center;gap:8px;
}
.crisis .tag::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--clay);flex:none;
  box-shadow:0 0 0 3px rgba(168,68,43,.16);
}
.crisis strong{color:var(--ink);font-weight:700}

/* =====================  FOOTER (back cover)  ======================== */
footer{background:var(--indigo-3);color:var(--on-indigo-72);padding:66px 0 56px;position:relative}
footer::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--clay-line) 20%,var(--clay-line) 80%,transparent);
}
.foot-grid{
  max-width:var(--shell);margin:0 auto;padding:0 34px;
  display:grid;grid-template-columns:1.35fr 1fr;gap:46px;align-items:start;
}
.foot-brand .fl{display:inline-flex;align-items:center;gap:14px;margin-bottom:18px}
.foot-brand .fl .mark{width:30px;height:30px;flex:none}
.foot-brand .fl .wm{font-family:var(--display);font-weight:500;font-size:22px;color:var(--on-indigo);letter-spacing:.005em}
.foot-brand .fl .wm .em{font-style:italic;color:var(--clay-lit)}
.foot-brand p{font-family:var(--serif);font-size:15px;line-height:1.62;color:var(--on-indigo-72);max-width:47ch}
.foot-nav{display:flex;flex-direction:column;gap:2px}
.foot-nav .fn-head{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--on-indigo-45);margin-bottom:16px;
}
.foot-nav a{
  font-family:var(--sans);font-size:13.5px;letter-spacing:.02em;color:var(--on-indigo-72);
  padding:7px 0;transition:color .25s ease;width:max-content;
}
.foot-nav a:hover{color:var(--clay-lit)}
.foot-rule{max-width:var(--shell);margin:46px auto 0;padding:0 34px}
.foot-rule .line{height:1px;background:var(--clay-line)}
.colophon{
  max-width:var(--shell);margin:22px auto 0;padding:0 34px;
  font-family:var(--sans);font-size:11.5px;letter-spacing:.06em;color:var(--on-indigo-45);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
}

/* =====================  ENTRANCE  =================================== */
@keyframes rise{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
.cover-frame > .chapter{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.cover-frame > h1{animation:rise .8s cubic-bezier(.2,.7,.2,1) .08s both}
.cover-frame > .standfirst{animation:rise .8s cubic-bezier(.2,.7,.2,1) .17s both}
.cover-frame > .imprint{animation:rise .8s cubic-bezier(.2,.7,.2,1) .26s both}

/* =====================  RESPONSIVE  ================================= */
@media(max-width:900px){
  .arch-bg{opacity:.34;right:-6%}
  .cover.short .arch-bg{opacity:.26}
}
@media(max-width:720px){
  body{font-size:18px}
  .mast-in{padding:15px 22px}
  .mast-nav{gap:16px;font-size:11px;letter-spacing:.1em;width:100%;justify-content:flex-start;
    overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  .cover-inner{padding:48px 22px 54px}
  .cover.short .cover-inner{padding:30px 22px 42px}
  .arch-bg{width:220px;right:-24%;opacity:.16}
  .cover.short .arch-bg{width:160px;opacity:.13}
  article{padding:46px 0 16px}
  .foot-grid{grid-template-columns:1fr;gap:36px}
  .fieldnote{padding:24px 22px}
  .help-frame{padding:28px 22px}
  .help-frame::before{top:16px;right:16px;width:38px}
  .toc a{grid-template-columns:32px 1fr auto;gap:12px}
  .faq-item{grid-template-columns:40px 1fr}
  .colophon{flex-direction:column;gap:6px}
}
@media(max-width:400px){
  .logo .wm{font-size:20px}
  .arch-bg{display:none}
}

/* =====================  MOTION  ==================================== */
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto !important;transition:none !important;animation:none !important}
}