/* The cover is the entrance. Existing colors, actual issues, native scrolling. */
body[data-petro-showroom]{background:#fff;color:#484848}
body:is([data-petro-showroom],[data-petro-edition]) .site-header.petro-shared-header{display:flex;align-items:center;justify-content:space-between;gap:32px;width:100%;margin:0;padding:19px 4%;background:linear-gradient(116deg,#fff 0 47%,#f5f5f5 58%,#fff 72%);color:#484848;box-shadow:none;--header-rule:#ddd}
body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-mast{display:block;border:0;padding:0;margin:0}
body:is([data-petro-showroom],[data-petro-edition]) .site-header .mast-brand{display:block}
body:is([data-petro-showroom],[data-petro-edition]) .site-header .mast-name{font-size:34px!important;letter-spacing:.12em;padding:0}
body:is([data-petro-showroom],[data-petro-edition]) .site-header :is(.mast-note,.mast-descriptor){display:none}
body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-nav{padding:0;gap:24px;margin:0}
body:is([data-petro-showroom],[data-petro-edition]) .site-nav .petro-glass{background:none!important;box-shadow:none!important;border:0!important;border-radius:0!important;color:#484848!important;padding:9px 0;min-height:40px;font-size:12px}
body:is([data-petro-showroom],[data-petro-edition]) .site-nav .nav-consult{border-bottom:1px solid #aaa!important}
body[data-petro-showroom]>.petro-breadcrumb{display:none}
body[data-petro-showroom] main.library-page{padding:0!important}
.issue-showroom{--display:Cochin,Prata,Georgia,serif;--sans:Jost,Arial,sans-serif;box-sizing:border-box;position:relative;isolation:isolate;padding:22px 0 34px;background:radial-gradient(ellipse at 86% 92%,#f2e9f4 0,transparent 44%),linear-gradient(115deg,#fff 0 35%,#f4f5f4 60%,#fff 84%);color:#484848;overflow:hidden}
.issue-showroom *{box-sizing:border-box}
.showroom-heading{padding:0 4%;display:flex;align-items:end;justify-content:space-between;gap:30px;position:relative;z-index:2}
.showroom-eyebrow{font:500 10px/1.5 Jost,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;margin:0 0 17px}
.showroom-heading h1{font:400 clamp(48px,6.4vw,88px)/1.05 var(--display);letter-spacing:-.035em;margin:0;text-wrap:nowrap;color:#484848}
.showroom-heading h1 em{font:400 1.9em/.7 Boisterous,cursive;font-style:normal;letter-spacing:0;display:inline-block;padding:.1em .09em .3em;margin:-.1em -.07em -.3em 0;background:linear-gradient(108deg,#ffc2b4,#ff5e6e 40%,#b01840 80%,#74102f);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;vertical-align:-.04em}
.showroom-invitation{font:400 20px/1.45 var(--display);margin:0 0 5px;flex-shrink:0}
.showroom-invitation span{font:400 12px/1.65 Jost,Arial,sans-serif;display:block;margin-top:5px}
.showroom-rail{position:relative;padding-bottom:10px}
.showroom-rail::after{content:"";position:absolute;pointer-events:none;left:0;right:0;bottom:27px;height:13px;background:linear-gradient(180deg,#fff 0 20%,#d0d0d0 23% 29%,#fff 36% 56%,#eee 78%,#c9c9c9 100%);box-shadow:0 14px 22px -10px #48484845;z-index:0}
.showroom-track{display:flex;gap:clamp(22px,3.3vw,48px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;padding:43px 5% 43px;isolation:isolate;perspective:1400px;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.showroom-track::-webkit-scrollbar{display:none}
.issue-object{flex:0 0 clamp(174px,20vw,266px);aspect-ratio:.73;display:block;position:relative;scroll-snap-align:center;color:var(--issue-ink);text-decoration:none;perspective:1100px;z-index:1;transform:translateY(var(--hover-lift,0px));transition:transform .4s cubic-bezier(.2,.75,.2,1);outline-offset:7px;-webkit-tap-highlight-color:transparent}
.object-drift{position:relative;display:block;height:100%;transform:rotate(-3deg) rotateY(-10deg);transform-style:preserve-3d;will-change:transform}
.issue-object:nth-child(3n+2) .object-drift{transform:translateY(-5px) rotate(2.2deg) rotateY(-9deg)}
.issue-object:nth-child(3n) .object-drift{transform:rotate(-1.2deg) rotateY(-9deg)}
.object-face,.unfold-cover{position:relative;display:flex;flex-direction:column;height:100%;padding:19px 18px 21px;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 10% 0,var(--issue-light) 0,transparent 53%),radial-gradient(ellipse at 100% 95%,var(--issue-depth) 0,transparent 61%),var(--issue-base);color:var(--issue-ink);box-shadow:inset 2px 1px 2px #ffffffba,inset -3px -2px 3px #00000016,9px 17px 18px -17px #32283c99;border-radius:1px 3px 2px 1px;transform:rotateX(var(--hover-y,0deg)) rotateY(var(--hover-x,0deg));transition:transform .35s ease}
.object-drift:after{content:"";position:absolute;top:2px;bottom:1px;right:-5px;width:5px;background:repeating-linear-gradient(90deg,#eee 0px,#fff 1px,#ccc 2px);transform:rotateY(30deg);transform-origin:left;z-index:-1;box-shadow:3px 3px 4px #44343e22}
.object-face:before,.unfold-cover:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(110deg,transparent 12%,#ffffff05 29%,#ffffff9c 43%,#ffffff0d 51%,transparent 67%);background-size:250% 100%;background-position:100% 0;mix-blend-mode:screen;opacity:.8}
.object-face:after,.unfold-cover:after{content:"";position:absolute;inset:0;pointer-events:none;border-left:5px solid #ffffff14;box-shadow:inset 6px 0 2px -4px #0000003b,inset 8px 0 1px -6px #ffffff66}
.object-mast{position:relative;z-index:1;font:400 clamp(28px,3vw,44px)/1 Prata,Georgia,serif;letter-spacing:.055em;display:block;white-space:nowrap}
.object-edition{position:relative;z-index:1;display:flex;flex-direction:column;gap:4px;margin-top:11px;border-top:1px solid currentColor;padding-top:9px;font:500 8px/1.5 Jost,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.object-title{position:relative;z-index:1;display:block;margin-top:auto;padding-top:17px;font:400 clamp(25px,2.65vw,37px)/1.02 Cochin,Georgia,serif;letter-spacing:-.015em;text-wrap:balance}
.object-invitation{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;font:500 9px/1.5 Jost,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:20px;gap:7px}
.object-invitation>span{font-size:17px;line-height:1}
.issue-object:focus-visible{outline:2px solid #484848;--hover-lift:-8px}
@media(hover:hover) and (pointer:fine){.issue-object:hover{--hover-lift:-12px;z-index:3}.issue-object:hover .object-face{box-shadow:inset 2px 1px 2px #ffffffba,inset -3px -2px 3px #00000016,10px 27px 26px -19px #32283c99}}
.issue-showroom.has-motion .object-drift{animation:cover-breathe 7s ease-in-out infinite alternate;animation-delay:calc(var(--object-index,0) * -.8s)}
.issue-showroom.has-motion .object-face:before{animation:cover-lacquer 9s ease-in-out infinite alternate;animation-delay:calc(var(--object-index,0) * -.7s)}
.issue-showroom[data-motion-paused] .object-drift,.issue-showroom[data-motion-paused] .object-face:before,.issue-showroom:not(.is-in-view) .object-drift,.issue-showroom:not(.is-in-view) .object-face:before,.issue-object:is(:hover,:focus-visible) .object-drift{animation-play-state:paused}
@keyframes cover-breathe{0%{transform:translateY(1px) rotate(-2.3deg) rotateY(-11deg)}100%{transform:translateY(-10px) rotate(1.8deg) rotateY(-6deg)}}
@keyframes cover-lacquer{from{background-position:100% 0}to{background-position:0% 0}}
.showroom-controls{display:flex;align-items:center;justify-content:space-between;padding:0 4%;gap:16px;font:400 12px/1.5 Jost,Arial,sans-serif}
.showroom-all{color:#484848;text-decoration:none;border-bottom:1px solid #999;padding:11px 0;display:inline-flex;gap:30px}
.showroom-playback{display:flex;align-items:center;gap:14px}
.showroom-controls button{appearance:none;border:0;border-bottom:1px solid #b5b5b5;background:none;color:#484848;padding:10px 5px;min-width:44px;min-height:44px;font:400 12px/1.5 Jost,Arial,sans-serif;cursor:pointer}
.showroom-controls .showroom-previous,.showroom-controls .showroom-next{font-size:22px}
.showroom-controls button:disabled{opacity:.3;cursor:default}
.showroom-controls :is(a,button):focus-visible{outline:2px solid #47776b;outline-offset:4px}
body[data-petro-showroom] #ask{scroll-margin-top:20px}
body[data-petro-showroom] .library-page .rack-intro{padding-top:55px}
/* Portrait first: the covers meet the photograph instead of replacing it. */
body[data-petro-hero]{padding-left:0}
body[data-petro-hero] .site-header.petro-shared-header{position:absolute;inset:0 0 auto;width:100%;margin:0;padding:22px 4%;background:transparent;color:#f3ede2;--header-rule:#ffffff50}
body[data-petro-hero] .site-header .site-nav .petro-glass{color:#f3ede2!important;backdrop-filter:none;-webkit-backdrop-filter:none}
body[data-petro-hero] .site-header .site-nav .nav-consult{border-bottom-color:#f3ede280!important}
body[data-petro-hero] #top.cover{min-height:0;height:calc(100svh - 70px);max-height:940px;padding:95px 5% 190px;margin:0!important;align-items:center}
body[data-petro-hero] #top .film{position:absolute;inset:0;width:100%;height:100%;margin:0;aspect-ratio:auto;background-position:center top}
body[data-petro-hero] #top .film::after{display:block;background:linear-gradient(90deg,rgba(4,36,26,.44),rgba(4,36,26,.1) 42%,transparent 65%)}
body[data-petro-hero] #top .scrim{height:28%;background:linear-gradient(0deg,rgba(4,36,26,.92),transparent)}
body[data-petro-hero] #top .copy{align-self:center;max-width:52%;padding-top:20px}
body[data-petro-hero] #top .welcome{font-size:clamp(45px,5.4vw,84px)}
body[data-petro-hero] #top .credit{position:absolute;left:5%;right:auto;bottom:155px;margin:0;align-items:flex-start;text-align:left;gap:5px}
body[data-petro-hero] #top .credit .line{font-size:13px;line-height:1.4}
body[data-petro-hero] #top .credit .name{font-size:12px;color:#f3ede2}
body[data-petro-hero] #top::after{display:none}
body[data-petro-hero] .petro-action-rail{display:none}
body[data-petro-hero] #ask.hero-issues{position:relative;z-index:5;margin-top:-115px;padding:0 0 22px;border:0;overflow:hidden;background:linear-gradient(180deg,transparent 0 115px,#fff 115px);color:#484848}
.hero-issues .showroom-heading{height:38px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;gap:18px;color:#f3ede2}
.hero-issues .showroom-heading h2{font:400 23px/1.2 Cochin,Georgia,serif;margin:0}
.hero-issues .showroom-heading>a{font:400 12px/1.4 Jost,Arial,sans-serif;color:inherit;text-underline-offset:4px}
.hero-issues .showroom-track{padding:18px 5% 30px;gap:32px}
.hero-issues .issue-object{flex-basis:clamp(174px,17vw,225px);aspect-ratio:.72}
.hero-issues .object-mast{font-size:clamp(28px,2.8vw,38px)}
.hero-issues .object-title{font-size:clamp(23px,2.2vw,31px)}
.hero-issues .showroom-controls{padding-inline:5%}
/* A real link opens immediately; a non-interactive paper layer folds away. */
.issue-unfold{display:none;pointer-events:none;position:fixed;z-index:9998;inset:0;overflow:hidden;perspective:1600px;background:#fffefa}
.petro-opening .issue-unfold{display:block;animation:unfold-stage 1.5s ease both}
.unfold-book{position:absolute;top:50%;left:50%;width:min(72vw,400px);height:min(72vh,550px);transform:translate(-50%,-50%);perspective:1400px;transform-style:preserve-3d}
.unfold-cover{position:absolute;inset:0;transform-origin:left center;backface-visibility:hidden;padding:7% 7% 8%;animation:unfold-cover 1.25s cubic-bezier(.2,.65,.2,1) both}
.unfold-cover .object-mast{font-size:clamp(34px,7vw,63px)}
.unfold-cover .object-title{font-size:clamp(33px,6vw,54px)}
.unfold-paper{position:absolute;inset:0;padding:9%;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(ellipse at 100% 0,var(--issue-light),transparent 68%),linear-gradient(90deg,#dedbd5,#fffefa 8%);color:#484848;box-shadow:4px 10px 40px #3a2d341a;font:400 clamp(30px,5vw,50px)/1.07 Prata,Georgia,serif;border-right:4px double #ddd;animation:unfold-paper 1.5s cubic-bezier(.2,.65,.2,1) both}
.unfold-paper-mast{font-size:16px;letter-spacing:.15em}
@keyframes unfold-cover{0%,15%{transform:rotateY(0) rotate(-2deg)}80%,100%{transform:rotateY(-125deg) rotate(-2deg)}}
@keyframes unfold-paper{0%,40%{transform:scale(1)}100%{transform:scale(2.2);opacity:0}}
@keyframes unfold-stage{0%,45%{background:#fffefa;opacity:1}85%{background:transparent;opacity:1}100%{background:transparent;opacity:0;visibility:hidden}}
.petro-arrived-from-cover .petro-issue-cover-copy{animation:issue-copy-arrive .9s .55s both}
.issue-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.issue-reveal.issue-in-view{opacity:1;transform:none}
@keyframes issue-copy-arrive{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(max-width:760px){
 body:is([data-petro-showroom],[data-petro-edition]) .site-header.petro-shared-header{padding:13px 5%;gap:10px;flex-wrap:wrap}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .mast-name{font-size:29px!important}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header[data-menu-ready] .petro-menu-toggle{display:flex;width:auto;min-height:40px;margin:0;padding:8px 14px;font-size:11px;gap:14px}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-nav{flex-basis:100%;padding:12px 0 3px;gap:8px;grid-template-columns:1fr 1fr 1.2fr}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-nav a{white-space:normal;text-align:center;font-size:11px!important;min-height:44px;padding:8px 0}
 .issue-showroom{padding:20px 0 23px}
 .showroom-heading{display:block;padding:0 5%}
 .showroom-eyebrow{font-size:9px;margin-bottom:16px}
 .showroom-heading h1{font-size:clamp(35px,9.5vw,65px)}
 .showroom-invitation{margin:22px 0 0;font-size:18px;display:flex;align-items:baseline;justify-content:space-between;gap:10px}
 .showroom-invitation span{font-size:10px;margin:0}
 .showroom-track{gap:23px;padding:29px 6% 32px}
 .issue-object{flex-basis:clamp(160px,43vw,222px);aspect-ratio:.64}
 .object-face{padding:15px 13px 16px}
 .object-mast{font-size:30px}
 .object-edition{font-size:7px;margin-top:9px;padding-top:7px}
 .object-title{font-size:clamp(24px,6vw,32px);padding-top:10px}
 .object-invitation{font-size:8px;margin-top:15px}
 .issue-object[data-open-issue=hooded] .object-title{font-size:21px}
 .showroom-controls{padding:0 5%;font-size:11px}
 .showroom-playback{gap:10px}
 .showroom-controls button{font-size:10px}
 .showroom-rail:after{bottom:22px}
 .showroom-all{gap:14px}
 body[data-petro-hero] .site-header.petro-shared-header{padding:18px 5%;background:linear-gradient(180deg,#04241a55,transparent)}
 body[data-petro-hero] .site-header[data-menu-ready] .petro-menu-toggle{background:#ffffff17!important;border:1px solid #ffffff80!important;box-shadow:none!important;color:#f3ede2!important;backdrop-filter:blur(9px)}
 body[data-petro-hero] .site-header .site-nav.is-open{background:#0a4a34ed;border-radius:6px;padding:12px}
 body[data-petro-hero] #top.cover{height:calc(100svh - 145px);min-height:490px;max-height:780px;padding:0}
 body[data-petro-hero] #top .film{background-position:76% top}
 body[data-petro-hero] #top .film::after{background:linear-gradient(180deg,transparent 0 43%,#04241a44 67%,#04241ae6 100%)}
 body[data-petro-hero] #top .copy{position:absolute;left:5%;bottom:176px;max-width:90%;padding:0}
 body[data-petro-hero] #top .welcome{font-size:clamp(32px,8.5vw,48px);line-height:1}
 body[data-petro-hero] #top .credit{left:5%;right:auto;bottom:98px;gap:3px;text-align:left;align-items:flex-start}
 body[data-petro-hero] #top .credit .name{font-size:11px;letter-spacing:.12em}
 body[data-petro-hero] #top .credit .crule{display:none}
 body[data-petro-hero] #top .credit .line{font-size:10px;line-height:1.3}
 body[data-petro-hero] #ask.hero-issues{margin-top:-74px;background:linear-gradient(180deg,transparent 0 74px,#fff 74px);padding-bottom:16px}
 .hero-issues .showroom-heading{height:30px}
 .hero-issues .showroom-heading h2{font-size:19px}
 .hero-issues .showroom-heading>a{font-size:10px}
 .hero-issues .showroom-track{padding:14px 6% 27px;gap:24px}
 .hero-issues .issue-object{flex-basis:clamp(160px,39vw,210px);aspect-ratio:.72}
 .hero-issues .object-mast{font-size:27px}
 .hero-issues .object-title{font-size:clamp(23px,5.7vw,29px)}
 .hero-issues .object-invitation{font-size:7px}
 .hero-issues .object-edition{font-size:6px}
 .hero-issues .showroom-controls{font-size:10px}
}
/* Keep showroom and magazine pages on the shared compact phone header. */
@media(max-width:760px){
 body:is([data-petro-showroom],[data-petro-edition]) .site-header.petro-shared-header{display:block;min-height:70px;height:70px;padding:0 16px;gap:0}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-mast{display:grid;grid-template-columns:44px minmax(0,1fr) 56px;align-items:center;min-height:70px;padding:11px 0 10px}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .mast-brand{grid-column:2;display:flex;align-items:center;justify-content:center}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .mast-name{font-size:29px!important;padding-left:.14em;letter-spacing:.14em}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .mast-descriptor{display:none}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .mast-note{grid-column:3;display:flex!important;align-items:center;justify-content:flex-end;width:56px;height:44px;padding:0}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header[data-menu-ready] .petro-menu-toggle{display:grid;width:44px;min-width:44px;min-height:44px;margin:0;padding:0}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-nav{display:flex;justify-content:flex-start!important;flex-wrap:nowrap;gap:0!important;margin:0;padding:0 24px 36px;background:#fff;color:#484848;border:0;border-radius:0}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-nav a{width:100%;min-height:54px;padding:15px 2px;border-bottom:1px solid #d8d8d8;color:#484848!important;font:500 15px/1.4 "Instrument Sans",Arial,sans-serif!important;text-align:left;white-space:nowrap}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header .site-nav .nav-consult{justify-content:center;width:100%;min-height:44px;margin:20px 0 0;padding:12px 23px;border:1px solid rgba(255,255,255,.88)!important;border-radius:999px!important;background:radial-gradient(115% 120% at 18% -40%,rgba(255,255,255,.95),rgba(255,255,255,0) 66%),linear-gradient(175deg,rgba(255,255,255,.72),rgba(255,255,255,.12) 43%,rgba(127,227,190,.43) 73%,rgba(255,255,255,.65)),rgba(185,244,217,.98)!important;color:#484848!important;box-shadow:inset 0 2px 3px rgba(255,255,255,.98),inset 0 -3px 6px rgba(255,255,255,.88),inset 0 0 0 1px rgba(101,101,98,.13),0 5px 12px rgba(101,101,98,.16)!important}
 body:is([data-petro-showroom],[data-petro-edition]) .site-header[data-menu-open] .petro-menu-toggle{color:#484848!important}
}
@media(prefers-reduced-motion:reduce){.issue-showroom .object-drift,.issue-showroom .object-face:before,.petro-arrived-from-cover .petro-issue-cover-copy{animation:none!important}.issue-object,.object-face,.issue-reveal{transition:none!important;transform:none!important}.issue-reveal{opacity:1!important}.issue-showroom .showroom-pause{display:none!important}.petro-opening .issue-unfold{display:none!important}.showroom-track{scroll-behavior:auto}}
@media(forced-colors:active){.object-face{border:1px solid CanvasText;background:Canvas;color:CanvasText}.object-face:before{display:none}.showroom-heading h1 em{-webkit-text-fill-color:CanvasText;background:none}.issue-unfold{display:none!important}}
