/* Industry pages (18 Oct 2026). Shared by the four "Who we help" pages; built from the homepage components. */
/* YFS film: heading above the film, the film at hero width */
.pfy .yhead{max-width:860px;margin:0 0 28px}
.pfy .yhead .lead{margin-top:12px}
/* Who this is for: a plain, readable list (search engines and AI answers read it too) */
.wholist{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;border-top:1px solid var(--line,#e3dfd8)}
.wholist li{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px;padding:18px 0;border-bottom:1px solid var(--line,#e3dfd8);align-items:baseline}
.wholist li h3{font:400 24px/1.15 var(--serif,Newsreader),serif;margin:0;position:relative;padding-left:22px}
.wholist li h3:before{content:"";position:absolute;left:0;top:.42em;width:9px;height:9px;background:var(--red,#FF2E2E)}
.wholist li p{margin:0;color:var(--mute,#5b5b60);font-size:16px;line-height:1.5}
@media (max-width:900px){.wholist{grid-template-columns:1fr}.wholist li{grid-template-columns:1fr;gap:6px}}
/* Three people, three doors */
.doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:36px}
.doors figure{margin:0;background:#fff;display:flex;flex-direction:column}
.doors figure img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;filter:grayscale(1) contrast(1.05);transition:filter .6s ease}
.doors figure:hover img{filter:none}
.doors figcaption{padding:20px 22px 24px;display:flex;flex-direction:column;gap:10px;border-top:3px solid var(--red,#FF2E2E)}
.doors .dw{font:400 30px/1.1 var(--serif,Newsreader),serif;margin:0}
.doors .dw em{color:var(--red,#FF2E2E)}
.doors .tq{font:italic 400 20px/1.35 var(--serif,Newsreader),serif;margin:0}
.doors .dn{margin:0;font-size:15px;line-height:1.5;color:var(--mute,#5b5b60)}
.doors .dn b{color:var(--ink,#0A0A0B);font-weight:600}
@media (max-width:900px){.doors{grid-template-columns:1fr}.doors figure img{aspect-ratio:16/10}}
/* YFS: the rebuilt website playing on a laptop and a phone (muted loops), six audiences under the copy */
#work .art video.shot{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#0A0A0B;border-radius:10px;box-shadow:0 30px 70px -36px rgba(10,10,11,.55)}
#work .art video.phone{position:absolute;right:-2%;bottom:-8%;width:24%;aspect-ratio:720/1560;object-fit:cover;background:#0A0A0B;border-radius:22px;border:6px solid #0A0A0B;box-shadow:0 30px 60px -24px rgba(0,0,0,.55);z-index:2}
#work .six{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 20px}
#work .six li{position:relative;padding-left:18px;font:500 15px/1.4 var(--sans,"Hanken Grotesk"),sans-serif}
#work .six li:before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;background:var(--red,#FF2E2E)}
@media (max-width:900px){#work .six{grid-template-columns:1fr 1fr}}
/* Fashion & Beauty hero (18 Oct 2026, Olia): no TV opening; fashion moves slowly inside the red square instead */
.hx2 .sq video.sqv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(1.05);mix-blend-mode:multiply;opacity:.6;z-index:1;pointer-events:none}
@media (prefers-reduced-motion:reduce){.hx2 .sq video.sqv{display:none}}

/* 18 Oct (Olia): the Take 2 film sits in the premium film strip she chose on 17 Oct; one red play button under the question */
#yfs-film .pf-box .pf-play{left:50%!important;top:72%!important;width:clamp(56px,6vw,84px)!important;height:clamp(56px,6vw,84px)!important;transform:translate(-50%,-50%)!important;background:var(--red,#FF2E2E)!important;color:#fff!important;animation:pfPulseR 2.4s ease-out infinite!important}
#yfs-film .pf-box .pf-play svg{width:46%;height:46%;transform:translateX(7%)}
#yfs-film .pf-box:hover .pf-play{transform:translate(-50%,-50%) scale(1.06)!important}
#yfs-film .pf-box:has(.pf-end.on) .pf-play{top:72%!important}
@keyframes pfPulseR{0%{box-shadow:0 0 0 0 rgba(255,46,46,.45)}70%{box-shadow:0 0 0 22px rgba(255,46,46,0)}100%{box-shadow:0 0 0 0 rgba(255,46,46,0)}}
@media (max-width:700px){#yfs-film .pf-box .pf-play{width:40px!important;height:40px!important}}
@media (prefers-reduced-motion:reduce){#yfs-film .pf-box .pf-play{animation:none!important}}
/* 2026-10-17 · Film as a strip of film (Olia's choice, premium motion). Classes pfs-*; strip shows only while the film is paused */
.pfilm .pfs{position:relative;background:#0c0b0a;border-radius:3px;box-shadow:0 30px 60px -38px rgba(10,10,11,.55),0 2px 6px -3px rgba(10,10,11,.25);--band:32px}
.pfilm .pfs-band{position:relative;height:var(--band);overflow:hidden;contain:strict;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.pfilm .pfs-run{position:absolute;left:0;top:0;height:100%;display:flex;will-change:transform;transform:translate3d(0,0,0)}
.pfilm .pfs-u{position:relative;flex:none;height:100%;background-repeat:repeat-x;background-position:0 50%}
.pfilm .pfs-u span{position:absolute;left:var(--tx,10px);white-space:nowrap;font:600 var(--fz,8px)/1 var(--sans,"Hanken Grotesk",sans-serif);letter-spacing:.24em;color:rgba(226,160,74,.62);text-transform:uppercase}
.pfilm .pfs-t .pfs-u span{top:calc((var(--gap) - var(--fz,8px))/2)}
.pfilm .pfs-b .pfs-u span{bottom:calc((var(--gap) - var(--fz,8px))/2)}
.pfilm .pfs-u span b{font-weight:600;color:rgba(255,46,46,.78)}
.pfilm .pfs .pf-box{box-shadow:0 0 0 1px rgba(255,255,255,.035)}
.pfilm .pfs .pf-box::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:5;box-shadow:inset 0 0 0 1px rgba(0,0,0,.6),inset 0 0 40px rgba(0,0,0,.18)}
.pfilm .pfs::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;z-index:6;background:linear-gradient(115deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.035) 46%,rgba(255,255,255,0) 60%)}
@media (max-width:700px){.pfilm .pfs-u span{display:none}.pfilm .pfs{border-radius:2px}}
.pfilm .pfs,.pfilm .pfs::before{transition:background-color .7s ease,box-shadow .7s ease,opacity .7s ease}
.pfilm .pfs.is-playing{background-color:transparent;box-shadow:none}
.pfilm .pfs.is-playing::before{opacity:0}
.pfilm .pfs-band{visibility:visible;transition:opacity .7s ease,visibility 0s linear 0s}
.pfilm .pfs.is-playing .pfs-band{opacity:0;visibility:hidden;transition:opacity .7s ease,visibility 0s linear .7s}
/* 18 Oct 2026 (Olia): the YFS case study as a real photo book — foil-stamped cover, visible page edges, glossy black (before) and white (after) pages */
:is(#book,#books) .bk{position:relative;margin-top:clamp(28px,4vw,52px);display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:start}
:is(#book,#books) .bk-side{position:sticky;top:110px;padding-top:24px}
:is(#book,#books) .bk-side ol{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid rgba(10,10,11,.14)}
:is(#book,#books) .bk-side li{border-bottom:1px solid rgba(10,10,11,.1)}
:is(#book,#books) .bk-side button{all:unset;cursor:pointer;display:block;width:100%;padding:11px 0;font:400 14px/1.3 var(--sans,"Hanken Grotesk"),sans-serif;color:rgba(10,10,11,.6);transition:color .2s,padding .3s}
:is(#book,#books) .bk-side button:hover,:is(#book,#books) .bk-side button.on{color:#0A0A0B;padding-left:10px}
:is(#book,#books) .bk-side button.on{box-shadow:inset 2px 0 0 var(--red,#FF2E2E)}
:is(#book,#books) .bk-k{display:block;font:600 11px/1 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.24em;text-transform:uppercase;color:rgba(10,10,11,.5)}
:is(#book,#books) .bk-stage{position:relative;min-width:0;padding:18px 18px 34px;perspective:2400px}
:is(#book,#books) .bk-stage:after{content:"";position:absolute;left:8%;right:8%;bottom:10px;height:34px;background:radial-gradient(50% 50% at 50% 50%,rgba(10,10,11,.32),transparent 72%);filter:blur(12px);pointer-events:none;z-index:0}
:is(#book,#books) .bk-book{position:relative;margin:0 auto;z-index:1;transition:transform .9s cubic-bezier(.4,0,.2,1)}
:is(#book,#books) .bk-edge{position:absolute;z-index:0;pointer-events:none;border-radius:0;transition:opacity .4s;
 background:repeating-linear-gradient(90deg,#fdfdfd 0 1px,#d9d9d9 1px 1.6px,#f4f4f4 1.6px 2.4px),#eee;box-shadow:0 1px 0 rgba(0,0,0,.08),0 10px 18px -12px rgba(0,0,0,.5)}
:is(#book,#books) .bk-edge.l{background-blend-mode:normal;box-shadow:-3px 0 6px -3px rgba(0,0,0,.35),0 10px 18px -12px rgba(0,0,0,.5)}
:is(#book,#books) .bk-edge.r{box-shadow:3px 0 6px -3px rgba(0,0,0,.35),0 10px 18px -12px rgba(0,0,0,.5)}
:is(#book,#books) .bk-pg{container-type:size;overflow:hidden}
:is(#book,#books) .bk-in{position:absolute;inset:0;padding:7cqw 7.5cqw 7cqw;display:flex;flex-direction:column}
:is(#book,#books) .bk-dark{background:#0B0B0C;color:#fff}
:is(#book,#books) .bk-light{background:#fff;color:#0A0A0B}
/* gloss and the gutter: light catches the paper; the spine darkens the inner edge */
:is(#book,#books) .bk-in:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(118deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.09) 47%,rgba(255,255,255,0) 58%)}
:is(#book,#books) .bk-light .bk-in:before{background:linear-gradient(118deg,rgba(255,255,255,0) 38%,rgba(235,240,245,.16) 47%,rgba(255,255,255,0) 58%)}
:is(#book,#books) .bk-l .bk-in:after,:is(#book,#books) .bk-r .bk-in:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2}
:is(#book,#books) .bk-light.bk-l .bk-in:after{background:linear-gradient(90deg,rgba(0,0,0,.07) 0,rgba(0,0,0,0) 9%,rgba(0,0,0,0) 66%,rgba(255,255,255,.26) 83%,rgba(0,0,0,.06) 90%,rgba(0,0,0,.2) 96%,rgba(0,0,0,.42) 100%)}
:is(#book,#books) .bk-light.bk-r .bk-in:after{background:linear-gradient(270deg,rgba(0,0,0,.07) 0,rgba(0,0,0,0) 9%,rgba(0,0,0,0) 66%,rgba(255,255,255,.26) 83%,rgba(0,0,0,.06) 90%,rgba(0,0,0,.2) 96%,rgba(0,0,0,.42) 100%)}
:is(#book,#books) .bk-dark.bk-l .bk-in:after{background:linear-gradient(90deg,rgba(0,0,0,.4) 0,rgba(0,0,0,0) 9%,rgba(0,0,0,0) 66%,rgba(255,255,255,.07) 83%,rgba(0,0,0,.2) 91%,rgba(0,0,0,.6) 100%)}
:is(#book,#books) .bk-dark.bk-r .bk-in:after{background:linear-gradient(270deg,rgba(0,0,0,.4) 0,rgba(0,0,0,0) 9%,rgba(0,0,0,0) 66%,rgba(255,255,255,.07) 83%,rgba(0,0,0,.2) 91%,rgba(0,0,0,.6) 100%)}
:is(#book,#books) .stf__block{transition:clip-path .45s ease}
:is(#book,#books) .bk-under{position:absolute;z-index:0;pointer-events:none;overflow:visible}
:is(#book,#books) .bk-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:3cqw;border-bottom:1px solid currentColor;border-color:rgba(128,128,128,.35)}
:is(#book,#books) .bk-ba{font:600 2.7cqw/1 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.32em;text-transform:uppercase}
:is(#book,#books) .bk-dark .bk-ba{color:rgba(255,255,255,.8)}
:is(#book,#books) .bk-light .bk-ba{color:var(--red,#FF2E2E)}
:is(#book,#books) .bk-n{font:300 2.7cqw/1 var(--serif,"Newsreader"),serif;opacity:.6}
:is(#book,#books) .bk-t{margin:5cqw 0 0;font:300 7.6cqw/1.04 var(--serif,"Newsreader"),serif;letter-spacing:-.015em}
:is(#book,#books) .bk-p{margin:4cqw 0 0;font:400 3.1cqw/1.5 var(--sans,"Hanken Grotesk"),sans-serif;opacity:.82}
:is(#book,#books) .bk-s{font:italic 300 3.6cqw/1.4 var(--serif,"Newsreader"),serif}
:is(#book,#books) .bk-meta{margin-top:auto;font:600 2.3cqw/1 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.24em;text-transform:uppercase;opacity:.6}
:is(#book,#books) .bk-dark .bk-k{color:rgba(255,255,255,.55)}
:is(#book,#books) .bk-scr{position:relative;margin-top:5cqw;border-radius:1.2cqw;overflow:hidden;background:#1a1a1c;box-shadow:0 3cqw 6cqw -3cqw rgba(0,0,0,.6),0 0 0 1px rgba(128,128,128,.25)}
:is(#book,#books) .bk-bar{display:flex;gap:1cqw;padding:1.4cqw 2cqw;background:#242427}
:is(#book,#books) .bk-light .bk-bar{background:#ececee}
:is(#book,#books) .bk-bar b{width:1.4cqw;height:1.4cqw;border-radius:50%;background:rgba(128,128,128,.55)}
:is(#book,#books) .bk-scr video,:is(#book,#books) .bk-scr img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;background:#111}
:is(#book,#books) .bk-ul{list-style:none;margin:4.5cqw 0 0;padding:0;display:grid;gap:2.2cqw}
:is(#book,#books) .bk-ul li{position:relative;padding-left:4.6cqw;font:400 3cqw/1.42 var(--sans,"Hanken Grotesk"),sans-serif}
:is(#book,#books) .bk-ul li:before{content:"";position:absolute;left:0;top:.5em;width:1.5cqw;height:1.5cqw;background:var(--red,#FF2E2E)}
:is(#book,#books) .bk-f{position:absolute;bottom:3.6cqw;font:400 2.2cqw/1 var(--serif,"Newsreader"),serif;opacity:.45;z-index:3}
:is(#book,#books) .bk-l .bk-f{left:7.5cqw}:is(#book,#books) .bk-r .bk-f{right:14cqw}
:is(#book,#books) .bk-toc{list-style:none;margin:5cqw 0 0;padding:0;border-top:1px solid rgba(255,255,255,.2)}
:is(#book,#books) .bk-toc li{border-bottom:1px solid rgba(255,255,255,.12)}
:is(#book,#books) .bk-toc button{all:unset;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:4cqw;align-items:baseline;width:100%;padding:3cqw 0;color:#fff;transition:padding .3s}
:is(#book,#books) .bk-toc button:hover{padding-left:1.6cqw}
:is(#book,#books) .bk-toc span{font:600 2.3cqw/1 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.2em;color:var(--red,#FF2E2E)}
:is(#book,#books) .bk-toc b{font:300 4.6cqw/1.15 var(--serif,"Newsreader"),serif}
:is(#book,#books) .bk-toc i{font:italic 400 3.6cqw/1 var(--serif,"Newsreader"),serif;color:var(--red,#FF2E2E)}
/* documents scroll by on the page */
:is(#book,#books) .bk-docin{padding:6cqw 9cqw}
:is(#book,#books) .bk-doc{position:relative;flex:1;overflow:hidden;border-radius:.6cqw;-webkit-mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent)}
:is(#book,#books) .bk-docrun{height:100%;display:flex;flex-direction:column;transition:transform 1.1s cubic-bezier(.65,0,.35,1)}
:is(#book,#books) .bk-dsl{flex:none;height:100%;display:grid;place-items:center;padding:2cqw 0}
:is(#book,#books) .bk-dsl img{display:block;max-height:100%;max-width:100%;width:auto;height:auto;box-shadow:0 2.4cqw 5cqw -2.4cqw rgba(0,0,0,.4),0 0 0 1px rgba(0,0,0,.08)}
:is(#book,#books) .bk-doc{-webkit-mask-image:none;mask-image:none}
/* the cover: soft-touch black board, the YFS mark stamped in silver foil that catches the light */
:is(#book,#books) .bk-cover{background:#0d0d0f;color:#fff}
/* 18 Oct (Olia): premium like a printed book — black pebbled leather you can almost feel, the mark and lines stamped in foil that shines.
   Our colours only: red foil, white foil, black board. */
:is(#book,#books) .bk-cover .bk-in{justify-content:flex-start;align-items:center;padding:13cqw 12cqw 10cqw;background:radial-gradient(130% 90% at 25% 12%,rgba(255,255,255,.06),transparent 55%),radial-gradient(90% 70% at 80% 100%,rgba(0,0,0,.55),transparent 70%),url(../media/yfs/book/yb-leather.jpg) 0 0/220px,#0b0b0c}
:is(#book,#books) .bk-cover .bk-in:after{content:"";position:absolute;left:0;top:0;bottom:0;width:4.4cqw;background:linear-gradient(90deg,rgba(0,0,0,.75),rgba(255,255,255,.08) 52%,rgba(0,0,0,.45) 60%,rgba(0,0,0,.2));pointer-events:none}
:is(#book,#books) .bk-mos{position:relative;width:62cqw;aspect-ratio:1}
:is(#book,#books) .bk-mos img{display:block;width:100%;height:100%}
:is(#book,#books) .bk-mtiles i{position:absolute;width:12.5%;height:12.5%;padding:.35%;box-sizing:border-box;background-clip:content-box}
:is(#book,#books) .bk-mtiles i,:is(#book,#books) .bk-rf,:is(#book,#books) .bk-foil{background-image:linear-gradient(110deg,#5e0006 0%,#b5101a 22%,#ff3b30 36%,#ffc2b8 45%,#ff2e2e 52%,#c4121c 66%,#6e0008 84%,#a50e16 100%);background-size:280% 100%;animation:bkFoil 6.5s ease-in-out infinite}
:is(#book,#books) .bk-mtiles i{background-origin:content-box;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
:is(#book,#books) .bk-rf,:is(#book,#books) .bk-wf{-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 -.12cqw 0 rgba(0,0,0,.95)) drop-shadow(0 .12cqw 0 rgba(255,255,255,.12))}
:is(#book,#books) .bk-wf{display:block;background-image:linear-gradient(110deg,#8f8f94 0%,#e9e9ec 18%,#ffffff 30%,#ffe3df 38%,#ffffff 44%,#a7a7ac 54%,#f4f4f6 68%,#ffffff 80%,#9a9a9f 100%);background-size:280% 100%;animation:bkFoil 6.5s ease-in-out infinite}
@keyframes bkFoil{0%,100%{background-position:100% 0}50%{background-position:0 0}}
:is(#book,#books) .bk-cvrow{display:flex;align-items:center;gap:4.5cqw;margin-top:9cqw;width:62cqw;padding-top:5cqw;border-top:1px solid rgba(255,46,46,.55)}
:is(#book,#books) .bk-sign{width:15cqw;aspect-ratio:214/199;flex:none;-webkit-mask:url(../media/yfs/book/yfs-sign.svg) center/contain no-repeat;mask:url(../media/yfs/book/yfs-sign.svg) center/contain no-repeat;filter:drop-shadow(0 -.15cqw 0 rgba(0,0,0,.95)) drop-shadow(0 .15cqw 0 rgba(255,255,255,.14))}
:is(#book,#books) .bk-cvt{margin:0;font:600 2.6cqw/1.55 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.24em;text-transform:uppercase}
:is(#book,#books) .bk-cvt i{display:block;margin-top:.6cqw;font:italic 400 3.1cqw/1.4 var(--serif,"Newsreader"),serif;letter-spacing:0;text-transform:none}
:is(#book,#books) .bk-spine{position:absolute;left:1.1cqw;top:50%;transform:translateY(-50%) rotate(180deg);writing-mode:vertical-rl;font:600 1.9cqw/1 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.3em;text-transform:uppercase;z-index:3}
:is(#book,#books) .bk-back .bk-in{justify-content:center;text-align:center}
:is(#book,#books) .bk-q{margin:0;max-width:44cqw;font:400 3.4cqw/1.45 var(--serif,"Newsreader"),serif;color:#fff}
:is(#book,#books) .bk-back .btn{margin-top:7cqw}
:is(#book,#books) .bk-q em{font-style:italic}
:is(#book,#books) .bk-p66{position:absolute;left:50%;bottom:10cqw;width:34cqw;aspect-ratio:1336/419;transform:translateX(-50%);filter:drop-shadow(0 -.12cqw 0 rgba(0,0,0,.95)) drop-shadow(0 .12cqw 0 rgba(255,255,255,.12))}
:is(#book,#books) .bk-p66 i{position:absolute;inset:0;background-size:280% 100%;animation:bkFoil 6.5s ease-in-out infinite}
:is(#book,#books) .bk-p66 .w{background-image:linear-gradient(110deg,#8f8f94 0%,#e9e9ec 18%,#ffffff 30%,#ffe3df 38%,#ffffff 44%,#a7a7ac 54%,#f4f4f6 68%,#ffffff 80%,#9a9a9f 100%);-webkit-mask:url(../media/yfs/book/p66-logo-w.png) center/contain no-repeat;mask:url(../media/yfs/book/p66-logo-w.png) center/contain no-repeat}
:is(#book,#books) .bk-p66 .r{background-image:linear-gradient(110deg,#5e0006 0%,#b5101a 22%,#ff3b30 36%,#ffc2b8 45%,#ff2e2e 52%,#c4121c 66%,#6e0008 84%,#a50e16 100%);-webkit-mask:url(../media/yfs/book/p66-logo-r.png) center/contain no-repeat;mask:url(../media/yfs/book/p66-logo-r.png) center/contain no-repeat}
/* the lifted corner on every right-hand page, the cover included */
:is(#book,#books) .bk-curl{position:absolute;right:0;bottom:0;width:9cqw;height:9cqw;z-index:4;pointer-events:none;background:linear-gradient(to top left,#c9c9cc 0,#dedee2 49.3%,#ffffff 50.7%,#eaeaee 100%);filter:drop-shadow(-.7cqw -.7cqw .9cqw rgba(0,0,0,.22));animation:bkCurl 3.2s ease-in-out infinite}
:is(#book,#books) .bk-cover .bk-curl,:is(#book,#books) .bk-dark .bk-curl{background:linear-gradient(to top left,#e9e9ec 0,#f4f4f6 49.3%,#2a2a2e 50.7%,#141416 100%)}
@keyframes bkCurl{0%,100%{width:8cqw;height:8cqw}50%{width:11cqw;height:11cqw}}
:is(#book,#books) .bk-nav{grid-column:2;display:flex;align-items:center;justify-content:center;gap:22px;margin-top:6px}
:is(#book,#books) .bk-nav button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(10,10,11,.2);background:#fff;font:400 18px/1 var(--sans,"Hanken Grotesk"),sans-serif;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
:is(#book,#books) .bk-nav button:hover:not(:disabled){background:#0A0A0B;color:#fff;border-color:#0A0A0B}
:is(#book,#books) .bk-nav button:disabled{opacity:.3;cursor:default}
:is(#book,#books) .bk-pos{min-width:150px;text-align:center;font:600 11px/1 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.24em;text-transform:uppercase}
@media (max-width:1000px){:is(#book,#books) .bk{grid-template-columns:minmax(0,1fr)}:is(#book,#books) .bk-side{position:static;padding:0}:is(#book,#books) .bk-side ol{display:flex;gap:8px;overflow-x:auto;border:0;margin-top:10px;padding-bottom:4px;scrollbar-width:none}
 :is(#book,#books) .bk-side li{border:0;flex:none}:is(#book,#books) .bk-side button{padding:9px 14px;border:1px solid rgba(10,10,11,.18);border-radius:40px;font-size:13px;white-space:nowrap}:is(#book,#books) .bk-side button:hover,:is(#book,#books) .bk-side button.on{padding-left:14px;background:#0A0A0B;color:#fff;box-shadow:none}:is(#book,#books) .bk-nav{grid-column:1}:is(#book,#books) .bk-stage{padding:10px 8px 28px}}
@media (prefers-reduced-motion:reduce){:is(#book,#books) .bk-curl,:is(#book,#books) .bk-foil,:is(#book,#books) .bk-docrun{animation:none}}
/* 18 Oct (Olia): the three-people lead reads in three lines on a computer */
@media (min-width:1000px){#buyers .stack .lead{max-width:47rem}}
/* the empty half of a closed book must not cover the contents list */
:is(#book,#books) .bk-side{z-index:5}
:is(#book,#books) .stf__block{pointer-events:none}
:is(#book,#books) .bk-pg{pointer-events:auto}

/* 18 Oct (Olia): the case study sits on black, so the page edges and corners read better and it feels more premium */
:is(#book,#books){background:#0A0A0B;color:#fff}
:is(#book,#books) .h2x{color:#fff}:is(#book,#books) .lead{color:rgba(255,255,255,.72)}
:is(#book,#books) .bk-side .bk-k{color:rgba(255,255,255,.5)}
:is(#book,#books) .bk-side ol{border-color:rgba(255,255,255,.16)}:is(#book,#books) .bk-side li{border-color:rgba(255,255,255,.1)}
:is(#book,#books) .bk-side button{color:rgba(255,255,255,.6)}:is(#book,#books) .bk-side button:hover,:is(#book,#books) .bk-side button.on{color:#fff}
:is(#book,#books) .bk-stage:before{content:"";position:absolute;inset:-6% -4% -2%;background:radial-gradient(55% 60% at 50% 48%,rgba(255,255,255,.075),rgba(255,255,255,0) 70%);pointer-events:none;z-index:0}
:is(#book,#books) .bk-stage:after{background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.85),transparent 72%)}
:is(#book,#books) .bk-cover{box-shadow:0 0 0 1px rgba(255,255,255,.07)}
:is(#book,#books) .bk-nav button{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
:is(#book,#books) .bk-nav button:hover:not(:disabled){background:#fff;color:#0A0A0B;border-color:#fff}
:is(#book,#books) .bk-pos{color:#fff}
@media (max-width:1000px){:is(#book,#books) .bk-side button{border-color:rgba(255,255,255,.25)}:is(#book,#books) .bk-side button:hover,:is(#book,#books) .bk-side button.on{background:#fff;color:#0A0A0B}}

/* contents across the opening spread: chapters on the left, documents on the right, compact rows */
:is(#book,#books) .bk-toc{margin-top:3.6cqw}
:is(#book,#books) .bk-toc button{padding:1.15cqw 0}
:is(#book,#books) .bk-toc b{font:300 3.5cqw/1.15 var(--serif,"Newsreader"),serif}
:is(#book,#books) .bk-toc i{font-size:3cqw}
:is(#book,#books) .bk-tocl{border-color:rgba(10,10,11,.16)}:is(#book,#books) .bk-tocl li{border-color:rgba(10,10,11,.1)}:is(#book,#books) .bk-tocl button{color:#0A0A0B}
:is(#book,#books) .bk-ts{font-size:6.2cqw;margin-top:3.5cqw}
:is(#book,#books) .bk-k2{margin-top:5cqw}
/* 18 Oct (Olia): the whole case study fits one screen — heading and a short two-group list beside the book */
:is(#book,#books) .bk{grid-template-columns:230px minmax(0,1fr);margin-top:0}
:is(#book,#books) .bk-side{top:96px;padding-top:6px}
:is(#book,#books) .bk-side .h2x{font-size:clamp(30px,2.6vw,40px);line-height:1.05;margin:10px 0 22px}
:is(#book,#books) .bk-side .bk-k{margin:16px 0 4px}
:is(#book,#books) .bk-side ol{margin:6px 0 0;border-top:0}
:is(#book,#books) .bk-side li{border:0}
:is(#book,#books) .bk-side button{padding:3.5px 0;font-size:13px;line-height:1.35}
:is(#book,#books) .bk-side button:hover,:is(#book,#books) .bk-side button.on{padding-left:8px}
:is(#book,#books) .bk-nav{margin-top:0}
@media (max-width:1000px){:is(#book,#books) .bk-side .h2x{margin-bottom:8px}:is(#book,#books) .bk-side nav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}:is(#book,#books) .bk-side nav .bk-k{display:none}:is(#book,#books) .bk-side ol{display:flex;gap:8px;margin:0}}
/* contents: everything on the first page */
:is(#book,#books) .bk-cin .bk-toc{margin-top:2.6cqw}
:is(#book,#books) .bk-cin .bk-toc button{padding:.62cqw 0}
:is(#book,#books) .bk-cin .bk-toc b{font-size:3.05cqw}
:is(#book,#books) .bk-cin .bk-toc i{font-size:2.7cqw}
:is(#book,#books) .bk-cin .bk-k2{margin-top:4cqw}
/* page two: how to read the book, and the Take 2 slate (the founders' film will take this page later) */
:is(#book,#books) .bk-take{justify-content:center;align-items:center;text-align:center}
:is(#book,#books) .bk-howto{margin:0 0 9cqw;max-width:66cqw;font:300 5cqw/1.25 var(--serif,"Newsreader"),serif;color:#0A0A0B}
:is(#book,#books) .bk-howto em{font-style:italic;color:var(--red,#FF2E2E)}
:is(#book,#books) .bk-clap{position:relative;width:62cqw;padding-top:15cqw}
:is(#book,#books) .bk-stk{position:absolute;left:0;right:0;height:6.4cqw;border-radius:.6cqw;background:repeating-linear-gradient(-58deg,#f4f4f5 0 4.2cqw,#0b0b0c 4.2cqw 8.4cqw);box-shadow:0 0 0 .35cqw #0b0b0c inset,0 1.2cqw 2.4cqw -1.2cqw rgba(0,0,0,.5)}
:is(#book,#books) .bk-stk2{top:8cqw}
:is(#book,#books) .bk-stk1{top:1.4cqw;transform-origin:.8cqw 5.6cqw;transform:rotate(-16deg);animation:bkClap 5.5s cubic-bezier(.5,0,.3,1) infinite}
@keyframes bkClap{0%,62%,100%{transform:rotate(-16deg)}70%{transform:rotate(0)}76%{transform:rotate(-2deg)}80%{transform:rotate(0)}}
:is(#book,#books) .bk-slate{position:relative;background:url(../media/yfs/book/yb-leather.jpg) 0 0/160px,#0d0d0f;border-radius:.8cqw;padding:7cqw 6cqw 5cqw;box-shadow:0 3cqw 6cqw -3cqw rgba(0,0,0,.6)}
:is(#book,#books) .bk-p66s{position:relative;left:auto;bottom:auto;transform:none;display:block;width:40cqw;margin:0 auto}
:is(#book,#books) .bk-fields{display:grid;grid-template-columns:1fr 1fr;margin-top:6cqw;border-top:1px solid rgba(255,255,255,.35)}
:is(#book,#books) .bk-fields span{display:flex;flex-direction:column;align-items:flex-start;padding:2cqw 2.4cqw 0;text-align:left}
:is(#book,#books) .bk-fields span+span{border-left:1px solid rgba(255,255,255,.35)}
:is(#book,#books) .bk-fields small{font:600 1.8cqw/1 var(--sans,"Hanken Grotesk"),sans-serif;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.6)}
:is(#book,#books) .bk-fields b{margin-top:1.4cqw;font:400 6cqw/1 var(--serif,"Newsreader"),serif;color:#fff}
:is(#book,#books) .bk-fields .bk-red{color:var(--red,#FF2E2E);font-style:italic}
@media (prefers-reduced-motion:reduce){:is(#book,#books) .bk-stk1{animation:none}}

:is(#book,#books) .bk-under{filter:drop-shadow(0 14px 18px rgba(0,0,0,.6))}
:is(#book,#books).sec{padding-top:26px;padding-bottom:22px}
:is(#book,#books) .bk-side .eyebrow{font-size:10px;letter-spacing:.2em;white-space:nowrap}
:is(#book,#books) .bk-stage{padding-top:10px;padding-bottom:22px}
:is(#book,#books) .bk-clap{padding-top:21cqw}
:is(#book,#books) .bk-howto{margin-bottom:4cqw}
:is(#book,#books).sec{padding-top:18px;padding-bottom:8px}
:is(#book,#books) .bk-stage{padding-bottom:14px}
/* slate: the sticks sit right on the board, the top one hinged at the left */
:is(#book,#books) .bk-clap{padding-top:26cqw}
:is(#book,#books) .bk-stk2{top:19.6cqw;border-radius:.4cqw .4cqw 0 0}
:is(#book,#books) .bk-stk1{top:13.1cqw;transform-origin:.9cqw 6.4cqw;transform:rotate(-12deg)}
@keyframes bkClap{0%,62%,100%{transform:rotate(-12deg)}70%{transform:rotate(0)}76%{transform:rotate(-2deg)}80%{transform:rotate(0)}}
:is(#book,#books) .bk-slate{border-radius:0 0 .8cqw .8cqw}
:is(#book,#books) .bk-howto{margin-bottom:2cqw}
@media (max-width:1000px){:is(#book,#books) .bk{grid-template-columns:minmax(0,1fr)}:is(#book,#books) .bk-side{position:static}:is(#book,#books) .bk-nav{grid-column:1}:is(#book,#books) .bk-side button{padding:8px 14px;font-size:13px}:is(#book,#books) .bk-side nav{gap:8px}}
@media (max-width:1000px){:is(#book,#books) .bk-side nav ol{flex:none;overflow:visible;padding:0}:is(#book,#books) .bk-side nav li{flex:none}:is(#book,#books) .bk-side nav{padding-bottom:4px}}
@media (max-width:1000px){:is(#book,#books) .bk-side nav button{width:auto;display:inline-block;white-space:nowrap}}
/* before pages where the old site had nothing to show: the words carry the page */
:is(#book,#books) .bk-none{margin:auto 0;padding-bottom:10cqw;font:300 6cqw/1.3 var(--serif,"Newsreader"),serif;color:rgba(255,255,255,.88)}

/* music on/off: three small bars that move while the music plays */
:is(#book,#books) .bk-mus{display:flex!important;align-items:flex-end;justify-content:center;gap:3px;padding:0 0 15px}
:is(#book,#books) .bk-mus i{display:block;width:3px;height:14px;background:currentColor;transform-origin:bottom;animation:bkEq 1.1s ease-in-out infinite}
:is(#book,#books) .bk-mus i:nth-child(2){animation-delay:-.4s}:is(#book,#books) .bk-mus i:nth-child(3){animation-delay:-.7s}
:is(#book,#books) .bk-mus.off i{animation:none;transform:scaleY(.25)}
@keyframes bkEq{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){:is(#book,#books) .bk-mus i{animation:none;transform:scaleY(.6)}}
/* 18 Oct 2026 · Personal Brands page: one name many businesses, the details */
.pb-many .ed{align-items:center}
.pb-many .art{position:relative}
.pb-many .pb-pil{display:block;width:100%;aspect-ratio:6/5;object-fit:cover;border-radius:6px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.pb-sides{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.pb-sides li{font:500 13px/1 var(--sans,'Hanken Grotesk'),sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:11px 14px;border:1px solid rgba(255,255,255,.22);border-radius:999px}
.pb-sides li:last-child{border-color:#FF2E2E;color:#fff;background:#FF2E2E}
.pb-det{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:40px}
.pb-d{margin:0}
.pb-dm{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:6px;background:#0A0A0B}
.pb-dv,.pb-dm img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pb-d2 .pb-dm{background:radial-gradient(120% 80% at 50% 30%,#14213f 0%,#0A0A0B 70%)}
.pb-d2 .pb-dm img{object-fit:contain;padding:7% 12%;box-sizing:border-box}
.pb-d3 .pb-dm{background:#f3f2ef}
.pb-d3 .pb-dm img{inset:6% 8% auto;width:84%;height:auto;object-fit:contain;border-radius:4px;box-shadow:0 18px 40px -18px rgba(0,0,0,.45)}
.pb-d figcaption h3{font:400 24px/1.15 var(--serif,Newsreader),serif;margin:18px 0 6px}
.pb-d figcaption p{margin:0;color:var(--muted,#5b5852);font-size:15px;line-height:1.55}
@media (max-width:900px){.pb-det{grid-template-columns:1fr;gap:36px}.pb-dm{aspect-ratio:4/4.4}}
/* Personal Brands hero: the bestseller rests against the portrait */
.hx2 .stage .pb-hbook{position:absolute;left:47%;bottom:-7%;width:17%;z-index:5;transform:rotate(5deg);filter:drop-shadow(0 22px 26px rgba(0,0,0,.42));border-radius:2px}
@media (max-width:900px){.hx2 .stage .pb-hbook{width:22%;left:52%;bottom:-5%}}
/* Personal Brands: the longer question sits on two lines */
[data-sid="P66-PERSON-02"] .ohead h2 .hw1,[data-sid="P66-PERSON-02"] .ohead h2 .ht{display:block}
@media (max-width:700px){[data-sid="P66-PERSON-02"] .ohead h2{white-space:normal}}
.pcard .pb-bookimg{background:radial-gradient(80% 70% at 50% 40%,#f4f4f5,#e4e4e7);padding:6% 0}
.pcard .pb-bookimg img{filter:drop-shadow(0 16px 18px rgba(0,0,0,.28))}
/* Personal Brands · One personal brand, every piece (the homepage tabs with the client's real work) */
[data-sid="P66-PERSON-06"] .ty2 .pb-ty{height:1em;width:auto;display:block}
[data-sid="P66-PERSON-06"] .bb-mono{width:24cqw}
[data-sid="P66-PERSON-06"] .l3 img{max-height:72%}
[data-sid="P66-PERSON-06"] .pb-use{display:flex;gap:1.6cqw;align-items:flex-start}
[data-sid="P66-PERSON-06"] .pb-use img{height:13cqh;width:auto;border-radius:2px;box-shadow:0 6px 16px -8px rgba(0,0,0,.35)}
[data-sid="P66-PERSON-06"] .pb-br{background:#0b0d14}
[data-sid="P66-PERSON-06"] .pb-br .br-bar{position:relative;z-index:2}
[data-sid="P66-PERSON-06"] .pb-brv{position:absolute;left:0;right:0;bottom:0;top:var(--barh,5.6cqh);width:100%;height:calc(100% - var(--barh,5.6cqh));object-fit:cover;object-position:50% 0}
[data-sid="P66-PERSON-06"] .rph video{object-fit:cover}
[data-sid="P66-PERSON-06"] .rp-top img{height:1.6em;width:auto;border-radius:0}
[data-sid="P66-PERSON-06"] .pb-lead{grid-template-columns:.8fr 1fr 1.25fr;grid-template-rows:1fr;padding:6cqh 4cqw 12cqh;align-items:center}
[data-sid="P66-PERSON-06"] .pb-lead .lg-mail{grid-column:auto}
.pb-lgbook{display:flex;flex-direction:column;align-items:center;gap:1.6cqh;text-align:center}
.pb-lgbook img{width:72%;transform:rotate(-3deg);filter:drop-shadow(0 14px 16px rgba(0,0,0,.3))}
.pb-lgbook p{margin:0;font:400 clamp(11px,1.5cqw,18px)/1.3 var(--serif)}
.pb-lgscore{display:grid;place-items:center;background:#03050E;border-radius:10px;padding:2cqh 0}
.pb-lgscore img{width:70%;height:auto}
/* 18 Oct (Olia): this section shows the client, so it takes the client's look: night and white backgrounds, her blue, no red, no beige */
.wd[data-sid="P66-PERSON-06"]{--paper:#03050E;--red:#2F6DF6;--act:#2F6DF6;background:#03050E}
.wd[data-sid="P66-PERSON-06"] .wd-h .rd{color:#5B8CFF}
.wd[data-sid="P66-PERSON-06"] .sc-brand{background:#0B0F1C}
.wd[data-sid="P66-PERSON-06"] .bb{background:#fff}
.wd[data-sid="P66-PERSON-06"] .bb-l{border-color:#e6e9f0}
.wd[data-sid="P66-PERSON-06"] .lv .l1{background:#F4F7FC}
.wd[data-sid="P66-PERSON-06"] .br-bar .tab{background:#fff!important}
.wd[data-sid="P66-PERSON-06"] .sc-soc{background:#0B0F1C}
.wd[data-sid="P66-PERSON-06"] .feed .qt{background:#0136F2}
.wd[data-sid="P66-PERSON-06"] .sc-lead{background:#F4F7FC}
.wd[data-sid="P66-PERSON-06"] .call{background:linear-gradient(170deg,#0b1f6b,#03050E 60%)}
.wd[data-sid="P66-PERSON-06"] .sc-call{background:#03050E}
.wd[data-sid="P66-PERSON-06"] .wd-stage :is(p,b,small,span,em,i,h3,label,div){font-family:var(--sans,"Hanken Grotesk"),sans-serif}
/* sound icon on a film inside the tabs (wd.js) */
.wd .wd-snd{position:absolute;right:2.4cqw;bottom:3cqh;z-index:6;width:clamp(38px,4.4cqw,52px);height:clamp(38px,4.4cqw,52px);border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(3,5,14,.55);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(6px);transition:background .25s}
.wd .wd-snd:hover{background:rgba(3,5,14,.8)}
.wd .wd-snd svg{width:55%;height:55%}
.wd .wd-snd .m-on{display:none}.wd .wd-snd[aria-pressed=true] .m-on{display:inline}.wd .wd-snd[aria-pressed=true] .m-off{display:none}
.wd .rph .wd-snd{top:7%;bottom:auto;right:7%;width:clamp(30px,3.4cqw,42px);height:clamp(30px,3.4cqw,42px)}
/* Personal Brands Take 2 film on phones (18 Oct 2026): the vertical film, so the box turns 9:16 and the play button sits under the question */
@media (max-width:700px){#take2 .pf-box{aspect-ratio:9/16}#take2 .pf-box .pf-play{top:58%!important}}
/* ---- Software & AI page (18 Oct 2026): Possena as client work, in Possena's own look inside the tabs and the book; our look everywhere else */
.sw-phonev{aspect-ratio:4/5;background:#030a1e;display:grid;place-items:center;overflow:hidden}
.sw-phonev video{height:94%;width:auto;aspect-ratio:1080/2337;border-radius:22px;border:6px solid #111;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);object-fit:cover;display:block}
.pcard .sw-pcimg{background:radial-gradient(80% 70% at 50% 40%,#0a1730,#030a1e);display:grid;place-items:center;padding:12% 0}
.pcard .sw-pcimg img{width:42%;height:auto;aspect-ratio:auto;object-fit:contain}
.wd[data-sid="P66-SOFT-05"]{--paper:#030a1e;--red:#2e6bff;--act:#2e6bff;background:#030a1e}
.wd[data-sid="P66-SOFT-05"] .wd-h .rd{color:#6ea5ff}
.wd[data-sid="P66-SOFT-05"] .sc-brand{background:#0a1730}
.wd[data-sid="P66-SOFT-05"] .bb{background:#fff}
.wd[data-sid="P66-SOFT-05"] .bb-l{border-color:#d8e2f0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4cqh}
.wd[data-sid="P66-SOFT-05"] .bb-mono{width:24cqw}
.wd[data-sid="P66-SOFT-05"] .sw-sig{width:26cqw;height:auto}
.wd[data-sid="P66-SOFT-05"] .lv .l1{background:#f6f8fc}
.wd[data-sid="P66-SOFT-05"] .lv .l2{background:#030a1e}
.wd[data-sid="P66-SOFT-05"] .lv img{max-height:46%;width:auto}
.wd[data-sid="P66-SOFT-05"] .ty2 .pb-ty{height:1em;width:auto;display:block}
.wd[data-sid="P66-SOFT-05"] .pb-use{display:flex;gap:1.6cqw;align-items:flex-start}
.wd[data-sid="P66-SOFT-05"] .pb-use img{height:13cqh;width:auto;border-radius:3px;box-shadow:0 6px 16px -8px rgba(0,0,0,.35)}
.wd[data-sid="P66-SOFT-05"] .pb-br{background:#030a1e}
.wd[data-sid="P66-SOFT-05"] .pb-br .br-bar{position:relative;z-index:2}
.wd[data-sid="P66-SOFT-05"] .br-bar .tab{background:#fff!important}
.wd[data-sid="P66-SOFT-05"] .pb-brv{position:absolute;left:0;right:0;bottom:0;top:var(--barh,5.6cqh);width:100%;height:calc(100% - var(--barh,5.6cqh));object-fit:cover;object-position:50% 0}
.wd[data-sid="P66-SOFT-05"] .sc-soc{background:#0a1730}
.wd[data-sid="P66-SOFT-05"] .feed .qt{background:#2e6bff}
.wd[data-sid="P66-SOFT-05"] .rph video{object-fit:cover}
.wd[data-sid="P66-SOFT-05"] .rp-top img{height:1.2em;width:auto;border-radius:0}
.wd[data-sid="P66-SOFT-05"] .sc-lead{background:#f6f8fc}
.wd[data-sid="P66-SOFT-05"] .pb-lead{grid-template-columns:1.1fr .8fr 1.1fr;grid-template-rows:1fr;padding:6cqh 4cqw 12cqh;align-items:center}
.wd[data-sid="P66-SOFT-05"] .pb-lead .lg-mail{grid-column:auto}
.wd[data-sid="P66-SOFT-05"] .sw-onb{background:#030a1e}
.wd[data-sid="P66-SOFT-05"] .sc-auto{background:#030a1e}
.wd[data-sid="P66-SOFT-05"] .wd-stage :is(p,b,small,span,em,i,h3,label,div){font-family:"Switzer",var(--sans,"Hanken Grotesk"),sans-serif}
.sw-lgimg{border-radius:12px;overflow:hidden;box-shadow:0 18px 40px -24px rgba(7,20,47,.4)}
.sw-lgimg img{width:100%;height:auto;display:block}
.sw-free{background:#fff;border:1px solid #d8e2f0;border-radius:14px;padding:3cqh 2cqw;display:flex;flex-direction:column;gap:1cqh;text-align:left;color:#08152b}
.sw-free b{font:600 clamp(14px,2.4cqw,30px)/1 sans-serif;letter-spacing:-.02em}
.sw-free p{margin:0;font:500 clamp(9px,1.2cqw,15px)/1.3 sans-serif}
.sw-free small{font:400 clamp(7px,.9cqw,12px)/1.35 sans-serif;color:#405777}
.sw-free em{align-self:flex-start;margin-top:1cqh;font:600 normal clamp(8px,1cqw,13px)/1 sans-serif;color:#fff;background:linear-gradient(180deg,#245bde,#1b47ce);padding:1.2cqh 1.4cqw;border-radius:10px}
.bk .sw-res{list-style:none;margin:2.4cqh 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:2.6cqh 2cqw}
.bk .sw-res li{display:flex;flex-direction:column;gap:.6cqh;border-top:1px solid rgba(10,10,11,.14);padding-top:1.4cqh}
.bk .sw-res b{font:400 clamp(18px,3.4cqw,40px)/1 var(--serif);color:#0A0A0B}
.bk .sw-res span{font:500 clamp(9px,1.05cqw,13px)/1.3 var(--sans);color:#5b5852}
/* the two Software & AI films on phones: the vertical cut, so the box turns 9:16 and the play button sits under the middle line */
@media (max-width:700px){[data-sid="P66-SOFT-01F"] .pf-box,[data-sid="P66-SOFT-06F"] .pf-box{aspect-ratio:9/16}[data-sid="P66-SOFT-01F"] .pf-box .pf-play,[data-sid="P66-SOFT-06F"] .pf-box .pf-play{top:62%!important}}
/* Software & AI hero (18 Oct 2026): its headline is five lines, so the art is held at the top of the column, at the same height as on Personal Brands, instead of sinking with the longer text */
@media (min-width:901px){.hero[data-sid="P66-SOFT-01"] .grid12{align-items:start}.hero[data-sid="P66-SOFT-01"] .stage{margin-top:5px}}
/* Olia, 18 Oct 2026: the headline already takes five lines, so the subheader takes three, same text, using the full text column */
@media (min-width:901px){.hero[data-sid="P66-SOFT-01"] .lede{max-width:none}}
/* ---- Hospitality & Restaurants (19 Oct 2026): Atelier Mercer, our concept restaurant, in its own look: obsidian, ivory, brushed gold, Marcellus and Cormorant */
@font-face{font-family:"Marcellus";src:url(../media/am/fonts/marcellus.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Cormorant";src:url(../media/am/fonts/cormorant-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Cormorant";src:url(../media/am/fonts/cormorant-500i.woff2) format("woff2");font-weight:500;font-style:italic;font-display:swap}
.pcard .am-pcimg{background:radial-gradient(80% 70% at 50% 40%,#2a2620,#0b0b0b);display:grid;place-items:center;padding:10% 0}
.pcard .am-pcimg img{width:44%;height:auto;aspect-ratio:1;object-fit:contain}
.wd[data-sid="P66-HOSP-05"]{--paper:#0b0b0b;--red:#c6a15b;--act:#c6a15b;background:#0b0b0b}
.wd[data-sid="P66-HOSP-05"] .wd-h .rd{color:#d9b97a}
.wd[data-sid="P66-HOSP-05"] .sc-brand{background:#16140f}
.wd[data-sid="P66-HOSP-05"] .bb{background:#f4efe5}
.wd[data-sid="P66-HOSP-05"] .bb-l{border-color:#e2d9c8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3cqh}
.wd[data-sid="P66-HOSP-05"] .bb-mono{width:20cqw}
.wd[data-sid="P66-HOSP-05"] .am-glass{width:15cqw;height:auto;border-radius:4px;box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.wd[data-sid="P66-HOSP-05"] .lv .l1{background:#f4efe5}
.wd[data-sid="P66-HOSP-05"] .lv .l2{background:#0b0b0b}
.wd[data-sid="P66-HOSP-05"] .lv img{max-height:62%;width:auto}
.wd[data-sid="P66-HOSP-05"] .sw i{background:var(--c)}
.wd[data-sid="P66-HOSP-05"] .ty2 .pb-ty{height:1em;width:auto;display:block}
.wd[data-sid="P66-HOSP-05"] .pb-use{display:flex;gap:1.4cqw;align-items:flex-start}
.wd[data-sid="P66-HOSP-05"] .pb-use img{height:13cqh;width:auto;border-radius:3px;box-shadow:0 6px 16px -8px rgba(0,0,0,.45)}
.wd[data-sid="P66-HOSP-05"] .am-web{background:radial-gradient(70% 60% at 50% 45%,#2a2620,#0b0b0b);display:flex;align-items:center;justify-content:center;gap:2cqw}
.wd[data-sid="P66-HOSP-05"] .am-web img{height:84cqh;width:auto;display:block}
.wd[data-sid="P66-HOSP-05"] .sc-soc{background:#16140f}
.wd[data-sid="P66-HOSP-05"] .feed .qt{background:#0b0b0b;border:1px solid #c6a15b}
.wd[data-sid="P66-HOSP-05"] .feed .qt p{font-family:"Marcellus",serif;letter-spacing:.04em;color:#f4efe5}
.wd[data-sid="P66-HOSP-05"] .rph video{object-fit:cover}
.wd[data-sid="P66-HOSP-05"] .rp-top img{height:.9em;width:auto;border-radius:0}
.wd[data-sid="P66-HOSP-05"] .sc-lead{background:#16140f}
.wd[data-sid="P66-HOSP-05"] .pb-lead{grid-template-columns:.8fr .8fr 1.1fr;grid-template-rows:1fr;padding:5cqh 4cqw 11cqh;align-items:center}
.wd[data-sid="P66-HOSP-05"] .pb-lead .lg-mail{grid-column:auto}
.wd[data-sid="P66-HOSP-05"] .pb-lead .ch{color:#cfc6b6}
.wd[data-sid="P66-HOSP-05"] .am-ph img{height:62cqh;width:auto;display:block;margin:0 auto}
.wd[data-sid="P66-HOSP-05"] .am-bk{background:#0b0b0b}
.wd[data-sid="P66-HOSP-05"] .sc-auto{background:#0b0b0b}
.wd[data-sid="P66-HOSP-05"] .wd-stage .nd b,.wd[data-sid="P66-HOSP-05"] .wd-stage .crow b{font-family:"Marcellus",serif;font-weight:400;letter-spacing:.03em}
:is(#book) .am-bkph img{object-fit:contain;object-position:50% 50%;background:#16140f}
#work .am-art{position:relative}
#work .am-art .shot{display:block;width:88%;height:auto;border-radius:10px;box-shadow:0 30px 70px -36px rgba(10,10,11,.55)}
#work .am-art .am-phonestill{position:absolute;right:-2%;bottom:-12%;width:30%;height:auto;z-index:3;filter:drop-shadow(0 30px 40px rgba(0,0,0,.35))}
/* Software & AI details (19 Oct 2026): the cliché panel is shown whole, on Possena's navy, never cropped */
[data-sid="P66-SOFT-04"] .pb-d2 .pb-dm{background:#030a1e}
[data-sid="P66-SOFT-04"] .pb-d2 .pb-dv{object-fit:contain}

/* Hospitality: the longer section title ("They found you. Then they booked someone else.") takes two lines, 19 Oct 2026 */
[data-sid="P66-HOSP-02"] .ohead h2{white-space:normal}
[data-sid="P66-HOSP-02"] .ohead .ht{display:block}
