/* A magazine opens into its own pigment, voice and imagery. Reading stays on paper. */
body main#main[data-petro-issue]{--spread-font:Cochin,Georgia,serif;--spread-label:Jost,Arial,sans-serif}
body main#main[data-petro-issue]>.petro-issue-spread{
  position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr);gap:0;
  width:auto;max-width:none;min-height:660px;margin:24px 0 0;padding:30px clamp(26px,4.2vw,66px) 48px;
  color:var(--issue-ink);border:0;
  background:radial-gradient(ellipse at 18% 9%,var(--issue-light),transparent 67%),radial-gradient(ellipse at 88% 91%,var(--issue-depth),transparent 65%),var(--issue-base);
  box-shadow:inset 0 1px 0 #ffffff9c,inset 2px 0 0 #ffffff35,inset -3px 0 0 #00000012,0 22px 40px -30px #33333370;
}
body main#main[data-petro-issue]>.petro-issue-spread::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(116deg,transparent 17%,#ffffff08 33%,#ffffff38 41%,#ffffff0a 47%,transparent 64%),linear-gradient(0deg,#0000000c,transparent 36%);
}
body main#main[data-petro-issue]>.petro-issue-spread::after{content:"";position:absolute;inset:8px;z-index:4;pointer-events:none;border:1px solid #ffffff38}
.petro-issue-identity{grid-column:1/-1;position:relative;z-index:3;display:flex;justify-content:space-between;align-items:flex-end;gap:25px;padding-bottom:20px;border-bottom:1px solid currentColor;margin-bottom:45px}
.petro-issue-wordmark{font:400 clamp(73px,11.8vw,168px)/.78 var(--spread-font);letter-spacing:-.055em;margin:0!important}
.petro-issue-folio{display:flex;flex-direction:column;gap:6px;align-items:flex-end;flex-shrink:0;margin:0!important;font:500 10px/1.4 var(--spread-label);letter-spacing:.16em;text-transform:uppercase}
.petro-issue-cover-copy{position:relative;z-index:2;min-width:0;align-self:center;padding:0!important}
body main#main[data-petro-issue] .petro-issue-spread :is(.eyebrow,.edition-eyebrow){font:500 10px/1.5 var(--spread-label);letter-spacing:.15em;color:inherit;margin:0 0 23px;padding:0;grid-column:auto;grid-row:auto}
body main#main[data-petro-issue] .petro-issue-spread h1{font:400 clamp(64px,8.3vw,124px)/.91 var(--spread-font)!important;letter-spacing:-.045em;max-width:12ch;margin:0;padding:0;color:inherit;text-wrap:balance;grid-column:auto;grid-row:auto}
body main#main[data-petro-issue] .petro-issue-spread h1 :is(em,.issue-title-paint,.cover-signature){font-family:inherit!important;color:inherit;-webkit-text-fill-color:currentColor;background:none;box-shadow:none;font-style:italic;font-size:inherit;line-height:inherit;letter-spacing:inherit;display:inline;padding:0;margin:0}
body main#main[data-petro-issue] .petro-issue-spread h1 .issue-title-paint::before,body main#main[data-petro-issue] .petro-issue-spread h1 em::before{display:none}
body main#main[data-petro-issue] .petro-issue-spread .actions{display:flex;flex-wrap:wrap;gap:14px 22px;margin:33px 0 0;padding:0;grid-column:auto;grid-row:auto}
body main#main[data-petro-issue] .petro-issue-spread .cover-byline{color:inherit;font:500 10px/1.5 var(--spread-label);letter-spacing:.15em;text-transform:uppercase;margin:26px 0 0;padding:0;grid-column:auto;grid-row:auto}
.petro-issue-watermark{position:absolute;right:-.03em;bottom:-.08em;z-index:0;font:400 clamp(300px,38vw,590px)/.8 var(--spread-font);letter-spacing:-.09em;color:var(--issue-light);opacity:.2;pointer-events:none}
body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=type]{padding-bottom:60px}
body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=type] .petro-issue-cover-copy{max-width:80%;padding:10px 0 5px!important}
/* The existing selected portrait is the photograph of this edition, not a result. */
body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=portrait]{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);column-gap:18px;padding-bottom:0}
body main#main[data-petro-issue] .petro-issue-spread[data-issue-composition=portrait] .petro-issue-cover-copy{align-self:center;display:block;padding:0 0 42px!important}
body main#main[data-petro-issue] .petro-issue-spread[data-issue-composition=portrait] h1{font-size:clamp(48px,5.45vw,82px)!important;max-width:12ch;line-height:.95!important}
body main#main[data-petro-issue] .petro-issue-spread .cover-ending{display:block;margin-top:.16em}
body main#main[data-petro-issue] .petro-issue-spread .cover-signature{white-space:normal}
body main#main[data-petro-issue] .petro-issue-spread .concern-cover-portrait{position:relative;z-index:1;display:flex;grid-column:2;grid-row:2;align-self:end;align-items:flex-end;min-width:0;width:calc(100% + 40px);height:auto;margin:0 -40px 0 0;padding:0}
body main#main[data-petro-issue] .petro-issue-spread .concern-cover-portrait img{display:block;max-width:none;width:100%;height:auto;max-height:none;object-fit:contain;object-position:center bottom;mask-image:linear-gradient(#000 94%,transparent);-webkit-mask-image:linear-gradient(#000 94%,transparent)}
/* Keep the lips edition's individually authored cover and illustration. */
body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=art]{grid-template-columns:minmax(0,1fr) minmax(0,.85fr);column-gap:7%;padding-bottom:55px}
body main#main[data-petro-issue] .petro-issue-spread .edition-cover-art{grid-column:2;grid-row:2;align-self:center;justify-self:center;width:100%;max-width:390px;margin:0;transform:rotate(3deg)}
body main#main[data-petro-issue] .petro-issue-spread .edition-cover-deck{color:inherit;font:400 clamp(25px,2.7vw,36px)/1.13 var(--spread-font);margin-top:25px}
body main#main[data-petro-issue] .petro-issue-spread .edition-cover-question{color:inherit;font-size:15px;line-height:1.55;margin-top:18px;max-width:31ch}
body main#main[data-petro-issue] .petro-issue-spread .edition-byline{color:inherit;font-size:10px;line-height:1.6;margin-top:22px}
/* The contents and opening form the next editorial spread; prose remains untouched. */
body main#main[data-petro-issue]>.issue-contents{padding:25px 0;gap:15px 27px;border-bottom:1px solid #c9c8c5}
body main#main[data-petro-issue]>.issue-contents a{font:400 12px/1.45 var(--spread-label)}
body main#main[data-petro-issue]>.chapter:first-of-type{padding-top:65px;padding-bottom:55px}
body main#main[data-petro-issue]>.mirror-moment>blockquote{font:400 clamp(38px,5.3vw,76px)/1.06 var(--spread-font)!important;letter-spacing:-.025em;max-width:16ch;margin:30px 0 0}
body main#main[data-petro-issue] .petro-issue-spread a:focus-visible{outline:3px solid currentColor;outline-offset:6px}
@media(max-width:900px){
 body main#main[data-petro-issue]>.petro-issue-spread{min-height:550px;padding:27px 30px 40px}
 .petro-issue-identity{margin-bottom:34px}.petro-issue-wordmark{font-size:clamp(70px,13.5vw,120px)}
 body main#main[data-petro-issue] .petro-issue-spread h1{font-size:clamp(55px,9.5vw,88px)!important}
 body main#main[data-petro-issue] .petro-issue-spread[data-issue-composition=portrait] h1{font-size:clamp(42px,5.8vw,61px)!important}
 body main#main[data-petro-issue] .petro-issue-spread .concern-cover-portrait{width:calc(100% + 26px);margin-right:-26px}
}
@media(max-width:600px){
 body main#main[data-petro-issue]>.petro-issue-spread{min-height:490px;margin-top:14px;padding:25px 23px 33px}
 .petro-issue-identity{gap:12px;margin-bottom:30px;padding-bottom:18px;align-items:center}
 .petro-issue-wordmark{font-size:clamp(60px,18vw,96px)}.petro-issue-folio{font-size:8px;letter-spacing:.1em;max-width:88px;text-align:right}
 body main#main[data-petro-issue] .petro-issue-spread :is(.eyebrow,.edition-eyebrow){font-size:9px;margin-bottom:22px}
 body main#main[data-petro-issue] .petro-issue-spread h1{font-size:clamp(46px,12.8vw,73px)!important;line-height:.95!important;max-width:12ch}
 body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=type]{padding-bottom:38px}
 body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=type] .petro-issue-cover-copy{max-width:100%;padding:0!important}
 .petro-issue-watermark{font-size:330px;right:-.025em;opacity:.12}
 body main#main[data-petro-issue] .petro-issue-spread .actions{gap:10px;margin-top:27px}
 body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=portrait]{grid-template-columns:minmax(0,1fr);min-height:0;padding-bottom:0}
 body main#main[data-petro-issue] .petro-issue-spread[data-issue-composition=portrait] .petro-issue-cover-copy{padding:0!important}
 body main#main[data-petro-issue] .petro-issue-spread[data-issue-composition=portrait] h1{font-size:clamp(42px,11.2vw,67px)!important;max-width:12ch}
 body main#main[data-petro-issue] .petro-issue-spread .concern-cover-portrait{grid-column:1;grid-row:auto;justify-self:end;width:82%;max-width:370px;margin:18px -20px 0 0}
 body main#main[data-petro-issue] .petro-issue-spread .concern-cover-portrait img{max-height:390px;object-fit:contain;object-position:right bottom}
 body main#main[data-petro-issue] .petro-issue-spread .cover-byline{margin-top:21px;font-size:9px}
 body main#main[data-petro-issue]>.petro-issue-spread[data-issue-composition=art]{grid-template-columns:minmax(0,1fr);padding-bottom:35px;gap:0}
 body main#main[data-petro-issue] .petro-issue-spread .edition-cover-art{grid-column:1;grid-row:auto;width:78%;max-width:290px;margin:36px auto 0}
 body main#main[data-petro-issue] .petro-issue-spread[data-issue-composition=art] h1{font-size:clamp(70px,19vw,105px)!important}
 body main#main[data-petro-issue]>.issue-contents{gap:12px 22px;padding:22px 0}
 body main#main[data-petro-issue]>.issue-contents a{font-size:11px}
 body main#main[data-petro-issue]>.chapter:first-of-type{padding-top:40px;padding-bottom:37px}
 body main#main[data-petro-issue]>.mirror-moment>blockquote{font-size:42px!important}
}
/* The forehead issue is intentionally quieter: sentence case, smaller cover
   typography, and the owner's treatment-room photograph. */
body main#main.issue-editorial[data-issue=forehead]>.petro-issue-spread{min-height:590px}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-wordmark{font-size:clamp(60px,7vw,90px);font-weight:300}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread[data-issue-composition=portrait] h1{font-size:clamp(39px,4.35vw,60px)!important;line-height:1.01!important;letter-spacing:-.035em;max-width:14ch}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread :is(.eyebrow,.edition-eyebrow){font-size:9px;letter-spacing:.12em;margin-bottom:18px}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread .actions{margin-top:25px}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread .actions :is(.cover-start,.text-link){font-size:12px!important;padding:11px 18px}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread .cover-byline{font-size:9px;margin-top:21px}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread .concern-cover-portrait{align-self:end;justify-self:end;width:min(100%,420px);margin:0 0 34px;padding:0}
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread .concern-cover-portrait img{width:100%;aspect-ratio:4/5;max-height:510px;object-fit:cover;object-position:center 43%;border:6px solid rgba(255,255,255,.72);box-shadow:0 22px 42px -26px rgba(45,30,39,.65);mask-image:none;-webkit-mask-image:none}
@media(max-width:600px){
 body main#main.issue-editorial[data-issue=forehead]>.petro-issue-spread{min-height:0;padding:22px 20px 28px}
 body main#main.issue-editorial[data-issue=forehead] .petro-issue-wordmark{font-size:clamp(52px,15vw,70px)}
 body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread[data-issue-composition=portrait] h1{font-size:clamp(33px,9.2vw,44px)!important;line-height:1.03!important;max-width:13ch}
 body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread .concern-cover-portrait{justify-self:center;width:min(88%,290px);margin:25px auto 28px}
 body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread .concern-cover-portrait img{max-height:none;object-position:center 41%}
}
@media(prefers-reduced-motion:reduce){body main#main[data-petro-issue] .petro-issue-spread,body main#main[data-petro-issue] .petro-issue-spread::before,body main#main[data-petro-issue] .petro-issue-spread::after{animation:none!important;transition:none!important}}
@media(forced-colors:active){body main#main[data-petro-issue]>.petro-issue-spread{background:Canvas;color:CanvasText;border:1px solid CanvasText;box-shadow:none}.petro-issue-watermark,body main#main[data-petro-issue]>.petro-issue-spread::before{display:none}}

/* Consistent issue-cover typography: one masthead and one title scale across every issue. */
body main#main[data-petro-issue] .petro-issue-wordmark{
  font-size:72px!important;
  font-weight:300!important;
  line-height:.82!important;
  letter-spacing:-.045em!important;
}
body main#main[data-petro-issue] .petro-issue-spread h1,
body main#main.issue-editorial[data-issue=forehead] .petro-issue-spread[data-issue-composition=portrait] h1,
body main#main[data-petro-issue] .petro-issue-spread[data-issue-composition=art] h1{
  font-size:48px!important;
  font-weight:300!important;
  line-height:.98!important;
  letter-spacing:-.035em!important;
  max-width:15ch;
}