:root{--bg:#121412;--bg2:#1A1D1A;--ink:#F5F4F0;--ink2:rgba(245,244,240,.72);--ink3:rgba(245,244,240,.5);--gold:#C9A96A;--gold2:#A8874E;--teal:#1D9E75;--rule:rgba(245,244,240,.14);--card:#FDFCFA;--cardink:#1C1C1A;--max:1240px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:300 17px/1.7 Raleway,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,.cz{font-family:Cinzel,serif;font-weight:400;letter-spacing:.01em}
em{font-style:italic;color:var(--gold)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.eb{font-family:Cinzel,serif;font-size:12px;letter-spacing:.42em;text-transform:uppercase;color:var(--gold2);display:flex;align-items:center;gap:16px}
.eb::before,.eb::after{content:"";height:1px;width:40px;background:rgba(168,135,78,.4)}
.eb.l::after{display:none}.eb.l::before{display:none}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#000;padding:8px 12px;z-index:99}
/* site header: logo centred, sections left and right */
.sitetop{position:absolute;top:0;left:0;right:0;z-index:40}
.sitetop .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:28px;padding-top:26px}
.sitetop ul{list-style:none;display:flex;gap:30px;align-items:center}
.sitetop .nl{justify-content:flex-end}.sitetop .nr{justify-content:flex-start}
.sitetop ul a{font-family:Cinzel,serif;font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);text-shadow:0 1px 14px rgba(0,0,0,.6);padding:8px 0;position:relative;white-space:nowrap}
.sitetop ul a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.sitetop ul a:hover::after,.sitetop ul a:focus-visible::after{transform:scaleX(1)}
.sitetop .logo{display:block}
.sitetop img{width:220px;height:220px;filter:brightness(0) invert(1) drop-shadow(0 2px 18px rgba(0,0,0,.35))}
.sitetop .menu{display:none;font-family:Cinzel,serif;font-size:12px;letter-spacing:.22em;text-transform:uppercase;border:1px solid rgba(245,244,240,.4);padding:9px 16px;border-radius:999px}
.mnav{display:none}
.sitetop.inner{position:static;background:var(--bg);border-bottom:1px solid var(--rule)}
.sitetop.inner .wrap{padding:16px 20px}
.sitetop.inner img{width:120px;height:120px;filter:brightness(0) invert(1)}
.sitetop.inner ul a{text-shadow:none}
.page-top{position:relative;height:40px}
.shelfbtn{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(201,169,106,.5);padding:9px 16px;border-radius:999px;font-size:13px;letter-spacing:.06em;color:var(--gold);pointer-events:auto;transition:all .2s}
.shelfbtn:hover{background:var(--gold);color:#121412}
.shelfbtn b{font-weight:500;font-family:'JetBrains Mono',monospace;font-size:12px}
/* hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;isolation:isolate;text-align:center}
.hero .ph{position:absolute;inset:0;background:url(../img/16730973.jpg) center 42%/cover no-repeat;transform:scale(1);animation:burns 24s ease-out forwards}
@keyframes burns{from{transform:scale(1)}to{transform:scale(1.12)}}
.hero .shade{position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 50%,rgba(18,20,18,.2),rgba(18,20,18,.55) 70%,rgba(18,20,18,.85)),linear-gradient(180deg,rgba(18,20,18,.45) 0%,rgba(18,20,18,0) 30%,rgba(18,20,18,0) 65%,#121412 100%)}
.hero .wrap{position:relative;padding:230px 20px 110px;display:flex;flex-direction:column;align-items:center}
.hero .glint{position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px 260px at var(--mx,50%) var(--my,45%),rgba(245,244,240,.16),rgba(245,244,240,0) 70%);mix-blend-mode:screen;transition:opacity .6s;opacity:0}
.hero:hover .glint{opacity:1}
.hero .band{margin-top:clamp(64px,11vh,130px);display:flex;flex-direction:column;align-items:center;transform:translateY(var(--py,0));transition:transform .15s ease-out;will-change:transform}
.hero h1{display:flex;flex-direction:column;align-items:center;line-height:1.02;margin:0 0 30px;text-shadow:0 2px 30px rgba(0,0,0,.45)}
.hero h1 .l1,.hero h1 .l2{display:block}
.hero h1 .l1{font-size:clamp(40px,8.6vw,120px);letter-spacing:.01em;white-space:nowrap}
.hero h1 .l2{font-size:clamp(30px,4.6vw,64px);margin-top:.18em;letter-spacing:.02em}
.hero .pull{font-size:clamp(16px,1.35vw,20px);line-height:1.8;max-width:none;color:var(--ink);text-shadow:0 1px 12px rgba(0,0,0,.6);font-weight:300}
.hero .pull span{display:block}
@media (min-width:900px){.hero .pull span{white-space:nowrap}}
.hero .row{justify-content:center;margin-top:34px;gap:16px}
.btn.big{min-width:250px;justify-content:center;padding:17px 34px;font-size:14px;letter-spacing:.16em;border-width:2px}
.btn.solid{background:var(--gold);color:#121412;border-color:var(--gold)}.btn.solid:hover{background:var(--ink);border-color:var(--ink)}
.btn.cream{border-color:var(--ink);color:var(--ink);background:rgba(18,20,18,.35)}.btn.cream:hover,.btn.cream:focus-visible{background:var(--ink);color:#121412}
/* editorial sections */
.sec{padding:96px 0;border-bottom:1px solid var(--rule)}
.sec .wrap{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.sec .pic{aspect-ratio:4/5;max-height:560px;background-size:cover;background-position:center;border-radius:4px;filter:saturate(.85)}
.sec h2{font-size:clamp(28px,3.4vw,46px);line-height:1.15;margin:16px 0 22px;text-wrap:balance}
.sec p{color:var(--ink2);font-size:17.5px;max-width:56ch}.sec p+p{margin-top:16px}
.more{margin-top:44px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.more p{color:var(--ink3);font-size:14px}
.feed.full{padding-top:56px}
/* the number */
.stop{padding:96px 0 88px;border-bottom:1px solid var(--rule);text-align:center}
.stop .eb{justify-content:center}
.stop .intro h2{font-size:clamp(26px,3.2vw,42px);line-height:1.2;margin:18px auto 10px;max-width:22ch;text-wrap:balance}
.stop .intro p{color:var(--ink2);font-size:17px;margin:0 auto 44px}
.stop .numwrap{min-height:clamp(120px,18vw,240px);display:flex;align-items:center;justify-content:center}
.stop .rest{width:clamp(96px,12vw,150px);height:clamp(96px,12vw,150px);border-radius:50%;border:1px solid rgba(201,169,106,.5);display:grid;place-items:center;font-family:Cinzel,serif;font-size:clamp(40px,5vw,64px);color:rgba(201,169,106,.6);animation:breathe 3s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.05);opacity:1}}
.stop .num{font-family:Cinzel,serif;font-size:clamp(96px,16vw,220px);line-height:.95;color:var(--gold);font-variant-numeric:tabular-nums;letter-spacing:-.01em;cursor:pointer;display:none;position:relative;padding:0 .12em .06em;transition:transform .3s}
.stop .num::after{content:"";position:absolute;left:.1em;right:.1em;bottom:0;height:2px;background:var(--gold);opacity:.75;transition:opacity .3s}
.stop[data-state="number"] .num{display:inline-block;animation:pulse 2.2s ease-in-out infinite}
.stop[data-state="open"] .num{display:inline-block;cursor:default}.stop[data-state="open"] .num::after{opacity:.3}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
.stop .num:hover{transform:scale(1.02)}.stop .num:focus-visible{outline:2px solid var(--gold);outline-offset:12px;border-radius:4px}
.stop .lbl{font-size:18px;color:var(--ink2);margin:16px auto 0;max-width:40ch;min-height:1.6em}
.stop .cta{margin-top:30px;display:flex;flex-direction:column;align-items:center;gap:12px;transition:opacity .35s,transform .35s}
.stop .cta .hint{font-size:15px;color:var(--gold);letter-spacing:.02em}
.stop .cta .hint b{font-weight:500;color:var(--ink)}
.stop[data-state="open"] .cta{opacity:0;transform:translateY(-6px);pointer-events:none;height:0;margin:0;overflow:hidden}
.stop .reveal{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s cubic-bezier(.2,.7,.2,1)}
.stop .reveal>div{overflow:hidden;min-height:0}
.stop[data-state="open"] .reveal{grid-template-rows:1fr}
.stop .inner{max-width:720px;margin:0 auto;padding-top:34px;opacity:0;transform:translateY(12px);transition:opacity .5s .25s,transform .5s .25s}
.stop[data-state="open"] .inner{opacity:1;transform:none}
.stop .inner .eb{margin-bottom:14px}
.stop h2{font-size:clamp(26px,3vw,40px);line-height:1.22;margin:0 0 16px;text-wrap:balance}
.stop .inner p{color:var(--ink2);font-size:17px}
.stop .meta{font-size:13px;color:var(--ink3);letter-spacing:.04em;margin-top:14px}
.stop .row{justify-content:center}
.btn{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--gold);color:var(--gold);padding:12px 22px;border-radius:999px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;transition:background .2s,color .2s}
.btn:hover,.btn:focus-visible{background:var(--gold);color:#121412;outline:none}
.btn.ghost{border-color:var(--rule);color:var(--ink2)}.btn.ghost:hover{background:var(--ink);color:#121412;border-color:var(--ink)}
.row{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.key{display:inline-block;border:1px solid currentColor;border-radius:4px;padding:0 7px;font-family:'JetBrains Mono',monospace;font-size:11px;margin:0 2px;opacity:.85}
/* feed */
.feed{padding:72px 0 96px}
.feed .head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:28px}.feed .head .shelfbtn{margin-bottom:10px}
.feed h2{font-size:clamp(48px,6.4vw,88px);line-height:1;margin-top:12px}
.feed h3.sub{font-size:clamp(20px,2.2vw,30px);line-height:1.25;margin-top:16px;color:var(--ink)}
.feed p.desc{color:var(--ink2);font-size:18px;max-width:58ch;margin-top:16px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:28px 0 36px}
.chip{border:1px solid var(--rule);padding:8px 16px;border-radius:999px;font-size:13px;letter-spacing:.06em;color:var(--ink2);transition:all .2s}
.chip b{font-weight:400;font-family:'JetBrains Mono',monospace;font-size:11px;opacity:.6;margin-left:6px}
.chip[aria-pressed=true]{border-color:var(--gold);color:var(--gold)}
.chip:hover{border-color:var(--ink2);color:var(--ink)}
.cards{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.card{position:relative;grid-column:span 4;aspect-ratio:4/5;border-radius:4px;overflow:hidden;background:#000;isolation:isolate;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.card.wide{grid-column:span 8;aspect-ratio:auto}
.card:hover{transform:translateY(-4px)}
.card .img{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s;filter:saturate(.85)}
.card:hover .img{transform:scale(1.05);filter:saturate(1)}
.card .sh{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,20,18,.15) 0%,rgba(18,20,18,0) 30%,rgba(18,20,18,.55) 52%,rgba(18,20,18,.9) 72%,rgba(18,20,18,.97) 100%)}
.card .txt{position:absolute;left:0;right:0;bottom:0;padding:24px}
.card .tag{font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);font-family:Cinzel,serif;margin-bottom:12px;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.card h3{font-size:clamp(20px,1.7vw,26px);line-height:1.22;text-wrap:balance}
.card.wide h3{font-size:clamp(26px,2.8vw,40px);max-width:20ch}
.card .meta{display:flex;gap:14px;font-size:12px;color:var(--ink3);margin-top:14px;letter-spacing:.03em;flex-wrap:wrap}
.card .meta span+span::before{content:"·";margin-right:14px;opacity:.6}
.card a.cover{position:absolute;inset:0;z-index:1}
.save{position:absolute;top:14px;right:14px;z-index:2;width:38px;height:38px;border-radius:50%;background:rgba(18,20,18,.55);border:1px solid rgba(245,244,240,.2);display:grid;place-items:center;transition:all .2s}
.save svg{width:16px;height:16px;fill:none;stroke:var(--ink);stroke-width:1.6}
.save[aria-pressed=true]{background:var(--gold);border-color:var(--gold)}.save[aria-pressed=true] svg{stroke:#121412;fill:#121412}
.save:hover{border-color:var(--gold)}
.empty{grid-column:1/-1;padding:48px;text-align:center;color:var(--ink3);border:1px dashed var(--rule)}
/* shelf drawer */
.drawer{position:fixed;inset:0 0 0 auto;width:min(420px,100%);background:var(--bg2);border-left:1px solid var(--rule);z-index:80;transform:translateX(100%);transition:transform .4s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column}
.drawer[aria-hidden=false]{transform:none}
.drawer header{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--rule)}
.drawer header h2{font-size:16px;letter-spacing:.2em;text-transform:uppercase}
.drawer .x{font-size:22px;line-height:1;opacity:.7;padding:6px}
.drawer ul{list-style:none;overflow:auto;padding:12px 24px;flex:1}
.drawer li{display:grid;grid-template-columns:72px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--rule)}
.drawer li img{width:72px;height:72px;object-fit:cover;border-radius:3px}
.drawer li a{font-family:Cinzel,serif;font-size:15px;line-height:1.3}
.drawer li small{display:block;color:var(--ink3);font-size:12px;margin-top:4px;font-family:Raleway,sans-serif}
.drawer li button{opacity:.5;font-size:18px}.drawer li button:hover{opacity:1}
.drawer .none{padding:40px 0;color:var(--ink3);text-align:center}
.drawer footer{padding:18px 24px;border-top:1px solid var(--rule);font-size:12px;color:var(--ink3);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:70;opacity:0;pointer-events:none;transition:opacity .3s}
.scrim.on{opacity:1;pointer-events:auto}
/* question sphere */
.ask{background:#000;padding:72px 0 88px;border-top:1px solid var(--rule)}
.sphere{position:relative;width:min(680px,92vw);height:min(680px,92vw);margin:0 auto;display:flex;align-items:center;justify-content:center;text-align:center}
.sphere canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.sphere .inner{position:relative;width:min(520px,78vw);display:flex;flex-direction:column;align-items:center;gap:0}
.sphere h2{font-size:clamp(28px,4.2vw,56px);line-height:1.1;margin:0 0 14px;text-wrap:balance}
.sphere h2 span{display:block}
.sphere p.sub{color:var(--ink2);font-size:15.5px;margin:0 0 26px}
.qform{display:flex;flex-direction:column;gap:12px;width:100%;max-width:420px;align-items:stretch}
.qform input{width:100%;background:rgba(0,0,0,.72);border:1px solid rgba(245,244,240,.35);color:var(--ink);padding:15px 20px;border-radius:999px;font:300 16px Raleway,sans-serif;outline:none;transition:border-color .2s;text-align:center}
.qform input::placeholder{color:var(--ink3)}
.qform input:focus{border-color:var(--gold)}
.qform .btn{justify-content:center;white-space:nowrap}
.qnote{margin-top:16px;font-size:13.5px;color:var(--ink3);min-height:1.5em;transition:color .3s}
.qnote.on{color:var(--gold)}
.qnote a{text-decoration:underline}
/* footer */
.foot{border-top:1px solid var(--rule);padding:72px 0 44px;font-size:14px;color:var(--ink3)}
.foot .top{display:grid;grid-template-columns:1.7fr 1fr 1fr;gap:48px;margin-bottom:48px;align-items:start}
.foot .col{padding-top:30px}.foot .brandcol{padding-top:0}
.foot .brand{display:flex;align-items:center;gap:18px}
.foot .brand img{width:120px;height:120px;filter:brightness(0) invert(1)}
.foot .brand span{display:block;font-family:Cinzel,serif;font-size:17px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);line-height:1.5;max-width:9ch}
.foot .social{display:flex;gap:14px;margin:4px 0 16px}
.foot .social a{width:40px;height:40px;border:1px solid var(--rule);border-radius:50%;display:grid;place-items:center;transition:all .2s}
.foot .social svg{width:17px;height:17px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.foot .social a:hover{border-color:var(--gold);background:var(--gold)}.foot .social a:hover svg{stroke:#121412}
.foot .plainlink{color:var(--ink2);font-size:14px}
.foot h4{font-family:Cinzel,serif;font-weight:400;letter-spacing:.2em;text-transform:uppercase;font-size:12px;color:var(--ink2);margin-bottom:14px}
.foot ul{list-style:none;display:grid;gap:8px}.foot a:hover{color:var(--ink)}
.foot p{max-width:46ch;margin-top:16px}
.foot .legal{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;padding-top:18px;border-top:1px solid var(--rule)}
/* post */
.phero{position:relative;min-height:66vh;display:flex;align-items:flex-end;overflow:hidden}
.phero .ph{position:absolute;inset:0;background-size:cover;background-position:center}
.phero .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,20,18,.78) 0%,rgba(18,20,18,.6) 35%,rgba(18,20,18,.88) 70%,#121412 100%)}
.phero .wrap{position:relative;padding:110px 20px 56px;max-width:860px}
.phero h1{font-size:clamp(34px,5.2vw,66px);line-height:1.1;margin:22px 0 22px;text-wrap:balance}
.phero .stand{font-size:20px;color:var(--ink2);max-width:60ch}
.phero .by{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--ink3);margin-top:26px;letter-spacing:.04em}
.phero .by span+span::before{content:"·";margin-right:18px;opacity:.6}
.article{max-width:860px;margin:0 auto;padding:0 20px 80px}
.paper{background:var(--card);color:var(--cardink);padding:clamp(28px,5vw,64px);border-radius:4px;position:relative}
.paper em{color:var(--gold2)}
.paper h2{font-size:clamp(22px,2.4vw,30px);margin:40px 0 14px;color:#1C1C1A}
.paper h2:first-child{margin-top:0}
.paper p{font-size:17.5px;line-height:1.85;color:#2A2A27;margin:0 0 18px;font-weight:300}
.paper p em{color:#1C1C1A;font-style:italic}
.pull-number{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;margin:40px 0;padding:28px 0;border-top:1px solid #E2E0D9;border-bottom:1px solid #E2E0D9}
.pn-big{font-family:Cinzel,serif;font-size:clamp(64px,9vw,120px);line-height:.9;color:var(--gold2)}
.pn-text{font-size:17px;line-height:1.6;color:#2A2A27;max-width:32ch}
.refs{margin-top:40px;padding-top:24px;border-top:1px solid #E2E0D9}
.refs h3{font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold2);margin-bottom:12px}
.refs ol{padding-left:20px;font-size:14px;line-height:1.6;color:#4A4A46}.refs li{margin-bottom:8px}
.tools{position:sticky;top:28px;float:right;margin:-8px -120px 0 0;display:grid;gap:10px}
.tools button{width:44px;height:44px;border-radius:50%;border:1px solid var(--rule);display:grid;place-items:center;background:rgba(18,20,18,.6);transition:all .2s}
.tools button svg{width:17px;height:17px;fill:none;stroke:var(--ink);stroke-width:1.6}
.tools button:hover,.tools button[aria-pressed=true]{border-color:var(--gold);background:var(--gold)}
.tools button:hover svg,.tools button[aria-pressed=true] svg{stroke:#121412}
.tools button[aria-pressed=true] svg{fill:#121412}
.rail{position:fixed;left:0;top:0;bottom:0;width:3px;background:var(--rule);z-index:60}
.rail i{display:block;width:100%;height:var(--p,0%);background:var(--gold);transition:height .1s linear}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--ink);color:#121412;padding:12px 20px;border-radius:999px;font-size:14px;opacity:0;transition:all .3s;z-index:90;pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}
.next{padding:48px 0 96px;border-top:1px solid var(--rule)}
.next h2{font-size:clamp(24px,3vw,36px);margin-bottom:28px}
.next .cards .card{grid-column:span 4}
/* story: social row */
.social-row{padding:56px 0 8px}
.social-row h2{font-size:clamp(24px,3vw,36px);margin:12px 0 8px}
.social-row p{color:var(--ink2);margin-bottom:22px}
.social-row .links{display:flex;gap:12px;flex-wrap:wrap}
.social-row .links a{display:inline-flex;align-items:center;gap:10px;border:1px solid var(--rule);border-radius:999px;padding:11px 18px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;color:var(--ink);transition:all .2s}
.social-row .links a svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.social-row .links a:hover{border-color:var(--gold);background:var(--gold);color:#121412}
.social-row .links .soon{opacity:.45;pointer-events:none}
.paper .lead{font-size:20px;line-height:1.7;color:#1C1C1A;font-weight:400;margin-bottom:22px}
.paper .close{font-family:Cinzel,serif;font-size:clamp(20px,2.2vw,28px);color:#1C1C1A;margin:34px 0 0;line-height:1.3}
/* privacy */
.plain{max-width:820px;margin:0 auto;padding:40px 20px 96px}
.plain h1{font-size:clamp(34px,4.8vw,56px);line-height:1.1;margin:18px 0 12px}
.plain .sub{color:var(--ink3);font-size:14px;margin-bottom:48px}
.plain section{padding:26px 0;border-top:1px solid var(--rule)}
.plain h2{font-size:20px;margin-bottom:10px}
.plain p{color:var(--ink2);max-width:66ch}
@media (max-width:900px){
 .sitetop .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:14px}.sitetop .nl,.sitetop .nr{display:none}.sitetop .menu{display:inline-block;order:3}.sitetop .logo{order:2;margin:0 auto}.sitetop .wrap::before{content:"";order:1;width:92px}.sitetop img{width:150px;height:150px}.sitetop.inner img{width:96px;height:96px}
 .mnav.open{display:flex;flex-direction:column;background:var(--bg2);border-bottom:1px solid var(--rule);padding:8px 20px 16px;position:relative;z-index:41}.mnav a{font-family:Cinzel,serif;font-size:13px;letter-spacing:.2em;text-transform:uppercase;padding:14px 0;border-bottom:1px solid var(--rule)}.mnav a:last-child{border:0}
 .sec .wrap{grid-template-columns:1fr;gap:32px}.sec .pic{aspect-ratio:16/10;max-height:none}.sec.alt .pic{order:-1}
 .foot .brand img{width:96px;height:96px}.foot .col{padding-top:0}
 .stop .grid{grid-template-columns:1fr;gap:28px}
 .card,.card.wide{grid-column:span 6}.card.wide{aspect-ratio:4/5}
 .foot .top{grid-template-columns:1fr;gap:28px}
 .tools{position:static;float:none;margin:0 0 20px;display:flex}
 .rail{top:0;bottom:auto;left:0;right:0;height:3px;width:auto}.rail i{height:100%;width:var(--p,0%);transition:width .1s linear}
}
@media (max-width:560px){
 .card,.card.wide{grid-column:1/-1;aspect-ratio:4/5}
 .hero .wrap{padding-top:170px;padding-bottom:90px}.hero h1 .l1{font-size:11vw}.hero h1 .l2{font-size:7.4vw}.hero .pull{font-size:16px}.hero .row .btn{width:100%;justify-content:center}.sphere{width:100vw;height:100vw;max-width:none}.sphere .inner{width:84vw}.qform .btn{white-space:normal}
 .pull-number{grid-template-columns:1fr;gap:10px}
 .shelfbtn span{display:none}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.stop .rest,.stop .num{animation:none}}


/* ===== r5 (2026-10-06) ===== */
/* header as a bar, like crescentbioresearch.com; logo larger */
.sitetop{position:static;background:var(--bg);border-bottom:1px solid var(--rule)}
.sitetop .wrap{padding:12px 20px 10px}
.sitetop img{width:250px;height:250px;filter:brightness(0) invert(1)}
.sitetop ul a{text-shadow:none}
.sitetop.inner img{width:120px;height:120px}
.hero{min-height:calc(100vh - 272px)}
.hero .wrap{padding:120px 20px 96px}
.hero .shade{background:radial-gradient(60% 60% at 50% 50%,rgba(18,20,18,.2),rgba(18,20,18,.55) 70%,rgba(18,20,18,.85)),linear-gradient(180deg,rgba(18,20,18,.65) 0%,rgba(18,20,18,0) 28%,rgba(18,20,18,0) 65%,#121412 100%)}
/* smaller pull copy, tighter buttons */
.hero .pull{font-size:clamp(14px,1.05vw,16.5px);line-height:1.7;color:var(--ink2)}
.hero .band{margin-top:clamp(48px,8vh,96px)}
.hero .row{margin-top:26px;gap:12px}
.btn.big{min-width:220px;padding:11px 28px;font-size:12.5px;letter-spacing:.16em;border-width:1.5px;line-height:1.2}
/* who is crescent: large subtitle, smaller sub-sub */
.sec h2.who{font-size:clamp(34px,4.2vw,58px);line-height:1.08;margin:0 0 10px}
.sec h3.subsub{font-family:Cinzel,serif;font-weight:400;font-size:clamp(17px,1.5vw,21px);line-height:1.35;color:var(--gold);margin:0 0 22px;letter-spacing:.02em}
.creed{margin:22px 0 0;padding:18px 0 0 22px;border-left:1px solid rgba(201,169,106,.55);font-family:Cinzel,serif;font-size:clamp(17px,1.45vw,21px);line-height:1.5;color:var(--ink);max-width:30em}
/* the number: distinct, interaction shown by design */
.stop{padding:120px 0 110px;background:radial-gradient(60% 50% at 50% 42%,rgba(201,169,106,.08),rgba(18,20,18,0) 70%)}
.stop .intro h2{font-size:clamp(34px,4.6vw,66px);line-height:1.08;margin:0 auto 14px;max-width:16ch}
.stop .intro p{font-size:16px;color:var(--ink3);margin-bottom:40px}
.stop .numwrap{min-height:clamp(200px,24vw,300px)}
.stop .rest{position:relative;width:clamp(150px,17vw,220px);height:clamp(150px,17vw,220px);border:0;background:none;display:grid;place-items:center;cursor:pointer;animation:none;padding:0;color:var(--gold)}
.stop .rest .q{position:relative;z-index:2;font-family:Cinzel,serif;font-size:clamp(56px,6.4vw,84px);line-height:1;color:var(--gold);text-shadow:0 0 28px rgba(201,169,106,.45);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.stop .rest::before{content:"";position:absolute;inset:14%;border-radius:50%;background:radial-gradient(circle,rgba(201,169,106,.22),rgba(201,169,106,0) 70%);transition:transform .4s}
.stop .rest .ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(201,169,106,.6);animation:radar 2.8s ease-out infinite}
.stop .rest .ring.r2{animation-delay:1.4s}
@keyframes radar{0%{transform:scale(.55);opacity:0}20%{opacity:.9}100%{transform:scale(1.15);opacity:0}}
.stop .rest .orbit{position:absolute;inset:10%;border-radius:50%;border:1px dashed rgba(201,169,106,.5);animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.stop .rest:hover .q,.stop .rest:focus-visible .q{transform:scale(1.12)}
.stop .rest:hover::before{transform:scale(1.25)}
.stop .rest:hover .orbit{border-color:var(--gold);animation-duration:6s}
.stop .rest:focus-visible{outline:2px solid var(--gold);outline-offset:10px;border-radius:50%}
.stop .num{text-shadow:0 0 40px rgba(201,169,106,.35)}
.stop[data-state="number"] .num{animation:pulse 2.2s ease-in-out infinite,glow 2.2s ease-in-out infinite}
@keyframes glow{0%,100%{text-shadow:0 0 30px rgba(201,169,106,.25)}50%{text-shadow:0 0 60px rgba(201,169,106,.6)}}
.stop .cta{margin-top:18px;gap:0}
.stop .again{display:none;width:54px;height:54px;border-radius:50%;border:1px solid rgba(201,169,106,.6);position:relative;transition:all .25s}
.stop .again .chev{position:absolute;left:50%;top:44%;width:12px;height:12px;border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);transform:translate(-50%,-50%) rotate(45deg);animation:nudge 1.6s ease-in-out infinite}
@keyframes nudge{0%,100%{top:42%}50%{top:52%}}
.stop[data-state="number"] .again{display:inline-block}
.stop .again:hover{background:var(--gold)}.stop .again:hover .chev{border-color:#121412}
.stop .lbl{font-size:17px}
/* footer: tighter, bigger logo set slightly high, 2x2 series buttons */
.foot{padding:40px 0 22px}
.foot .top{grid-template-columns:1.2fr 1fr 1fr;gap:40px;margin-bottom:26px;align-items:start}
.foot .col{padding-top:24px}
.foot .brandcol{padding-top:0;margin-top:-14px}
.foot .brand img{width:170px;height:170px}
.foot .brand span,.foot .brandcol p{display:none}
.foot ul.grid4{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:360px}
.foot ul.grid4 a{display:block;border:1px solid var(--rule);border-radius:999px;padding:8px 14px;font-size:12.5px;letter-spacing:.06em;text-align:center;color:var(--ink2);transition:all .2s;white-space:nowrap}
.foot ul.grid4 a:hover{border-color:var(--gold);color:var(--gold)}
.foot .social{margin:2px 0 12px}
.foot .legal{padding-top:14px}
@media (max-width:900px){.sitetop img{width:150px;height:150px}.hero{min-height:auto}.hero .wrap{padding:90px 20px 80px}.foot .brandcol{margin-top:0}.foot .brand img{width:120px;height:120px}}


/* ===== r6 (2026-10-06) ===== */
/* header sits over the eye again, as a translucent bar; tighter top */
.sitetop{position:absolute;top:0;left:0;right:0;background:linear-gradient(180deg,rgba(18,20,18,.82) 0%,rgba(18,20,18,.55) 60%,rgba(18,20,18,0) 100%);border-bottom:0}
.sitetop .wrap{padding:8px 20px 0}
.sitetop img{width:230px;height:230px}
.sitetop ul a{text-shadow:0 1px 14px rgba(0,0,0,.6)}
.sitetop.inner{position:static;background:var(--bg);border-bottom:1px solid var(--rule)}
.sitetop.inner .wrap{padding:16px 20px}
.hero{min-height:100vh}
.hero .wrap{padding:196px 20px 96px}
.hero h1{margin-bottom:22px}
.hero .band{margin-top:clamp(28px,5vh,56px);transform:none!important;transition:none}
/* the eye zooms slowly, always, regardless of motion settings (requested) */
.hero .ph{animation:burns2 28s ease-in-out infinite alternate!important;transform-origin:50% 42%}
@keyframes burns2{from{transform:scale(1)}to{transform:scale(1.14)}}
/* step hints for the number: one line, device-specific */
.stop .cta{gap:14px}
.stop .hint{font-family:Cinzel,serif;font-size:11.5px;letter-spacing:.34em;text-transform:uppercase;color:rgba(201,169,106,.75);margin:0}
.stop .hint .touch{display:none}
@media (hover:none) and (pointer:coarse){.stop .hint .desk{display:none}.stop .hint .touch{display:inline}}
.stop[data-state="open"] .hint{display:none}
/* footer: no pills; one line of links; address beside the logo */
.foot .top{grid-template-columns:1.6fr 1.2fr .8fr;gap:40px}
.foot .brandcol{display:flex;align-items:center;gap:22px;margin-top:-10px}
.foot .brand img{width:150px;height:150px}
.foot .addr{font-style:normal;font-size:13.5px;line-height:1.75;color:var(--ink2)}
.foot .addr a{color:var(--ink2)}.foot .addr a:hover{color:var(--ink)}
.foot ul.grid4{display:none}
.foot ul.line{display:flex;flex-wrap:wrap;gap:4px 0;max-width:none}
.foot ul.line li{font-size:13.5px;color:var(--ink2);white-space:nowrap}
.foot ul.line li+li::before{content:"·";margin:0 10px;opacity:.5}
.foot ul.line a:hover{color:var(--gold)}
@media (max-width:900px){.sitetop{background:linear-gradient(180deg,rgba(18,20,18,.85),rgba(18,20,18,0))}.hero .wrap{padding:150px 20px 80px}.foot .brandcol{flex-direction:column;align-items:flex-start;gap:10px;margin-top:0}.foot .brand img{width:110px;height:110px}}

/* r7: two-line header on desktop */
@media (min-width:900px){.stop .intro h2{max-width:none}.stop .intro h2 span{display:block}}


/* ===== r8 (2026-10-06) ===== */
/* footer: fixed four-cell grid with vertical rules, hard-baked for 1280px and up */
.foot{padding:44px 0 18px}
.foot .ftop{display:grid;grid-template-columns:200px .9fr 1.7fr .85fr;align-items:center;margin-bottom:36px}
.foot .fcell{padding:6px 28px;border-left:1px solid var(--rule);min-width:0}
.foot .fcell:first-child{border-left:0;padding-left:0}
.foot .flogo .brand img{width:150px;height:150px;filter:brightness(0) invert(1)}
.foot h4{margin-bottom:10px}
.foot address{font-style:normal;font-size:13.5px;line-height:1.8;color:var(--ink2)}
.foot address a{color:var(--ink2)}.foot address a:hover{color:var(--ink)}
.foot ul.line{display:flex;flex-wrap:wrap;gap:4px 0;max-width:none;font-size:13.5px}
.foot ul.line li{white-space:nowrap;color:var(--ink2)}.foot ul.line li+li::before{content:"·";margin:0 10px;opacity:.5}
.foot .fsoc .social{display:flex;gap:12px;flex-wrap:nowrap;margin:0 0 6px}
.foot .fsoc .social a{width:38px;height:38px;flex:0 0 38px}
.foot .legal{padding-top:18px;margin-top:0}
.foot .brandcol,.foot .top{display:none}
/* crawler connections: present, readable by machines, visually recessive */
.crawl{margin-top:22px;padding-top:10px;border-top:1px solid rgba(245,244,240,.05)}
.crawl p{margin:0;font-size:10.5px;line-height:1.7;color:rgba(245,244,240,.14);max-width:none}
.crawl a{color:inherit;text-decoration:none}.crawl a:hover{color:var(--ink3)}
/* about + crescent as full-bleed photo bands with a glass card (variation B) */
.sec.band{padding:0;border:0;position:relative;min-height:78vh;display:flex;align-items:center;overflow:hidden}
.sec.band .wrap{display:block;position:static;width:100%}
.sec.band .pic{position:absolute;inset:0;aspect-ratio:auto;max-height:none;border-radius:0;filter:saturate(.7) brightness(.55);z-index:0}
.sec.band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,20,18,.85) 0%,rgba(18,20,18,.35) 55%,rgba(18,20,18,.15) 100%);z-index:1}
.sec.band.alt::after{background:linear-gradient(270deg,rgba(18,20,18,.85) 0%,rgba(18,20,18,.35) 55%,rgba(18,20,18,.15) 100%)}
.sec.band .txt{position:relative;z-index:2;max-width:560px;background:rgba(18,20,18,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(245,244,240,.12);padding:40px 44px;border-radius:6px;margin:90px 0}
.sec.band.alt .txt{margin-left:auto}
.sec.band .piclogo{position:absolute;right:7%;top:50%;transform:translateY(-50%);width:min(34vw,420px);height:auto;filter:brightness(0) invert(1);opacity:.85;z-index:1;pointer-events:none}
.sec.band.alt .piclogo{right:auto;left:7%}
#about h2{white-space:nowrap;font-size:clamp(26px,3.1vw,48px)}
/* follow row under See all discoveries */
.feedsoc{display:flex;gap:28px;flex-wrap:wrap;justify-content:center;margin-top:26px;padding-top:22px;border-top:1px solid var(--rule);width:100%}
.feedsoc a{display:inline-flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.06em;color:var(--ink2);transition:color .2s}
.feedsoc a svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.feedsoc a:hover{color:var(--gold)}
@media (max-width:1100px){.foot .ftop{grid-template-columns:1fr 1fr;row-gap:24px}.foot .fcell{border-left:0;padding:0}.foot .fcell:nth-child(even){border-left:1px solid var(--rule);padding-left:24px}}
@media (max-width:900px){.sec.band{min-height:auto}.sec.band .txt{margin:60px 0;padding:28px 24px}.sec.band::after,.sec.band.alt::after{background:rgba(18,20,18,.6)}.sec.band .piclogo{width:40vw;top:12%;transform:none;opacity:.5}#about h2{white-space:normal}}
@media (max-width:600px){.foot .ftop{grid-template-columns:1fr}.foot .fcell:nth-child(even){border-left:0;padding-left:0}}
/* r11 (2026-10-06): About heading box wide enough for the one-line title; mobile footer centred; crawler block near-invisible on mobile */
#about .txt{max-width:820px}
#about h2{font-size:clamp(26px,3vw,46px)}
@media (max-width:1100px){#about .txt{max-width:720px}}
@media (max-width:600px){
  .foot .ftop{grid-template-columns:1fr;justify-items:center;text-align:center;row-gap:26px}
  .foot .fcell{padding:0;width:100%;display:flex;flex-direction:column;align-items:center;text-align:center}
  .foot .flogo .brand{justify-content:center}
  .foot .faddr p,.foot .faddr li,.foot .fseries li,.foot .fsoc p{text-align:center}
  .foot .fseries ul.line{justify-content:center}
  .foot .fsoc .social{justify-content:center}
  .foot .legal{justify-content:center;text-align:center;flex-direction:column;gap:6px;align-items:center}
  .crawl p{color:rgba(245,244,240,.035)}
  .crawl a:hover{color:inherit}
}
/* r12: crawler block sits one step off the page tone on mobile; present in the HTML, not on the screen */
@media (max-width:600px){.crawl{border-top-color:transparent}.crawl p,.crawl a{color:#151715}.crawl a:hover{color:#151715}}
/* r13: story closing line in the body face (rule 2026-10-04), no orphaned last word */
.paper .close{font-family:Raleway,sans-serif;font-weight:400;font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:#1C1C1A;margin:34px 0 0;text-wrap:balance;max-width:52ch}
/* r14: the Crescent quote in the body face */
.creed{font-family:Raleway,sans-serif;font-weight:300;font-style:italic;font-size:clamp(17px,1.4vw,20px);line-height:1.6;letter-spacing:.01em}

/* r15 (2026-10-06): masthead header (Header 1 without the strip), hamburger + centred logo on phones, Q2 quote, white embedded logo, footer rebuilt */
.sitetop.hv1{position:static;background:var(--bg);border-bottom:0}.sitetop.hv1 .wrap{display:block;padding:0}.sitetop.hv1 img{filter:brightness(0) invert(1)}
.hv1 .mast .wrap{text-align:center;padding:26px 20px 18px;position:relative}.hv1 .mast img{width:92px;height:92px;display:block;margin:0 auto 10px}
.hv1 .wm{display:block;font:500 34px/1.1 'Cormorant Garamond',serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}.hv1 .tl{margin:10px 0 0;font:italic 400 16px/1.3 'Cormorant Garamond',serif;color:var(--ink3)}
.hv1 nav.row{display:flex;justify-content:center;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:12px 20px}.hv1 ul{list-style:none;display:flex;gap:34px;margin:0;padding:0}.hv1 .nl{margin-right:34px}
.hv1 ul a{font:500 11.5px/1 Inter,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--ink2);text-shadow:none}.hv1 ul a::after{display:none}.hv1 ul a:hover{color:var(--gold)}
.hv1 .ham{display:none;position:absolute;left:16px;top:18px;z-index:45;width:40px;height:36px;border:0;background:transparent;padding:6px;flex-direction:column;justify-content:space-between;cursor:pointer;border-radius:0}
.hv1 .ham span{display:block;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s,opacity .2s}
.hv1 .ham[aria-expanded="true"] span:nth-child(1){transform:translateY(11px) rotate(45deg)}.hv1 .ham[aria-expanded="true"] span:nth-child(2){opacity:0}.hv1 .ham[aria-expanded="true"] span:nth-child(3){transform:translateY(-11px) rotate(-45deg)}
.hero .wrap{padding-top:72px}
@media(max-width:900px){
  .sitetop.hv1{position:absolute;top:0;left:0;right:0;background:linear-gradient(180deg,rgba(18,20,18,.55),rgba(18,20,18,0));z-index:40}
  .hv1 .mast .wrap{padding:14px 20px 0}.hv1 .mast img{width:168px;height:168px;margin:0 auto;filter:brightness(0) invert(1) drop-shadow(0 2px 18px rgba(0,0,0,.35))}
  .hv1 .wm,.hv1 .tl,.hv1 nav.row{display:none}
  .hv1 .ham{display:flex}.sitetop.inner.hv1 .ham span{background:var(--ink)}
  .hv1 .mnav.open{position:absolute;left:0;right:0;top:100%;z-index:41}
  .hero .wrap{padding-top:170px}
}
.sitetop.inner.hv1 .mast img{width:92px;height:92px}
/* who is crescent: framed-plate quote, no side rule; logo white and centred in the photograph */
.creed.q2{border:1px solid rgba(201,169,106,.55);outline:1px solid rgba(201,169,106,.25);outline-offset:4px;padding:26px 28px 22px;margin:30px 2px 4px;text-align:center;max-width:none;background:rgba(201,169,106,.04);border-left:1px solid rgba(201,169,106,.55)}
.creed.q2 p{margin:0;font:italic 300 20px/1.55 Raleway,sans-serif;color:var(--ink);text-wrap:balance}
.creed.q2 footer{margin-top:14px;font:500 10.5px/1 Raleway,sans-serif;letter-spacing:.32em;text-transform:uppercase;color:var(--gold)}.creed.q2 footer::before{content:'';display:block;width:34px;height:1px;background:var(--gold);margin:0 auto 12px}
.sec.band.alt .piclogo{left:0;right:auto;width:min(26vw,340px);top:50%;transform:translateY(-50%);opacity:1;filter:brightness(0) invert(1);margin-left:calc(25% - min(13vw,170px))}
@media(max-width:900px){.sec.band.alt .piclogo{display:block;left:50%;transform:translateX(-50%);top:14px;width:30vw;opacity:1}.sec.band .txt{margin-top:calc(30vw + 40px)}}
/* footer: logo (centred on phones) with the social links under it; address left, phone + site right */
.foot .ftop,.foot .top{display:none}
.foot .ftop2{display:flex;justify-content:flex-start;margin-bottom:34px}.foot .fbrand{display:flex;flex-direction:column;align-items:flex-start;gap:14px}.foot .fbrand .brand img{width:150px;height:150px;filter:brightness(0) invert(1)}
.foot .fbrand .social{display:flex;gap:12px;margin:0}.foot .fbrand .social a{width:38px;height:38px;flex:0 0 38px}.foot .fbrand .social .xlogo{fill:currentColor}
.foot .fbottom{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:22px 0 20px;border-top:1px solid var(--rule)}
.foot .fbottom .addr{font-style:normal;font-size:14px;line-height:1.7;color:var(--ink2)}.foot .fbottom .reach{text-align:right;font-size:14px;line-height:1.7}.foot .fbottom .reach a{color:var(--ink)}
@media(max-width:600px){.foot .ftop2{justify-content:center}.foot .fbrand{align-items:center}.foot .fbrand .brand img{width:150px;height:150px}.foot .fbottom{align-items:flex-start}}

.touchdev .stop .hint .desk{display:none}.touchdev .stop .hint .touch{display:inline}
/* r15b: masthead nav row on one line */
.sitetop.hv1 nav.row{display:flex;justify-content:center;align-items:center;gap:34px;padding:12px 20px}.sitetop.hv1 ul.nl,.sitetop.hv1 ul.nr{justify-content:center;margin:0;flex:0 0 auto}
@media(max-width:900px){.sitetop.hv1 nav.row{display:none}}
/* r16: the embedded logo sits above the band shade on every viewport, pure white */
.sec.band .piclogo,.sec.band.alt .piclogo{z-index:2;opacity:1;filter:brightness(0) invert(1)}
/* r17: About heading back on two lines */
#about h2{white-space:normal;font-size:clamp(28px,3.4vw,46px);max-width:11em}
#about .txt{max-width:560px}

/* r19: desktop masthead without the logo, bigger wordmark; logo in the hero; main-site hamburger lines; About as two boxes on phones; footer rebuilt */
.hv1 .mast img{display:none}.hv1 .wm{font-size:48px;letter-spacing:.16em}.hv1 .mast .wrap{padding:30px 20px 20px}
.hero .herologo{display:block;width:150px;height:150px;margin:0 auto 22px;filter:brightness(0) invert(1) drop-shadow(0 2px 18px rgba(0,0,0,.35))}
.hero .wrap{padding-top:64px}
@media(max-width:900px){.hv1 .mast img{display:block}.hero .herologo{display:none}.hero .wrap{padding-top:170px}}
.hv1 .ham{left:20px;top:76px;width:50px;height:30px;padding:0}.hv1 .ham span{height:1.5px}
.hv1 .ham[aria-expanded="true"] span:nth-child(1){transform:translateY(14px) rotate(45deg)}.hv1 .ham[aria-expanded="true"] span:nth-child(3){transform:translateY(-14px) rotate(-45deg)}
#about .txt .box{display:contents}
@media(max-width:900px){
  #about .txt{background:none;border:0;padding:0;backdrop-filter:none;-webkit-backdrop-filter:none;margin:60px 0}
  #about .txt .box{display:block;background:rgba(18,20,18,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(245,244,240,.12);padding:28px 24px;border-radius:6px}
  #about .txt .box+.box{margin-top:14px}#about .txt .box p:last-child{margin-bottom:0}
  #crescent h2.who{text-align:center}
}
.foot .ftop2,.foot .legal{display:none}
.foot .fhead{display:flex;flex-direction:column;align-items:flex-start;gap:18px;margin-bottom:30px}.foot .fhead .brand img{width:150px;height:150px;filter:brightness(0) invert(1)}
.foot .handles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,auto));gap:10px 40px}
.foot .handles a{display:flex;align-items:center;gap:12px;color:var(--ink2);font-size:14px}.foot .handles a:hover{color:var(--ink)}
.foot .handles svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;flex:0 0 18px}.foot .handles .xlogo{fill:currentColor;stroke:none}
.foot .handles .pf{font-family:Cinzel,serif;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);min-width:92px}.foot .handles .hd{letter-spacing:.02em}
.foot .flegal{margin:6px 0 0;display:flex;gap:22px;font-size:12px;letter-spacing:.2em;text-transform:uppercase}.foot .flegal a{color:var(--ink3)}.foot .flegal a:hover{color:var(--ink)}
.foot .fbottom{border-top:0;padding:10px 0 18px}
.foot .copy{margin:0;font-size:12px;color:var(--ink3);padding-top:16px;border-top:1px solid var(--rule)}
@media(max-width:600px){.foot .fhead{align-items:center;text-align:center}.foot .handles{grid-template-columns:1fr;justify-items:center}.foot .handles .pf{min-width:0}.foot .flegal{justify-content:center}.foot .copy{text-align:center}}
/* r20: hamburger matched to crescentbioresearch.com as seen on the phone: 26px wide, three 1.5px lines, 9px apart, level with the logo's centre */
.hv1 .ham{left:20px;top:88px;width:26px;height:21px;padding:0;gap:0}
.hv1 .ham span{height:1.5px;border-radius:0}
.hv1 .ham[aria-expanded="true"] span:nth-child(1){transform:translateY(9.75px) rotate(45deg)}.hv1 .ham[aria-expanded="true"] span:nth-child(3){transform:translateY(-9.75px) rotate(-45deg)}
/* r21: desktop footer laid out like /discover: everything centred, handles in one row, address left and phone/site right beneath */
@media(min-width:601px){
  .foot .fhead{align-items:center;text-align:center;gap:22px}
  .foot .handles{display:flex;justify-content:center;gap:0}
  .foot .handles li{padding:0 34px;border-left:1px solid var(--rule)}.foot .handles li:first-child{border-left:0}
  .foot .handles a{flex-direction:column;gap:8px}.foot .handles .pf{min-width:0}.foot .handles svg{width:20px;height:20px}
  .foot .flegal{justify-content:center;margin-top:4px}
  .foot .fbottom{padding:26px 0 18px;margin-top:10px;border-top:1px solid var(--rule)}
  .foot .copy{text-align:center}
}

/* 10-07 Ashiq: masthead logo on top (bigger), wordmark + tagline moved under the bar; citation rule lines off; socials as circled icons beside Discoveries; What we do eyebrow spacing; gold wondered in Ask; one-line footer */
.hv1 .mast img{display:block;width:200px;height:200px;margin:0 auto 4px}
.hv1 .mast .wrap{padding:22px 20px 14px}
.hero .herologo{display:none}
.wmblock{text-align:center;margin:0 auto}
.wmblock .wm{display:block;font:500 40px/1.1 'Cormorant Garamond',serif;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);text-shadow:0 1px 14px rgba(0,0,0,.5)}
.wmblock .tl{margin:10px 0 0;font:italic 400 16px/1.3 'Cormorant Garamond',serif;color:var(--ink2)}
.hero .wmblock{margin-bottom:34px}
body>.wmblock,main>.wmblock{padding:26px 20px 6px}
.stop .inner .eb::before,.stop .inner .eb::after{display:none}
.stop .inner .eb{justify-content:center}
#crescent .txt .eb{margin-bottom:26px}
.ask h2 em{font-style:italic;color:var(--gold)}
.h2row{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.headsoc{list-style:none;margin:14px 0 0;padding:0;display:flex;gap:10px}
.headsoc a{width:38px;height:38px;border:1px solid var(--rule);border-radius:50%;display:grid;place-items:center;color:var(--ink2);transition:all .2s}
.headsoc svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.headsoc .xlogo{fill:currentColor;stroke:none}
.headsoc a:hover{border-color:var(--gold);color:var(--gold)}
.foot.f2{padding:30px 0 16px}
.foot.f2 .frow{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-bottom:22px;border-bottom:1px solid var(--rule)}
.foot.f2 .fl{display:flex;align-items:center;gap:22px}.foot.f2 .fl .brand img{width:84px;height:84px;filter:brightness(0) invert(1)}
.foot.f2 .fsoc{list-style:none;margin:0;padding:0;display:flex;gap:10px}
.foot.f2 .fsoc a{width:38px;height:38px;border:1px solid var(--rule);border-radius:50%;display:grid;place-items:center;color:var(--ink2);transition:all .2s}.foot.f2 .fsoc a:hover{border-color:var(--gold);color:var(--gold)}
.foot.f2 .fsoc svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.foot.f2 .fsoc .xlogo{fill:currentColor;stroke:none}
.foot.f2 .fr{text-align:right}.foot.f2 .addr{font-style:normal;font-size:13.5px;line-height:1.7;color:var(--ink2);margin:0}.foot.f2 .addr a{color:var(--ink2)}
.foot.f2 .flegal{margin:8px 0 0;display:flex;justify-content:flex-end;gap:18px;font-size:11px;letter-spacing:.2em;text-transform:uppercase}.foot.f2 .flegal a{color:var(--ink3)}.foot.f2 .flegal a:hover{color:var(--ink)}
.foot.f2 .copy{margin:0;padding:14px 0 0;font-size:12px;color:var(--ink3);border-top:0;text-align:left}
.foot.f2 .crawl{margin-top:14px}
@media(max-width:900px){.wmblock,.hero .wmblock{display:none}.hv1 .mast img{width:168px;height:168px}.h2row{gap:16px}.headsoc{margin-top:8px}.headsoc a{width:34px;height:34px}
.foot.f2 .frow{flex-direction:column;align-items:center;text-align:center;gap:18px;padding-bottom:18px}.foot.f2 .fl{flex-direction:column;gap:14px}.foot.f2 .fl .brand img{width:96px;height:96px}
.foot.f2 .fr{text-align:center}.foot.f2 .flegal{justify-content:center}.foot.f2 .copy{text-align:center}}

/* 10-07 b (Ashiq, mobile pass): wordmark under the logo in the mast; "The number" eyebrow off; eyebrow + icons row on the feed; About boxes scaled + layered; What we do centred; mission tightened; footer condensed Gmail-style */
.wmm{display:none}
@media(max-width:900px){
.hv1 .mast .wrap{padding:4px 20px 0}.hv1 .mast img{width:160px;height:160px;margin:0 auto}
.wmm{display:block;text-align:center;margin:-6px 0 6px}.wmm .wm{display:block;font:500 21px/1.15 'Cormorant Garamond',serif;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);text-shadow:0 1px 14px rgba(0,0,0,.5)}.wmm .tl{margin:5px 0 0;font:italic 400 13px/1.3 'Cormorant Garamond',serif;color:var(--ink2)}
.hv1 .ham{top:72px}
.hero .wrap{padding-top:232px}
.stop .intro .num-eb{display:none}.stop .intro h2{margin-top:0}
.feed .head>div{display:flex;flex-direction:column}
.feed .head .eb.l{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:6px}
.feed .head .h2row{display:block}.feed .head .h2row h2{margin-top:0}
.feed .head .headsoc{position:absolute;right:20px;margin:0}
.feed .head{position:relative}.feed .head .eb.l{min-height:34px}
#about .txt{margin:40px 0}
#about .txt .box{width:78%;padding:20px 18px;border-radius:5px}
#about .txt .box:first-child{margin-right:auto}
#about .txt .box+.box{margin:-14px 0 0 auto;position:relative;z-index:2}
#about .txt .box h2{font-size:24px;line-height:1.1;margin-bottom:8px}#about .txt .box .eb{font-size:10.5px}#about .txt .box p{font-size:14px;line-height:1.55}
#about.sec.band .pic{filter:saturate(.7) brightness(.55)}
#crescent .txt{text-align:center}#crescent .txt .eb{justify-content:center;margin-bottom:14px}#crescent h2.who{margin-bottom:22px}
#crescent .txt>p{text-align:center}#crescent .creed.q2{text-align:left}#crescent .creed.q2 p{text-align:left;text-wrap:pretty}#crescent .creed.q2 footer{text-align:left}#crescent .creed.q2 footer::before{margin-left:0}
#mission{padding-bottom:40px}#mission .pic{margin-bottom:0}
.foot.f2{padding:22px 0 10px}
.foot.f2 .frow{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"brand addr" "soc soc" "legal legal";align-items:center;column-gap:18px;row-gap:14px;padding-bottom:14px;text-align:left}
.foot.f2 .fl,.foot.f2 .fr{display:contents}
.foot.f2 .fl .brand{grid-area:brand;display:block;padding-right:18px;border-right:1px solid var(--rule)}.foot.f2 .fl .brand img{width:78px;height:78px;display:block}
.foot.f2 .addr{grid-area:addr;text-align:left;font-size:13px;line-height:1.6}
.foot.f2 .fsoc{grid-area:soc;justify-content:center}.foot.f2 .fsoc a{width:34px;height:34px}
.foot.f2 .flegal{grid-area:legal;justify-content:center;margin:0}
.foot.f2 .copy{padding-top:10px;font-size:11.5px}
.foot.f2 .crawl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);margin:0;padding:0;border:0}
}

@media(max-width:900px){
.hv1 .mast .wmm .wm{font-size:18px;letter-spacing:.11em;white-space:nowrap}
.hv1 .mast .wmm .tl{display:block;margin-top:4px;font:italic 400 13px/1.3 'Cormorant Garamond',serif;color:var(--ink2)}
.feed .head .headsoc{top:-4px}
.foot.f2 .addr .brk{display:block;height:0}
}

/* 10-07 c (Ashiq, desktop): nav bar tight under the logo, wordmark + tagline directly under the bar; number eyebrow lines off; footer: logo | rule | address left, icons + Privacy/Terms right, copyright + crawler centred */
@media(min-width:901px){
.hv1 .mast .wrap{padding:16px 20px 6px}.hv1 .mast img{width:190px;height:190px;margin:0 auto}
.sitetop.hv1 nav.row{padding:10px 20px}
body>.wmblock{padding:18px 20px 0}
.hero .wrap{padding-top:70px}
.stop .intro .num-eb::before,.stop .intro .num-eb::after{display:none}
.foot.f2{padding:30px 0 14px}
.foot.f2 .frow{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"brand addr soc" "brand addr legal";align-items:center;column-gap:22px;row-gap:10px;padding-bottom:18px}
.foot.f2 .fl,.foot.f2 .fr{display:contents}
.foot.f2 .fl .brand{grid-area:brand;display:block;padding-right:22px;border-right:1px solid var(--rule)}.foot.f2 .fl .brand img{width:104px;height:104px;display:block}
.foot.f2 .addr{grid-area:addr;text-align:left;font-size:13.5px;line-height:1.7}.foot.f2 .addr .brk{display:block;height:0}
.foot.f2 .fsoc{grid-area:soc;justify-content:flex-end;align-self:end}
.foot.f2 .flegal{grid-area:legal;justify-content:flex-end;margin:0;align-self:start}
.foot.f2 .copy{text-align:center;padding-top:12px}
.foot.f2 .crawl p{text-align:center}
}

.foot.f2 .copy{max-width:none;margin-left:auto;margin-right:auto}

/* 10-07 d (Ashiq, desktop): wordmark back in the hero (higher), mast tighter, nav rules full-bleed, hero pills larger with gold shade + inner hairline, number eyebrow off, feed eyebrow row with icons then Discoveries, feed bottom = about gap, footer logo larger with matching rule */
.stop .intro .num-eb{display:none}
.feed .head>div{flex:1 1 auto}
.ebrow{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:10px}.ebrow .eb{margin:0}.ebrow .headsoc{margin:0}
.feed .head .h2row{display:block}.feed h2{margin-top:0}
.hero .btn.big.solid{background:linear-gradient(180deg,#D6B97C 0%,#C9A96A 55%,#B8975A 100%);border-color:#B8975A;color:#121412;box-shadow:inset 0 0 0 2px #B8975A,inset 0 0 0 3px rgba(255,248,230,.55),0 10px 26px rgba(201,169,106,.26)}
.hero .btn.big.solid:hover{background:var(--ink);border-color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 3px rgba(201,169,106,.6),0 10px 26px rgba(201,169,106,.26)}
.hero .btn.big.cream{border-color:var(--gold);color:var(--ink);background:rgba(201,169,106,.12);box-shadow:inset 0 0 0 3px rgba(0,0,0,0),inset 0 0 0 4px var(--gold),0 10px 26px rgba(201,169,106,.22)}
.hero .btn.big.cream:hover,.hero .btn.big.cream:focus-visible{background:var(--gold);color:#121412;box-shadow:inset 0 0 0 3px var(--gold),inset 0 0 0 4px rgba(18,20,18,.55),0 10px 26px rgba(201,169,106,.3)}
@media(min-width:901px){
.hv1 .mast .wrap{padding:10px 20px 2px}.hv1 .mast img{width:190px;height:190px}
.sitetop.hv1 nav.row{max-width:none;width:100%}
body>.wmblock{display:none}
.hero .wrap{padding-top:44px}.hero .wmblock{display:block;margin:0 auto 30px}
.hero .btn.big{min-width:272px;padding:19px 38px;font-size:14.5px}
.feed{padding-bottom:86px}
.foot.f2 .frow{column-gap:18px}
.foot.f2 .fl .brand{position:relative;border-right:0;padding-right:16px}.foot.f2 .fl .brand img{width:132px;height:132px}
.foot.f2 .fl .brand::after{content:"";position:absolute;right:0;top:9%;bottom:9%;width:1px;background:var(--rule)}
}
@media(max-width:900px){
.feed .head .headsoc{position:static;right:auto;top:auto}.feed .head .eb.l{min-height:0;display:flex;width:auto}
}

/* 10-07 e (Ashiq, mobile): hero->number gap halved; series + mission titles before the photo; feed icons right after the eyebrow; feed bottom gap = 40; About title embedded, two separate boxes; piclogo centred; footer group centred with larger logo */
#about .abhead{display:contents}
@media(max-width:900px){
.hero{min-height:auto}.hero .wrap{padding-bottom:30px}.hero .band{margin-top:28px}
.stop{padding-top:44px}.stop .intro h2{margin-top:0}
#series .wrap,#mission .wrap{display:flex;flex-direction:column;gap:0}
#series .txt,#mission .txt{display:contents}
#series .txt .eb,#mission .txt .eb{order:1}#series .txt h2,#mission .txt h2{order:2;margin-bottom:22px}
#series .pic,#mission .pic{order:3;margin-bottom:26px}
#series .txt p,#mission .txt p{order:4}
.ebrow{justify-content:flex-start;gap:14px}
.feed{padding-bottom:40px}
#about .abhead{display:block;text-align:right;margin:0 0 16px}#about .abhead .eb{justify-content:flex-end}#about .abhead h2{font-size:26px;line-height:1.1;margin:8px 0 0}
#about .txt .box{width:78%}#about .txt .box:first-of-type{margin-right:auto}#about .txt .box+.box{margin:14px 0 0 auto;position:static}
.sec.band.alt .piclogo{margin-left:0;left:50%;transform:translateX(-50%)}
.foot.f2 .frow{grid-template-columns:auto auto;justify-content:center;column-gap:16px}
.foot.f2 .fl .brand{position:relative;border-right:0;padding-right:14px}.foot.f2 .fl .brand img{width:100px;height:100px}
.foot.f2 .fl .brand::after{content:"";position:absolute;right:0;top:9%;bottom:9%;width:1px;background:var(--rule)}
.foot.f2 .addr{justify-self:start}
}

@media(max-width:900px){#series .pic,#mission .pic{width:100%;align-self:stretch;aspect-ratio:16/10}}

/* 10-07 f (Ashiq, desktop): wordmark centred between the bar and the title; pills flat gold / clear with inner gold line, gold fall-off glow; number section up; nav items spread; footer rules full width; Privacy/Terms centred under the icons */
.hero .btn.big.solid{background:var(--gold);border-color:var(--gold);color:#121412;box-shadow:0 0 0 1px rgba(201,169,106,.6),0 0 18px 2px rgba(201,169,106,.38),0 0 54px 10px rgba(201,169,106,.16)}
.hero .btn.big.solid:hover{background:var(--ink);border-color:var(--ink);box-shadow:0 0 18px 2px rgba(201,169,106,.38),0 0 54px 10px rgba(201,169,106,.16)}
.hero .btn.big.cream{border:1px solid var(--gold);color:var(--ink);background:rgba(18,20,18,.28);box-shadow:inset 0 0 0 3px rgba(0,0,0,0),inset 0 0 0 4px rgba(201,169,106,.9),0 0 18px 2px rgba(201,169,106,.3),0 0 54px 10px rgba(201,169,106,.14)}
.hero .btn.big.cream:hover,.hero .btn.big.cream:focus-visible{background:var(--gold);color:#121412;box-shadow:inset 0 0 0 3px var(--gold),inset 0 0 0 4px rgba(18,20,18,.5),0 0 18px 2px rgba(201,169,106,.4),0 0 54px 10px rgba(201,169,106,.18)}
@media(min-width:901px){
.hero .wrap{padding-top:62px;padding-bottom:78px}.hero .wmblock{margin:0 auto 62px}
.hero .btn.big{border-width:1px}
.stop{padding-top:92px}
.sitetop.hv1 nav.row{gap:56px}.sitetop.hv1 ul.nl,.sitetop.hv1 ul.nr{gap:48px}
.foot.f2 .wrap{max-width:none;padding:0 48px}
.foot.f2 .fsoc{width:182px;justify-content:flex-start}.foot.f2 .flegal{width:182px;justify-content:center;gap:16px}
}

@media(min-width:901px){.hero .wrap{padding-top:40px}.hero .wmblock{margin-bottom:66px}}
/* 10-07 g (Ashiq, mobile): wordmark above the logo, logo smaller; series section up; feed eyebrow row up with more gap to the icons; About title centred + larger; footer logo taller than the address block */
@media(max-width:900px){
.hv1 .mast .wrap{display:flex;flex-direction:column;align-items:center;padding:14px 20px 0}
.hv1 .mast .wmm{order:1;margin:0 0 6px}.hv1 .mast .logo{order:2}.hv1 .mast img{width:148px;height:148px;margin:0 auto}
.hv1 .ham{top:92px}
#series{padding-top:44px}
.feed{padding-top:34px}.ebrow{gap:26px}
#about .abhead{text-align:center}#about .abhead .eb{justify-content:center}#about .abhead h2{font-size:30px}
.foot.f2 .fl .brand img{width:136px;height:136px}.foot.f2 .frow{column-gap:18px}
}

@media(max-width:900px){.hv1 .ham{top:134px}.hero .wrap{padding-top:262px}}
/* 10-07 h (Ashiq): pills + nav in Cormorant Garamond; header rule above the nav removed, header tightened by half; pills: internal hairline always on, white edge on Ask, visible gold drop glow; footer condensed */
.hero .btn.big{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:17px;letter-spacing:.2em;text-transform:uppercase}
.hero .btn.big.solid{background:var(--gold);border:1.5px solid var(--gold);color:#121412;box-shadow:inset 0 0 0 2px var(--gold),inset 0 0 0 3px rgba(18,20,18,.6),0 14px 34px rgba(201,169,106,.42),0 0 64px 14px rgba(201,169,106,.2)}
.hero .btn.big.solid:hover{background:var(--ink);border-color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 3px rgba(201,169,106,.7),0 14px 34px rgba(201,169,106,.42),0 0 64px 14px rgba(201,169,106,.2)}
.hero .btn.big.cream{border:1.5px solid var(--ink);color:var(--ink);background:rgba(18,20,18,.32);box-shadow:inset 0 0 0 2px rgba(0,0,0,0),inset 0 0 0 3px rgba(245,244,240,.6),0 14px 34px rgba(201,169,106,.36),0 0 64px 14px rgba(201,169,106,.18)}
.hero .btn.big.cream:hover,.hero .btn.big.cream:focus-visible{background:var(--ink);color:#121412;box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 3px rgba(18,20,18,.55),0 14px 34px rgba(201,169,106,.42),0 0 64px 14px rgba(201,169,106,.2)}
.hv1 ul a{font:500 15px/1 'Cormorant Garamond',serif;letter-spacing:.18em;text-transform:uppercase}
@media(min-width:901px){
.hv1 .mast .wrap{padding:8px 20px 0}
.sitetop.hv1 nav.row{border-top:0;padding:6px 20px 10px}
.hero .wrap{padding-top:6px}.hero .wmblock{margin-bottom:66px}
.foot.f2{padding:22px 0 10px}
.foot.f2 .frow{grid-template-columns:auto 1fr auto;grid-template-areas:"brand addr soc" "legal legal legal";align-items:center;row-gap:6px;padding-bottom:6px;border-bottom:0}
.foot.f2 .fl .brand{padding-right:18px}.foot.f2 .fl .brand img{width:150px;height:150px}
.foot.f2 .fl .brand::after{top:16%;bottom:16%}
.foot.f2 .fsoc{align-self:center;width:auto;justify-content:flex-end}
.foot.f2 .flegal{grid-area:legal;width:auto;justify-content:center;margin:0}
.foot.f2 .copy{padding:6px 0 12px;border-bottom:1px solid var(--rule)}
.foot.f2 .crawl{margin-top:10px;border-top:0;padding-top:0}
}
@media(max-width:900px){.hero .btn.big{font-size:16px}}
/* 10-07 i: desktop bar->wordmark halved; pills in Cinzel, Ask stays clear (transparent) with white edge, hairline inside both, slight run-off shadow (variation A, board-shadows.html); mobile: masthead back to logo on top + wordmark beneath, footer tightened, About head up, series bottom gap, icons on the eyebrow centre line */
.hero .btn.big{font-family:'Cinzel',serif;font-weight:400;font-size:13px;letter-spacing:.24em;text-transform:uppercase}
.hero .btn.big.solid{background:var(--gold);border:1.5px solid var(--gold);color:#121412;box-shadow:inset 0 0 0 2px var(--gold),inset 0 0 0 3px rgba(18,20,18,.55),0 6px 16px -6px rgba(201,169,106,.7)}
.hero .btn.big.solid:hover{background:var(--ink);border-color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink),inset 0 0 0 3px rgba(201,169,106,.65),0 6px 16px -6px rgba(201,169,106,.7)}
.hero .btn.big.cream{border:1.5px solid var(--ink);color:var(--ink);background:transparent;box-shadow:inset 0 0 0 2px rgba(0,0,0,0),inset 0 0 0 3px rgba(245,244,240,.55),0 6px 16px -6px rgba(245,244,240,.5)}
.hero .btn.big.cream:hover,.hero .btn.big.cream:focus-visible{background:rgba(245,244,240,.12);color:var(--ink);box-shadow:inset 0 0 0 2px rgba(0,0,0,0),inset 0 0 0 3px rgba(245,244,240,.8),0 0 22px rgba(245,244,240,.35),0 6px 16px -6px rgba(245,244,240,.5)}
.ebrow{align-items:center}.ebrow .eb{line-height:1;min-height:0;margin:0}
@media(min-width:901px){
.hero .wmblock{margin-top:-19px}
}
@media(max-width:900px){
.hv1 .mast .wrap{display:block;padding:4px 20px 0}
.hv1 .mast img{width:168px;height:168px;margin:0 auto}
.hv1 .mast .wmm{margin:-4px 0 6px}
.hv1 .ham{top:78px}
.hero .wrap{padding-top:252px}
.hero .btn.big{font-size:12px;letter-spacing:.22em}
#series{padding-bottom:44px}
#about .txt{margin:26px 0 40px}#about .abhead{margin:0 0 24px;width:100%}
.foot.f2{padding:18px 0 8px}
.foot.f2 .frow{column-gap:10px;row-gap:12px;padding-bottom:8px;border-bottom:0}
.foot.f2 .fl .brand{padding-right:10px}.foot.f2 .fl .brand::after{top:22%;bottom:22%}
.foot.f2 .fsoc a{width:40px;height:40px}.foot.f2 .fsoc svg{width:17px;height:17px}
.foot.f2 .flegal{margin:0}
.foot.f2 .copy{border-top:0;padding:4px 0 0}
}

@media(min-width:901px){.hero .wmblock{margin-top:-31px}}
/* 10-07 j (Ashiq, mobile): eye imagery centred and carried down behind the pills; inner-page masthead sits in flow; menu smaller and higher */
@media(max-width:900px){
.hero .ph{background-position:56% 50%;transform-origin:56% 50%}
.hero .shade{background:radial-gradient(70% 55% at 50% 55%,rgba(18,20,18,.1),rgba(18,20,18,.45) 70%,rgba(18,20,18,.75)),linear-gradient(180deg,rgba(18,20,18,.8) 0%,rgba(18,20,18,.15) 26%,rgba(18,20,18,0) 55%,rgba(18,20,18,.55) 88%,#121412 100%)}
.sitetop.inner.hv1{position:static;background:var(--bg);border-bottom:1px solid var(--rule)}
.sitetop.inner.hv1 .mast img{width:168px;height:168px}
.hv1 .ham{top:66px;width:22px;height:17px}.hv1 .ham[aria-expanded="true"] span:nth-child(1){transform:translateY(7.75px) rotate(45deg)}.hv1 .ham[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.75px) rotate(-45deg)}
}
/* 10-07 k (Ashiq, mobile story page): title first, photograph second, standfirst and by-line after, body full width */
@media(max-width:900px){
.phero{min-height:0;display:flex;flex-direction:column;padding:26px 0 8px}
.phero .wrap{display:contents}
.phero h1{order:1;margin:0 20px 18px;font-size:34px;line-height:1.1}
.phero .ph{order:2;position:relative;inset:auto;width:100%;aspect-ratio:4/3;background-size:cover;background-position:center;margin:0 0 20px}
.phero .shade{display:none}
.phero .stand{order:3;margin:0 20px;font-size:17px;line-height:1.6}
.phero .by{order:4;margin:16px 20px 0;font-size:12px}
.article{padding:18px 20px 56px}
.tools{margin:0 0 14px}
.paper{padding:24px 20px}.paper p{font-size:16.5px;line-height:1.75}.paper .lead{font-size:18px}
.social-row{padding:40px 0 0}.next{padding:40px 0 64px}
}
/* 10-07 l (Ashiq, mobile): logo back to the smaller size on home + inner pages, menu level with it, dropdown opens beneath the wordmark on every page, Ask a question above Discoveries */
@media(max-width:900px){
.hv1 .mast .wrap{padding:6px 20px 0}
.hv1 .mast img,.sitetop.inner.hv1 .mast img{width:104px;height:104px;margin:0 auto}
.hv1 .mast .wmm{margin:4px 0 8px}
.hv1 .ham{top:50px}
.hero .wrap{padding-top:200px}
.sitetop.inner.hv1{position:relative}
.hv1 .mnav.open{position:absolute;left:0;right:0;top:100%;z-index:41}
.hero .row{display:flex;flex-direction:column}.hero .row .btn.cream{order:-1}
}

@media(max-width:900px){.hero .row{width:100%;align-items:stretch}.hero .row .btn{width:100%}}

/* 10-07 m (Ashiq, Discovery): split nav around the logo on every page, Raleway nav, wordmark beneath; pill hovers (gold stays gold, clear fills white); story by-line trimmed; social row spacing + four channels; footer f4; Favorites */
.hv1 .mast .mrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:40px}
.hv1 .mast .mrow ul{list-style:none;margin:0;padding:0;display:flex;gap:34px;align-items:center}.hv1 .mast .mrow .nl{justify-content:flex-end}.hv1 .mast .mrow .nr{justify-content:flex-start}
.hv1 .mast .mrow ul a{font:500 11.5px/1 'Raleway',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--ink2);text-shadow:none}.hv1 .mast .mrow ul a:hover{color:var(--gold)}
.hv1 .mast img,.sitetop.inner.hv1 .mast img{display:block;width:190px;height:190px;margin:0 auto}
.wmm,.hv1 .mast .wmm{display:block;text-align:center;margin:2px 0 12px}
.hv1 .mast .wmm .wm{display:block;font:500 34px/1.1 'Cormorant Garamond',serif;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
.hv1 .mast .wmm .tl{margin:8px 0 0;font:italic 400 16px/1.3 'Cormorant Garamond',serif;color:var(--ink3)}
.hv1 .mast .wrap{padding:10px 20px 0}
.sitetop.hv1{border-bottom:1px solid var(--rule)}
.hero .wmblock,body>.wmblock{display:none}
.hero .btn.big.solid:hover{background:#D6B97C;border-color:#D6B97C;color:#121412;box-shadow:inset 0 0 0 2px #D6B97C,inset 0 0 0 3px rgba(18,20,18,.55),0 6px 16px -6px rgba(201,169,106,.7)}
.hero .btn.big.cream:hover,.hero .btn.big.cream:focus-visible{background:#F5F4F0;color:#121412;box-shadow:inset 0 0 0 2px #F5F4F0,inset 0 0 0 3px rgba(18,20,18,.35),0 6px 16px -6px rgba(245,244,240,.5)}
.social-row{padding:72px 0 64px;border-bottom:1px solid var(--rule)}.social-row .links{margin-top:34px}.social-row p{margin-bottom:0}.next{border-top:0}
.foot.f4{padding:34px 0 14px}
.foot.f4 .frow{display:flex;justify-content:center;align-items:center;gap:18px;flex-wrap:wrap}
.foot.f4 .brand{display:block}.foot.f4 .brand img{width:132px;height:132px;display:block;filter:brightness(0) invert(1)}
.foot.f4 .addr{font-style:normal;font-size:13.5px;line-height:1.7;color:var(--ink2);border-left:1px solid var(--rule);padding-left:16px;margin:0}.foot.f4 .addr a{color:var(--ink2)}.foot.f4 .addr .brk{display:block;height:0}
.foot.f4 .fsoc{list-style:none;margin:0 0 0 10px;padding:0;display:flex;gap:10px}.foot.f4 .fsoc a{width:38px;height:38px;border:1px solid var(--rule);border-radius:50%;display:grid;place-items:center;color:var(--ink2)}.foot.f4 .fsoc a:hover{border-color:var(--gold);color:var(--gold)}.foot.f4 .fsoc svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.foot.f4 .fsoc .xlogo{fill:currentColor;stroke:none}
.foot.f4 .flegal{margin:22px 0 14px;display:flex;justify-content:center;gap:18px;font-size:11px;letter-spacing:.22em;text-transform:uppercase}.foot.f4 .flegal a{color:var(--ink3)}.foot.f4 .flegal a:hover{color:var(--ink)}
.foot.f4 .copy{margin:0 -48px;padding:14px 48px 0;border-top:1px solid var(--rule);text-align:center;font-size:12px;color:var(--ink3);max-width:none}
.foot.f4 .crawl{margin-top:10px;border-top:0;padding-top:0}.foot.f4 .crawl p{text-align:center}
@media(min-width:901px){.foot.f4 .wrap{max-width:none;padding:0 48px}}
@media(max-width:900px){
.hv1 .mast .mrow{display:block}.hv1 .mast .mrow ul{display:none}
.hv1 .mast .wrap{padding:6px 20px 0}
.hv1 .mast img,.sitetop.inner.hv1 .mast img{width:104px;height:104px}
.hv1 .mast .wmm{margin:4px 0 8px}.hv1 .mast .wmm .wm{font-size:18px;letter-spacing:.11em;white-space:nowrap}.hv1 .mast .wmm .tl{font-size:13px;margin-top:4px}
.sitetop.hv1{border-bottom:0}.sitetop.inner.hv1{border-bottom:1px solid var(--rule)}
.social-row{padding:48px 0 40px}.social-row .links{margin-top:24px}
.foot.f4{padding:24px 0 10px}.foot.f4 .frow{gap:12px}.foot.f4 .brand img{width:104px;height:104px}.foot.f4 .addr{font-size:12.5px;padding-left:12px}.foot.f4 .fsoc{width:100%;justify-content:center;margin:12px 0 0}
.foot.f4 .flegal{margin:16px 0 10px}.foot.f4 .copy{margin:0 -20px;padding:10px 20px 0;font-size:11.5px}
.foot.f4 .crawl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%)}.foot.f4{position:relative}
}
.foot.f4 .flegal{max-width:none}
@media(max-width:900px){.next .cards{grid-template-columns:1fr;gap:16px}.next .cards .card{grid-column:1/-1;aspect-ratio:4/5}}

/* 10-07 n (Ashiq, desktop): hero pull up to the title, title up, pills down a touch; footer squeezed vertically, logo left with a taller rule and the address, icons right, Privacy/Terms centred, no rule above the copyright; model label gone from cards */
@media(min-width:901px){
.hero .wrap{padding-top:30px}.hero .wmblock{margin-bottom:56px}
.hero .band{margin-top:18px}.hero .row{margin-top:46px}
.foot.f4{padding:26px 0 10px}
.foot.f4 .frow{justify-content:flex-start;gap:20px;flex-wrap:nowrap}
.foot.f4 .brand img{width:150px;height:150px}
.foot.f4 .addr{border-left:0;position:relative;padding-left:20px}.foot.f4 .addr::before{content:"";position:absolute;left:0;top:-12px;bottom:-12px;width:1px;background:var(--rule)}
.foot.f4 .fsoc{margin-left:auto}
.foot.f4 .flegal{margin:10px 0 6px}
.foot.f4 .copy{border-top:0;padding:0;margin:0}
.foot.f4 .crawl{margin-top:8px}
}