@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url('/wp-content/themes/bookkreative/site/assets/fonts/InterVariable.woff2') format('woff2')}
@font-face{font-family:Inter;font-style:italic;font-weight:100 900;font-display:swap;src:url('/wp-content/themes/bookkreative/site/assets/fonts/InterVariable-Italic.woff2') format('woff2')}
:root{--ink:#211f1d;--paper:#f3f0ea;--accent:#a50a04;--accent-light:#ef796e;--muted:#aaa39d;--line:#ffffff26;--serif:'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;--sans:'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--sans);font-size:16px;-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,a:focus-visible,[tabindex]:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:6px}button{color:inherit}::selection{background:rgba(160,160,160,.2);color:inherit}h1,h2,h3,p{margin:0}button{border:0}a,button{touch-action:manipulation}.skip-link{position:fixed;top:-100px;left:20px;z-index:100;background:var(--accent);color:var(--ink);padding:16px}.skip-link:focus{top:10px}.site-header{height:94px;display:flex;align-items:center;justify-content:space-between;margin:0 4.5%;border-bottom:1px solid var(--line);position:relative;z-index:10}.brand{display:flex;align-items:center;font-weight:650;font-size:26px;letter-spacing:-1.25px;gap:11px}.brand-dot{align-self:flex-start;font-size:11px;padding-top:3px;letter-spacing:0;margin-left:-7px}.brand-symbol{display:flex;gap:3px;align-items:center;height:28px;transform:rotate(-8deg)}.brand-symbol i{height:22px;width:7px;background:var(--accent);transform:skewY(-22deg)}.brand-symbol i:nth-child(2){height:29px}.brand-symbol i:nth-child(3){height:24px;transform:skewY(22deg)}nav{display:flex;gap:30px;font-size:14px}nav a{padding:12px 0;color:#d5cfca}nav a:hover{color:var(--accent)}.header-cta{background:transparent;border:1px solid #827771;padding:13px 17px;font-size:13px;display:flex;gap:34px;align-items:center}.header-cta:hover{background:var(--accent);color:var(--ink);border-color:var(--accent)}.menu-toggle{display:none}.hero{min-height:760px;height:calc(100svh - 94px);max-height:1080px;position:relative;isolation:isolate;padding:0 4.5%;overflow:hidden}.hero-copy{position:relative;z-index:3;width:55%;padding:64px 0 130px;pointer-events:none}.hero-copy a{pointer-events:auto}h1{font-size:clamp(76px,7.9vw,130px);line-height:.94;letter-spacing:-.068em;font-weight:450}h1 em{font-family:var(--serif);font-weight:400;color:var(--accent);letter-spacing:-.07em}.hero-copy p{font-size:16px;color:#beb6b0;line-height:1.65;margin:27px 0}.button{padding:16px 23px;display:inline-flex;align-items:center;gap:40px;font-size:14px;font-weight:500;border:1px solid transparent;transition:background .2s,transform .2s}.button:hover{transform:translateY(-3px)}.button span{font-size:20px;line-height:1}.accent{background:var(--accent);color:var(--ink)}.hero-art{position:absolute;right:4.5%;top:75px;width:51%;height:calc(100% - 150px);perspective:1400px}.hero-art:before{content:'';position:absolute;inset:1% -15% -10%;background:radial-gradient(ellipse at 60% 48%,#bfb9a724,transparent 63%);z-index:-2}.book-3d{position:absolute;width:290px;height:415px;transform-style:preserve-3d;transform:rotateX(8deg) rotateY(-22deg) rotateZ(9deg);--depth:36px;touch-action:pan-y;cursor:default}.hero-book{left:38%;top:15%;z-index:3}.book-3d:active{cursor:default}.book-front{position:absolute;inset:0;transform:translateZ(18px);backface-visibility:hidden;background:#243135;box-shadow:inset 3px 0 4px #ffffff26,inset 8px 0 8px #0006;border-radius:1px 4px 4px 1px;overflow:hidden}.book-back{position:absolute;inset:0;background:#182629;transform:translateZ(-18px) rotateY(180deg)}.book-pages{position:absolute;top:5px;bottom:5px;width:32px;right:-16px;transform:rotateY(90deg);background:repeating-linear-gradient(90deg,#d1c9ae 0px,#e9e4d4 1px,#e9e4d4 3px);box-shadow:inset 5px 0 8px #0003}.book-spine{position:absolute;width:36px;left:-18px;top:0;bottom:0;transform:rotateY(-90deg);background:#293b3a;color:#e6dec6;display:flex;align-items:center;justify-content:space-around;writing-mode:vertical-rl;font-family:var(--serif);font-size:16px;letter-spacing:2px}.book-spine small{font-family:var(--sans);font-size:9px;letter-spacing:2px}.atlas-cover{padding:26px 24px;color:#dedccc;text-align:center;background:radial-gradient(ellipse at 53% 68%,#617d79,#1d333b 48%,#182728 85%)}.atlas-cover:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#06121555,transparent 35%,#020d18bb)}.atlas-cover>small{font-size:9px;letter-spacing:5px}.atlas-cover h2{font-family:var(--serif);font-weight:400;font-size:54px;line-height:.88;letter-spacing:-3px;margin-top:27px}.atlas-cover h2 em{font-weight:400}.atlas-cover p{position:absolute;bottom:55px;left:0;width:100%;font:italic 12px/1.3 var(--serif)}.atlas-cover strong{position:absolute;bottom:24px;left:0;width:100%;font-size:10px;letter-spacing:4px;font-weight:400}.cover-door{width:37px;height:61px;position:absolute;bottom:96px;left:calc(50% - 18px);background:#f9e7a9;box-shadow:0 0 38px #ffcb5288;border:5px solid #131d1e;border-bottom:0}.book-shadow{position:absolute;bottom:12%;left:20%;height:50px;width:75%;border-radius:50%;background:#0009;filter:blur(25px);transform:rotate(-14deg)}dialog{color:var(--ink);background:var(--paper);border:0;width:min(900px,92vw);max-height:90svh;padding:64px}dialog::backdrop{background:#080b09c9;backdrop-filter:blur(10px)}.dialog-close{position:absolute;top:17px;right:20px;background:transparent;color:var(--ink);font-size:32px;line-height:1;padding:5px 10px;z-index:2}body:has(dialog[open]){overflow:hidden}
@media(min-width:1600px){.hero-book{width:350px;height:500px}.atlas-cover h2{font-size:70px}.hero-copy{padding-top:90px}}
@media(max-width:1050px){nav{gap:18px}.hero-book{left:30%;width:240px;height:350px}.atlas-cover h2{font-size:46px}.hero{min-height:720px}.hero-copy{padding-top:85px}h1{font-size:9vw}.hero-art{top:90px}}
@media(max-width:720px){.site-header{height:78px;margin:0 6%}.brand{font-size:23px}.header-cta{display:none}.menu-toggle{display:flex;gap:16px;align-items:center;background:none;font-size:13px;padding:10px 0}.menu-toggle span{font-size:22px}nav{display:none;position:absolute;top:77px;left:-7%;right:-7%;background:var(--ink);padding:24px 7%;border-bottom:1px solid var(--line);flex-direction:column;gap:8px}nav.open{display:flex}.hero{height:auto;min-height:1060px;padding:0 6%}.hero-copy{width:100%;padding:48px 0 0}.hero h1{font-size:clamp(66px,14vw,100px);letter-spacing:-.065em;line-height:.94}.hero-copy p{font-size:15px;max-width:300px;margin:22px 0}.hero-copy .button{padding:13px 18px;font-size:13px;gap:35px}.hero-art{left:6%;right:6%;width:88%;top:510px;height:445px}.hero-book{left:39%;top:4%;width:200px;height:290px;transform:rotateX(8deg) rotateY(-22deg) rotateZ(9deg)}.atlas-cover{padding:16px}.atlas-cover h2{font-size:39px;margin-top:17px}.atlas-cover strong{font-size:8px;bottom:19px}.atlas-cover p{bottom:42px;font-size:10px}.atlas-cover small{font-size:7px}.cover-door{bottom:79px;width:26px;height:43px;left:calc(50% - 13px)}dialog{padding:60px 24px 32px}.book-shadow{bottom:24%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* Book imagery is shared across cover, campaign, and story so the identity stays coherent. */
.atlas-cover{background-image:linear-gradient(#12222670,transparent 45%,#07131ab8),url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp');background-size:cover;background-position:67% center}.cover-door{display:none}.paper{background:var(--paper);color:var(--ink)}.section-pad{padding:100px 6%}.eyebrow{display:block;font-size:11px;letter-spacing:1.8px;text-transform:uppercase}.intro{padding:90px 6% 50px;border-bottom:1px solid #25292020}.intro>p{font-size:clamp(32px,4.3vw,66px);letter-spacing:-2px;line-height:1.18;margin:34px 0 50px}.intro em,h2 em{font-family:var(--serif);font-weight:400}.intro-bottom{display:flex;align-items:end;justify-content:space-between}.intro-bottom>span{font-size:9px;letter-spacing:1.5px}.intro-bottom p{font-size:14px;line-height:1.65;color:#6c625c}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:52px;gap:30px}.section-heading h2{font-size:clamp(38px,4.9vw,75px);font-weight:450;letter-spacing:-3.3px;line-height:1.04;margin-top:27px}.section-heading>p{color:#706760;line-height:1.7;font-size:14px}.service-layout{display:grid;grid-template-columns:1fr 1.12fr;gap:60px}.service-tabs{display:flex;flex-direction:column}.service-tabs button{background:transparent;color:var(--ink);text-align:left;display:flex;align-items:center;gap:22px;padding:25px 0;border-top:1px solid #2529202a;width:100%;transition:padding .3s}.service-tabs button:last-child{border-bottom:1px solid #2529202a}.service-tabs button>span{font-size:10px;color:#77786c}.service-tabs button>div{font-size:20px;letter-spacing:-.5px}.service-tabs small{display:block;font-size:12px;color:#756b64;margin-top:8px;letter-spacing:0}.service-tabs b{font-weight:400;margin-left:auto;font-size:25px;opacity:0}.service-tabs button[aria-selected=true]{padding-left:20px;padding-right:20px;background:#ded9d2}.service-tabs button[aria-selected=true] b{opacity:1}.service-tabs button:focus-visible{outline-color:#857564;outline-offset:-2px}.service-stage{position:relative;min-height:514px;background:#e2dcd3;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;transition:background .6s}.stage-top{padding:23px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.6px;position:relative;z-index:3}.stage-bottom{display:flex;justify-content:space-between;gap:25px;padding:25px;position:relative;z-index:3}.stage-bottom p{font-size:12px;line-height:1.5;max-width:260px}.stage-bottom a{display:flex;gap:20px;align-items:center;font-size:12px;white-space:nowrap}.service-scene{height:360px;position:relative;perspective:1000px}.soft-cover{background:#bf2114 url('/wp-content/themes/bookkreative/site/assets/soft-machinery.webp') center/cover;color:#ffe3c4;text-align:center;box-shadow:inset 4px 0 4px #0005,9px 15px 25px #0003;padding:24px 15px}.soft-cover>small{font-size:9px;letter-spacing:4px;display:block}.soft-cover h3{font-size:47px;line-height:.9;font-family:var(--serif);font-weight:400;letter-spacing:-3px;margin-top:18px}.soft-cover>span{position:absolute;bottom:20px;left:0;width:100%;font-size:8px;letter-spacing:3px}.service-cover{position:absolute;width:215px;height:315px;left:calc(50% - 107px);top:15px;transform:rotate(-8deg);transition:transform .7s,opacity .5s;z-index:2}.open-spread{display:flex;position:absolute;width:380px;height:275px;top:45px;left:calc(50% - 190px);background:#faf6e8;box-shadow:5px 18px 28px #0002;transform:rotate(3deg) scale(.55);opacity:0;transition:transform .7s,opacity .5s}.open-spread>div{width:50%;padding:30px 23px;position:relative}.open-spread>div:first-child{background:linear-gradient(90deg,transparent 92%,#31281b28);border-right:1px solid #ddd8c8}.open-spread h3{font-family:var(--serif);font-size:22px;font-weight:400;line-height:1.15;margin:20px 0}.open-spread small{font-size:6px;letter-spacing:2px}.open-spread p{font:8px/1.75 var(--serif);margin-bottom:12px;text-align:justify}.open-spread>div:nth-child(2){padding-top:52px}.page-number{position:absolute;bottom:18px;font-size:6px;left:50%}.campaign{position:absolute;opacity:0;transition:transform .7s,opacity .5s}.campaign-one{width:175px;height:220px;background:#ee391e;left:8%;top:40px;transform:rotate(-15deg) scale(.6);padding:20px;color:#ffe5c9}.campaign-one>span{font:29px/.95 var(--serif);letter-spacing:-1px}.campaign-one>small{display:block;font-size:6px;margin-top:30px}.campaign-two{right:5%;top:110px;width:145px;height:145px;background:#f0e7ce;padding:19px;transform:rotate(10deg) scale(.6);color:#b22719}.campaign-two span{font-size:30px;font-weight:700;line-height:.9;letter-spacing:-2px}.browser-frame{position:absolute;left:8%;right:8%;top:15px;height:320px;background:#ba2218 url('/wp-content/themes/bookkreative/site/assets/soft-machinery.webp') right 30%/55% auto no-repeat;color:#ffe7cf;padding:0 25px;transform:scale(.5);opacity:0;transition:transform .7s,opacity .5s;box-shadow:0 16px 25px #0002}.browser-dots{font-size:8px;letter-spacing:3px;border-bottom:1px solid #ffffff55;padding:12px 0}.browser-dots>span{font-size:7px;letter-spacing:0;margin-left:20px}.browser-frame h3{font-family:var(--serif);font-size:41px;line-height:.9;letter-spacing:-2px;margin-top:42px;font-weight:400}.browser-frame>span{display:block;font-size:6px;letter-spacing:2px;margin-top:30px}.service-stage[data-mode=interior] .service-cover{transform:translateX(-100px) rotateY(-140deg);opacity:0}.service-stage[data-mode=interior] .open-spread{opacity:1;transform:rotate(-5deg) scale(1)}.service-stage[data-mode=visuals]{background:#c8b7a5}.service-stage[data-mode=visuals] .service-cover{transform:scale(.7) rotate(-2deg)}.service-stage[data-mode=visuals] .campaign{opacity:1;transform:rotate(-12deg)}.service-stage[data-mode=visuals] .campaign-two{transform:rotate(12deg)}.service-stage[data-mode=web] .service-cover,.service-stage[data-mode=story] .service-cover{transform:scale(.5) translate(155px,90px);opacity:0}.service-stage[data-mode=web] .browser-frame{opacity:1;transform:scale(1)}.service-stage[data-mode=story]{background:#223033;color:#e9ecdf}.service-stage[data-mode=story] .browser-frame{background:#223033 url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;opacity:1;transform:scale(1.07)}.service-stage[data-mode=story] .browser-frame h3{text-shadow:0 2px 12px #000}
.experience-intro{display:grid;grid-template-columns:1fr 1fr;padding-top:100px;padding-bottom:85px;gap:25px}.experience-intro>.eyebrow{grid-column:1/-1;color:#a7ab98}.experience-intro h2{font-size:clamp(40px,4.8vw,76px);font-weight:400;line-height:1.08;letter-spacing:-3px;grid-column:1/-1;margin-top:10px}.experience-intro h2 em{color:var(--accent)}.experience-intro>div{grid-column:2;display:flex;align-items:end;gap:45px;justify-content:space-between}.experience-intro p{font-size:14px;line-height:1.6;color:#aeb3a0}.text-link{font-size:13px;display:inline-flex;gap:30px;align-items:center;border-bottom:1px solid #777c67;padding:12px 0}.story-scroll{height:400svh;position:relative}.story-sticky{height:100svh;position:sticky;top:0;overflow:clip;isolation:isolate;min-height:580px;background:#0c151b}.story-image{position:absolute;inset:-5%;background:url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') 63% center/cover;transform:scale(1);will-change:transform}.story-shade{position:absolute;inset:0;background:linear-gradient(90deg,#031118bb,transparent 83%),linear-gradient(0deg,#03111899,transparent 25%,transparent 80%,#03111866)}.story-grain{position:absolute;inset:0;opacity:.1;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.6' filter='url(%23n)'/%3E%3C/svg%3E")}.story-top{position:absolute;top:35px;left:6%;right:6%;display:flex;justify-content:space-between;font-size:10px;letter-spacing:2px;z-index:3}.story-top a{letter-spacing:0;border-bottom:1px solid #c2cbbe77;padding-bottom:6px}.story-scenes{position:absolute;inset:0}.story-scene{position:absolute;left:8%;right:8%;top:26%;opacity:0;transform:translateY(22px);transition:opacity .65s,transform .65s;pointer-events:none;visibility:hidden}.story-scene.active{opacity:1;transform:translateY(0);pointer-events:auto;visibility:visible}.story-scene>.eyebrow{color:#cacfaf;font-size:10px;letter-spacing:3px}.story-scene h2{font-family:var(--serif);font-weight:400;font-size:clamp(54px,7vw,110px);line-height:.96;letter-spacing:-4px;margin:28px 0}.story-scene h2 em{color:#e4d5a3}.story-scene p{font-size:14px;line-height:1.8;color:#d1d5c9}.story-reveal .button{margin-top:26px;font-size:12px}.story-reveal small{display:block;font-size:10px;color:#b4bdad;margin-top:14px}.story-bottom{position:absolute;bottom:30px;left:6%;right:6%;display:flex;gap:25px;align-items:center;font-size:11px}.story-track{flex:1;height:1px;background:#ffffff40}.story-track i{height:2px;width:25%;display:block;background:#e4d5a3;transition:width .4s}.story-bottom button{background:none;font-size:11px;padding:12px;display:flex;gap:18px}.story-outro{padding:70px 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:30px;flex-wrap:wrap}.story-outro>span{width:100%;font-size:10px;color:#a6ad97;letter-spacing:1.5px}.story-outro p{font-size:44px;letter-spacing:-2px;line-height:1.1}.story-outro em{font-family:var(--serif);color:var(--accent)}.work-art{display:block;position:relative;overflow:hidden;min-height:500px}.work-art-label{position:absolute;top:27px;left:27px;z-index:3;font-size:9px;letter-spacing:1.5px}.atlas-work{background:#445b58 url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center 66%/cover;color:var(--paper);display:grid;place-items:center;height:570px}.atlas-work:before{content:'';position:absolute;inset:0;background:#152b2955}.work-book{position:relative;height:355px;width:240px;transform:rotate(-8deg);transition:transform .65s;box-shadow:12px 20px 28px #0006}.work-art:hover .work-book{transform:rotate(0) translateY(-10px)}.work-book.atlas-cover{transform:rotate(-9deg) perspective(1000px) rotateY(-20deg);box-shadow:8px 2px 0 #d5ceba,14px 25px 35px #0009}.work-book.atlas-cover h2{font-size:48px}.work-caption{padding:23px 0 40px;display:flex;justify-content:space-between;align-items:center;gap:15px}.work-caption h3{font-size:22px;font-weight:450;letter-spacing:-.5px}.work-caption>span,.work-caption>a{font-size:11px;color:#706760}.work-pair{display:grid;grid-template-columns:1fr 1fr;gap:30px}.soft-work{background:#bd301d;display:grid;place-items:center;color:#f8e4c6}.soft-work:before{content:'soft';font:italic 220px var(--serif);letter-spacing:-20px;position:absolute;left:0;top:15%;color:#e95f4338;transform:rotate(-12deg)}.blue-work{background:#b8c4ce;display:grid;place-items:center;color:#162d49}.blue-cover{background:#163e77;color:#c4d8e6;position:relative;padding:23px;overflow:hidden;box-shadow:inset 4px 0 4px #0005,10px 15px 25px #0004}.blue-cover small{font-size:9px;letter-spacing:3px}.blue-cover h3{font-size:39px;line-height:1.07;letter-spacing:-2px;margin-top:34px;position:relative;z-index:1}.blue-cover h3 em{font-family:var(--serif);font-weight:400;font-size:54px}.blue-circle{height:200px;width:200px;background:#fb623c;border-radius:50%;position:absolute;bottom:-30px;right:-70px;box-shadow:-15px -5px 0 #f66f48}.blue-cover>span{position:absolute;bottom:22px;left:23px;right:23px;font-size:6px;letter-spacing:2px}.work-pair .work-caption{display:block}.work-pair .work-caption span{display:block;margin-top:9px}.round-arrow{position:absolute;right:22px;bottom:22px;height:44px;width:44px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:23px}.about{padding-top:110px;padding-bottom:110px}.about-main{display:grid;grid-template-columns:1.3fr 1fr;gap:10%;margin-top:38px}.about h2{font-size:clamp(45px,5.2vw,80px);font-weight:400;line-height:1.02;letter-spacing:-3px}.about h2 em{color:var(--accent)}.about-main>div>p{font-size:16px;line-height:1.8;color:#beb5ae;margin-bottom:24px;max-width:370px}.studio-mark{display:block;color:var(--accent);font-family:var(--serif);font-size:90px;font-style:italic;line-height:1;margin:0 0 28px}.process{border-bottom:1px solid #25292022}.process-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;margin-top:70px}.process-steps article{border-top:1px solid #25292055;padding-top:18px}.process-steps article>span{font:italic 32px var(--serif);color:#757969}.process-steps h3{font-size:17px;font-weight:500;letter-spacing:-.5px;margin:35px 0 14px}.process-steps p{font-size:13px;line-height:1.65;color:#756b64}.insights{padding-top:70px}.sample-note{font-size:12px;color:#776b63}.notes{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.notes a{border-top:1px solid #25292044;padding-top:22px}.notes a>span{font-size:9px;letter-spacing:1px;color:#776b63}.notes h3{font:26px/1.2 var(--serif);letter-spacing:-.5px;margin:28px 0 40px}.notes i{font-style:normal;font-size:12px}.notes a:hover h3{color:#80664d}.final-cta{padding:90px 6% 75px;background:var(--accent);color:var(--ink);display:flex;position:relative;flex-wrap:wrap;align-items:center;justify-content:space-between}.final-cta h2{font-size:clamp(58px,7.8vw,120px);font-weight:450;line-height:.94;letter-spacing:-6px;margin:35px 0}.final-cta h2 em{font-family:var(--serif)}.final-cta>p{font-size:14px;line-height:1.6;width:100%;margin-top:20px}.cta-circle{width:210px;height:210px;border-radius:50%;background:var(--ink);color:var(--accent);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:18px;transform:rotate(-10deg);margin-right:4%;transition:transform .4s}.cta-circle:hover{transform:rotate(0) scale(1.04)}.cta-circle>span{font-size:13px;line-height:1.4;letter-spacing:1px}.cta-circle>b{font-size:48px;font-weight:300}.final-cta button:focus-visible{outline-color:var(--ink)}footer{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:38px 4.5%}footer>span,footer>a:last-child{font-size:11px;color:#b0a69f}footer .brand{font-size:23px}.detail-dialog h2,.project-dialog h2{font-size:clamp(34px,4vw,60px);font-weight:400;letter-spacing:-2px;line-height:1.04;margin:22px 0}.detail-dialog p{font-size:16px;line-height:1.75;color:#665c55;margin:20px 0}.detail-dialog .detail-art{height:320px;margin:28px -20px;display:flex;align-items:center;justify-content:center;overflow:hidden}.detail-art .work-book{height:270px;width:183px}.detail-art .atlas-cover h2{font-size:34px}.detail-art .soft-cover h3{font-size:36px}.detail-art .blue-cover h3{font-size:26px}.detail-art .blue-cover h3 em{font-size:38px}.detail-dialog h3{font-size:20px;letter-spacing:-.5px;margin-top:28px}.detail-chips{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0}.detail-chips span{border:1px solid #959b8666;padding:8px 12px;font-size:11px}.detail-dialog .button,.project-dialog .button{background:var(--ink);color:var(--paper);margin-top:20px}.detail-dialog .eyebrow{margin-top:6px}.project-dialog{width:min(800px,94vw);min-height:540px}.form-progress{display:flex;gap:6px;margin:23px 0 35px}.form-progress i{height:3px;background:#d9cdc3;flex:1}.form-progress i.complete{background:#726252}.project-dialog label{display:block;font-size:14px;margin:25px 0 8px}.project-dialog input:not([type=checkbox]),.project-dialog textarea,.project-dialog select{background:transparent;border:0;border-bottom:1px solid #95877b;width:100%;padding:13px 0;color:var(--ink);border-radius:0;font-size:20px}.project-dialog textarea{min-height:140px;resize:vertical;line-height:1.5;font-size:17px}.project-dialog select{font-size:18px}.project-dialog input:focus-visible,.project-dialog textarea:focus-visible,.project-dialog select:focus-visible{outline-color:#857564;outline-offset:3px}.form-help{font-size:13px;line-height:1.6;color:#75675e;margin-top:17px}.form-actions{display:flex;justify-content:space-between;align-items:center;margin-top:32px}.form-back{background:transparent;color:#76655b;padding:15px 0;font-size:13px}.form-actions .button{margin:0}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:25px}.project-dialog .choice-grid label{display:flex;align-items:center;gap:10px;border:1px solid #b5a69a77;padding:14px;margin:0;font-size:13px;cursor:pointer;min-height:50px}.choice-grid input{accent-color:#625447;width:17px;height:17px}.choice-grid label:has(input:checked){background:#ded6cb;border-color:#857564}.form-error{color:#a12016;font-size:13px;min-height:20px;margin-top:12px}.brief-summary{border-top:1px solid #c7bcb1;padding-top:20px;line-height:1.6}.brief-summary dl{display:grid;grid-template-columns:100px 1fr;gap:12px;font-size:14px}.brief-summary dt{color:#7d6e64}.brief-summary dd{margin:0;overflow-wrap:anywhere}.brief-summary p{font-size:14px;color:#65584f;white-space:pre-wrap;overflow-wrap:anywhere}.download-status{font-size:13px;margin-top:15px;color:#6e5145}.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:translateY(0)}
@media(max-width:1050px){.service-layout{gap:30px;grid-template-columns:1fr 1fr}.service-tabs button>div{font-size:17px}.service-tabs button{gap:14px}.open-spread{width:310px;left:calc(50% - 155px)}.open-spread>div{padding:22px 15px}.campaign-one{left:1%;width:145px}.campaign-two{right:0;width:120px}.experience-intro>div{grid-column:1/-1;justify-content:space-between}.process-steps{gap:16px}.work-pair .work-art{min-height:430px}.work-book{width:200px;height:300px}.work-book.soft-cover h3{font-size:39px}.work-book.blue-cover h3{font-size:32px}.work-caption{flex-wrap:wrap}.work-caption>a{display:none}.cta-circle{width:170px;height:170px}.work-book.atlas-cover h2{font-size:43px}}
@media(max-width:720px){.section-pad{padding:65px 6%}.intro{padding:65px 6% 35px}.intro>p{font-size:34px;letter-spacing:-1.5px;line-height:1.2;margin:28px 0 35px}.intro-bottom{align-items:start;gap:25px;flex-direction:column}.intro-bottom p{font-size:13px}.intro-bottom>span{font-size:8px}.eyebrow{font-size:9px;letter-spacing:1.3px}.section-heading{margin-bottom:32px;gap:24px;display:block}.section-heading h2{font-size:44px;letter-spacing:-2px;margin-top:20px}.section-heading>p{font-size:13px;margin-top:24px}.service-layout{display:flex;flex-direction:column;gap:24px}.service-tabs button{padding:18px 0}.service-tabs button>div{font-size:17px}.service-tabs small{font-size:11px;margin-top:5px}.service-tabs button[aria-selected=true]{padding:18px 13px}.service-stage{min-height:460px}.service-scene{height:335px}.service-cover{height:280px;width:190px;left:calc(50% - 95px);top:25px}.service-cover h3{font-size:41px}.stage-top{font-size:8px;padding:20px}.stage-bottom{padding:20px;gap:15px}.stage-bottom p{font-size:11px}.stage-bottom a{font-size:11px}.open-spread{width:300px;left:calc(50% - 150px);height:235px}.open-spread p{font-size:7px}.open-spread h3{font-size:20px}.open-spread>div:nth-child(2){padding-top:35px}.browser-frame{left:6%;right:6%;height:290px}.experience-intro{gap:25px}.experience-intro h2{font-size:44px;letter-spacing:-2px}.experience-intro>div{display:block}.experience-intro .text-link{margin-top:20px}.story-scroll{height:360svh}.story-sticky{min-height:620px}.story-top{top:26px;font-size:8px;letter-spacing:1.3px}.story-top a{font-size:10px}.story-scene{top:25%;left:7%;right:7%}.story-scene h2{font-size:60px;letter-spacing:-2.5px}.story-scene p{font-size:13px}.story-image{background-position:60% center}.story-shade{background:linear-gradient(90deg,#031118c9,#03111833),linear-gradient(0deg,#03111888,transparent)}.story-scene>.eyebrow{font-size:8px;letter-spacing:2px}.story-bottom{gap:13px;font-size:9px}.story-bottom button{font-size:10px;padding:10px 0;gap:10px}.story-outro{padding:50px 6%;gap:25px}.story-outro>span{font-size:8px;line-height:1.6}.story-outro p{font-size:35px;letter-spacing:-1px}.story-outro .button{font-size:12px;padding:14px 17px}.atlas-work{height:430px;min-height:430px}.work-art-label{font-size:7px;top:20px;left:20px}.work-book{width:190px;height:280px}.work-book.atlas-cover h2{font-size:40px}.work-pair{grid-template-columns:1fr;gap:10px}.work-pair .work-art{min-height:400px}.work-caption{padding:20px 0 35px;display:block}.work-caption h3{font-size:20px}.work-caption>span{display:block;font-size:10px;margin-top:8px}.work-pair .work-book{height:290px;width:198px}.about-main{display:block;margin-top:25px}.about h2{font-size:47px;letter-spacing:-2px}.about-main>div{margin-top:40px}.about-main>div>p{font-size:14px}.studio-mark{font-size:64px}.process-steps{grid-template-columns:1fr;margin-top:35px;gap:27px}.process-steps article{position:relative;padding-left:52px;padding-top:22px}.process-steps article>span{position:absolute;left:0;top:20px;font-size:26px}.process-steps h3{margin:0 0 10px;font-size:19px}.process-steps p{font-size:13px;max-width:290px}.sample-note{display:block;margin-top:20px}.notes{grid-template-columns:1fr;gap:35px}.notes h3{margin:20px 0 22px;font-size:27px}.notes a>span{font-size:8px}.final-cta{padding:60px 6%}.final-cta h2{font-size:56px;letter-spacing:-3px;margin:28px 0}.cta-circle{width:115px;height:115px;margin:0 0 15px auto;gap:7px}.cta-circle>span{font-size:8px}.cta-circle>b{font-size:28px}.final-cta>p{font-size:12px;margin-top:10px}footer{padding:32px 6%;display:grid;grid-template-columns:1fr 1fr;gap:26px}footer .brand{font-size:20px}footer>span,footer>a:last-child{font-size:9px}footer>span:nth-child(2){text-align:right}footer>a:last-child{text-align:right}.detail-dialog .detail-art{margin:25px 0;height:280px}.detail-dialog p{font-size:14px}.project-dialog h2{font-size:36px;letter-spacing:-1.5px}.choice-grid{grid-template-columns:1fr}.project-dialog .choice-grid label{min-height:44px;padding:12px}.project-dialog{min-height:480px}.brief-summary dl{grid-template-columns:70px 1fr;font-size:12px}.form-progress{margin:20px 0 28px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.story-scroll{height:auto}.story-sticky{position:relative;height:auto;min-height:0}.story-image{transform:none!important}.story-scenes{position:relative;padding:50px 0}.story-scene{position:relative;left:auto;right:auto;top:auto;margin:90px 7%;visibility:visible!important;opacity:1!important;transform:none!important;pointer-events:auto}.story-top{position:relative;padding-top:25px;top:0}.story-bottom{display:none}}

.mobile-project{display:none}@media(max-width:720px){.mobile-project{display:block;text-align:left;background:var(--accent);color:var(--ink);padding:14px;margin-top:8px;width:100%}}

/* A quiet layout leaves the moving portfolio as the single hero focal point. */
:root{--ink:#171717;--paper:#f5f5f7;--muted:#a1a1a6}
em{font-style:normal}
.site-header{position:relative;inset:auto;height:72px;margin:0 5%;padding:0;border-bottom:1px solid #ffffff10;background:transparent}
.brand{font-size:24px}.site-header nav{font-size:13px;gap:28px}.header-cta{border-radius:24px;padding:10px 18px;border-color:#ffffff45}
.hero{display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:20px;min-height:640px;height:calc(100svh - 72px);max-height:820px;padding:38px 5% 50px;background:var(--ink)}
.hero-copy{width:100%;padding:0;pointer-events:auto;max-width:560px}
.hero h1{font-size:clamp(58px,6.5vw,100px);font-weight:600;line-height:1.02;letter-spacing:-.055em}
.hero-copy p{font-size:19px;line-height:1.5;color:#a1a1a6;margin:26px 0 30px}
.hero-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap}.hero-actions .button{border-radius:4px;padding:19px 26px;font-size:17px;min-height:60px;gap:26px;box-shadow:none}.hero-actions .button:hover{transform:none;background:#bd1008}
.hero-work{display:inline-flex;align-items:center;gap:15px;min-height:48px;font-size:16px;text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:1px}.hero-work:hover{color:var(--accent-light)}
.book-gallery{position:relative;min-width:0;height:570px;isolation:isolate}
.gallery-stage{position:absolute;inset:0;overflow:clip;perspective:1100px}
.gallery-card{position:absolute;left:50%;top:50%;width:clamp(145px,15vw,215px);height:clamp(210px,22.5vw,322px);overflow:hidden;border-radius:5px;box-shadow:0 15px 35px #0005;background:#ede8e0;will-change:transform;backface-visibility:hidden}
.gallery-card img{display:block;width:100%;height:100%;object-fit:cover}
.gallery-landscape{width:clamp(215px,22vw,310px);height:clamp(153px,16vw,220px)}
.gallery-atlas{background:#244047 url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') 60% center/cover;color:#eee6d6;padding:23px;text-align:center;display:flex;flex-direction:column;align-items:center}
.gallery-atlas h3{font-size:clamp(26px,3vw,42px);line-height:1.05;font-weight:500;margin:auto 0}.gallery-atlas>span,.gallery-atlas small{font-size:8px;letter-spacing:2px}
.gallery-blue{background:#194176;color:#ecedea;padding:23px}.gallery-blue small{font-size:8px;letter-spacing:2px}.gallery-blue h3{position:relative;font-size:27px;line-height:1.1;margin-top:26px;z-index:1}.gallery-blue i{position:absolute;width:160px;height:160px;border-radius:50%;background:#e9653d;right:-45px;bottom:-30px}
.gallery-soft{background:#af281a url('/wp-content/themes/bookkreative/site/assets/soft-machinery.webp') center/cover;color:#ffe7d1;padding:22px;text-align:center}.gallery-soft small,.gallery-soft>span{font-size:8px;letter-spacing:2px}.gallery-soft h3{font-size:25px;line-height:1.05;margin-top:18px}.gallery-soft>span{position:absolute;bottom:20px;left:0;right:0}
.gallery-type{display:flex;color:#333;background:#f3efe4;padding:0}.gallery-type>div{width:50%;padding:24px 17px}.gallery-type>div+div{box-shadow:inset 8px 0 12px #0001}.gallery-type small{font-size:6px;letter-spacing:1px}.gallery-type h3{font-size:20px;line-height:1.12;margin-top:28px}.gallery-type p{font-size:10px;line-height:1.5;margin:25px 0 15px}.gallery-type span{display:block;height:2px;background:#aaa8a0;margin:6px 0}
.gallery-pause{position:absolute;bottom:0;right:12px;z-index:20;display:flex;gap:10px;align-items:center;background:#ffffff0c;color:#b8b8bd;border:1px solid #ffffff16;border-radius:22px;padding:10px 14px;font-size:11px;min-height:40px}
.accent,.skip-link,.mobile-project,.header-cta:hover{background:var(--accent);color:#fff}
nav a:hover,.experience-intro h2 em,.about h2 em{color:var(--accent-light)}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline-color:var(--accent-light)}
.paper a:focus-visible,.paper button:focus-visible{outline-color:var(--accent)}
.brand-symbol i{background:var(--accent-light)}
.final-cta{background:var(--accent);color:#fff4ed}.cta-circle{background:#fff4ed;color:var(--accent)}.final-cta button:focus-visible{outline-color:#fff}
.paper .eyebrow,.paper .text-link{color:var(--accent)}
.service-tabs button[aria-selected=true]{background:#e9dfd6;border-left:3px solid var(--accent)}
.section-heading h2,.intro>p,.experience-intro h2,.about h2{font-weight:550;letter-spacing:-.045em}.section-pad{padding-top:85px;padding-bottom:85px}
@media(max-width:1050px){.site-header nav{gap:16px}.hero{min-height:600px;gap:0}.hero h1{font-size:clamp(48px,6.3vw,68px)}.hero-copy p{font-size:16px}.book-gallery{height:520px}.hero-actions{gap:12px}}
@media(max-width:720px){.site-header{height:70px;margin:0 6%}.site-header nav{top:69px}.hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;height:auto;max-height:none;padding:50px 6% 30px;gap:24px}.hero-copy{max-width:550px}.hero h1{font-size:clamp(50px,12.8vw,80px)}.hero-copy p{font-size:16px;margin:22px 0}.book-gallery{height:420px;margin:0 -6.8%}.gallery-card{width:150px;height:220px}.gallery-landscape{width:220px;height:156px}.gallery-pause{right:6%}.hero-actions{gap:18px}.hero-actions .button{padding:17px 19px;font-size:16px;gap:18px;min-height:56px}.hero-work{font-size:14px;gap:8px}.section-pad{padding-top:60px;padding-bottom:60px}}
@media(prefers-reduced-motion:reduce){.gallery-card{will-change:auto}.gallery-pause{display:none}}

.gallery-hours{background:#e6c96f;color:#20221e;padding:24px}.gallery-hours small{font-size:8px;letter-spacing:1px}.gallery-hours h3{font-size:36px;line-height:.95;letter-spacing:-2px;margin-top:50px}.gallery-hours>span{position:absolute;left:24px;right:24px;bottom:25px;font-size:11px;line-height:1.4}

/* Each service uses a single photographic composition with space for live copy. */
.services{padding-left:12px;padding-right:12px;background:#fff}
.needs-heading{text-align:center;padding:0 20px 54px}.needs-heading h2{font-size:clamp(36px,4.2vw,60px);font-weight:600;letter-spacing:-.045em;line-height:1.08}
.needs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.need-tile{position:relative;height:620px;overflow:hidden;background:#f5f5f7;color:#1d1d1f;text-align:center;isolation:isolate}
.need-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;z-index:-1;}
.need-copy{position:relative;z-index:2;padding:42px 24px 0}.need-copy h3{font-size:40px;font-weight:600;letter-spacing:-.04em;line-height:1.1;max-width:410px;margin:0 auto}.need-copy p{font-size:18px;margin:10px 0 16px;line-height:1.35}.need-copy a{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);color:white;font-size:13px;min-height:36px;padding:9px 18px;border-radius:22px}.need-copy a:hover{background:#bc140d}
.need-world{grid-column:1/-1;height:650px;color:white;background:#111}.need-world .need-copy{padding-top:50px}.need-world .need-copy h3{max-width:none;font-size:clamp(34px,4.4vw,60px)}.need-world-caption{position:absolute;bottom:25px;left:20px;right:20px;font-size:10px;letter-spacing:2px;color:#ddd}
.services>.service-layout{margin:90px auto 0;max-width:1400px;width:90%}
@media(min-width:1500px){.need-tile:not(.need-world){height:680px}.need-photo{object-fit:contain}}
@media(min-width:721px) and (max-width:1050px){.need-tile{height:560px}.need-copy h3{font-size:32px;max-width:330px}.need-copy p{font-size:16px}.need-photo{object-fit:contain}.need-world{height:600px}}
@media(max-width:720px){.services{padding-left:10px;padding-right:10px}.needs-heading{padding-bottom:35px}.needs-grid{grid-template-columns:1fr;gap:10px}.need-tile{height:520px}.need-photo{object-fit:contain;object-position:center bottom}.need-copy{padding:32px 18px 0}.need-copy h3{font-size:32px;max-width:300px}.need-copy p{font-size:16px;margin:10px 0 14px}.need-world{height:520px}.need-world .need-copy{padding-top:38px}.services>.service-layout{width:100%;margin-top:60px}}

.need-actions{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}
.need-actions button{display:inline-flex;align-items:center;justify-content:center;background:transparent;color:var(--accent);border:1px solid var(--accent);border-radius:22px;padding:9px 17px;font-size:13px;min-height:36px}.need-actions button:hover{background:var(--accent);color:#fff}
.need-interior,.need-visuals,.need-world{background:#111;color:#f5f5f7}.need-interior .need-actions button,.need-visuals .need-actions button,.need-world .need-actions button{border-color:#f5f5f7;color:#f5f5f7}.need-interior .need-actions button:hover,.need-visuals .need-actions button:hover,.need-world .need-actions button:hover{background:#fff;color:#171717}
.need-tile .need-photo{object-fit:cover}.need-world .need-photo{object-position:center bottom}
.portfolio-dialog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px;margin:30px 0}.portfolio-dialog-grid figure{margin:0;min-width:0}.portfolio-dialog-grid img{display:block;width:100%;height:280px;object-fit:contain;background:#eae9e6;border-radius:4px}.portfolio-dialog-grid figcaption h3{font-size:20px;margin:14px 0 5px}.portfolio-dialog-grid figcaption p{font-size:13px;margin:0}
@media(max-width:720px){.need-tile:not(.need-world){height:540px}.need-tile:not(.need-world) .need-photo{height:100%;top:0;bottom:0;object-fit:cover}.need-cover,.need-web{background:#eeeae4}.need-copy h3{font-size:30px}.need-actions{gap:9px}.need-actions a,.need-actions button{font-size:12px;padding:10px 14px;min-height:40px}.need-world .need-photo{object-fit:cover;object-position:center bottom}.portfolio-dialog-grid{grid-template-columns:1fr}.portfolio-dialog-grid img{height:320px}}

/* Keep product silhouettes in frame and copy on uninterrupted flat color. */
.need-tile{height:580px;background:#f5f5f7;color:#1d1d1f}.need-copy{padding:38px 26px 0}.need-copy h3{font-size:34px;max-width:460px}.need-copy p{font-size:17px;max-width:420px;margin:12px auto 18px;line-height:1.4}
.need-tile .need-photo{inset:auto 9% 12px;width:82%;height:82%;object-fit:contain;object-position:center bottom;mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 94%,transparent),linear-gradient(to right,transparent,#000 5%,#000 95%,transparent);mask-composite:intersect}
.need-interior,.need-world{background:#080808;color:#f5f5f7}.need-visuals{background:#f5f5f7;color:#1d1d1f}.need-visuals .need-actions button{color:var(--accent);border-color:var(--accent)}.need-visuals .need-actions button:hover{background:var(--accent);color:#fff}
.need-actions a,.need-actions button{min-height:44px;padding:11px 18px;font-size:13px}.need-world{height:600px}.need-world .need-copy h3{font-size:46px}.need-world .need-copy p{max-width:600px}.need-world .need-photo{inset:auto 0 0;width:100%;height:100%;object-fit:contain;object-position:center bottom}
@media(max-width:1050px) and (min-width:721px){.need-copy h3{font-size:29px}.need-copy p{font-size:16px}.need-tile{height:550px}.need-tile .need-photo{width:88%;left:6%;right:6%}}
@media(max-width:720px){.need-tile:not(.need-world),.need-world{height:500px}.need-copy,.need-world .need-copy{padding:30px 18px 0}.need-copy h3,.need-world .need-copy h3{font-size:29px;max-width:340px}.need-copy p,.need-world .need-copy p{font-size:16px;max-width:310px}.need-tile:not(.need-world) .need-photo{top:auto;bottom:14px;left:4%;right:4%;width:92%;height:70%;object-fit:contain}.need-world .need-photo{top:auto;bottom:12px;left:-8%;width:116%;height:70%;object-fit:contain}.need-actions{gap:8px}.need-actions a,.need-actions button{padding:11px 13px;font-size:12px}.need-cover,.need-web{background:#f5f5f7}}

.need-interior{background:#030303}.need-world{background:#060606}

/* Reuse the portfolio card layout, including artwork and captions below it. */
.services{background:var(--paper);padding-left:5%;padding-right:5%}
.service-cards{gap:30px}.service-cards>article{min-width:0}.service-cards .work-caption{padding:23px 0 35px}.service-cards .work-caption>span{font-size:13px;line-height:1.5}
.service-card-actions{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;margin-top:15px}.service-card-actions a,.service-card-actions button{font-size:13px;min-height:44px;display:inline-flex;align-items:center;padding:8px 0;color:var(--accent);background:transparent}.service-card-actions button{text-decoration:underline;text-underline-offset:5px}.service-card-actions a:hover{text-decoration:underline}
.services>.need-world{margin-top:5px}.services>.service-layout{width:100%}
@media(max-width:720px){.services{padding-left:6%;padding-right:6%}.service-cards{gap:10px}.service-cards .work-caption>span{font-size:12px}.service-card-actions{gap:10px 20px}}

.service-cards .work-art{height:570px;min-height:570px}
@media(max-width:720px){.service-cards .work-art{height:430px;min-height:430px}}

.cover-service-panel .cover-panel-copy{position:absolute;z-index:3;top:27px;left:5%;right:5%;text-align:center;color:#f8e4c6}
.cover-panel-copy h3{font-size:clamp(26px,2.5vw,32px);font-weight:600;letter-spacing:-.04em;line-height:1.1}.cover-panel-copy p{font-size:15px;line-height:1.4;max-width:410px;margin:8px auto 12px}
.cover-panel-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}.cover-panel-actions a,.cover-panel-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:40px;border-radius:24px;padding:8px 15px;font-size:12px;border:1px solid #f8e4c6}.cover-panel-actions a{background:#f8e4c6;color:#8b2117}.cover-panel-actions button{background:transparent;color:#f8e4c6}.cover-panel-actions a:hover{background:#fff}.cover-panel-actions button:hover{background:#ffffff18}
.service-cards .cover-service-panel .work-book{position:absolute;top:193px;left:50%;margin-left:-115px;width:230px;height:335px;transform:rotate(-8deg);transition:transform .45s ease}
.service-cards .cover-service-panel:hover .work-book,.service-cards .cover-service-panel:focus-within .work-book{transform:rotate(0deg) translateY(-10px)}
.cover-service-panel .soft-cover h3{font-size:44px}.cover-service-panel .soft-cover{padding:23px 17px}.cover-service-panel:before{top:43%}
@media(max-width:720px){.cover-service-panel .cover-panel-copy{top:23px}.cover-panel-copy h3{font-size:25px}.cover-panel-copy p{font-size:14px;margin:7px auto 10px}.cover-panel-actions{gap:9px}.cover-panel-actions a,.cover-panel-actions button{font-size:12px;padding:10px 12px}.service-cards .cover-service-panel .work-book{top:172px;width:154px;height:223px;margin-left:-77px}.cover-service-panel .soft-cover{padding:16px 10px}.cover-service-panel .soft-cover h3{font-size:30px}.cover-service-panel .soft-cover small{font-size:7px}}

@media(prefers-reduced-motion:reduce){.service-cards .cover-service-panel .work-book{transition:none}.service-cards .cover-service-panel:hover .work-book,.service-cards .cover-service-panel:focus-within .work-book{transform:rotate(-8deg)}}

/* Equal taller service panels leave room for both the message and full-size book. */
.service-cards .work-art{height:700px;min-height:700px}
.cover-service-panel .cover-panel-copy{top:38px}
.cover-panel-copy h3{font-size:clamp(32px,3.2vw,42px)}
.cover-panel-copy p{font-size:17px;margin:12px auto 17px}
.cover-panel-actions a,.cover-panel-actions button{min-height:44px;padding:10px 18px;font-size:13px}
.service-cards .cover-service-panel .work-book{top:250px;width:260px;height:380px;margin-left:-130px}
.cover-service-panel .soft-cover h3{font-size:50px}
@media(max-width:720px){.service-cards .work-art{height:600px;min-height:600px}.cover-service-panel .cover-panel-copy{top:30px}.cover-panel-copy h3{font-size:30px}.cover-panel-copy p{font-size:15px;margin:10px auto 15px}.cover-panel-actions a,.cover-panel-actions button{font-size:12px;padding:10px 13px}.service-cards .cover-service-panel .work-book{top:237px;width:198px;height:290px;margin-left:-99px}.cover-service-panel .soft-cover h3{font-size:39px}}

.interior-service-panel{background:#eae7e2;color:#1d1d1f}
.interior-panel-copy{position:absolute;z-index:3;top:38px;left:5%;right:5%;text-align:center}.interior-panel-copy h3{font-size:clamp(32px,3.2vw,42px);font-weight:600;letter-spacing:-.04em;line-height:1.1;max-width:440px;margin:auto}.interior-panel-copy p{font-size:17px;line-height:1.4;margin:12px auto 17px}
.interior-panel-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}.interior-panel-actions a,.interior-panel-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:24px;padding:10px 18px;font-size:13px;border:1px solid var(--accent)}.interior-panel-actions a{background:var(--accent);color:#fff}.interior-panel-actions button{background:transparent;color:var(--accent)}.interior-panel-actions a:hover{background:#bd140b}.interior-panel-actions button:hover{background:#a50a040b}
.interior-panel-book{position:absolute;left:7%;bottom:58px;width:86%;height:360px;object-fit:contain;transform:rotate(-7deg);transition:transform .45s ease}
.interior-service-panel:hover .interior-panel-book,.interior-service-panel:focus-within .interior-panel-book{transform:rotate(0) translateY(-10px)}
@media(max-width:720px){.interior-panel-copy{top:30px}.interior-panel-copy h3{font-size:30px}.interior-panel-copy p{font-size:15px;margin:10px auto 15px}.interior-panel-actions{gap:9px}.interior-panel-actions a,.interior-panel-actions button{font-size:12px;padding:10px 13px}.interior-panel-book{left:5%;width:90%;height:280px;bottom:65px}}
@media(prefers-reduced-motion:reduce){.interior-panel-book{transition:none}.interior-service-panel:hover .interior-panel-book,.interior-service-panel:focus-within .interior-panel-book{transform:rotate(-7deg)}}

.interior-service-panel{background:#b8c4ce;color:#162d49}
.interior-panel-book{left:2%;width:96%;height:430px;bottom:30px;filter:drop-shadow(0 24px 20px #14283e40)}
@media(max-width:720px){.interior-panel-copy h3{font-size:28px}.interior-panel-book{left:0;width:100%;height:340px;bottom:35px;filter:drop-shadow(0 18px 15px #14283e40)}}

.interior-service-panel{background:#eae7e2;color:#1d1d1f}
.interior-panel-book{left:-1%;width:102%;height:470px;top:175px;bottom:auto;transform:rotate(0);filter:drop-shadow(0 7px 5px #18202b30) drop-shadow(0 26px 19px #18202b55)}
.interior-service-panel:hover .interior-panel-book,.interior-service-panel:focus-within .interior-panel-book{transform:translateY(-10px)}
@media(max-width:720px){.interior-panel-book{left:-1%;width:102%;height:365px;top:193px;bottom:auto;filter:drop-shadow(0 5px 4px #18202b30) drop-shadow(0 19px 14px #18202b55)}}
@media(prefers-reduced-motion:reduce){.interior-service-panel:hover .interior-panel-book,.interior-service-panel:focus-within .interior-panel-book{transform:none}}

.interior-panel-book.flat-interior{left:8%;width:84%;height:330px;top:280px;bottom:auto;display:flex;object-fit:initial;filter:none;transform:rotate(-6deg);box-shadow:12px 24px 28px #0003;border:1px solid #d1c8b8;background:#f7f2e7}
.flat-page{width:50%;position:relative;padding:30px 25px;color:#2c302e;text-align:left;overflow:hidden}.flat-page+.flat-page{border-left:1px solid #d6cdbd}.flat-page small{display:block;font-size:8px;letter-spacing:2px}.flat-chapter h4{font-size:32px;font-weight:500;letter-spacing:-1.3px;line-height:1.08;margin:62px 0 20px}.flat-rule{width:28px;height:1px;background:#2c302e;margin-bottom:20px}.flat-chapter p{font-size:12px;line-height:1.5;max-width:140px}.flat-reading small{margin-bottom:32px;font-size:7px;letter-spacing:1.5px}.flat-reading p{font-size:11px;line-height:1.55;margin:0 0 13px}.flat-folio{position:absolute;bottom:20px;font-size:8px}.flat-reading .flat-folio{right:25px}
.interior-service-panel:hover .flat-interior,.interior-service-panel:focus-within .flat-interior{transform:rotate(0) translateY(-10px)}
@media(max-width:720px){.interior-panel-book.flat-interior{left:5%;width:90%;height:250px;top:270px}.flat-page{padding:22px 15px}.flat-chapter h4{font-size:25px;margin:42px 0 15px}.flat-chapter p{font-size:10px}.flat-reading small{font-size:6px;margin-bottom:20px;letter-spacing:1px}.flat-reading p{font-size:8px;line-height:1.5;margin-bottom:10px}.flat-folio{bottom:15px}}
@media(prefers-reduced-motion:reduce){.interior-service-panel:hover .flat-interior,.interior-service-panel:focus-within .flat-interior{transform:rotate(-6deg)}}

.interior-panel-book.editorial-interior{top:231px;left:7%;width:86%;height:408px;transform:rotate(-4deg);background:#f6f4ee}
.editorial-interior .flat-page{padding:0}.editorial-opener{display:flex}.editorial-stripe{position:relative;width:35%;height:100%;background:#b22a22;overflow:hidden}.editorial-stripe i{position:absolute;display:block;background:#272a27;width:180px;height:60px;transform:rotate(-48deg);left:-67px;top:49%}.editorial-stripe i:nth-child(2){top:65%;left:-27px}.editorial-stripe i:nth-child(3){top:80%;left:-74px}
.editorial-chapter{padding:31px 13px;flex:1}.editorial-chapter small{font-size:6px;letter-spacing:1px;line-height:1.5}.editorial-chapter h4{font-size:37px;line-height:.98;letter-spacing:-1.5px;font-weight:800;margin:52px 0 28px}.editorial-chapter h4 em{color:#b22a22;display:block;margin-top:8px}.editorial-chapter>strong{font-size:13px;line-height:1.3;display:block;letter-spacing:-.4px}.editorial-chapter>span{font-size:8px;line-height:1.5;display:block;margin-top:14px}.editorial-opener .flat-folio{left:45%;bottom:17px}
.editorial-interior .editorial-reading{padding:26px 18px 32px}.editorial-band{display:flex;align-items:stretch;background:#b22a22;color:#fff;height:48px;margin-bottom:20px}.editorial-band b{display:grid;place-items:center;width:32%;background:#272a27;font-size:24px}.editorial-band strong{font-size:10px;line-height:1.2;padding:12px 8px}.editorial-reading h5{margin:13px 0 7px;border-bottom:2px solid #b22a22;background:#b22a2210;padding:5px 4px;font-size:8px;letter-spacing:-.1px;line-height:1.2}.editorial-reading p{font-size:8px;line-height:1.55;margin:0}.editorial-footer{position:absolute;left:18px;right:18px;bottom:16px;display:flex;justify-content:space-between;border-top:2px solid #b22a22;padding-top:7px;font-size:5px;letter-spacing:.7px}
.interior-service-panel:hover .editorial-interior,.interior-service-panel:focus-within .editorial-interior{transform:rotate(0) translateY(-10px)}
@media(max-width:720px){.interior-panel-book.editorial-interior{top:225px;left:5%;width:90%;height:320px}.editorial-chapter{padding:22px 9px}.editorial-chapter small{font-size:5px;letter-spacing:.6px}.editorial-chapter h4{font-size:29px;margin:38px 0 20px}.editorial-chapter>strong{font-size:10px}.editorial-chapter>span{font-size:6px}.editorial-interior .editorial-reading{padding:18px 10px 27px}.editorial-band{height:36px;margin-bottom:13px}.editorial-band b{font-size:19px}.editorial-band strong{font-size:7px;padding:9px 5px}.editorial-reading h5{font-size:6px;margin:10px 0 5px;padding:4px 2px}.editorial-reading p{font-size:6px;line-height:1.5}.editorial-footer{left:10px;right:10px;font-size:4px;bottom:12px}}
@media(prefers-reduced-motion:reduce){.interior-service-panel:hover .editorial-interior,.interior-service-panel:focus-within .editorial-interior{transform:rotate(-4deg)}}

.interior-service-panel{background:#b8c4ce;color:#162d49}
.editorial-stripe,.editorial-band{background:#24579b}.editorial-chapter h4 em{color:#24579b}.editorial-reading h5{border-color:#24579b;background:#24579b12}.editorial-footer{border-color:#24579b}.editorial-stripe i,.editorial-band b{background:#142d4b}

.interior-service-panel{background:#b9ddfa;color:#163750}
.editorial-stripe,.editorial-band{background:#398ddd}.editorial-chapter h4 em{color:#237bc9}.editorial-reading h5{border-color:#398ddd;background:#398ddd12}.editorial-footer{border-color:#398ddd}.editorial-stripe i,.editorial-band b{background:#235b94}

.interior-panel-actions a,.interior-panel-actions button{border-color:#195fa3}.interior-panel-actions a{background:#195fa3;color:#fff}.interior-panel-actions button{background:transparent;color:#174f83}.interior-panel-actions a:hover{background:#124c85}.interior-panel-actions button:hover{background:#195fa312}.interior-panel-actions a:focus-visible,.interior-panel-actions button:focus-visible{outline-color:#174f83}

.interior-service-panel{background:#235b94;color:#f5f8ff}
.interior-panel-actions a{background:#f5f8ff;color:#174f83;border-color:#f5f8ff}.interior-panel-actions button{color:#f5f8ff;border-color:#f5f8ff}.interior-panel-actions a:hover{background:#deedfc}.interior-panel-actions button:hover{background:#ffffff15}.interior-panel-actions a:focus-visible,.interior-panel-actions button:focus-visible{outline-color:#fff}
.interior-panel-book.editorial-interior{left:50%;width:270px;height:408px;margin-left:-135px;top:231px}.editorial-interior .editorial-reading{width:100%;padding:28px 22px 35px}.editorial-reading h5{font-size:9px}.editorial-reading p{font-size:9px;line-height:1.6}.editorial-band strong{font-size:11px}.editorial-footer{left:22px;right:22px}
@media(max-width:720px){.interior-panel-book.editorial-interior{left:50%;width:212px;height:320px;margin-left:-106px;top:225px}.editorial-interior .editorial-reading{padding:20px 17px 28px}.editorial-reading h5{font-size:7px}.editorial-reading p{font-size:7px;line-height:1.5}.editorial-band strong{font-size:8px}.editorial-footer{left:17px;right:17px}}

.service-cards{gap:16px}.services>.need-world{margin-top:16px}
@media(max-width:720px){.service-cards{gap:12px}.services>.need-world{margin-top:12px}}

.landing-service-panel{background:#d8d1c3;color:#272b27;display:grid;place-items:center}
.landing-panel-copy{position:absolute;z-index:3;top:38px;left:5%;right:5%;text-align:center}.landing-panel-copy h3{font-size:clamp(32px,3.2vw,42px);font-weight:600;letter-spacing:-.04em;line-height:1.1;margin:0}.landing-panel-copy p{font-size:17px;line-height:1.4;margin:12px auto 17px;max-width:440px}
.landing-panel-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px}.landing-panel-actions a,.landing-panel-actions button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border-radius:24px;padding:10px 18px;font-size:13px;border:1px solid #35443b}.landing-panel-actions a{background:#35443b;color:#fff}.landing-panel-actions button{background:transparent;color:#35443b}.landing-panel-actions a:hover{background:#233029}.landing-panel-actions button:hover{background:#35443b12}.landing-panel-actions a:focus-visible,.landing-panel-actions button:focus-visible{outline-color:#35443b}
.landing-preview{position:absolute;top:270px;left:7%;width:86%;height:330px;background:#172525;border:1px solid #ffffff25;border-radius:7px;overflow:hidden;box-shadow:12px 24px 28px #0003;transform:rotate(-5deg);transition:transform .45s ease}.landing-preview-bar{height:27px;background:#f3f0e9;display:flex;align-items:center;gap:18px;padding:0 12px;color:#858981}.landing-preview-bar>span{font-size:7px;letter-spacing:2px}.landing-preview-bar small{font-size:8px;letter-spacing:.5px}.landing-preview-page{height:calc(100% - 27px);padding:20px 24px;color:#f4f1e8;text-align:left;background:linear-gradient(90deg,#102022c9,#10202215),url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover}.landing-preview-nav{font-size:8px;letter-spacing:1px;display:flex;justify-content:space-between;margin-bottom:42px}.landing-preview-nav span{font-size:5px;letter-spacing:.4px}.landing-preview-page>small{font-size:6px;letter-spacing:1.5px}.landing-preview-page h4{font-size:34px;line-height:1.03;letter-spacing:-1.1px;font-weight:500;margin:12px 0}.landing-preview-page p{font-size:8px;line-height:1.5;color:#ddd}.landing-preview-cta{display:inline-block;margin-top:17px;font-size:7px;border-bottom:1px solid #f4f1e8;padding-bottom:4px}
.landing-service-panel:hover .landing-preview,.landing-service-panel:focus-within .landing-preview{transform:rotate(0) translateY(-10px)}
@media(max-width:720px){.landing-panel-copy{top:30px}.landing-panel-copy h3{font-size:30px}.landing-panel-copy p{font-size:15px;margin:10px auto 15px}.landing-panel-actions{gap:9px}.landing-panel-actions a,.landing-panel-actions button{font-size:12px;padding:10px 13px}.landing-preview{top:258px;left:5%;width:90%;height:260px}.landing-preview-page{padding:17px}.landing-preview-nav{font-size:6px;margin-bottom:28px}.landing-preview-page h4{font-size:28px}.landing-preview-page p{font-size:7px}.landing-preview-cta{margin-top:11px}}
@media(prefers-reduced-motion:reduce){.landing-preview{transition:none}.landing-service-panel:hover .landing-preview,.landing-service-panel:focus-within .landing-preview{transform:rotate(-5deg)}}

.landing-service-panel{background:#214e3b;color:#f4f2e8}.landing-panel-actions a{background:#f4f2e8;color:#214e3b;border-color:#f4f2e8}.landing-panel-actions button{color:#f4f2e8;border-color:#f4f2e8}.landing-panel-actions a:hover{background:#fff}.landing-panel-actions button:hover{background:#ffffff16}.landing-panel-actions a:focus-visible,.landing-panel-actions button:focus-visible{outline-color:#fff}
.landing-preview{top:225px;height:435px;background:#f4f1e8;transform:rotate(-4deg)}
.landing-site{font-size:8px;line-height:1.4;height:calc(100% - 27px);background:#f4f1e8;color:#233d32;text-align:left;overflow:hidden}.landing-site-nav{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;border-bottom:1px solid #233d3220;font-size:7px;letter-spacing:.6px}.landing-site-nav span{font-size:5px;letter-spacing:0}.landing-site-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;padding:23px 24px 20px}.landing-site-hero small{font-size:6px;letter-spacing:1px}.landing-site-hero h4{font-size:35px;line-height:1;letter-spacing:-1.2px;font-weight:550;margin:10px 0}.landing-site-hero p{font-size:7px;line-height:1.5;margin:0}.landing-site-links{display:flex;align-items:center;gap:10px;margin:13px 0 9px;font-size:6px}.landing-site-links b{background:#214e3b;color:#fff;padding:7px 9px;font-weight:500}.landing-site-links span{text-decoration:underline;text-underline-offset:2px}.landing-site-hero .landing-site-format{font-size:4px;letter-spacing:.8px}
.landing-site-book{position:relative;height:165px;width:116px;justify-self:center;align-self:center;background:#152a2a url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;box-shadow:5px 9px 12px #0003;color:#fff6de;text-align:center;padding:15px 8px;transform:rotate(5deg)}.landing-site-book strong{display:block;font-size:22px;font-weight:500;line-height:.95;margin-top:17px;letter-spacing:-.6px}.landing-site-book>span{position:absolute;bottom:13px;left:0;right:0;font-size:6px;letter-spacing:1px}
.landing-site-about{padding:13px 24px;background:#e5e8df}.landing-site-about small,.landing-site-author small{font-size:5px;letter-spacing:1px}.landing-site-about h5{font-size:14px;font-weight:500;margin:5px 0;letter-spacing:-.3px}.landing-site-about p{font-size:6px;line-height:1.5;max-width:320px;margin:0}.landing-site-author{display:flex;gap:10px;align-items:center;padding:13px 24px}.landing-site-author>span{width:35px;height:35px;background:#ccd5c6;display:grid;place-items:center;font-size:12px}.landing-site-author strong{display:block;font-size:10px;margin:3px 0}.landing-site-author p{font-size:5px;line-height:1.5;margin:0}
@media(max-width:720px){.landing-preview{top:221px;height:362px;left:5%;width:90%}.landing-site-nav{padding:10px 13px;font-size:6px}.landing-site-nav span{font-size:4px}.landing-site-hero{padding:15px 14px;gap:8px}.landing-site-hero h4{font-size:28px}.landing-site-hero p{font-size:5px}.landing-site-hero small{font-size:5px}.landing-site-book{width:88px;height:135px;padding:10px 6px}.landing-site-book strong{font-size:18px;margin-top:15px}.landing-site-links{font-size:5px;gap:6px;margin:10px 0 7px}.landing-site-links b{padding:6px}.landing-site-about{padding:10px 14px}.landing-site-about h5{font-size:11px}.landing-site-about p{font-size:5px}.landing-site-author{padding:10px 14px}.landing-site-author p{font-size:4px}}

/* Keep the browser frame still while its miniature page tours itself. */
.landing-site{--preview-height:406px;overflow:clip;pointer-events:none;user-select:none}
.landing-site-scroll{min-height:100%;transform:translateY(0)}
.landing-site-about{padding-top:28px;padding-bottom:28px}
.landing-site-author{padding-top:25px;padding-bottom:25px}
.landing-site-end{padding:26px 24px;background:#233d32;color:#f4f1e8;text-align:center}
.landing-site-end small{font-size:5px;letter-spacing:1px}.landing-site-end strong{display:block;font-size:18px;font-weight:500;margin:9px 0}.landing-site-end span{display:inline-block;font-size:6px;padding:7px 10px;border:1px solid #f4f1e860}
.landing-service-panel:hover .landing-site-scroll,.landing-service-panel:focus-within .landing-site-scroll{animation:landing-page-tour 12s ease-in-out infinite}
@keyframes landing-page-tour{0%,15%,100%{transform:translateY(0)}45%,65%{transform:translateY(calc(var(--preview-height) - 100%))}}
@media(max-width:720px){.landing-site{--preview-height:333px}.landing-site-about{padding-top:22px;padding-bottom:22px}.landing-site-author{padding-top:20px;padding-bottom:20px}.landing-site-end{padding:22px 14px}}
@media(hover:none){.landing-site-scroll{animation:landing-page-tour 12s ease-in-out infinite}}
@media(prefers-reduced-motion:reduce){.landing-site-scroll,.landing-service-panel:hover .landing-site-scroll,.landing-service-panel:focus-within .landing-site-scroll{animation:none}.landing-service-panel:hover .landing-preview,.landing-service-panel:focus-within .landing-preview{transform:rotate(-4deg)}}

.visuals-service-panel{background:#202322;color:#f4f2e8;isolation:isolate}
.visuals-service-panel .landing-panel-actions a{background:#f4f2e8;color:#202322;border-color:#f4f2e8}.visuals-service-panel .landing-panel-actions button{color:#f4f2e8;border-color:#f4f2e8}.visuals-service-panel .landing-panel-actions a:hover{background:#fff}.visuals-service-panel .landing-panel-actions button:hover{background:#ffffff16}
.campaign-lineup{position:absolute;top:275px;left:7%;width:86%;height:425px;perspective:1000px}
.campaign-banner{position:absolute;width:38%;height:365px;padding:22px 16px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;box-shadow:-7px 12px 24px #0005;border:1px solid #ffffff25;transform:rotateY(-16deg) rotateZ(8deg);transform-origin:bottom center;transition:transform .6s ease,translate .6s ease;overflow:hidden}
.campaign-banner small{font-size:7px;letter-spacing:1px}.campaign-banner strong{font-size:26px;font-weight:500;line-height:1.05;letter-spacing:-1px;margin-top:30px}.campaign-banner>span{margin-top:auto;font-size:7px;line-height:1.7;letter-spacing:.6px}
.campaign-rose{left:0;top:24px;background:#b87e78;color:#321f25}.campaign-lilac{left:16%;top:9px;background:#b3aac6;color:#342e48}.campaign-ocean{left:32%;top:0;background:linear-gradient(#11242d40,#11242d55),url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;color:#fff4dc}.campaign-red{left:48%;top:18px;background:#8d292b;color:#ffe8db}.campaign-cream{left:64%;top:85px;background:#e6e4d7;color:#333c35}
.campaign-lilac:after{content:'';width:130px;height:130px;border-radius:50%;background:#e0bea6;position:absolute;top:160px;left:35px}.campaign-rose:after{content:'';width:100px;height:200px;background:#623b46;position:absolute;top:150px;left:60px;transform:rotate(25deg);border-radius:50%}.campaign-banner>span{position:relative;z-index:1}.campaign-red strong{font-size:42px}.campaign-cream strong{font-size:29px}
.visuals-service-panel:hover .campaign-banner,.visuals-service-panel:focus-within .campaign-banner{transform:rotateY(-10deg) rotateZ(5deg);translate:0 -10px}
@media(max-width:720px){.visuals-service-panel .landing-panel-copy h3{font-size:29px}.campaign-lineup{top:260px;left:5%;width:87%;height:340px}.campaign-banner{height:310px;padding:17px 10px}.campaign-banner small{font-size:5px}.campaign-banner strong{font-size:20px;margin-top:25px}.campaign-banner>span{font-size:5px}.campaign-red strong{font-size:32px}.campaign-cream strong{font-size:22px}.campaign-cream{top:65px}}
@media(prefers-reduced-motion:reduce){.campaign-banner{transition:none}.visuals-service-panel:hover .campaign-banner,.visuals-service-panel:focus-within .campaign-banner{transform:rotateY(-16deg) rotateZ(8deg);translate:none}}

/* Square campaign artwork rotates through the front of a compact stack. */
.campaign-lineup{top:285px;left:0;width:100%;height:350px;perspective:1000px;--banner-size:300px;--banner-offset:100px}
.campaign-banner{top:0;left:calc(50% - var(--banner-size)/2);width:var(--banner-size);height:var(--banner-size);padding:27px;border-radius:8px;transform-origin:center;animation:campaign-stack 20s ease-in-out infinite;transition:none;translate:none;box-shadow:0 16px 30px #0004}
.campaign-banner strong{font-size:38px;margin-top:30px;letter-spacing:-1.3px}.campaign-banner small{font-size:8px}.campaign-banner>span{font-size:8px}
.campaign-rose{animation-delay:0s}.campaign-lilac{animation-delay:-4s}.campaign-ocean{animation-delay:-8s}.campaign-red{animation-delay:-12s}.campaign-cream{animation-delay:-16s}
.campaign-red strong{font-size:48px}.campaign-cream strong{font-size:37px}.campaign-rose:after{left:190px;top:100px;opacity:.6}.campaign-lilac:after{left:175px;top:165px;width:160px;height:160px}
.visuals-service-panel:hover .campaign-banner,.visuals-service-panel:focus-within .campaign-banner{translate:none}
@keyframes campaign-stack{
0%,12%,100%{transform:translateX(0) scale(1);z-index:5;opacity:1}
20%,32%{transform:translateX(var(--banner-offset)) scale(.86) rotateY(-22deg);z-index:3;opacity:1}
40%,52%{transform:translateX(40px) scale(.72) rotateY(-12deg);z-index:1;opacity:0}
60%,72%{transform:translateX(-40px) scale(.72) rotateY(12deg);z-index:1;opacity:0}
80%,92%{transform:translateX(calc(-1 * var(--banner-offset))) scale(.86) rotateY(22deg);z-index:3;opacity:1}
}
@media(max-width:720px){.campaign-lineup{top:270px;--banner-size:225px;--banner-offset:62px;height:270px}.campaign-banner{padding:21px}.campaign-banner strong{font-size:29px;margin-top:23px}.campaign-banner small,.campaign-banner>span{font-size:6px}.campaign-red strong{font-size:36px}.campaign-cream strong{font-size:28px}.campaign-rose:after{left:155px;top:90px}.campaign-lilac:after{left:140px;top:125px}}
@media(prefers-reduced-motion:reduce){.campaign-banner{animation:none;opacity:0}.campaign-ocean{opacity:1;z-index:5;transform:none}.campaign-rose{opacity:1;z-index:2;transform:translateX(calc(-1 * var(--banner-offset))) scale(.86) rotateY(22deg)}.campaign-cream{opacity:1;z-index:2;transform:translateX(var(--banner-offset)) scale(.86) rotateY(-22deg)}.visuals-service-panel:is(:hover,:focus-within) .campaign-ocean{transform:none}.visuals-service-panel:is(:hover,:focus-within) .campaign-rose{transform:translateX(calc(-1 * var(--banner-offset))) scale(.86) rotateY(22deg)}.visuals-service-panel:is(:hover,:focus-within) .campaign-cream{transform:translateX(var(--banner-offset)) scale(.86) rotateY(-22deg)}}

.campaign-banner{animation-play-state:paused}
@media(hover:hover) and (min-width:721px){.visuals-service-panel.campaign-visible:hover .campaign-banner{animation-play-state:running}}
@media(hover:none),(max-width:720px){.visuals-service-panel.campaign-visible .campaign-banner{animation-play-state:running}}

.cover-stack{top:250px;--banner-size:260px;--banner-offset:100px;height:380px}
.cover-stack .campaign-banner{height:380px;border-radius:0;padding:26px 20px;text-align:center;align-items:center;color:#f8e4c6;box-shadow:5px 12px 22px #0005}
.cover-stack .campaign-banner strong{font-size:42px;line-height:1.03;margin-top:45px}.cover-stack .campaign-banner small{font-size:8px;letter-spacing:2px}.cover-stack .campaign-banner>span{font-size:8px;letter-spacing:1px}
.cover-soft{background:#852719 url('/wp-content/themes/bookkreative/site/assets/soft-machinery.webp') center/cover;animation-delay:0s}.cover-atlas{background:#183039 url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;animation-delay:-4s}.cover-field{background:#163e77;animation-delay:-8s}.cover-hours{background:#e5d9bf;animation-delay:-12s}.cover-stack .cover-hours{color:#394a40}.cover-form{background:#334740;animation-delay:-16s}.cover-field:after{content:'';position:absolute;width:125px;height:125px;border-radius:50%;background:#cc8b55;left:26%;top:55%}.cover-hours:after{content:'';position:absolute;inset:54% 18% 17%;border-top:1px solid #394a40;border-bottom:1px solid #394a40;transform:rotate(-16deg)}.cover-form:after{content:'';position:absolute;inset:49% 15% 16%;background:linear-gradient(135deg,#c7bfa8 50%,#89957e 50%);clip-path:polygon(0 100%,0 40%,50% 0,100% 40%,100% 100%)}
@media(hover:hover) and (min-width:721px){.cover-service-panel.campaign-visible:hover .campaign-banner{animation-play-state:running}}
@media(hover:none),(max-width:720px){.cover-service-panel.campaign-visible .campaign-banner{animation-play-state:running}}
@media(max-width:720px){.cover-stack{top:237px;--banner-size:198px;--banner-offset:65px;height:290px}.cover-stack .campaign-banner{height:290px;padding:21px 15px}.cover-stack .campaign-banner strong{font-size:32px;margin-top:32px}.cover-stack .campaign-banner small,.cover-stack .campaign-banner>span{font-size:6px}.cover-field:after{width:90px;height:90px}}
@media(prefers-reduced-motion:reduce){.cover-stack .campaign-banner{animation:none;opacity:0}.cover-stack .cover-soft{opacity:1;z-index:5;transform:none}.cover-stack .cover-atlas{opacity:1;z-index:2;transform:translateX(calc(-1 * var(--banner-offset))) scale(.86) rotateY(22deg)}.cover-stack .cover-form{opacity:1;z-index:2;transform:translateX(var(--banner-offset)) scale(.86) rotateY(-22deg)}}

.cover-stack{--banner-offset:132px}
@media(max-width:720px){.cover-stack{--banner-offset:82px}}

.cover-service-panel:before{content:none}
.layout-stack{top:231px;--banner-size:270px;--banner-offset:127px;height:408px}
.layout-stack .layout-sheet{height:408px;border-radius:0;background:#f6f4ee;color:#253849;padding:30px 25px;display:block;box-shadow:5px 12px 22px #0005}
.layout-stack .layout-original{padding:0;animation-delay:0s}.layout-original .editorial-reading{height:100%;padding:28px 22px 35px;position:relative;background:#f6f4ee}.layout-original .editorial-band strong{font-size:11px;margin:0;letter-spacing:0}.layout-original .editorial-band{background:#398ddd}
.layout-sheet>small{font-size:7px;letter-spacing:1.3px}.layout-sheet>h4{font-size:28px;font-weight:500;line-height:1.1;letter-spacing:-1px;margin:47px 0 25px}.layout-sheet>p{font-size:10px;line-height:1.7;margin:0 0 15px}.layout-sheet>footer{position:absolute;bottom:19px;left:25px;right:25px;padding:8px 0 0;border-top:1px solid #25384940;display:flex;justify-content:space-between;font-size:5px;letter-spacing:1px}.layout-chapter{animation-delay:-4s}.layout-photo{animation-delay:-8s}.layout-poetry{animation-delay:-12s}.layout-essay{animation-delay:-16s}.layout-photo>h4{margin:19px 0 15px}.layout-page-photo{height:130px;margin-bottom:15px;background:url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover}.layout-poetry>h4{margin-top:72px}.layout-poetry>p{line-height:2}.layout-essay>h4{border-left:5px solid #398ddd;padding-left:15px}
@media(hover:hover) and (min-width:721px){.interior-service-panel.campaign-visible:hover .campaign-banner{animation-play-state:running}}
@media(hover:none),(max-width:720px){.interior-service-panel.campaign-visible .campaign-banner{animation-play-state:running}}
@media(max-width:720px){.layout-stack{top:225px;--banner-size:212px;--banner-offset:72px;height:320px}.layout-stack .layout-sheet{height:320px;padding:22px 19px}.layout-stack .layout-original{padding:0}.layout-original .editorial-reading{padding:20px 17px 28px}.layout-original .editorial-band strong{font-size:8px}.layout-sheet>small{font-size:5px}.layout-sheet>h4{font-size:23px;margin:30px 0 20px}.layout-sheet>p{font-size:8px;line-height:1.6}.layout-sheet>footer{left:19px;right:19px;bottom:15px;font-size:4px}.layout-page-photo{height:95px;margin-bottom:12px}.layout-photo>h4{margin:14px 0 12px}.layout-poetry>h4{margin-top:50px}}
@media(prefers-reduced-motion:reduce){.layout-stack .campaign-banner{animation:none;opacity:0}.layout-stack .layout-original{opacity:1;z-index:5;transform:none}.layout-stack .layout-chapter{opacity:1;z-index:2;transform:translateX(var(--banner-offset)) scale(.86) rotateY(-22deg)}.layout-stack .layout-essay{opacity:1;z-index:2;transform:translateX(calc(-1 * var(--banner-offset))) scale(.86) rotateY(22deg)}}

.landing-stack{top:235px;height:425px;left:0;width:100%;--landing-width:340px;--landing-offset:100px}
.landing-stack .landing-stack-item{top:0;left:calc(50% - var(--landing-width)/2);width:var(--landing-width);height:425px;transform:none;animation:landing-stack-turn 18s ease-in-out infinite paused;border-radius:0;transition:none}
.landing-stack .landing-variant-soft{animation-delay:-6s}.landing-stack .landing-variant-field{animation-delay:-12s}
@keyframes landing-stack-turn{0%,22%,100%{transform:translateX(0) scale(1);z-index:3}33%,55%{transform:translateX(var(--landing-offset)) scale(.8) rotateY(-22deg);z-index:1}66%,88%{transform:translateX(calc(-1 * var(--landing-offset))) scale(.8) rotateY(22deg);z-index:1}}
.landing-stack .landing-site{--preview-height:396px}.landing-stack .landing-site-hero{padding:22px 17px;gap:9px}.landing-stack .landing-site-hero h4{font-size:29px}.landing-stack .landing-site-book{width:98px;height:150px}.landing-stack .landing-site-book strong{font-size:20px}.landing-stack .landing-site-nav{padding:13px 17px}.landing-stack .landing-site-about,.landing-stack .landing-site-author{padding-left:17px;padding-right:17px}
.landing-variant-soft .landing-site{color:#692b25;background:#f5e9dd}.landing-variant-soft .landing-site-about{background:#ead4c5}.landing-variant-soft .landing-site-book{background:#852719 url('/wp-content/themes/bookkreative/site/assets/soft-machinery.webp') center/cover}.landing-variant-soft .landing-site-end,.landing-variant-soft .landing-site-links b{background:#852719}
.landing-variant-field .landing-site{color:#263e65;background:#f1f3f8}.landing-variant-field .landing-site-about{background:#dce4ef}.landing-variant-field .landing-site-book{background:#163e77}.landing-variant-field .landing-site-end,.landing-variant-field .landing-site-links b{background:#163e77}
.landing-service-panel .landing-site-scroll,.landing-service-panel:hover .landing-site-scroll,.landing-service-panel:focus-within .landing-site-scroll{animation:landing-page-tour 12s ease-in-out infinite paused}
@media(hover:hover) and (min-width:721px){.landing-service-panel.campaign-visible:hover .landing-stack-item,.landing-service-panel.campaign-visible:hover .landing-site-scroll{animation-play-state:running}}
@media(hover:none),(max-width:720px){.landing-service-panel.campaign-visible .landing-stack-item,.landing-service-panel.campaign-visible .landing-site-scroll{animation-play-state:running}}
@media(max-width:720px){.landing-stack{top:225px;height:350px;--landing-width:246px;--landing-offset:55px}.landing-stack .landing-stack-item{height:350px}.landing-stack .landing-site{--preview-height:321px}.landing-stack .landing-site-nav{padding:10px;font-size:5px}.landing-stack .landing-site-nav span{font-size:3px}.landing-stack .landing-site-hero{padding:16px 10px;gap:5px}.landing-stack .landing-site-hero h4{font-size:23px}.landing-stack .landing-site-book{width:76px;height:116px}.landing-stack .landing-site-book strong{font-size:15px}.landing-stack .landing-site-links{gap:4px;font-size:4px}.landing-stack .landing-site-links b{padding:5px}.landing-stack .landing-site-about,.landing-stack .landing-site-author{padding-left:12px;padding-right:12px}}
@media(prefers-reduced-motion:reduce){.landing-stack .landing-stack-item,.landing-service-panel .landing-site-scroll,.landing-service-panel:hover .landing-site-scroll,.landing-service-panel:focus-within .landing-site-scroll{animation:none}.landing-stack .landing-variant-atlas{z-index:3;transform:none}.landing-stack .landing-variant-soft{transform:translateX(var(--landing-offset)) scale(.8) rotateY(-22deg)}.landing-stack .landing-variant-field{transform:translateX(calc(-1 * var(--landing-offset))) scale(.8) rotateY(22deg)}}

/* Each front-page tour finishes before the stack advances. */
.landing-stack .landing-stack-item{animation-duration:30s}
.landing-stack .landing-variant-soft{animation-delay:-10s}.landing-stack .landing-variant-field{animation-delay:-20s}
.landing-service-panel .landing-stack .landing-site-scroll,.landing-service-panel:hover .landing-stack .landing-site-scroll,.landing-service-panel:focus-within .landing-stack .landing-site-scroll{animation:landing-front-tour 30s ease-in-out infinite paused;animation-delay:var(--tour-delay,0s)}
.landing-stack .landing-variant-soft .landing-site-scroll{animation-delay:-10s}.landing-stack .landing-variant-field .landing-site-scroll{animation-delay:-20s}
@keyframes landing-front-tour{0%,2%,25%,100%{transform:translateY(0)}10%,16%{transform:translateY(calc(var(--preview-height) - 100%))}}
@keyframes landing-stack-turn{0%,27%,100%{transform:translate3d(0,0,0) scale(1) rotateY(0)}33.333%,60.333%{transform:translate3d(var(--landing-offset),0,-120px) scale(.9) rotateY(-22deg)}66.667%,93.667%{transform:translate3d(calc(-1 * var(--landing-offset)),0,-120px) scale(.9) rotateY(22deg)}}
@media(hover:hover) and (min-width:721px){.landing-service-panel.campaign-visible:hover .landing-stack .landing-site-scroll{animation-play-state:running}}
@media(hover:none),(max-width:720px){.landing-service-panel.campaign-visible .landing-stack .landing-site-scroll{animation-play-state:running}}
@media(prefers-reduced-motion:reduce){.landing-service-panel .landing-stack .landing-site-scroll,.landing-service-panel:hover .landing-stack .landing-site-scroll,.landing-service-panel:focus-within .landing-stack .landing-site-scroll{animation:none}}

.landing-variant-soft{--tour-delay:-10s}.landing-variant-field{--tour-delay:-20s}

@media(prefers-reduced-motion:no-preference){.landing-stack{transform-style:preserve-3d}.landing-stack .landing-stack-item{z-index:auto;will-change:transform;backface-visibility:hidden}.landing-stack .landing-site-scroll{will-change:transform}}

.need-tile.need-world{height:850px;overflow:hidden}.experience-mockups{position:absolute;top:255px;left:5%;width:90%;height:520px;display:flex;align-items:center;justify-content:center;gap:3%;text-align:left}
.experience-tablet{position:relative;width:70%;padding:15px 17px;background:linear-gradient(135deg,#626564,#121414 20%,#0a0a0a 80%,#727470);border:1px solid #8a8c88;border-radius:28px;box-shadow:0 25px 45px #0009;flex-shrink:0}.experience-tablet:before{content:'';position:absolute;left:5px;top:50%;width:5px;height:5px;background:#242932;border-radius:50%}.experience-screen{aspect-ratio:1.5;position:relative;overflow:hidden;border-radius:13px;background:#10232b}.experience-screen>video{width:100%;height:100%;object-fit:cover;display:block}
.story-preview{position:absolute;inset:0;overflow:hidden;color:#f8f3e4}.story-preview-landscape{position:absolute;inset:-7%;background:url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;animation:experience-pan 21s ease-in-out infinite paused}.story-preview-shade{position:absolute;inset:0;background:linear-gradient(90deg,#071319bb,#07131915),linear-gradient(0deg,#07131970,transparent)}.story-preview-brand{position:absolute;top:7%;left:7%;font-size:9px;letter-spacing:2px}.story-preview-chapter{position:absolute;left:7%;right:5%;top:32%;opacity:0;animation:experience-chapter 21s ease-in-out infinite paused}.story-preview-chapter small{font-size:8px;letter-spacing:2px}.story-preview-chapter h4{font-size:clamp(27px,3.4vw,52px);font-weight:500;line-height:1.08;letter-spacing:-1.8px;margin:18px 0}.story-preview-chapter p{font-size:12px;line-height:1.6;margin:0}.story-preview-chapter.chapter-second{animation-delay:-14s}.story-preview-chapter.chapter-third{animation-delay:-7s}.story-preview-progress{position:absolute;bottom:7%;left:7%;right:7%;height:2px;background:#ffffff35}.story-preview-progress i{display:block;width:100%;height:100%;background:#e6d8ad;transform-origin:left;animation:experience-progress 21s linear infinite paused}
.experience-book{position:relative;width:24%;aspect-ratio: .66;background:#162831 url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;box-shadow:inset 7px 0 6px #0009,5px 1px 0 #c5beae,12px 20px 30px #0008;color:#f5ead2;padding:22px 14px;text-align:center;transform:perspective(1000px) rotateY(-8deg)}.experience-book small{font-size:8px;letter-spacing:3px}.experience-book h4{font-size:clamp(26px,3vw,46px);font-weight:500;line-height:1;letter-spacing:1px;margin:35% 0 0}.experience-book>span{position:absolute;bottom:9%;left:0;right:0;font-size:9px;letter-spacing:3px}
.experience-playing .story-preview-landscape,.experience-playing .story-preview-chapter,.experience-playing .story-preview-progress i{animation-play-state:running}
@keyframes experience-pan{0%,100%{transform:scale(1) translateX(0)}50%{transform:scale(1.1) translateX(-2%)}}
@keyframes experience-chapter{0%,26%{opacity:1;transform:translateY(0)}32%,94%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:translateY(0)}}
@keyframes experience-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(min-width:1500px){.need-tile.need-world{height:1000px}.experience-mockups{top:270px;height:650px;max-width:1350px;left:50%;transform:translateX(-50%)}}
@media(max-width:1050px) and (min-width:721px){.need-tile.need-world{height:760px}.experience-mockups{top:250px;height:420px}.story-preview-chapter h4{font-size:30px}}
@media(max-width:720px){.need-tile.need-world{height:720px}.experience-mockups{top:270px;left:4%;width:92%;height:400px;display:block}.experience-tablet{width:96%;padding:9px 11px;border-radius:17px}.experience-screen{border-radius:8px;aspect-ratio:1.3}.experience-tablet:before{left:3px;width:3px;height:3px}.story-preview-brand{font-size:5px;letter-spacing:1px}.story-preview-chapter small{font-size:5px;letter-spacing:1px}.story-preview-chapter h4{font-size:25px;letter-spacing:-.8px;margin:12px 0}.story-preview-chapter p{font-size:8px}.experience-book{position:absolute;right:1%;bottom:0;width:35%;padding:17px 10px}.experience-book h4{font-size:24px;margin-top:26%}.experience-book small{font-size:5px;letter-spacing:1px}.experience-book>span{font-size:5px;letter-spacing:1px}}
@media(prefers-reduced-motion:reduce){.story-preview-landscape,.story-preview-chapter,.story-preview-progress i{animation:none}.story-preview-chapter{opacity:0}.story-preview-chapter.chapter-first{opacity:1}}

.experience-mockups{--device-height:clamp(310px,38vw,480px);height:var(--device-height);top:275px;gap:32px;align-items:stretch}
.experience-tablet{height:100%;width:auto;aspect-ratio:1.5;flex-shrink:1;min-width:0;box-shadow:0 22px 26px -12px #000,0 40px 55px -22px #000c}
.experience-screen{height:100%;width:100%;aspect-ratio:auto}
.experience-book{height:100%;width:auto;aspect-ratio:.66;flex-shrink:0;transform:none;box-shadow:inset 6px 0 6px #0008,4px 0 0 #b5af9f,9px 14px 18px -7px #000,0 35px 40px -18px #000c}
.experience-mockups:before{content:'';position:absolute;left:2%;right:2%;bottom:-32px;height:42px;border-radius:50%;background:radial-gradient(ellipse,#6d777331,transparent 70%);filter:blur(10px);pointer-events:none}
@media(min-width:1500px){.experience-mockups{top:285px;--device-height:580px}}
@media(max-width:1050px) and (min-width:721px){.experience-mockups{--device-height:clamp(240px,37vw,380px);top:285px;gap:24px}}
@media(max-width:720px){.experience-mockups{top:290px;height:340px;display:flex;align-items:flex-end;gap:12px}.experience-tablet{width:65%;height:230px;aspect-ratio:auto;padding:8px;border-radius:14px;flex-shrink:0}.experience-book{position:relative;right:auto;bottom:auto;width:30%;height:230px;aspect-ratio:auto;padding:16px 8px}.experience-book h4{font-size:21px;margin-top:65%}.story-preview-chapter h4{font-size:20px}.story-preview-chapter p{font-size:7px}.story-preview-chapter small{font-size:4px;letter-spacing:.6px}.experience-mockups:before{bottom:-25px}.need-tile.need-world{height:690px}}
@media(max-width:720px){.experience-mockups{top:275px;height:250px;gap:10px}.experience-tablet{width:60%;height:185px}.experience-book{width:36%;height:185px}.experience-book h4{font-size:22px;margin-top:37%}.story-preview-chapter h4{font-size:18px;margin:10px 0}.story-preview-chapter p{font-size:6px}.need-tile.need-world{height:595px}}

/* A softly lit charcoal surface grounds both objects without boxing in the artwork. */
.need-world{isolation:isolate}
.need-world:before{content:'';position:absolute;inset:26% 0 0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 69%,#55514b 0%,#34332f 28%,#171817 61%,#060606 85%);mask-image:linear-gradient(to bottom,transparent 0%,#000 38%,#000 100%)}
.need-world:after{content:'';position:absolute;inset:26% 0 0;z-index:0;pointer-events:none;opacity:.2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grain)' opacity='.55'/%3E%3C/svg%3E");mask-image:linear-gradient(to bottom,transparent 0%,#000 48%,#000 100%);mix-blend-mode:soft-light}
.experience-mockups{z-index:1}
.experience-mockups:before{left:-2%;right:-2%;bottom:-29px;height:55px;background:radial-gradient(ellipse,#000d 0%,#0008 35%,transparent 72%);filter:blur(8px)}
.experience-tablet{box-shadow:0 7px 7px -3px #000c,0 22px 25px -10px #000b,0 38px 45px -20px #0009}
.experience-book{box-shadow:inset 6px 0 6px #0008,4px 0 0 #b5af9f,0 6px 5px -2px #000d,7px 19px 19px -7px #000c,0 35px 35px -15px #0009}
@media(max-width:720px){.need-world:before,.need-world:after{top:37%}.experience-mockups:before{bottom:-22px;height:38px;filter:blur(6px)}}
.need-world:after{opacity:.45;mix-blend-mode:soft-light;background-size:180px 180px}

/* Studio mockups: a solid baseline, visible edge thickness, and a restrained floor reflection. */
.experience-mockups{gap:38px}
.experience-mockups:before{bottom:-13px;height:23px;left:0;right:0;filter:blur(5px);background:radial-gradient(ellipse,#000 0%,#000b 45%,transparent 74%)}
.experience-tablet{padding:17px 20px;border:2px solid #b1b2af;background:linear-gradient(135deg,#363837 0%,#141615 23%,#050606 70%,#292b29 100%);box-shadow:inset 0 0 0 2px #ffffff13,0 3px 3px #000,0 11px 12px -7px #000d;-webkit-box-reflect:below 3px linear-gradient(transparent 72%,#ffffff16 100%)}
.experience-tablet:before{left:6px;width:6px;height:6px;background:#010202;border:1px solid #242b30;box-shadow:inset 0 0 2px #4a5960}
.experience-book{border-radius:3px 2px 2px 3px;border-top:1px solid #ffffff55;border-right:2px solid #b5af9f;padding-left:26px;box-shadow:inset 14px 0 7px -6px #000b,inset 17px 0 1px -15px #ffffff55,2px 1px 0 #817c70,0 3px 3px #000,3px 11px 12px -7px #000e;-webkit-box-reflect:below 3px linear-gradient(transparent 74%,#ffffff13 100%)}
.experience-book:before{content:'';position:absolute;left:-9px;top:0;bottom:0;width:12px;border-radius:3px 0 0 3px;background:linear-gradient(90deg,#151b1d,#536064 25%,#263034 52%,#121b20 86%,#ffffff25);box-shadow:inset 0 1px 1px #ffffff55;border-bottom:1px solid #000}
.experience-book:after{content:'';position:absolute;left:13px;top:1px;bottom:1px;width:4px;background:linear-gradient(90deg,#0006,#ffffff18,transparent);pointer-events:none}
.need-world:before{background:radial-gradient(ellipse at 50% 100%,#414440 0%,#282a28 32%,#111311 64%,#060606 86%)}
.need-world:after{opacity:.23}
@media(max-width:720px){.experience-mockups{gap:12px}.experience-tablet{padding:8px 10px;border-width:1px}.experience-tablet:before{left:3px;width:3px;height:3px}.experience-book{padding-left:15px}.experience-book:before{left:-5px;width:7px}.experience-book:after{left:7px;width:3px}.experience-mockups:before{bottom:-10px;height:17px}}

/* Studio contact lighting and short reflections keep the objects seated. */
.need-world:before{background:radial-gradient(ellipse at 50% 100%,#505151 0%,#303232 27%,#111313 53%,#060606 76%)}
.experience-mockups:before{bottom:-7px;height:15px;left:0;right:0;background:radial-gradient(ellipse,#000 15%,#000c 46%,transparent 74%);filter:blur(3px)}
.experience-tablet{padding:18px 21px;border:1px solid #c2c3bf;border-radius:27px;background:linear-gradient(120deg,#454847 0%,#0d0e0e 23%,#090a0a 70%,#262827 100%);box-shadow:inset 0 0 0 2px #101111,inset 0 3px 2px #ffffff66,0 3px 3px #000,0 15px 18px -12px #000; -webkit-box-reflect:below 4px linear-gradient(to bottom,transparent 82%,#ffffff14 100%)}
.experience-tablet:before{left:7px;width:6px;height:6px;background:#020405;box-shadow:inset 0 0 0 1px #ffffff0d}
.experience-screen{border-radius:9px}
.experience-book{border-radius:3px 2px 2px 3px;border-top:1px solid #ffffff6b;border-right:1px solid #ffffff2a;box-shadow:inset 2px 0 2px #ffffff55,inset 13px 0 8px #0006,3px 0 0 #8a887f,0 3px 3px #000,8px 14px 17px -12px #000; -webkit-box-reflect:below 4px linear-gradient(to bottom,transparent 82%,#ffffff12 100%)}
.experience-book:before{content:'';position:absolute;inset:0 auto 0 0;width:18px;background:linear-gradient(90deg,#05080977,#ffffff1f 26%,#0007 55%,#ffffff22 77%,transparent);border-radius:3px 0 0 3px;pointer-events:none}
.experience-book:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,#ffffff0b,transparent 35%,#0000000a);border-radius:inherit}
@media(max-width:720px){.experience-tablet{padding:8px 10px;border-radius:14px}.experience-tablet:before{left:3px;width:3px;height:3px}.experience-screen{border-radius:6px}.experience-book:before{width:10px}.experience-mockups:before{bottom:-5px;height:11px}}

.process-interactive{padding-top:35px;scroll-margin-top:90px}.process-interactive .service-layout{width:100%;margin-top:45px}.process-interactive .stage-bottom button{background:none;color:inherit;display:flex;align-items:center;gap:20px;white-space:nowrap;border-bottom:1px solid currentColor;padding:10px 0;font-size:12px}.process-interactive .stage-bottom p{max-width:340px}.process-interactive .service-tabs small{line-height:1.5}
@media(max-width:720px){.process-interactive{padding-top:25px}.process-interactive .service-layout{margin-top:30px}.process-interactive .stage-bottom button{font-size:11px;gap:10px}.process-interactive .stage-bottom{align-items:flex-start}}

.process-heading{padding-bottom:0}.process-heading p{font-size:18px;line-height:1.4;margin:14px 0 0}@media(max-width:720px){.process-heading p{font-size:16px;margin-top:12px}}

.process-interactive .service-stage{background:#dedbd4;color:#303932;min-height:580px}.process-art{position:relative;height:440px;margin:0 25px}.process-visual{position:absolute;inset:0;display:none;align-items:center;justify-content:center}.service-stage[data-mode=cover] .brief-visual,.service-stage[data-mode=interior] .mood-visual,.service-stage[data-mode=visuals] .draft-visual,.service-stage[data-mode=web] .final-visual,.service-stage[data-mode=story] .delivery-visual{display:flex}
.brief-paper{position:relative;background:#fffdf6;width:310px;padding:30px 29px;box-shadow:3px 7px 0 #eeeae0,8px 16px 25px #30352a25;transform:rotate(-4deg);color:#343a35}.brief-paper>small{font-size:7px;letter-spacing:1.3px}.brief-paper h4{font-size:22px;letter-spacing:-.7px;line-height:1.1;margin:16px 0 23px;font-weight:500}.brief-paper dl{margin:0}.brief-paper dt{font-size:6px;letter-spacing:1px;color:#80776c;margin-top:13px}.brief-paper dd{font-size:9px;line-height:1.6;margin:4px 0 0}.brief-note{display:block;font-size:9px;margin-top:19px;color:#a34f37}.paperclip{position:absolute;width:18px;height:55px;border:3px solid #999e9c;border-radius:12px;top:-12px;right:34px;transform:rotate(10deg);box-shadow:2px 2px 3px #0003}.paperclip:after{content:'';position:absolute;inset:4px 3px 8px;border:1px solid #b4b7b2;border-radius:8px}
.moodboard{width:100%;max-width:450px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:190px 165px;gap:12px;transform:rotate(-2deg)}.mood-tile{position:relative;overflow:hidden;padding:17px;box-shadow:0 4px 8px #0001}.mood-tile small{font-size:5px;letter-spacing:1px;display:block}.mood-type{background:#d7ab50;color:#37332a;transform:translateY(12px)}.mood-type strong{font-size:25px;line-height:1.05;display:block;margin:23px 0}.mood-type>span{font-size:16px}.mood-photo{background:#15303b url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;color:#f5e9d1}.mood-photo span{font-size:18px;display:block;margin-top:65px;line-height:1.1}.mood-pages{background:#fffdf5;color:#333;transform:rotate(3deg)}.mood-pages h5{font-size:18px;font-weight:500;margin:20px 0 15px}.typeset-lines{height:56px;background:repeating-linear-gradient(to bottom,#58605b70 0 1px,transparent 1px 6px);margin:12px 0;opacity:.65}.mood-web{background:linear-gradient(#16283230,#162832d9),url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;color:#f4ebd9}.mood-web strong{font-size:27px;line-height:1;display:block;margin:23px 0 15px}.mood-web span{font-size:6px}.mood-swatch{background:#ece7dc;display:flex;flex-wrap:wrap;gap:4px;align-content:center}.mood-swatch i{height:57px;width:calc(33.33% - 3px);background:#274754}.mood-swatch i:nth-child(2){background:#c6b78e}.mood-swatch i:nth-child(3){background:#a45037}.mood-swatch small{width:100%;margin-top:14px}.mood-cover{background:#9e4737;color:#f5dba6;transform:translateY(-10px)}.mood-cover strong{font-size:25px;display:block;margin-top:32px;line-height:1}
.draft-board{position:relative;width:100%;max-width:455px;height:390px}.draft-label{position:absolute;top:8px;left:6px;font-size:7px;letter-spacing:1.4px}.draft-option{position:absolute;width:34%;top:54px;left:1%;transform:rotate(-7deg)}.draft-option.option-b{left:35%;top:44px;transform:rotate(5deg)}.process-cover{position:relative;aspect-ratio:.66;background:#173039 url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;color:#f6ebcf;box-shadow:4px 7px 10px #0003;text-align:center;padding:17px 12px}.process-cover>small{font-size:6px;letter-spacing:1px}.process-cover>strong{display:block;font-size:28px;line-height:1;margin-top:38px;font-weight:500}.process-cover>span{position:absolute;bottom:16px;left:0;right:0;font-size:6px;letter-spacing:2px}.alternate-cover{background:#cabd94;color:#223d46;border:10px solid #e2d9bf}.alternate-cover>strong{font-size:25px;text-align:left;margin-top:35px}.draft-option>small{display:block;font-size:6px;margin-top:10px;letter-spacing:1px}.draft-page{position:absolute;width:32%;right:0;top:114px;transform:rotate(10deg)}.process-page{position:relative;aspect-ratio:.66;background:#fffdf5;box-shadow:4px 7px 10px #0002;padding:23px 17px;color:#303831;text-align:left}.process-page>small{font-size:5px;letter-spacing:1px}.process-page h5{font-size:16px;line-height:1.2;font-weight:500;margin:24px 0 16px}.process-page p{font-size:7px;line-height:1.6}.process-page>span{position:absolute;bottom:13px;left:50%;font-size:6px}.draft-page .typeset-lines{height:30px}.draft-note{position:absolute;bottom:8px;left:15%;font-size:11px;color:#9c4c36;transform:rotate(-5deg);line-height:1.5}
.final-visual{flex-direction:column;gap:28px}.final-pair{display:flex;width:90%;max-width:420px;gap:22px;align-items:stretch}.final-pair>*{width:calc(50% - 11px)}.final-pair .process-cover strong{font-size:34px;margin-top:42px}.final-pair .process-page h5{font-size:20px}.final-pair .process-page p{font-size:8px}.finish-label{font-size:7px;letter-spacing:1.4px}
.delivery-folder{position:relative;width:350px;background:#ede5d4;border:1px solid #d0c5ad;border-radius:4px;padding:29px;box-shadow:7px 14px 22px #0002}.delivery-folder:before{content:'';position:absolute;left:0;top:-17px;width:120px;height:17px;background:#d7cbb2;border-radius:7px 7px 0 0}.delivery-folder>small{font-size:6px;letter-spacing:1px}.delivery-folder h4{font-size:25px;font-weight:500;line-height:1.1;margin:19px 0 23px;letter-spacing:-.7px}.delivery-file{display:flex;align-items:center;gap:13px;background:#fffdf7;padding:12px;margin-top:8px}.delivery-file>b{font-size:10px;color:#9d9079;font-weight:400}.delivery-file>span{font-size:12px}.delivery-file small{display:block;font-size:5px;letter-spacing:.8px;margin-top:5px}.delivery-file i{font-style:normal;font-size:12px;margin-left:auto;color:#40604a}.delivery-note{display:block;font-size:8px;margin-top:18px;color:#80725e}
@media(max-width:720px){.process-interactive .service-stage{min-height:550px}.process-art{margin:0 15px;height:400px}.brief-paper{width:260px;padding:25px}.brief-paper h4{font-size:20px}.brief-paper dd{font-size:8px}.moodboard{gap:8px;grid-template-rows:175px 150px}.mood-tile{padding:11px}.mood-type strong,.mood-cover strong{font-size:21px}.mood-photo span{font-size:15px}.mood-pages h5{font-size:15px}.draft-board{height:350px}.process-cover>strong{font-size:20px;margin-top:24px}.alternate-cover{border-width:6px}.alternate-cover>strong{font-size:18px}.process-page{padding:15px 10px}.process-page h5{font-size:12px;margin:17px 0 10px}.process-page p{font-size:5px}.draft-page .typeset-lines{height:22px;margin:9px 0}.draft-note{bottom:20px}.final-pair{width:95%;gap:12px}.final-pair>*{width:calc(50% - 6px)}.final-pair .process-cover strong{font-size:27px;margin-top:30px}.final-pair .process-page h5{font-size:16px}.final-pair .process-page p{font-size:6px}.final-pair .typeset-lines{height:35px}.finish-label{font-size:5px;letter-spacing:1px}.delivery-folder{width:285px;padding:24px}.delivery-folder h4{font-size:23px}}
@media(max-width:720px){.moodboard{width:94%}}

.process-interactive .service-stage{display:flex;align-items:center;justify-content:center}.process-interactive .process-art{width:calc(100% - 50px);margin:0 25px}@media(max-width:720px){.process-interactive .process-art{width:calc(100% - 30px);margin:0 15px}}

/* The direction board fills its frame like a saved collection of references. */
.process-interactive .service-stage[data-mode=interior] .process-art{width:100%;height:580px;margin:0;overflow:hidden}
.moodboard.moodboard-full{width:100%;max-width:none;height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;gap:10px;padding:10px;transform:none;background:#f5f5f7;align-items:start}
.mood-column{display:flex;flex-direction:column;gap:10px;min-width:0}.moodboard-full .mood-tile{border-radius:12px;box-shadow:none;transform:none;flex-shrink:0;padding:19px}.moodboard-full .mood-type{height:185px}.moodboard-full .mood-type strong{font-size:31px;margin:22px 0}.moodboard-full .mood-photo{height:275px}.moodboard-full .mood-photo span{font-size:30px;margin-top:65px}.moodboard-full .mood-swatch{height:120px}.moodboard-full .mood-pages{height:245px}.moodboard-full .mood-pages h5{font-size:24px;margin:29px 0 24px}.moodboard-full .mood-web{height:205px}.moodboard-full .mood-web strong{font-size:38px}.moodboard-full .mood-script{height:205px;background:#e8dca5;color:#364634}.moodboard-full .mood-script strong{font-size:29px;transform:rotate(-7deg)}.moodboard-full .mood-cover{height:150px}.moodboard-full .mood-cover strong{font-size:31px;margin-top:16px}.mood-soft{height:245px;background:#852719 url('/wp-content/themes/bookkreative/site/assets/soft-machinery.webp') center/cover;color:#f6e4c6}.mood-soft strong{display:block;font-size:28px;line-height:1;margin-top:45px;font-weight:500;letter-spacing:-1px}.moodboard-full .mood-spread{height:215px;background:#eae8e0}.moodboard-full .mood-spread h5{font-size:22px;margin:24px 0}
@media(max-width:720px){.process-interactive .service-stage[data-mode=interior] .process-art{height:550px}.moodboard.moodboard-full{gap:7px;padding:7px}.mood-column{gap:7px}.moodboard-full .mood-tile{padding:12px;border-radius:9px}.moodboard-full .mood-type strong{font-size:23px}.moodboard-full .mood-type>span{font-size:13px}.moodboard-full .mood-photo span{font-size:24px}.moodboard-full .mood-pages h5{font-size:19px}.moodboard-full .mood-web strong{font-size:27px}.moodboard-full .mood-cover strong{font-size:24px}.mood-soft strong{font-size:23px}.moodboard-full .mood-script strong{font-size:23px}.moodboard-full .mood-spread h5{font-size:18px}}
@media(max-width:720px){.moodboard-full .mood-type strong{font-size:19px}.mood-soft strong{font-size:17px;letter-spacing:-.8px}.moodboard-full .mood-cover strong{font-size:21px}}

.process-interactive .service-stage[data-mode=visuals] .process-art{width:100%;height:580px;margin:0}.design-options{width:100%;height:100%;display:grid;grid-template-rows:1fr 1fr;gap:1px;background:#c9c7bf}.design-option{position:relative;padding:32px 25px 14px;background:#dcded8;overflow:hidden}.direction-two{background:#e7decb}.option-label{position:absolute;top:13px;left:20px;font-size:8px;letter-spacing:1.8px;color:#51584c}.option-art{height:100%;display:flex;align-items:center;justify-content:center;gap:24px}.option-art .process-cover,.option-art .process-page{height:100%;width:auto;aspect-ratio:.66;flex-shrink:0;transform:rotate(-3deg)}.option-art .process-page{transform:rotate(3deg)}.option-art .process-cover strong{font-size:27px;margin-top:28px}.option-art .process-page h5{font-size:17px;margin:22px 0 15px}.option-art .process-page p{font-size:7px}.option-art .typeset-lines{height:42px;margin:11px 0}.option-art .graphic-cover{background:#dfd6b9;color:#173e47;overflow:hidden}.option-art .graphic-cover strong{font-size:25px;text-align:left;margin-top:20px;line-height:.95}.graphic-cover i{display:block;position:absolute;width:100px;height:100px;border:17px solid #244b54;border-radius:50%;left:25%;top:47%;box-shadow:23px 0 0 #b96542}.option-art .graphic-page{border-top:10px solid #234951;background:#fcf8ed;color:#24434a;padding-top:14px}.graphic-page>b{font-size:39px;display:block;margin:12px 0 7px;font-weight:500;color:#b76543}.option-art .graphic-page h5{font-size:14px;font-weight:700;margin:5px 0 14px;letter-spacing:-.4px}.option-art .graphic-page .typeset-lines{height:36px}
@media(max-width:720px){.process-interactive .service-stage[data-mode=visuals] .process-art{height:550px}.design-option{padding:34px 14px 17px}.option-art{gap:18px}.option-label{left:16px;font-size:7px}.option-art .process-cover strong{font-size:24px;margin-top:28px}.option-art .process-page h5{font-size:15px;margin:17px 0 12px}.option-art .process-page p{font-size:6px}.option-art .typeset-lines{height:37px}.option-art .graphic-cover strong{font-size:22px}.graphic-cover i{width:85px;height:85px;border-width:14px}.option-art .graphic-page h5{font-size:12px;margin:5px 0 10px}.graphic-page>b{font-size:30px;margin:9px 0 7px}}
.option-art .typeset-lines{height:31px;margin:10px 0}.option-art .graphic-page .typeset-lines{height:30px}

.launch-scene{position:relative;width:100%;max-width:460px;height:420px}.launch-website{position:absolute;top:22px;left:0;width:91%;height:275px;background:#18303a url('/wp-content/themes/bookkreative/site/assets/quiet-atlas.webp') center/cover;box-shadow:0 10px 25px #0003;border:1px solid #ffffff40;border-radius:7px;overflow:hidden;transform:rotate(-3deg);color:#f7f0df}.launch-browser{height:24px;background:#f5f1e7;color:#82847c;display:flex;align-items:center;gap:25px;font-size:6px;padding:0 12px}.launch-browser span{font-size:7px;letter-spacing:.4px}.launch-web-copy{height:100%;padding:33px 25px;background:linear-gradient(90deg,#0e202ad9,#0e202a20)}.launch-web-copy>small{font-size:6px;letter-spacing:1px}.launch-web-copy h4{font-size:32px;font-weight:500;letter-spacing:-1px;margin:17px 0 12px}.launch-web-copy p{font-size:8px;line-height:1.6}.launch-buy{display:inline-block;background:#ede4c9;color:#1c3439;font-size:8px;padding:9px 13px;margin-top:15px}.launch-web-copy .launch-formats{display:block;font-size:5px;margin-top:13px}.launch-book.process-cover{position:absolute;right:0;bottom:16px;width:155px;transform:rotate(5deg);box-shadow:4px 1px 0 #c3bca8,10px 17px 23px #0004;z-index:2}.launch-book.process-cover strong{font-size:30px;margin-top:33px}.launch-announcement{position:absolute;bottom:0;left:15px;width:220px;background:#f8f1df;color:#26414a;padding:23px;transform:rotate(-5deg);box-shadow:5px 8px 16px #0002}.launch-announcement small{font-size:6px;letter-spacing:1.6px}.launch-announcement strong{display:block;font-size:37px;font-weight:500;letter-spacing:-1.5px;margin:9px 0 13px}.launch-announcement>span{font-size:7px;line-height:1.6}
@media(max-width:720px){.launch-scene{height:375px}.launch-website{height:243px;width:95%;top:20px}.launch-web-copy{padding:26px 17px}.launch-web-copy h4{font-size:27px}.launch-web-copy p{font-size:7px}.launch-book.process-cover{width:118px;bottom:19px;padding:17px 10px}.launch-book.process-cover strong{font-size:24px;margin-top:27px}.launch-announcement{left:5px;width:185px;padding:20px}.launch-announcement strong{font-size:32px}.launch-announcement>span{font-size:6px}}

/* Transparent artwork is contained within the same process preview surface. */
.process-interactive .service-stage[data-mode=story]{background:#dedbd4;overflow:hidden}
.process-interactive .service-stage[data-mode=story] .process-art{width:100%;height:580px;margin:0}
.delivery-visual{padding:32px}
.launch-render{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}
@media(max-width:720px){.process-interactive .service-stage[data-mode=story] .process-art{height:550px}.delivery-visual{padding:20px}}

/* Supplied BookKreative identity, shared across brand placements. */
.brand-logo{display:block;width:34px;height:40px;object-fit:contain;flex:0 0 auto}.studio-logo{display:block;width:80px;height:96px;object-fit:contain;margin-bottom:24px}footer .brand{align-items:center}
@media(max-width:720px){.brand-logo{width:27px;height:32px}.studio-logo{width:62px;height:76px}}

/* One horizontal lockup, with the red accent restricted to the i dot. */
.brand{gap:8px;color:#f5f5f7;font-weight:600;letter-spacing:-.8px;white-space:nowrap}
.brand .brand-logo{width:28px;height:34px;object-fit:contain;flex-shrink:0}
.brand-wordmark{display:inline-block;font-size:24px;line-height:1;letter-spacing:-.8px}
.brand-letter-i{position:relative;display:inline-block}
.brand-letter-i:after{content:"";position:absolute;width:.13em;height:.13em;left:50%;top:.035em;transform:translateX(-42%);background:#e50905;border-radius:50%}
.studio-brand{display:inline-flex;margin-bottom:28px}.studio-brand .brand-wordmark{font-size:30px}.studio-brand .brand-logo{width:34px;height:41px}
@media(max-width:720px){.brand{gap:7px}.brand .brand-wordmark{font-size:21px}.brand .brand-logo{width:24px;height:29px}.studio-brand .brand-wordmark{font-size:27px}.studio-brand .brand-logo{width:30px;height:36px}}

/* Restore the circular brand mark and plain wordmark. */
.brand .brand-logo{width:36px;height:36px}.studio-brand .brand-logo{width:42px;height:42px}
@media(max-width:720px){.brand .brand-logo{width:30px;height:30px}.studio-brand .brand-logo{width:36px;height:36px}}

body{font-optical-sizing:auto}

/* Hero actions share a silhouette; studio action follows filled service pills. */
.hero-actions .hero-contact,.hero-actions .hero-work{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:17px 25px;border-radius:30px;font-size:16px;line-height:1.2;border:1px solid transparent;text-decoration:none}
.hero-actions .hero-work{background:transparent;border-color:#f4f2e8;color:#f4f2e8}.hero-actions .hero-work:hover{background:#ffffff16}
.studio-learn-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid #f4f2e8;border-radius:24px;font-size:13px;line-height:1.4;background:#f4f2e8;color:#202322}.studio-learn-button:hover{background:#fff;border-color:#fff}
@media(max-width:720px){.hero-actions{gap:12px}.hero-actions .hero-contact,.hero-actions .hero-work{padding:16px 18px;font-size:14px;min-height:52px}.studio-learn-button{font-size:12px;padding:10px 13px}}

.hero-actions .hero-contact,.hero-actions .hero-work{width:190px;flex:0 0 190px}
@media(max-width:720px){.hero-actions .hero-contact,.hero-actions .hero-work{width:calc((100% - 12px)/2);flex:0 0 calc((100% - 12px)/2);padding-inline:10px}}

/* Very pale service colors keep the artwork as the focal point. */
.service-cards .cover-service-panel{background:#f3dedb;--panel-ink:#8b2117}
.service-cards .interior-service-panel{background:#dce8f6;--panel-ink:#235b94}
.service-cards .visuals-service-panel{background:#dce8f6;--panel-ink:#235b94}
.service-cards .landing-service-panel{background:#f3dedb;--panel-ink:#8b2117}
.service-cards :is(.cover-panel-copy,.interior-panel-copy,.landing-panel-copy){color:#232725}
.service-cards :is(.cover-panel-copy,.interior-panel-copy,.landing-panel-copy)>p{color:#535c57}
.service-cards :is(.cover-panel-actions,.interior-panel-actions,.landing-panel-actions) a{background:var(--panel-ink);border-color:var(--panel-ink);color:#fff}
.service-cards :is(.cover-panel-actions,.interior-panel-actions,.landing-panel-actions) button{background:transparent;border-color:var(--panel-ink);color:var(--panel-ink)}
.service-cards :is(.cover-panel-actions,.interior-panel-actions,.landing-panel-actions) a:hover{filter:brightness(.88)}
.service-cards :is(.cover-panel-actions,.interior-panel-actions,.landing-panel-actions) button:hover{background:#00000008}
.service-cards :is(.cover-panel-actions,.interior-panel-actions,.landing-panel-actions) :is(a,button):focus-visible{outline-color:var(--panel-ink)}

.service-cards :is(.cover-service-panel,.landing-service-panel){background:#bd301d}
.service-cards :is(.cover-service-panel,.landing-service-panel) :is(.cover-panel-copy,.landing-panel-copy){color:#f8e4c6}
.service-cards :is(.cover-service-panel,.landing-service-panel) :is(.cover-panel-copy,.landing-panel-copy)>p{color:#f8e4c6}
.service-cards :is(.cover-service-panel,.landing-service-panel) :is(.cover-panel-actions,.landing-panel-actions) a{background:#f8e4c6;border-color:#f8e4c6;color:#8b2117}
.service-cards :is(.cover-service-panel,.landing-service-panel) :is(.cover-panel-actions,.landing-panel-actions) button{background:transparent;border-color:#f8e4c6;color:#f8e4c6}
.service-cards :is(.cover-service-panel,.landing-service-panel) :is(.cover-panel-actions,.landing-panel-actions) button:hover{background:#ffffff18}
.service-cards :is(.cover-service-panel,.landing-service-panel) :is(a,button):focus-visible{outline-color:#f8e4c6}

.service-cards :is(.interior-service-panel,.visuals-service-panel){background:var(--ink)}
.service-cards :is(.interior-service-panel,.visuals-service-panel) :is(.interior-panel-copy,.landing-panel-copy){color:#f5f5f7}
.service-cards :is(.interior-service-panel,.visuals-service-panel) :is(.interior-panel-copy,.landing-panel-copy)>p{color:#c8c8c8}
.service-cards :is(.interior-service-panel,.visuals-service-panel) :is(.interior-panel-actions,.landing-panel-actions) a{background:#f4f2e8;border-color:#f4f2e8;color:#171717}
.service-cards :is(.interior-service-panel,.visuals-service-panel) :is(.interior-panel-actions,.landing-panel-actions) button{background:transparent;border-color:#f4f2e8;color:#f4f2e8}
.service-cards :is(.interior-service-panel,.visuals-service-panel) :is(.interior-panel-actions,.landing-panel-actions) button:hover{background:#ffffff18}
.service-cards :is(.interior-service-panel,.visuals-service-panel) :is(a,button):focus-visible{outline-color:#f4f2e8}

.service-cards :is(.cover-panel-copy,.interior-panel-copy,.landing-panel-copy) h3{font-size:40px}
@media(max-width:720px){.service-cards :is(.cover-panel-copy,.interior-panel-copy,.landing-panel-copy) h3{font-size:27px}}

.service-cards :is(.cover-panel-copy,.interior-panel-copy,.landing-panel-copy) h3{font-weight:600}

.project-proof{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;align-items:center;padding:70px 10%;background:#fff;color:#202322;border-bottom:1px solid #17171710}
.proof-number{display:flex;flex-direction:column;gap:12px}.proof-number strong{font-size:clamp(68px,8vw,112px);font-weight:600;letter-spacing:-.065em;line-height:1;font-variant-numeric:tabular-nums}.proof-number strong>span:last-child{color:#a50a04;font-weight:400}.proof-number>span{font-size:17px;color:#626762}
.proof-context h2{font-size:clamp(24px,2.4vw,34px);letter-spacing:-.045em;font-weight:550;line-height:1.2;max-width:400px}.proof-context p{font-size:15px;line-height:1.7;color:#676b67;margin:16px 0 22px}.proof-platforms{display:flex;align-items:center;gap:20px;font-size:19px;font-weight:600;letter-spacing:-.5px}.proof-platforms i{height:17px;width:1px;background:#ccc}
.client-voices{background:#fafaf9}.client-voices .needs-heading p{font-size:17px;color:#686b67;margin-top:15px}.testimonial-previews{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.testimonial-previews article{display:flex;flex-direction:column;background:#fff;padding:30px;border:1px solid #e5e5e1;border-radius:8px;min-height:310px}.quote-symbol{font-size:58px;line-height:1;color:#a50a04;height:50px}.preview-label{font-size:8px;letter-spacing:1.5px;color:#85857e}.quote-placeholder h3{font-size:22px;font-weight:500;letter-spacing:-.6px;line-height:1.3;margin:12px 0}.quote-placeholder p{font-size:13px;line-height:1.6;color:#7a7d77}.quote-person{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:30px}.person-placeholder{display:block;width:34px;height:34px;border-radius:50%;background:#edece7}.quote-person strong{font-size:12px;font-weight:500;display:block}.quote-person small{font-size:10px;color:#878980;display:block;margin-top:4px}.client-logo-area{text-align:center;margin-top:65px;padding-top:40px;border-top:1px solid #dedfd9}.client-logo-area>p{font-size:13px;color:#747970}.client-logo-slots{display:grid;grid-template-columns:repeat(5,1fr);gap:25px;margin:35px 0 25px;align-items:center}.client-logo-slots span{font-size:16px;font-weight:550;letter-spacing:-.3px;color:#a0a39b;padding:15px 5px;border:1px dashed #d9dcd4;border-radius:4px}.client-logo-area>small{font-size:10px;color:#92968c}.instagram-link{display:inline-flex;align-items:center;gap:9px;font-size:12px;color:#d5d5d2}.instagram-link:hover{color:#fff}
@media(max-width:900px){.project-proof{padding:55px 6%;gap:35px}.testimonial-previews{gap:12px}.testimonial-previews article{padding:22px}.quote-placeholder h3{font-size:19px}}
@media(max-width:720px){.project-proof{grid-template-columns:1fr;gap:28px;padding:45px 6%}.proof-number strong{font-size:76px}.proof-number>span{font-size:15px}.proof-context h2{font-size:27px}.proof-context p{font-size:14px}.proof-platforms{font-size:17px}.testimonial-previews{grid-template-columns:1fr;gap:14px}.testimonial-previews article{min-height:260px;padding:26px}.quote-placeholder h3{font-size:22px}.client-logo-area{margin-top:38px;padding-top:30px}.client-logo-slots{grid-template-columns:repeat(2,1fr);gap:12px;margin:25px 0 18px}.client-logo-slots span:last-child{grid-column:1/-1;max-width:160px;width:100%;justify-self:center}footer .instagram-link{justify-self:end;font-size:11px}}

.project-proof-centered{display:flex;justify-content:center;text-align:center;padding:65px 6%}.project-proof-centered .proof-number{align-items:center}
@media(max-width:720px){.project-proof-centered{padding:48px 6%}}

.studio-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:65px;scroll-margin-top:40px}.studio-stat{background:#222;padding:32px 30px;min-height:190px;display:flex;flex-direction:column;justify-content:space-between;gap:28px}.studio-stat strong{font-size:clamp(44px,5.3vw,72px);line-height:1;font-weight:550;letter-spacing:-.055em;font-variant-numeric:tabular-nums;white-space:nowrap}.stat-plus{color:#ef796e;font-weight:400}.studio-stat h3{font-size:15px;font-weight:450;color:#d1d1ce;letter-spacing:-.2px}
@media(max-width:720px){.studio-stats{margin-top:40px;gap:2px}.studio-stat{min-height:132px;padding:20px 10px;gap:20px}.studio-stat strong{font-size:clamp(25px,7.3vw,44px)}.studio-stat h3{font-size:11px;line-height:1.4;max-width:90px}}

/* Studio introduction connects directly to the experience counters. */
.about-main{grid-template-columns:1fr 1.65fr;gap:9%;margin-top:0;align-items:start}
.about .studio-identity h2{font-size:11px;line-height:1.5;letter-spacing:1.8px;text-transform:uppercase;font-weight:450;margin:0 0 27px;color:#bebeba}
.studio-identity .studio-brand{margin-bottom:0}
.about-main .studio-introduction>p{max-width:680px;font-size:16px;line-height:1.75;color:#bebeba;margin-bottom:24px}
.about-main .studio-introduction>.studio-lead{font-size:clamp(27px,2.8vw,40px);line-height:1.22;letter-spacing:-1.2px;font-weight:450;color:#f4f2e8;margin-bottom:22px}
@media(max-width:720px){.about-main{display:block}.about-main>.studio-identity{margin-top:0}.about-main>.studio-introduction{margin-top:30px}.about .studio-identity h2{font-size:10px;margin-bottom:18px}.about-main .studio-introduction>.studio-lead{font-size:28px;letter-spacing:-.8px}.about-main .studio-introduction>p{font-size:14px;line-height:1.7}}

.studio-workspace{margin:48px 0 0;position:relative;aspect-ratio:2.2;clip-path:url(#studio-book-shape);background:#8b201c}
.studio-clip-defs{position:absolute}
.studio-workspace>img{width:100%;height:100%;object-fit:cover;object-position:center 58%;display:block}
.about .studio-stats{margin-top:36px;gap:0}
.about .studio-stat{background:transparent;min-height:150px;padding:12px 30px;align-items:center;text-align:center;gap:24px}
.about .studio-stat+.studio-stat{border-left:1px solid #ffffff24}
.about .studio-stat strong{font-size:clamp(42px,4.6vw,64px)}
@media(max-width:720px){.studio-workspace{margin-top:32px;aspect-ratio:1.35}.studio-workspace>img{object-position:center 54%}.about .studio-stats{margin-top:25px}.about .studio-stat{min-height:105px;padding:8px 8px;gap:17px}.about .studio-stat strong{font-size:clamp(25px,7.3vw,44px)}}

/* A continuous ribbon leaves pockets for the studio numbers. */
.studio-composition{position:relative;margin-top:46px;aspect-ratio:2.65}
.studio-composition .studio-workspace{position:absolute;inset:0;aspect-ratio:auto;margin:0}
.studio-composition .studio-workspace>img{object-position:center 46%}
.about .studio-composition .studio-stats{position:absolute;inset:0;margin:0;display:block;pointer-events:none}
.about .studio-composition .studio-stat{position:absolute;min-height:0;padding:0;border:0;gap:9px;justify-content:center;align-items:center;text-align:center;width:21%;height:32%;top:67%}
.about .studio-composition .studio-stat:first-child{top:2%;left:79%;height:34%;width:21%}
.about .studio-composition .studio-stat:nth-child(2){left:0}
.about .studio-composition .studio-stat:nth-child(3){left:23%}
.about .studio-composition .studio-stat:nth-child(4){left:46%}
.about .studio-composition .studio-stat strong{font-size:clamp(30px,3.7vw,48px)}
.about .studio-composition .studio-turnaround strong{font-size:clamp(23px,2.5vw,34px);letter-spacing:-1px}
.about .studio-composition .studio-stat h3{font-size:13px}
@media(max-width:720px){.studio-composition{margin-top:30px;aspect-ratio:1.9}.about .studio-composition .studio-stat{gap:5px}.about .studio-composition .studio-stat strong{font-size:clamp(18px,5vw,30px);letter-spacing:-1px}.about .studio-composition .studio-turnaround strong{font-size:14px;letter-spacing:-.4px}.about .studio-composition .studio-stat h3{font-size:9px;line-height:1.35}.studio-composition .studio-workspace>img{object-position:44% 46%}}

.about .studio-identity .studio-descriptor{margin:10px 0 0 50px;font-size:23px;line-height:1.2;letter-spacing:-.5px;text-transform:none;font-weight:400;color:#bebeba}
@media(max-width:720px){.about .studio-identity .studio-descriptor{margin-left:43px;font-size:21px}}

.about .studio-identity{width:max-content;max-width:100%}
.about .studio-identity .studio-descriptor{margin:3px 0 0;text-align:right;font-size:11px;line-height:1.5;letter-spacing:1.8px;text-transform:uppercase;font-weight:450;color:#bebeba}
@media(max-width:720px){.about .studio-identity .studio-descriptor{margin:3px 0 0;font-size:10px}}

.about .studio-identity .studio-brand{display:flex}
.about .studio-identity .studio-descriptor{margin-top:-5px}

.client-logo-slots.client-brands{grid-template-columns:repeat(4,1fr);gap:32px;margin:32px 0 0}.client-brands>div{min-height:58px;display:flex;align-items:center;justify-content:center}.client-brands img{display:block;width:128px;max-width:100%;height:auto;object-fit:contain}.client-brands .client-wordmark{font-size:34px;color:#202322;letter-spacing:-1.6px;line-height:1;font-weight:650}.client-brands .client-fiverr{font-weight:800}.client-brands .client-fiverr span{border:0;padding:0;margin:0;font:inherit;color:#1dbf73}.client-brands .client-upwork{color:#158b24}@media(max-width:720px){.client-logo-slots.client-brands{grid-template-columns:repeat(2,1fr);gap:20px}.client-brands .client-wordmark{font-size:31px}.client-brands img{width:118px}}

.testimonial-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.testimonial-cards article{background:#fff;border:1px solid #e1e1dd;border-radius:14px;text-align:center;padding:34px 28px 38px;display:flex;flex-direction:column;align-items:center}
.testimonial-cards article:nth-child(2){background:#f0efec;border-color:#d1cfca}
.testimonial-portrait{width:88px;height:88px;object-fit:cover;object-position:center 12%;border-radius:50%;background:#dededb;filter:grayscale(1);border:1px solid #d0d0cd;display:block}
.testimonial-cards h3{font-size:17px;font-weight:550;letter-spacing:-.4px;margin:18px 0 0;color:#232323}
.testimonial-quote-mark{font-size:43px;line-height:1;color:#a50a04;height:34px;margin-top:20px;font-family:Georgia,serif}
.testimonial-cards blockquote{margin:0}.testimonial-cards blockquote p{font-size:14px;line-height:1.85;color:#62625f;margin:0}
@media(max-width:900px){.testimonial-cards{gap:14px}.testimonial-cards article{padding:28px 20px 30px}.testimonial-cards blockquote p{font-size:13px}}
@media(max-width:720px){.testimonial-cards{grid-template-columns:1fr;gap:16px}.testimonial-cards article{padding:30px 27px}.testimonial-cards blockquote p{font-size:14px}.testimonial-portrait{width:82px;height:82px}}

.final-cta{gap:36px}.final-cta h2{font-size:clamp(48px,6.2vw,88px);line-height:1.02;letter-spacing:-3.5px;margin:25px 0}.closing-copy>p{font-size:15px;line-height:1.75;max-width:570px}.closing-project-button{display:inline-flex;justify-content:center;align-items:center;min-height:64px;padding:20px 32px;border-radius:100px;border:1px solid #f4f2e8;background:#f4f2e8;color:#81150f;font-size:17px;font-weight:550;line-height:1.35;cursor:pointer;box-shadow:0 5px 0 #580c0866;transition:transform .18s,box-shadow .18s,background .18s}.closing-project-button:hover{background:#fff;transform:translateY(-2px);box-shadow:0 7px 0 #580c0866}.closing-project-button:active{transform:translateY(3px);box-shadow:0 2px 0 #580c0866}
@media(max-width:720px){.final-cta{gap:28px}.final-cta h2{font-size:48px;letter-spacing:-2px}.closing-copy>p{font-size:14px}.closing-copy>p br{display:none}.closing-project-button{min-height:58px;font-size:15px;padding:17px 26px}}
@media(prefers-reduced-motion:reduce){.closing-project-button{transition:none}}

.site-footer{display:block;background:#171717;padding:66px 6% 26px;color:#bcbcb8}
.footer-main{display:grid;grid-template-columns:1.4fr .8fr 1.2fr .85fr;gap:42px;padding-bottom:54px}
.footer-studio .brand{display:inline-flex;font-size:23px;color:#f4f2e8}
.footer-studio>p{font-size:13px;line-height:1.75;max-width:235px;margin-top:20px}.footer-studio>.footer-location{margin-top:15px;color:#999a95}
.footer-column{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.footer-column h2{font-size:14px;line-height:1.5;font-weight:550;color:#f4f2e8;margin:4px 0 7px;letter-spacing:0}
.footer-column>a,.footer-column>span,.footer-contact{font-size:13px;line-height:1.5;color:#bcbcb8}
.footer-column a:hover,.footer-contact:hover,.footer-bottom a:hover{color:#fff}
.footer-contact{padding:0;background:none;text-align:left;cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.footer-column .instagram-link{gap:8px;font-size:12px;white-space:nowrap}
.footer-bottom{border-top:1px solid #ffffff20;padding-top:24px;display:flex;justify-content:space-between;gap:20px;font-size:11px;line-height:1.6;color:#92938e}
@media(max-width:1000px){.footer-main{grid-template-columns:1.2fr 1fr;gap:38px 30px}}
@media(max-width:720px){.site-footer{display:block;padding:45px 6% 24px}.footer-main{grid-template-columns:1fr 1fr;gap:34px 20px;padding-bottom:34px}.footer-studio{grid-column:1/-1}.footer-studio>p{max-width:260px;margin-top:15px}.footer-column{gap:12px}.footer-column>a,.footer-column>span,.footer-contact{font-size:12px;overflow-wrap:anywhere}.footer-column .instagram-link{font-size:11px}.footer-column h2{font-size:13px}.footer-bottom{font-size:10px;align-items:flex-start}.footer-bottom>a{text-align:right;max-width:100px}}

.site-footer .footer-column{min-width:0;width:auto;padding:0;margin:0}.site-footer nav.footer-column a{padding:0}

.site-footer nav.footer-column{position:static;inset:auto;transform:none;border:0;background:none;display:flex}

.site-footer.reference-footer{background:#171717;border-top:1px solid #ffffff14;padding:70px 5% 26px;color:#bcbcb8}
.reference-footer .footer-main{grid-template-columns:1.5fr repeat(4,1fr);gap:0;padding-bottom:42px}
.reference-footer .footer-studio{padding:14px 28px 0 0}.reference-footer .footer-studio .brand-wordmark{font-size:24px}.reference-footer .footer-studio>p{color:#f0f3f6;max-width:275px;font-size:14px;line-height:1.75;margin-top:18px}
.reference-footer .footer-column{border-left:1px solid #ffffff14;padding:0 16px;align-items:center;text-align:center;gap:25px}
.site-footer.reference-footer nav.footer-column{border-left:1px solid #ffffff14;padding:0 16px}
.reference-footer .footer-column h2{color:#fff;font-size:16px;font-weight:700;margin:0 0 3px}
.reference-footer .footer-column>a,.reference-footer .footer-column>span,.reference-footer .footer-contact{color:#bcbcb8;font-size:13px;line-height:1.5;text-align:center;text-decoration:none;overflow-wrap:anywhere}
.reference-footer .footer-column a:hover,.reference-footer .footer-contact:hover{color:#fff}
.footer-socials{display:flex;gap:12px;margin-top:28px}.reference-footer .footer-socials .instagram-link{width:40px;height:40px;border-radius:50%;background:#f4f2e8;color:#171717;display:grid;place-items:center}.reference-footer .footer-socials .instagram-link:hover{background:#fff}.reference-footer .footer-socials svg{width:23px;height:23px}
.reference-footer .footer-bottom{border:0;padding-top:10px;color:#92938e;font-size:10px}
@media(max-width:1050px){.reference-footer .footer-main{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:40px}.reference-footer .footer-studio{grid-column:1/-1;padding:0}.reference-footer .footer-studio>p{max-width:380px}.reference-footer .footer-column:nth-child(2){border-left:0}}
@media(max-width:720px){.site-footer.reference-footer{padding:42px 6% 24px}.reference-footer .footer-main{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:35px;padding-bottom:30px}.reference-footer .footer-column,.site-footer.reference-footer nav.footer-column{padding:0 12px;gap:20px}.reference-footer .footer-column:nth-child(even){border-left:0}.reference-footer .footer-column h2{font-size:15px}.reference-footer .footer-column>a,.reference-footer .footer-column>span,.reference-footer .footer-contact{font-size:12px}.reference-footer .footer-studio .brand-wordmark{font-size:24px}.reference-footer .footer-bottom{font-size:10px}}

.footer-socials .social-placeholder{width:40px;height:40px;border-radius:50%;background:#f4f2e8;color:#171717;display:grid;place-items:center;flex-shrink:0;cursor:default}

.final-cta{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr);gap:40px}
.closing-action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.closing-guide{display:block;width:min(320px,100%);height:auto;overflow:visible;color:#f4f2e8;pointer-events:none}
.closing-guide path{stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.closing-guide-line{stroke-dasharray:1 1;stroke-dashoffset:1;animation:closing-line-flow 4.8s cubic-bezier(.45,0,.3,1) infinite}
.closing-guide-tip{opacity:0;animation:closing-tip-flow 4.8s ease infinite}
@keyframes closing-line-flow{0%,8%{stroke-dashoffset:1}53%,68%{stroke-dashoffset:0}95%,100%{stroke-dashoffset:-1}}
@keyframes closing-tip-flow{0%,45%{opacity:0}54%,80%{opacity:1}95%,100%{opacity:0}}
@media(max-width:720px){.final-cta{grid-template-columns:minmax(0,1fr);gap:12px}.closing-guide{width:220px}.closing-action{gap:6px;align-items:center}.closing-project-button{width:auto;max-width:100%}}
@media(prefers-reduced-motion:reduce){.closing-guide-line{animation:none;stroke-dashoffset:0}.closing-guide-tip{animation:none;opacity:1}}

.final-cta .closing-action{position:static}.final-cta .closing-guide{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}.closing-project-button{position:relative;z-index:2}
@media(max-width:720px){.final-cta .closing-action{padding-top:55px}.final-cta .closing-guide{width:100%;height:100%}}

.service-cards :is(.cover-service-panel,.landing-service-panel){background:var(--accent)}

/* Shared raised treatment for filled calls to action. */
:is(.button:not(.hero-work),.studio-learn-button,.cover-panel-actions>a,.interior-panel-actions>a,.landing-panel-actions>a,.need-actions>a,.closing-project-button){--button-shadow:#00000040;box-shadow:0 5px 0 var(--button-shadow);transition:transform .18s,box-shadow .18s,background .18s}
:is(.cover-service-panel,.landing-service-panel,.final-cta) :is(.button:not(.hero-work),.studio-learn-button,.cover-panel-actions>a,.interior-panel-actions>a,.landing-panel-actions>a,.need-actions>a,.closing-project-button){--button-shadow:#580c0866}
@media(hover:hover){:is(.button:not(.hero-work),.studio-learn-button,.cover-panel-actions>a,.interior-panel-actions>a,.landing-panel-actions>a,.need-actions>a,.closing-project-button):hover{transform:translateY(-2px);box-shadow:0 7px 0 var(--button-shadow)}}
:is(.button:not(.hero-work),.studio-learn-button,.cover-panel-actions>a,.interior-panel-actions>a,.landing-panel-actions>a,.need-actions>a,.closing-project-button):active{transform:translateY(3px);box-shadow:0 2px 0 var(--button-shadow)}
:is(.button:not(.hero-work),.studio-learn-button,.cover-panel-actions>a,.interior-panel-actions>a,.landing-panel-actions>a,.need-actions>a,.closing-project-button):disabled{transform:none;box-shadow:none}
@media(prefers-reduced-motion:reduce){:is(.button:not(.hero-work),.studio-learn-button,.cover-panel-actions>a,.interior-panel-actions>a,.landing-panel-actions>a,.need-actions>a,.closing-project-button){transition:none}}

/* Keep cards opaque and let continuous depth determine their overlap. */
@media(prefers-reduced-motion:no-preference){
 :is(.cover-service-panel,.visuals-service-panel) .campaign-lineup{transform-style:preserve-3d}
 :is(.cover-service-panel,.visuals-service-panel) .campaign-banner{animation-name:campaign-depth-cycle;z-index:auto;opacity:1;will-change:transform;backface-visibility:hidden}
}
@keyframes campaign-depth-cycle{
 0%,12%,100%{transform:translate3d(0,0,0) scale(1) rotateY(0deg)}
 16%{transform:translate3d(calc(var(--banner-offset) * 1.18),0,0) scale(.96) rotateY(-10deg)}
 20%,32%{transform:translate3d(var(--banner-offset),0,-90px) scale(.94) rotateY(-18deg)}
 40%,52%{transform:translate3d(calc(var(--banner-offset) * .65),0,-190px) scale(.84) rotateY(-10deg)}
 60%,72%{transform:translate3d(calc(var(--banner-offset) * -.65),0,-190px) scale(.84) rotateY(10deg)}
 80%,92%{transform:translate3d(calc(var(--banner-offset) * -1),0,-90px) scale(.94) rotateY(18deg)}
 96%{transform:translate3d(calc(var(--banner-offset) * -1.18),0,0) scale(.96) rotateY(10deg)}
}

/* On touch-sized stacks, exchange layers only after the two cards separate. */
@media(prefers-reduced-motion:no-preference) and (max-width:1100px),(prefers-reduced-motion:no-preference) and (pointer:coarse){
 :is(.cover-service-panel,.visuals-service-panel,.interior-service-panel) .campaign-lineup{transform-style:flat;perspective:none}
 :is(.cover-service-panel,.visuals-service-panel,.interior-service-panel) .campaign-banner{animation-name:campaign-touch-cycle;backface-visibility:visible}
 :is(.cover-service-panel,.visuals-service-panel,.interior-service-panel).campaign-visible .campaign-banner{animation-play-state:running}
}
@keyframes campaign-touch-cycle{
 0%,12%,100%{transform:translateX(0) scale(1);z-index:5}
 15.99%{transform:translateX(calc(var(--banner-size) * .38)) scale(.70);z-index:5}
 16%{transform:translateX(calc(var(--banner-size) * .38)) scale(.70);z-index:3}
 20%,32%{transform:translateX(var(--banner-offset)) scale(.83);z-index:3}
 35.99%{transform:translateX(calc(var(--banner-offset) * .65)) scale(.73);z-index:3}
 36%,40%,52%{transform:translateX(calc(var(--banner-offset) * .65)) scale(.73);z-index:1}
 60%,72%,76%{transform:translateX(calc(var(--banner-offset) * -.65)) scale(.73);z-index:1}
 76.01%{transform:translateX(calc(var(--banner-offset) * -.65)) scale(.73);z-index:3}
 80%,92%{transform:translateX(calc(var(--banner-offset) * -1)) scale(.83);z-index:3}
 95.99%{transform:translateX(calc(var(--banner-size) * -.38)) scale(.70);z-index:3}
 96%{transform:translateX(calc(var(--banner-size) * -.38)) scale(.70);z-index:5}
}

@media(min-width:721px) and (max-width:1100px){
 .cover-service-panel .cover-stack{--banner-size:clamp(180px,25vw,260px);--banner-offset:clamp(68px,10vw,110px)}
 .cover-stack .campaign-banner{height:calc(var(--banner-size) * 1.46);padding:22px 16px}
 .cover-stack .campaign-banner strong{font-size:clamp(29px,3.3vw,38px)}
 .visuals-service-panel .campaign-lineup{--banner-size:clamp(190px,25vw,275px);--banner-offset:clamp(58px,8vw,88px)}
 .visuals-service-panel .campaign-banner strong{font-size:clamp(27px,3.5vw,38px)}
}

@media(min-width:721px) and (max-width:1100px){.interior-service-panel .layout-stack{--banner-size:clamp(190px,25vw,270px);--banner-offset:clamp(68px,10vw,110px)}.layout-stack .layout-sheet{height:calc(var(--banner-size) * 1.51)}}
@media(prefers-reduced-motion:no-preference) and (max-width:1100px),(prefers-reduced-motion:no-preference) and (pointer:coarse){.interior-service-panel .campaign-banner{opacity:1}}

.process-alternative{background:#fff;color:#252525;border-top:1px solid #dededb}
.process-alt-heading>.eyebrow{font-size:10px;color:#757570;letter-spacing:1.8px;margin-bottom:17px}
.process-alt-heading h2{font-size:clamp(38px,4.5vw,60px);font-weight:550;line-height:1.1;letter-spacing:-2px}
.process-alt-heading>p{max-width:550px;font-size:16px;line-height:1.7;color:#686862;margin-top:22px}
.process-number-row{display:flex;gap:24px;margin-top:54px;min-height:305px}
.process-number-step{display:flex;align-items:flex-start;flex:1 1 0;min-width:0;border-top:1px solid #dededb;padding-top:24px;gap:0;transition:flex-grow .55s cubic-bezier(.22,1,.36,1),border-color .25s}
.process-number-step.is-open{flex-grow:5.5;border-color:#92928b;gap:24px}
.process-number{flex:0 0 auto;display:block;padding:0;background:none;color:#cececb;font-size:clamp(75px,10vw,146px);font-weight:450;line-height:.95;letter-spacing:-.075em;text-align:left;transition:color .2s}
.process-number-step.is-open .process-number{color:#252525}.process-number:hover,.process-number:focus-visible{color:var(--accent)}
.process-number-detail{min-width:0;flex:1;padding-top:7px;animation:process-detail-in .45s ease both}
.process-number-detail[hidden]{display:none}
.process-number-detail h3{font-size:22px;font-weight:500;letter-spacing:-.6px;line-height:1.2;margin-bottom:15px}
.process-number-detail p{font-size:14px;line-height:1.75;color:#65655f}
.process-number-detail small{display:block;font-size:12px;line-height:1.6;color:#a50a04;margin-top:20px}
.process-alt-start{background:var(--accent);color:#fff;border-radius:30px;font-size:14px;padding:14px 23px;margin-top:32px}
@keyframes process-detail-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:1000px){.process-number-row{gap:16px;min-height:350px}.process-number-step.is-open{flex-grow:7;gap:16px}.process-number{font-size:clamp(60px,9vw,100px)}.process-number-detail h3{font-size:20px}.process-number-detail p{font-size:13px}}
@media(max-width:720px){.process-number-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0 12px;margin-top:35px;min-height:0}.process-number-step,.process-number-step.is-open{display:contents}.process-number{order:0;font-size:57px;border-top:1px solid #dededb;padding-top:18px;width:100%;text-align:center;letter-spacing:-3px}.process-number-step.is-open .process-number{border-color:var(--accent);color:var(--accent)}.process-number-detail{order:1;grid-column:1/-1;padding-top:30px;min-height:265px}.process-number-detail h3{font-size:24px}.process-number-detail p{font-size:15px}.process-alt-heading>p{font-size:15px}.process-alt-start{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.process-number-step,.process-number{transition:none}.process-number-detail{animation:none}}

/* Third process option pairs the numbered journey with the existing artwork. */
.process-combined{padding-top:90px;padding-bottom:100px;border-top:1px solid #dcd9d2}
.combined-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;margin:48px 0 36px}
.combined-step{background:transparent;text-align:left;color:#aaa6a0;border-top:1px solid #ccc8c0;padding:16px 0 0;transition:color .25s,border-color .25s}
.combined-step>span{display:block;font-size:clamp(64px,7vw,100px);font-weight:500;line-height:1;letter-spacing:-.065em}
.combined-step small{display:block;font-size:14px;font-weight:500;margin-top:14px;letter-spacing:-.02em}
.combined-step[aria-selected=true],.combined-step:hover{color:#a50a04;border-color:#a50a04}
.combined-step:focus-visible{outline:2px solid #a50a04;outline-offset:6px}
.combined-panel{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px;align-items:center}
.combined-story{padding:30px 0}
.combined-copy[hidden]{display:none}
.combined-copy h3{font-size:clamp(28px,3vw,42px);font-weight:600;letter-spacing:-.04em;line-height:1.15;margin:0 0 24px}
.combined-copy p{font-size:17px;line-height:1.8;color:#625f59;margin:0 0 26px}
.combined-copy small{display:block;font-size:14px;line-height:1.6;font-weight:500;padding-top:20px;border-top:1px solid #d6d2ca}
.combined-story>.button{margin-top:30px}
.process-combined .service-stage{width:100%;min-width:0;margin:0}
@media(max-width:1000px){.combined-panel{gap:30px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.combined-copy p{font-size:15px}}
@media(max-width:720px){.process-combined{padding-top:65px;padding-bottom:65px}.combined-steps{gap:12px;margin:32px 0 22px}.combined-step>span{font-size:54px}.combined-step small{display:none}.combined-panel{grid-template-columns:minmax(0,1fr);gap:25px}.combined-story{padding:0}.combined-copy h3{font-size:30px;margin-bottom:16px}.combined-copy p{font-size:16px;line-height:1.7}.combined-story>.button{margin-top:24px}}
@media(prefers-reduced-motion:reduce){.combined-step{transition:none}}

.combined-hint{text-align:center;font-size:13px;color:#6c6862;margin:26px 0 0}
.combined-steps{display:flex;margin-top:26px}
.combined-step{flex:1 1 0;min-width:0;cursor:pointer;transition:flex-grow .55s cubic-bezier(.22,1,.36,1),color .25s,border-color .25s}
.combined-step[aria-selected=true]{flex-grow:1.65}
.combined-step>span{transform-origin:left bottom;transition:transform .55s cubic-bezier(.22,1,.36,1)}
.combined-step[aria-selected=true]>span{transform:scale(1.08)}
@media(max-width:720px){.combined-steps{gap:10px;align-items:stretch}.combined-step[aria-selected=true]{flex-grow:1.35}.combined-step>span{font-size:46px}.combined-step small{display:block;font-size:10px;line-height:1.35;margin-top:12px;min-height:40px;color:#625f59}.combined-step[aria-selected=true] small{color:#a50a04}.combined-hint{margin-top:22px}}
@media(prefers-reduced-motion:reduce){.combined-step,.combined-step>span{transition:none}.combined-step[aria-selected=true]>span{transform:none}}

.combined-short,.combined-mobile-nav{display:none}
@media(max-width:720px){
 .process-combined .combined-steps,.process-combined .combined-hint{display:none}
 .combined-mobile-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:28px 0 18px}
 .combined-mobile-nav button{min-height:44px;padding:10px 16px;background:#a50a04;color:#fff;border-radius:24px;font-size:13px;cursor:pointer}
 .combined-mobile-nav button:disabled{background:#e4e1dc;color:#777;cursor:default}
 .combined-mobile-nav span{font-size:12px;color:#625f59;white-space:nowrap}
 .process-combined .combined-panel{display:flex;flex-direction:column;gap:22px;align-items:stretch}
 .process-combined .service-stage{order:0;height:360px;min-height:360px;overflow:hidden;flex-shrink:0}
 .process-combined .service-stage .process-art{width:138.89%;height:500px;margin:0;flex-shrink:0;transform:scale(.72)}
 .combined-story{order:1}
 .combined-copy .combined-long,.combined-copy small{display:none}
 .combined-copy .combined-short{display:block;margin-bottom:0;min-height:110px;font-size:16px;line-height:1.65}
 .combined-copy h3{font-size:28px;margin-bottom:12px}
 .combined-story>.button{margin-top:22px}
}

.mobile-process-list{display:none}
@media(max-width:720px){
 .process-combined .combined-panel{display:none}
 .mobile-process-list{display:block;margin-top:30px}
 .mobile-process-step{border-top:1px solid #d4d1cc}
 .mobile-process-step:last-of-type{border-bottom:1px solid #d4d1cc}
 .mobile-process-step h3{margin:0}
 .mobile-process-step h3 button{display:flex;align-items:center;gap:13px;width:100%;min-height:78px;padding:18px 0;background:none;color:#252525;text-align:left;font-size:18px;font-weight:550;letter-spacing:-.035em;cursor:pointer}
 .mobile-process-number{font-size:13px;color:#85817b;letter-spacing:0}
 .mobile-process-toggle{margin-left:auto;font-size:25px;font-weight:350;transition:transform .35s}
 .mobile-process-step.is-open h3 button{color:#a50a04}
 .mobile-process-step.is-open .mobile-process-toggle{transform:rotate(45deg)}
 .mobile-process-body{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows .45s cubic-bezier(.22,1,.36,1),opacity .3s,visibility .45s}
 .mobile-process-step.is-open .mobile-process-body{grid-template-rows:1fr;opacity:1;visibility:visible}
 .mobile-process-inner{min-height:0;overflow:hidden}
 .mobile-process-inner>p{font-size:16px;line-height:1.65;color:#625f59;padding:20px 0 26px;margin:0}
 .mobile-process-list>.button{margin-top:26px}
}
@media(prefers-reduced-motion:reduce){.mobile-process-body,.mobile-process-toggle{transition:none}}

/* The experience preview now features the tablet alone. */
.need-world .experience-mockups{left:50%;transform:translateX(-50%);width:min(90%,870px);gap:0}
.need-world .experience-tablet{width:100%;height:auto;aspect-ratio:1.5;flex-shrink:1}
@media(max-width:720px){.need-world .experience-mockups{width:88%;height:auto;top:290px;align-items:center}.need-world .experience-tablet{width:100%;height:auto;aspect-ratio:1.5}}

/* Keep the device at a fixed 3:2 proportion instead of stretching to the stage. */
.need-world .experience-mockups{height:auto;align-items:flex-start}
.need-world .experience-tablet{flex:none;align-self:flex-start;aspect-ratio:3 / 2;height:auto;min-height:0;max-width:100%;box-sizing:border-box}
.need-world .experience-screen{position:absolute;inset:18px 21px;width:auto;height:auto;aspect-ratio:auto}
@media(max-width:720px){.need-world .experience-screen{inset:8px 10px}}

@media(max-width:720px){
 .site-footer.reference-footer{padding:40px 24px 24px}
 .site-footer.reference-footer .footer-main{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px;padding-bottom:28px}
 .site-footer.reference-footer .footer-studio{padding-bottom:28px;border-bottom:1px solid #ffffff20}
 .site-footer.reference-footer .footer-studio>p{font-size:14px;line-height:1.7;color:#aaa;max-width:320px;margin-top:16px}
 .site-footer.reference-footer .footer-socials{margin-top:20px;gap:14px}
 .site-footer.reference-footer .footer-socials>*{width:44px;height:44px}
 .site-footer.reference-footer .footer-column,
 .site-footer.reference-footer nav.footer-column{border:0;padding:0;align-items:flex-start;text-align:left;gap:0}
 .site-footer.reference-footer .footer-column h2{font-size:15px;margin:0 0 12px;font-weight:600}
 .site-footer.reference-footer .footer-column>a,
 .site-footer.reference-footer .footer-column>span,
 .site-footer.reference-footer .footer-contact{text-align:left;font-size:13px;line-height:1.55;overflow-wrap:normal;padding:10px 0;min-height:40px}
 .site-footer.reference-footer .footer-main>div.footer-column{grid-column:1/-1;border-top:1px solid #ffffff20;padding-top:26px;gap:0}
 .site-footer.reference-footer .footer-main>div.footer-column>a{font-size:16px;color:#f4f2e8}
 .site-footer.reference-footer .footer-main>div.footer-column>span{font-size:13px;padding:4px 0;min-height:0;color:#aaa}
 .site-footer.reference-footer nav.footer-column:last-child{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;border-top:1px solid #ffffff20;padding-top:26px}
 .site-footer.reference-footer nav.footer-column:last-child h2{grid-column:1/-1}
 .site-footer.reference-footer .footer-bottom{border-top:1px solid #ffffff20;padding-top:22px;font-size:11px;line-height:1.6}
}

/* Let the panel grow with the device so intermediate widths cannot crop it. */
.need-tile.need-world{height:auto;padding-bottom:64px}
.need-world .experience-mockups{position:relative;top:auto;left:auto;transform:none;margin:64px auto 0}
@media(max-width:720px){.need-tile.need-world{padding-bottom:44px}.need-world .experience-mockups{margin-top:42px}}

.portfolio-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 24px}
.portfolio-tabs button{background:transparent;border:1px solid #a9a49a;border-radius:24px;padding:11px 16px;font-size:13px;line-height:1.3;cursor:pointer;color:inherit}
.portfolio-tabs button[aria-selected=true]{background:#a50a04;border-color:#a50a04;color:#fff}
.portfolio-tabs button:focus-visible{outline:2px solid #a50a04;outline-offset:3px}
.portfolio-category{display:block;font-size:11px;color:#716b62;margin-bottom:8px}
@media(max-width:720px){.portfolio-tabs{gap:8px}.portfolio-tabs button{font-size:12px;padding:11px 13px}}

.cover-stack .campaign-banner.cover-actual{padding:0;background:transparent}
.cover-stack .cover-actual img{display:block;width:100%;height:100%;object-fit:contain}
.portfolio-dialog-grid .portfolio-real-cover img{width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;border-radius:0;background:transparent}
.portfolio-dialog-grid .portfolio-real-cover h3{font-size:18px;line-height:1.35;margin-top:6px}
.portfolio-real-cover .portfolio-category{margin-top:14px}

/* Timing follows each slot, independent of which cover artwork is supplied. */
.cover-stack .campaign-banner:nth-child(1){animation-delay:0s}
.cover-stack .campaign-banner:nth-child(2){animation-delay:-4s}
.cover-stack .campaign-banner:nth-child(3){animation-delay:-8s}
.cover-stack .campaign-banner:nth-child(4){animation-delay:-12s}
.cover-stack .campaign-banner:nth-child(5){animation-delay:-16s}
@media(prefers-reduced-motion:reduce){
 .cover-stack .campaign-banner:nth-child(1){opacity:1;z-index:5;transform:none}
 .cover-stack .campaign-banner:nth-child(2){opacity:1;z-index:2;transform:translateX(calc(-1 * var(--banner-offset))) scale(.86) rotateY(22deg)}
 .cover-stack .campaign-banner:nth-child(5){opacity:1;z-index:2;transform:translateX(var(--banner-offset)) scale(.86) rotateY(-22deg)}
}

.layout-stack .campaign-banner.layout-actual{height:calc(var(--banner-size) * 1.51);padding:0;background:transparent;border:0;border-radius:0}
.layout-stack .layout-actual img{display:block;width:100%;height:100%;object-fit:contain}
.portfolio-dialog-grid .portfolio-real-interior{grid-column:1/-1;margin-bottom:24px}
.portfolio-dialog-grid .portfolio-real-interior>img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;border-radius:0}
.portfolio-real-interior .portfolio-category{margin-top:18px}
.portfolio-interior-pages{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px;align-items:start}
.portfolio-dialog-grid .portfolio-interior-pages img{height:auto;width:100%;border-radius:0;background:transparent}
@media(prefers-reduced-motion:reduce){
 .layout-stack .campaign-banner:nth-child(1){opacity:1;z-index:5;transform:none}
 .layout-stack .campaign-banner:nth-child(2){opacity:1;z-index:2;transform:translateX(calc(-1 * var(--banner-offset))) scale(.86) rotateY(22deg)}
 .layout-stack .campaign-banner:nth-child(5){opacity:1;z-index:2;transform:translateX(var(--banner-offset)) scale(.86) rotateY(-22deg)}
}

/* Cover choreography, extended behind the stack to accommodate eight sequential pages. */
.interior-service-panel .layout-stack{--banner-offset:132px}
@media(max-width:720px){.interior-service-panel .layout-stack{--banner-offset:82px}}
@media(min-width:721px) and (max-width:1100px){.interior-service-panel .layout-stack{--banner-offset:clamp(68px,10vw,110px)}}
.layout-stack .campaign-banner.layout-actual{box-shadow:5px 12px 22px #0005;backface-visibility:visible}
@media(prefers-reduced-motion:no-preference){
 .interior-service-panel .layout-stack .campaign-banner{animation-name:interior-depth-cycle;animation-duration:32s;z-index:auto;backface-visibility:hidden;animation-timing-function:ease-in-out;opacity:1;will-change:transform}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(1){animation-delay:0s}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(2){animation-delay:-28s}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(3){animation-delay:-24s}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(4){animation-delay:-20s}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(5){animation-delay:-16s}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(6){animation-delay:-12s}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(7){animation-delay:-8s}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(8){animation-delay:-4s}
}
@keyframes interior-depth-cycle{
 0%,7.5%,100%{transform:translate3d(0,0,0) scale(1) rotateY(0deg)}
 10%{transform:translate3d(calc(var(--banner-offset) * 1.18),0,0) scale(.96) rotateY(-10deg)}
 12.5%,20%{transform:translate3d(var(--banner-offset),0,-90px) scale(.94) rotateY(-18deg)}
 25%,55%{transform:translate3d(calc(var(--banner-offset) * .65),0,-190px) scale(.84) rotateY(-10deg)}
 75%,82.5%{transform:translate3d(calc(var(--banner-offset) * -.65),0,-190px) scale(.84) rotateY(10deg)}
 87.5%,95%{transform:translate3d(calc(var(--banner-offset) * -1),0,-90px) scale(.94) rotateY(18deg)}
 97.5%{transform:translate3d(calc(var(--banner-offset) * -1.18),0,0) scale(.96) rotateY(10deg)}
}
@keyframes interior-touch-cycle{
 0%,7.5%,100%{transform:translateX(0) scale(1);z-index:5}
 9.99375%{transform:translateX(calc(var(--banner-size) * .38)) scale(.70);z-index:5}
 10%{transform:translateX(calc(var(--banner-size) * .38)) scale(.70);z-index:3}
 12.5%,20%{transform:translateX(var(--banner-offset)) scale(.83);z-index:3}
 22.4938%{transform:translateX(calc(var(--banner-offset) * .65)) scale(.73);z-index:3}
 22.5%,25%,55%{transform:translateX(calc(var(--banner-offset) * .65)) scale(.73);z-index:1}
 75%,82.5%,85%{transform:translateX(calc(var(--banner-offset) * -.65)) scale(.73);z-index:1}
 85.0063%{transform:translateX(calc(var(--banner-offset) * -.65)) scale(.73);z-index:3}
 87.5%,95%{transform:translateX(calc(var(--banner-offset) * -1)) scale(.83);z-index:3}
 97.4938%{transform:translateX(calc(var(--banner-size) * -.38)) scale(.70);z-index:3}
 97.5%{transform:translateX(calc(var(--banner-size) * -.38)) scale(.70);z-index:5}
}
@media(prefers-reduced-motion:reduce){
 .interior-service-panel .layout-stack .campaign-banner{animation:none;opacity:0;transform:none;z-index:0}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(1){opacity:1;z-index:5}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(2){opacity:1;z-index:2;transform:translateX(calc(-1 * var(--banner-offset))) scale(.83)}
 .interior-service-panel .layout-stack .campaign-banner:nth-child(3){opacity:1;z-index:2;transform:translateX(var(--banner-offset)) scale(.83)}
}

/* Match the cover artwork to the interior page dimensions. */
.cover-service-panel .cover-stack{top:231px;--banner-size:270px;height:408px}
.cover-stack .campaign-banner.cover-actual{height:calc(var(--banner-size) * 1.51)}
@media(min-width:721px) and (max-width:1100px){
 .cover-service-panel .cover-stack{--banner-size:clamp(190px,25vw,270px)}
}
@media(max-width:720px){
 .cover-service-panel .cover-stack{top:225px;--banner-size:212px;height:320px}
}

@media(prefers-reduced-motion:no-preference){.interior-service-panel .layout-stack{transform-style:preserve-3d}}
@media(prefers-reduced-motion:no-preference) and (max-width:1100px),(prefers-reduced-motion:no-preference) and (pointer:coarse){
 .interior-service-panel .layout-stack{transform-style:flat;perspective:none}
 .interior-service-panel .layout-stack .campaign-banner{animation-name:interior-touch-cycle;backface-visibility:visible}
}

@keyframes visual-four-depth{
 0%,15%,100%{transform:translate3d(0,0,0) scale(1) rotateY(0deg)}
 20%{transform:translate3d(calc(var(--banner-offset) * 1.18),0,0) scale(.96) rotateY(-10deg)}
 25%,40%{transform:translate3d(var(--banner-offset),0,-90px) scale(.94) rotateY(-18deg)}
 50%,50%{transform:translate3d(calc(var(--banner-offset) * .65),0,-190px) scale(.84) rotateY(-10deg)}
 50%,65%{transform:translate3d(calc(var(--banner-offset) * -.65),0,-190px) scale(.84) rotateY(10deg)}
 75%,90%{transform:translate3d(calc(var(--banner-offset) * -1),0,-90px) scale(.94) rotateY(18deg)}
 95%{transform:translate3d(calc(var(--banner-offset) * -1.18),0,0) scale(.96) rotateY(10deg)}
}
@keyframes visual-four-touch{
 0%,15%,100%{transform:translateX(0) scale(1);z-index:5}
 19.9875%{transform:translateX(calc(var(--banner-size) * .38)) scale(.70);z-index:5}
 20%{transform:translateX(calc(var(--banner-size) * .38)) scale(.70);z-index:3}
 25%,40%{transform:translateX(var(--banner-offset)) scale(.83);z-index:3}
 44.9875%{transform:translateX(calc(var(--banner-offset) * .65)) scale(.73);z-index:3}
 45%,50%,50%{transform:translateX(calc(var(--banner-offset) * .65)) scale(.73);z-index:1}
 50%,65%,70%{transform:translateX(calc(var(--banner-offset) * -.65)) scale(.73);z-index:1}
 70.0125%{transform:translateX(calc(var(--banner-offset) * -.65)) scale(.73);z-index:3}
 75%,90%{transform:translateX(calc(var(--banner-offset) * -1)) scale(.83);z-index:3}
 94.9875%{transform:translateX(calc(var(--banner-size) * -.38)) scale(.70);z-index:3}
 95%{transform:translateX(calc(var(--banner-size) * -.38)) scale(.70);z-index:5}
}
.visuals-actual-stack .campaign-banner.visual-actual{padding:0;background:transparent;border-radius:0}
.visual-actual img{display:block;width:100%;height:100%;object-fit:contain}
.portfolio-dialog-grid .portfolio-real-visual img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:0}
@media(prefers-reduced-motion:no-preference){
 .visuals-actual-stack .campaign-banner{animation-name:visual-four-depth;animation-duration:16s}
 .visuals-actual-stack .campaign-banner:nth-child(1){animation-delay:0s}
 .visuals-actual-stack .campaign-banner:nth-child(2){animation-delay:-12s}
 .visuals-actual-stack .campaign-banner:nth-child(3){animation-delay:-8s}
 .visuals-actual-stack .campaign-banner:nth-child(4){animation-delay:-4s}
}
@media(prefers-reduced-motion:no-preference) and (max-width:1100px),(prefers-reduced-motion:no-preference) and (pointer:coarse){
 .visuals-service-panel .visuals-actual-stack .campaign-banner{animation-name:visual-four-touch}
}
@media(prefers-reduced-motion:reduce){
 .visuals-actual-stack .campaign-banner{animation:none;opacity:0}
 .visuals-actual-stack .campaign-banner:nth-child(1){opacity:1;z-index:5;transform:none}
 .visuals-actual-stack .campaign-banner:nth-child(2){opacity:1;z-index:2;transform:translateX(calc(-1 * var(--banner-offset))) scale(.83)}
 .visuals-actual-stack .campaign-banner:nth-child(4){opacity:1;z-index:2;transform:translateX(var(--banner-offset)) scale(.83)}
}

.gallery-card.gallery-actual{background:transparent;border-radius:0}
.gallery-actual img{object-fit:contain}
.gallery-card.gallery-campaign{height:clamp(145px,15vw,215px)}
@media(max-width:720px){.gallery-card.gallery-campaign{height:150px}}

.hero-comparison{background:var(--ink);color:#f5f5f7;padding:70px 0 32px;border-top:1px solid #ffffff20;overflow:hidden}
.hero-comparison-copy{text-align:center;padding:0 6%}
.hero-comparison h1{font-size:clamp(58px,6.5vw,100px);font-weight:600;line-height:1.02;letter-spacing:-.055em}
.hero-comparison-copy p{font-size:19px;line-height:1.5;color:#a1a1a6;margin:24px 0 28px}
.hero-comparison .hero-actions{justify-content:center}
.hero-reel{position:relative;height:440px;margin:38px auto 0;width:100%;max-width:1440px;cursor:grab;touch-action:pan-y;user-select:none;overflow:hidden}
.hero-reel.is-dragging{cursor:grabbing}
.hero-reel:focus-visible{outline:2px solid #eee;outline-offset:-4px}
.hero-reel-card{position:absolute;left:50%;top:50%;width:250px;height:375px;will-change:transform;pointer-events:none;backface-visibility:hidden}
.hero-reel-card img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 15px 14px #0007)}
.hero-reel-controls{display:flex;justify-content:center;align-items:center;gap:18px;color:#aaa;font-size:12px}
.hero-reel-controls button{min-width:44px;height:44px;border:1px solid #ffffff30;border-radius:24px;color:#ddd;background:transparent;cursor:pointer;padding:0 14px}
.hero-reel-controls button:hover{background:#ffffff15}
@media(max-width:1050px){.hero-comparison h1{font-size:clamp(48px,6.3vw,68px)}}
@media(max-width:720px){.hero-comparison{padding-top:50px}.hero-comparison h1{font-size:clamp(50px,12.8vw,80px)}.hero-comparison-copy p{font-size:16px}.hero-comparison .hero-actions{gap:12px}.hero-reel{height:310px;margin-top:28px}.hero-reel-card{width:170px;height:255px}.hero-reel-controls{gap:12px}}
@media(prefers-reduced-motion:reduce){.hero-reel-card{will-change:auto}}

/* A shared perspective bends the row around the central, front-facing artwork. */
.hero-reel{perspective:1100px;perspective-origin:50% 50%}

.hero-reel::before,.hero-reel::after{content:'';position:absolute;top:0;bottom:0;width:23%;z-index:500;pointer-events:none}
.hero-reel::before{left:0;background:linear-gradient(to right,#171717 0%,#171717ed 18%,#17171790 52%,#17171700 100%)}
.hero-reel::after{right:0;background:linear-gradient(to left,#171717 0%,#171717ed 18%,#17171790 52%,#17171700 100%)}
@media(max-width:720px){.hero-reel::before,.hero-reel::after{width:16%}}

.tablet-preview-toggle{display:none}
@media(min-width:721px) and (max-width:1100px){
 .tablet-preview-paused .campaign-lineup *{animation-play-state:paused!important}
 .tablet-preview-selected.campaign-visible .campaign-lineup *{animation-play-state:running}
 .tablet-preview-toggle{display:block;position:absolute;bottom:16px;left:50%;transform:translateX(-50%);z-index:10;border:1px solid #ffffff40;background:transparent;color:#eee;border-radius:24px;padding:9px 16px;font:inherit;font-size:11px;cursor:pointer;min-height:36px;white-space:nowrap}
 .tablet-preview-toggle[aria-pressed=true]{border-color:transparent;color:#ffffff99}
}

@media(min-width:721px) and (max-width:1100px){
 .service-cards .work-art{height:760px;min-height:760px}
 .tablet-preview-toggle{bottom:20px;min-height:44px;background:#171717;color:#fff;z-index:20}
 .tablet-preview-toggle[aria-pressed=true]{background:transparent}
}

.site-header{position:sticky;top:0;z-index:80;margin:0;padding:0 5%;background:#171717}
@media(max-width:720px){.site-header{padding:0 6%}.site-header nav{left:0;right:0;margin:0}}

@media(max-width:720px){
 .menu-toggle{width:44px;height:44px;padding:10px;align-items:center;justify-content:center}
 .hamburger-icon{display:flex;width:22px;height:18px;flex-direction:column;justify-content:space-between}
 .hamburger-icon i{display:block;width:22px;height:2px;background:currentColor;transition:transform .2s,opacity .2s}
 .menu-toggle[aria-expanded=true] .hamburger-icon i:first-child{transform:translateY(8px) rotate(45deg)}
 .menu-toggle[aria-expanded=true] .hamburger-icon i:nth-child(2){opacity:0}
 .menu-toggle[aria-expanded=true] .hamburger-icon i:last-child{transform:translateY(-8px) rotate(-45deg)}
}
@media(prefers-reduced-motion:reduce){.hamburger-icon i{transition:none}}

@media(max-width:720px){
 .site-header nav .mobile-project{position:relative;isolation:isolate;overflow:hidden;background:transparent;color:#d5cfca;border:1px solid #ffffff55;border-radius:6px;padding:14px 16px;text-align:left;font-size:13px;font-weight:400}
 .site-header nav .mobile-project::before{content:'';position:absolute;inset:-1px;z-index:-1;border-radius:inherit;padding:1px;background:linear-gradient(110deg,transparent 35%,#ffffff 49%,transparent 63%);background-size:300% 100%;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;animation:menu-project-shine 4.5s ease-in-out infinite}
 .site-header nav .mobile-project:hover{border-color:#fff;color:#fff;background:#ffffff08}
}
@keyframes menu-project-shine{0%,25%{background-position:150% 0}70%,100%{background-position:-150% 0}}
@media(prefers-reduced-motion:reduce){.site-header nav .mobile-project::before{animation:none;background:none}}

@media(max-width:720px){
 .site-header nav>a{border-bottom:1px solid #ffffff0d}
 .site-header nav .mobile-project{width:max-content;align-self:flex-start;margin-top:8px;padding:12px 0;border:0;border-radius:0;background:transparent;overflow:hidden}
 .site-header nav .mobile-project::before{inset:auto 0 0;height:1px;padding:0;border-radius:0;mask:none;background:#ffffff30;animation:none}
 .site-header nav .mobile-project::after{content:'';position:absolute;bottom:0;left:0;width:45%;height:1px;background:linear-gradient(90deg,transparent,#ffffff,transparent);pointer-events:none;animation:menu-project-flow 2.8s linear infinite}
 .site-header nav .mobile-project:hover{background:transparent}
}
@keyframes menu-project-flow{from{transform:translateX(-110%)}to{transform:translateX(330%)}}
@media(prefers-reduced-motion:reduce){.site-header nav .mobile-project::after{animation:none;left:28%}}

@media(min-width:721px){
 .site-header .header-cta{position:relative;isolation:isolate;overflow:hidden}
 .site-header .header-cta::after{content:'';position:absolute;inset:-1px;padding:1px;border-radius:inherit;background:linear-gradient(110deg,transparent 35%,#fff 49%,transparent 63%);background-size:300% 100%;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;animation:menu-project-shine 4.5s ease-in-out infinite}
}
@media(prefers-reduced-motion:reduce){.site-header .header-cta::after{animation:none;background:none}}

@media(min-width:721px){
 .site-header .header-cta{border:0;border-radius:0;background:transparent;padding:12px 0;color:#d5cfca;overflow:hidden}
 .site-header .header-cta:hover{background:transparent;color:#fff}
 .site-header .header-cta::before{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:#ffffff30;pointer-events:none}
 .site-header .header-cta::after{inset:auto auto 0 0;width:45%;height:1px;padding:0;border-radius:0;mask:none;background:linear-gradient(90deg,transparent,#fff,transparent);background-size:100% 100%;animation:menu-project-flow 2.8s linear infinite}
}
@media(prefers-reduced-motion:reduce){.site-header .header-cta::after{animation:none;left:28%}}

@property --header-glow-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
@media(min-width:721px){
 .site-header .header-cta{border:1px solid #ffffff45;border-radius:24px;padding:10px 18px;background:transparent}
 .site-header .header-cta::before{content:none}
 .site-header .header-cta::after{inset:-1px;width:auto;height:auto;padding:1px;border-radius:inherit;background:conic-gradient(from var(--header-glow-angle),transparent 0deg,transparent 280deg,#ffffff20 305deg,#fff 335deg,transparent 360deg);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:header-pill-flow 2.8s linear infinite}
}
@keyframes header-pill-flow{to{--header-glow-angle:360deg}}
@media(prefers-reduced-motion:reduce){.site-header .header-cta::after{animation:none;background:none}}

@media(min-width:721px){
 .site-header .header-cta::after{padding:2px;background:conic-gradient(from var(--header-glow-angle),transparent 0deg,transparent 255deg,#ffffff25 280deg,#ffffff 310deg,#ffffff 345deg,transparent 360deg)}
}
@media(prefers-reduced-motion:reduce){.site-header .header-cta::after{background:none}}

/* A single book identity carries through the process mood board. */
.moodboard.courage-moodboard{background:#e6ebef;gap:9px;padding:9px;align-items:stretch;overflow:hidden;color:#24282c}
.courage-mood-column{display:grid;grid-template-rows:1fr 1.45fr .42fr;gap:9px;min-width:0;min-height:0}
.courage-mood-column:nth-child(2){grid-template-rows:1.85fr 1fr}
.courage-mood-column:nth-child(3){grid-template-rows:1.2fr .8fr 1.2fr}
.courage-tile{min-width:0;min-height:0;overflow:hidden;border-radius:9px;background:#fff}
.courage-image img{width:100%;height:100%;object-fit:cover;display:block}
.courage-cover img{object-fit:contain}
.courage-type,.courage-serif,.courage-lettering{padding:18px 13px;display:flex;flex-direction:column;justify-content:center}
.courage-tile small{font-size:7px;line-height:1.5;letter-spacing:1.1px}
.courage-tile strong{display:block;font-size:clamp(22px,2.4vw,35px);font-weight:300;line-height:1.05;letter-spacing:-1.2px;margin:14px 0}
.courage-tile span{font-size:9px;line-height:1.6}
.courage-serif{background:#cbdde8}
.courage-serif strong{font-family:Georgia,serif;font-size:27px;letter-spacing:-.8px}
.courage-lettering{background:#283238;color:#fff}
.courage-lettering strong{font-size:48px;margin:5px 0}
.courage-palette{display:flex}
.courage-palette i{width:25%;height:100%;background:#fff}
.courage-palette i:nth-child(2){background:#d9e9f2}
.courage-palette i:nth-child(3){background:#86a9be}
.courage-palette i:nth-child(4){background:#283238}
@media(max-width:720px){.courage-tile strong{font-size:27px}.courage-lettering strong{font-size:44px}.courage-type,.courage-serif,.courage-lettering{padding:14px 12px}}
@media(max-width:720px){
 .process-combined .service-stage[data-mode=interior] .process-art{width:100%;height:360px;margin:0;transform:none}
 .process-combined .courage-moodboard{gap:6px;padding:6px}
 .courage-mood-column{gap:6px}
 .courage-type,.courage-serif,.courage-lettering{padding:10px 8px}
 .courage-tile strong{font-size:19px;letter-spacing:-.7px;margin:10px 0}
 .courage-tile small{font-size:5px;letter-spacing:.7px}
 .courage-tile span{font-size:7px}
 .courage-lettering strong{font-size:35px;margin:4px 0}
}
@media(min-width:721px) and (max-width:1000px){.courage-type,.courage-serif,.courage-lettering{padding:14px 9px}.courage-tile strong{font-size:21px}.courage-serif strong{font-size:19px}.courage-lettering strong{font-size:40px}.courage-tile small{font-size:6px}}

/* Direction studies suggest the design before finished artwork is revealed. */
.courage-font-study{display:flex;flex-direction:column;justify-content:space-between;padding:25px 18px;background:#f9fbfc}
.courage-font-study strong{font-size:clamp(30px,4vw,56px);font-weight:300;margin:10px 0}
.courage-font-study .courage-alphabet{font-size:clamp(19px,2.6vw,34px);line-height:1.45;letter-spacing:-.7px;font-weight:300}
.courage-opener-study{padding:20px 15px;background:linear-gradient(155deg,#fff 45%,#e6eff4);display:flex;flex-direction:column;justify-content:center}
.courage-opener-study b{font-family:Georgia,serif;font-size:58px;line-height:1;font-weight:400;color:#86a9be;margin:12px 0}
.courage-study-rule{height:1px;width:40%;background:#86a9be;margin-bottom:10px}
.courage-opener-study>span{font-family:Georgia,serif;font-size:18px;line-height:1.2}
.courage-page-study{padding:22px 18px;display:flex;flex-direction:column;justify-content:center}
.courage-study-heading{height:6px;width:58%;background:#53616b;margin:16px 0 12px}
.courage-study-lines{height:42px;background:repeating-linear-gradient(to bottom,#c3cbd1 0 1px,transparent 1px 7px);margin-bottom:12px;clip-path:polygon(0 0,100% 0,100% 85%,67% 85%,67% 100%,0 100%)}
@media(max-width:1000px){.courage-font-study{padding:18px 12px}.courage-font-study strong{font-size:36px}.courage-font-study .courage-alphabet{font-size:23px}.courage-opener-study,.courage-page-study{padding:14px 10px}.courage-opener-study b{font-size:44px}.courage-opener-study>span{font-size:16px}}
@media(max-width:720px){.courage-font-study{padding:14px 10px}.courage-font-study strong{font-size:30px}.courage-font-study .courage-alphabet{font-size:20px}.courage-opener-study,.courage-page-study{padding:10px}.courage-opener-study b{font-size:32px;margin:8px 0}.courage-opener-study>span{font-size:13px}.courage-study-heading{margin:10px 0;height:4px}.courage-study-lines{height:28px;margin-bottom:8px}}

/* Cover alternatives paired with illustrative interior concepts. */
.courage-options .design-option{padding:34px 20px 16px;background:#e4ebef}
.courage-options .courage-option-dark{background:#bdcad3}
.courage-options .option-label{color:#344550;font-size:8px;letter-spacing:1.1px}
.courage-options .option-art{gap:25px}
.courage-option-cover,.courage-option-page{height:100%;aspect-ratio:2/3;width:auto;min-width:0;box-shadow:0 5px 13px #1b2e3b25;transform:rotate(-2deg)}
.courage-option-cover{object-fit:contain;background:white;display:block}
.courage-option-page{position:relative;background:#fff;color:#29343c;padding:18px 15px;transform:rotate(2deg);overflow:hidden}
.courage-option-page>small{display:block;font-size:5px;letter-spacing:.7px}
.courage-chapter{display:block;font-size:26px;font-weight:300;color:#8ba8ba;margin:18px 0 8px}
.courage-option-page h5{font-family:Georgia,serif;font-size:15px;font-weight:400;line-height:1.15;margin:0 0 12px}
.courage-option-page p{font-family:Georgia,serif;font-size:6px;line-height:1.65;margin:0 0 10px}
.courage-concept-lines{height:22px;margin-bottom:10px;background:repeating-linear-gradient(to bottom,#bcc5cb 0 1px,transparent 1px 5px);opacity:.65}
.courage-option-page .courage-page-folio{position:absolute;bottom:12px;left:15px;right:15px;display:flex;justify-content:space-between;font-size:4px;letter-spacing:.5px}
.courage-page-alternative{border-top:7px solid #253f54;background:#f7f5f0}
.courage-page-alternative .courage-chapter{color:#253f54;font-family:Georgia,serif;font-size:36px;margin:8px 0}
.courage-page-alternative h5{font-family:inherit;font-weight:500;font-size:18px}
@media(max-width:720px){
 .process-combined .service-stage[data-mode=visuals]{height:440px;min-height:440px}
 .process-combined .service-stage[data-mode=visuals] .process-art{width:100%;height:440px;margin:0;transform:none}
 .courage-options .design-option{padding:30px 12px 12px}
 .courage-options .option-label{font-size:6px;left:14px;top:12px}
 .courage-options .option-art{gap:20px}
 .courage-option-page{padding:12px 10px}
 .courage-chapter{font-size:21px;margin:12px 0 7px}
 .courage-option-page h5{font-size:12px;margin-bottom:8px}
 .courage-option-page p{font-size:5px;margin-bottom:7px}
 .courage-option-page>small{font-size:4px}
 .courage-concept-lines{height:16px;margin-bottom:7px}
 .courage-page-alternative .courage-chapter{font-size:27px;margin:5px 0}
 .courage-page-alternative h5{font-size:15px}
 .courage-option-page .courage-page-folio{left:10px;right:10px;bottom:8px;font-size:3px}
}

/* Three pieces per direction: cover, opener, and reading page. */
.courage-options .option-art{gap:12px;container-type:inline-size}
.courage-options .option-art>*{width:calc((100% - 24px)/3);height:auto;max-height:100%;aspect-ratio:2/3;flex:0 1 auto;transform:none}
.courage-options .courage-option-page{padding:3cqw 2.5cqw}
.courage-options .courage-option-page>small{font-size:1cqw;letter-spacing:.12cqw}
.courage-options .courage-option-page h5{font-size:3cqw;margin:3cqw 0 2cqw}
.courage-options .courage-option-page p{font-size:1.2cqw;line-height:1.65;margin-bottom:2cqw}
.courage-options .courage-page-folio{font-size:.75cqw;left:2.5cqw;right:2.5cqw;bottom:2cqw;letter-spacing:0}
.courage-options .courage-alt-opener{background:#20384b;color:#f6f4ec;border:0;display:flex;flex-direction:column;justify-content:center}
.courage-options .courage-alt-opener .courage-chapter{font-family:inherit;font-size:2cqw;letter-spacing:.4cqw;color:#adcbdc;margin:0 0 3cqw}
.courage-light-crack{height:11cqw;width:1px;background:#d2e8f5;box-shadow:0 0 12px 3px #bce1ff40;transform:rotate(12deg);margin:0 0 0 40%}
.courage-options .courage-alt-opener h5{font-family:Georgia,serif;font-weight:400;font-size:3.4cqw}
.courage-options .courage-alt-reading{border-top-width:4px}
@media(max-width:720px){.courage-options .option-art{gap:8px}.courage-options .option-art>*{width:calc((100% - 16px)/3)}}

/* White editorial sheets with restrained blue details. */
.courage-options{background:#e5e7ea;gap:1px}
.courage-options .design-option,.courage-options .courage-option-dark{background:#fff}
.courage-options .option-label{color:#65717b}
.courage-options .option-art>*{box-shadow:0 3px 12px #263c5017,0 0 0 1px #263c5010}
.courage-options .courage-alt-opener,.courage-options .courage-alt-reading{background:#fff;color:#263b4d;border:0;padding:3.5cqw 3cqw}
.courage-options .courage-alt-opener{justify-content:flex-start;text-align:center}
.courage-options .courage-alt-opener>small,.courage-options .courage-alt-reading>small{font-size:.7cqw;letter-spacing:.13cqw;padding-bottom:1.3cqw;border-bottom:1px solid #dbe3e8;width:100%}
.courage-options .courage-alt-opener .courage-chapter{font-size:1cqw;letter-spacing:.3cqw;margin:4cqw 0 0;color:#55768d}
.courage-opener-mark{font-family:Georgia,serif;font-size:12cqw;line-height:1.05;color:#a5bdcd;font-weight:400;margin:1cqw 0}
.courage-options .courage-alt-opener h5{font-size:3.5cqw;line-height:1.18;letter-spacing:-.08cqw;margin:1cqw 0 2cqw;font-weight:400}
.courage-options .courage-alt-opener h5:after{content:'';display:block;width:4cqw;height:1px;background:#a5bdcd;margin:2cqw auto}
.courage-options .courage-alt-opener p{font-family:Georgia,serif;font-style:italic;font-size:1.15cqw;line-height:1.7;color:#6a7c89;margin:0}
.courage-reading-kicker{display:block;font-size:.85cqw;letter-spacing:.2cqw;color:#68889d;margin:4cqw 0 1.5cqw}
.courage-options .courage-alt-reading h5{font-family:Georgia,serif;font-size:3.3cqw;font-weight:400;line-height:1.16;letter-spacing:-.06cqw;margin:0 0 3cqw}
.courage-options .courage-alt-reading p{font-family:Georgia,serif;font-size:1.15cqw;line-height:1.8;color:#40505c;margin:0 0 1.5cqw}
.courage-options .courage-alt-reading h5+p:first-letter{float:left;font-size:3.4cqw;line-height:.9;margin:.5cqw .6cqw 0 0;color:#55768d}
.courage-options .courage-page-folio{left:3cqw;right:3cqw;bottom:2.5cqw;border-top:1px solid #dbe3e8;padding-top:1cqw;color:#69808f;font-size:.65cqw;letter-spacing:.05cqw}
.courage-options .courage-alt-opener .courage-chapter{margin-top:2.5cqw}
.courage-opener-mark{font-size:10cqw;margin:.5cqw 0}
.courage-options .courage-alt-opener h5{font-size:3.1cqw;margin:.5cqw 0 1cqw}
.courage-options .courage-alt-opener h5:after{margin:1.2cqw auto}
.courage-reading-kicker{margin:2.5cqw 0 1cqw}
.courage-options .courage-alt-reading h5{font-size:3cqw;margin-bottom:2cqw}
.courage-options .courage-alt-reading p{font-size:1cqw;line-height:1.65;margin-bottom:1.2cqw}

/* The process previews share the same white presentation surface. */
.process-combined .service-stage[data-mode],
.process-combined .moodboard.courage-moodboard{background:#fff}

.courage-final-set{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;width:100%;padding:24px}
.courage-final-set img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;background:#fff;box-shadow:0 5px 18px #263c501a,0 0 0 1px #263c5010}
@media(max-width:720px){
 .process-combined .service-stage[data-mode=web]{height:300px;min-height:300px}
 .process-combined .service-stage[data-mode=web] .process-art{width:100%;height:300px;transform:none;margin:0}
 .courage-final-set{gap:8px;padding:12px}
}

.process-combined .service-stage[data-mode=story] .process-art{width:100%;height:580px;margin:0;transform:none}
.process-combined .delivery-visual{padding:20px}
.process-combined .courage-launch{object-fit:contain}
@media(max-width:720px){
 .process-combined .service-stage[data-mode=story]{height:auto;min-height:0;aspect-ratio:1}
 .process-combined .service-stage[data-mode=story] .process-art{height:auto;aspect-ratio:1;width:100%}
 .process-combined .delivery-visual{padding:12px}
}

/* Fixed page images scale together without changing their composition. */
.courage-options .option-art{container-type:size}
.courage-options .option-art>img{width:min(calc((100% - 24px)/3),calc(100cqh * 2 / 3));height:auto;max-height:100%;aspect-ratio:2/3;object-fit:contain;flex-shrink:0}
@media(max-width:720px){.courage-options .option-art>img{width:min(calc((100% - 16px)/3),calc(100cqh * 2 / 3))}}

.detail-dialog.portfolio-dark{background:#171717;color:#f5f5f7;color-scheme:dark}
.detail-dialog.portfolio-dark p,.portfolio-dark .portfolio-category,.portfolio-dark .eyebrow{color:#b5b5bc}
.portfolio-dark .portfolio-tabs button{border-color:#555;color:#f5f5f7}
.portfolio-dark .portfolio-tabs button:hover{background:#2c2c2c}
.portfolio-dark .portfolio-tabs button[aria-selected=true]{background:#a50a04;border-color:#a50a04;color:#fff}
.portfolio-dark .portfolio-tabs button:focus-visible{outline-color:#f5f5f7}
.portfolio-dark .portfolio-dialog-grid img{background:#222}
.portfolio-dark .portfolio-dialog-grid .portfolio-real-cover img,.portfolio-dark .portfolio-interior-pages img{background:transparent}
.portfolio-dark .dialog-close{color:#f5f5f7;background:#292929;border-color:#555}


.services-overview{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 0;list-style:none;margin:22px auto 0;padding:0;max-width:850px;color:#68686f;font-size:14px;line-height:1.6}
.services-overview li{display:flex;align-items:center;white-space:nowrap}
.services-overview li+li:before{content:"·";color:#a5a5ac;margin:0 12px}
@media(max-width:720px){.services-overview{font-size:12px;gap:7px 14px;max-width:330px;margin-top:18px}.services-overview li+li:before{display:none}}

.services-scroll-hint{display:none}
@media(max-width:720px){.services-scroll-hint{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 0;font-size:12px;color:#68686f}.services-scroll-hint span{color:#a50a04;font-size:17px;animation:services-scroll-nudge 2.8s ease-in-out infinite}}
@keyframes services-scroll-nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
@media(prefers-reduced-motion:reduce){.services-scroll-hint span{animation:none}}

.detail-topbar{display:contents}
.portfolio-topbar-label{display:none}
.detail-dialog.portfolio-dark{padding:0}
.portfolio-dark .detail-topbar{display:flex;position:sticky;top:0;z-index:20;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;background:#171717;border-bottom:1px solid #ffffff1a}
.portfolio-dark .portfolio-topbar-label{display:block;font-size:10px;letter-spacing:1.6px;color:#b5b5bc}
.portfolio-dark .detail-topbar .dialog-close{position:static;display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;padding:0;border:1px solid #ffffff30;border-radius:50%;cursor:pointer}
.portfolio-dark .detail-topbar .dialog-close:hover{background:#3a3a3a}
.portfolio-dark #detail-content{padding:20px 64px 64px}
.portfolio-dark #detail-content>.eyebrow{display:none}
@media(max-width:720px){.portfolio-dark .detail-topbar{padding:10px 18px}.portfolio-dark .portfolio-topbar-label{font-size:9px;letter-spacing:1.2px}.portfolio-dark #detail-content{padding:12px 24px 32px}}

.client-brands .client-fiverr{white-space:nowrap;gap:0}
.client-brands .client-fiverr span{width:auto;max-width:none;flex:0 0 auto;grid-column:auto;align-self:baseline;letter-spacing:inherit}
.client-brands .client-fiverr{display:block;line-height:58px}

.services-scroll-hint{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 0;font-size:12px;color:#68686f}
.services-scroll-hint span{color:#a50a04;font-size:17px;animation:services-scroll-nudge 2.8s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.services-scroll-hint span{animation:none}}

.landing-mini-frame{display:block;width:960px;height:3700px;border:0;zoom:calc(340 / 960);pointer-events:none;background:#f7f5ee}
.landing-stack .landing-site-scroll{min-height:0}
@media(max-width:720px){.landing-mini-frame{zoom:calc(246 / 960)}}
.portfolio-landing-project .portfolio-landing-art{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;background:#d8edef;padding:30px 20px;color:#173e43;min-height:360px}
.portfolio-dialog-grid .portfolio-landing-art img{width:150px;height:225px;object-fit:contain;background:none;box-shadow:8px 12px 20px #0003;transform:rotate(-4deg);border-radius:0}
.portfolio-landing-art>span{font-size:12px;border-bottom:1px solid currentColor;padding-bottom:4px}
.landing-project-outsider .portfolio-landing-art{background:#f8d744;color:#25251f}
.landing-project-attention .portfolio-landing-art{background:#24b6af;color:#183c3a}
.portfolio-landing-link{display:inline-block;margin-top:16px;font-size:13px;padding:10px 16px;border:1px solid #ffffff50;border-radius:24px}
.detail-dialog.landing-detail{width:min(1220px,96vw);max-height:94svh}
.landing-detail #detail-content{padding:0}
.landing-back{display:block;padding:14px 24px;font-size:12px;color:#ddd}
.full-book-landing{width:100%;height:calc(94svh - 125px);display:block;border:0;background:#f7f5ee}
@media(max-width:720px){.landing-detail #detail-content{padding:0}.full-book-landing{height:calc(94svh - 113px)}}
.portfolio-landing-project .portfolio-landing-art{display:block;position:relative;height:340px;min-height:0;padding:0;overflow:hidden;container-type:inline-size}
.portfolio-landing-art iframe{width:960px;height:1000px;zoom:calc(100cqw / 960px);border:0;display:block;pointer-events:none}
.portfolio-landing-art>span{position:absolute;bottom:0;left:0;right:0;background:#171717;color:white;padding:13px;text-align:center;border:0}

/* Solid brand-red inquiry actions with a warm moving perimeter highlight. */
.portfolio-dark .button.portfolio-project-cta{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;width:max-content;max-width:100%;min-height:44px;padding:12px 22px;border:1px solid #a50a04;border-radius:999px;background:#a50a04;color:#fff;font-size:13px;font-weight:600;box-shadow:0 4px 0 #650600,0 8px 20px #0003;transform:none}
.portfolio-dark .portfolio-project-cta::before{content:none}
.portfolio-dark .portfolio-project-cta::after{content:'';position:absolute;inset:-1px;padding:2px;border-radius:inherit;background:conic-gradient(from var(--header-glow-angle),transparent 0deg,transparent 255deg,#ef403555 280deg,#ff9b8b 310deg,#ffd1c5 345deg,transparent 360deg);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none;animation:header-pill-flow 2.8s linear infinite}
.portfolio-dark .portfolio-project-cta:hover{background:#bb1008;border-color:#bb1008;color:white;box-shadow:0 4px 0 #650600,0 9px 24px #a50a0433;transform:none}
.portfolio-dark .portfolio-project-cta:focus-visible{outline:2px solid white;outline-offset:5px}
@media(prefers-reduced-motion:reduce){.portfolio-dark .portfolio-project-cta::after{animation:none}}

.detail-dialog.studio-detail{width:min(1100px,94vw);background:#171717;color:#f5f5f7}.studio-detail-intro{max-width:760px}.studio-detail .studio-detail-intro h2{font-size:clamp(36px,5vw,62px);line-height:1.06;margin:20px 0 26px}.studio-detail .studio-detail-intro p{font-size:16px;line-height:1.8;color:#bcbcc3}.studio-team-heading{margin:60px 0 28px}.studio-detail .studio-team-heading h3{font-size:clamp(26px,3vw,38px);margin:12px 0;font-weight:500}.studio-team-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}.team-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;min-width:0}.team-pair>img{width:100%;height:100%;aspect-ratio:1;object-fit:cover;filter:grayscale(1)}.team-label{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;aspect-ratio:1;min-width:0;padding:16px;background:#a50a04;color:white}.team-pair:nth-child(4n+3) .team-label,.team-pair:nth-child(4n+4) .team-label{order:-1;align-items:flex-end;text-align:right}.team-arrow{width:38px;height:31px;margin-bottom:6px;flex-shrink:0}.team-pair:nth-child(4n+3) .team-arrow,.team-pair:nth-child(4n+4) .team-arrow{transform:scaleX(-1)}.studio-detail .team-label h4{font-size:clamp(22px,3.2vw,38px);line-height:1.1;letter-spacing:-.055em;font-weight:300;text-transform:uppercase;margin:0 0 7px}.studio-detail .team-label p{font-size:12px;line-height:1.35;color:inherit;margin:0}.team-tone-1 .team-label{background:#a4ae32;color:#171717}.team-tone-2 .team-label{background:#668db5}.team-tone-3 .team-label{background:#b6a0d2;color:#21182d}.team-tone-4 .team-label{background:#e4b34e;color:#211c12}.studio-detail-action{margin-top:40px}.studio-detail-action p{margin-bottom:20px}
@media(max-width:620px){.studio-team-grid{grid-template-columns:1fr}.studio-team-heading{margin-top:38px}.studio-detail .team-label h4{font-size:clamp(25px,7.5vw,38px)}.team-label{padding:14px}.team-pair:nth-child(n) .team-label{order:0;align-items:flex-start;text-align:left}.team-pair:nth-child(n) .team-arrow{transform:none}.team-pair:nth-child(even) .team-label{order:-1;align-items:flex-end;text-align:right}.team-pair:nth-child(even) .team-arrow{transform:scaleX(-1)}}

/* Keep each site's scrolling phase aligned with its card, including hover. */
.landing-stack .landing-stack-item{--tour-delay:0s;animation-duration:45s;animation-delay:var(--tour-delay)}
.landing-stack .landing-variant-soft{--tour-delay:-15s}
.landing-stack .landing-variant-field{--tour-delay:-30s}
.landing-service-panel .landing-stack .landing-site-scroll,.landing-service-panel:hover .landing-stack .landing-site-scroll,.landing-service-panel:focus-within .landing-stack .landing-site-scroll{animation-duration:45s;animation-delay:var(--tour-delay)}
@media(min-width:721px) and (max-width:1100px){
 .landing-stack{--landing-width:240px;--landing-offset:45px;height:350px;top:285px}
 .landing-stack .landing-stack-item{height:350px}
 .landing-stack .landing-site{--preview-height:321px}
 .landing-stack .landing-mini-frame{zoom:.25}
}

/* Scale a fixed page surface instead of zooming a moving iframe. */
.landing-stack{--landing-scale:.354166667}
.landing-stack .landing-site-scroll{position:relative;height:calc(var(--page-height,4800px) * var(--landing-scale));min-height:0}
.landing-stack .landing-mini-frame{position:absolute;top:0;left:0;width:960px;max-width:none;zoom:1;transform:scale(var(--landing-scale));transform-origin:top left;background:#f7f5ee}
@keyframes landing-front-tour{0%,2%{transform:translateY(0)}24%,49.99%{transform:translateY(calc(var(--preview-height) - 100%))}50%,100%{transform:translateY(0)}}
@media(min-width:721px) and (max-width:1100px){.landing-stack{--landing-scale:.25}.landing-stack .landing-mini-frame{zoom:1}}
@media(max-width:720px){.landing-stack{--landing-scale:.25625}.landing-stack .landing-mini-frame{zoom:1}}

/* Three complete portrait/name pairs per desktop row. */
@media(min-width:901px){
 .detail-dialog.studio-detail{width:min(1100px,94vw)}
 .studio-team-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .studio-team-grid .team-pair .team-label{order:0;align-items:flex-start;text-align:left;padding:14px}
 .studio-team-grid .team-pair .team-arrow{transform:none}
 .studio-team-grid .team-pair:nth-child(6n+4) .team-label,.studio-team-grid .team-pair:nth-child(6n+5) .team-label,.studio-team-grid .team-pair:nth-child(6n+6) .team-label{order:-1;align-items:flex-end;text-align:right}
 .studio-team-grid .team-pair:nth-child(6n+4) .team-arrow,.studio-team-grid .team-pair:nth-child(6n+5) .team-arrow,.studio-team-grid .team-pair:nth-child(6n+6) .team-arrow{transform:scaleX(-1)}
 .studio-detail .team-label h4{font-size:clamp(19px,2.05vw,27px)}
 .studio-detail .team-label p{font-size:11px}
}

/* Contact shares the portfolio's persistent close bar. */
.contact-dialog{background:#171717;color:#f8f3e8}.contact-dialog .detail-topbar{position:sticky;top:0;background:#171717;z-index:2;display:flex;justify-content:space-between;align-items:center}.contact-content{padding:20px 40px 48px}.contact-content h2{font-size:clamp(36px,6vw,64px);margin:12px 0}.contact-content>p{max-width:580px;color:#c9c5bd}.contact-columns{display:grid;grid-template-columns:1fr 1.3fr;gap:40px;margin-top:36px}.contact-columns address{font-style:normal;line-height:1.9}.contact-columns address a{overflow-wrap:anywhere}.contact-columns form{min-width:0}.contact-columns label{display:block;margin:18px 0 8px}.contact-columns input,.contact-columns textarea,.contact-columns select{display:block;box-sizing:border-box;width:100%;padding:12px;border:1px solid #625e58;border-radius:8px;background:#252525;color:#fff;font:inherit}.contact-columns textarea{resize:vertical}.contact-columns .form-help,.contact-columns [role=status]{color:#c9c5bd;font-size:14px;line-height:1.6}.contact-columns .button{margin-top:12px}.form-actions{flex-wrap:wrap;gap:16px}.brief-summary>p{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:720px){.contact-content{padding:12px 22px 28px}.contact-columns{grid-template-columns:1fr;gap:18px;margin-top:24px}}

.experience-screen{position:relative;background:#050505}.experience-screen>video.experience-loop{width:100%;height:100%;object-fit:contain;display:block}.experience-loop-toggle{position:absolute;bottom:12px;right:12px;border:1px solid #aaa;border-radius:20px;background:#171717e8;color:#fff;padding:8px 12px;font:inherit;font-size:12px;cursor:pointer}.portfolio-experience{grid-column:1/-1}.portfolio-experience>button{position:relative;display:block;width:100%;padding:0;background:#050505;border:1px solid #555;color:#fff;cursor:pointer;border-radius:12px;overflow:hidden}.portfolio-experience>button img{width:100%;height:auto;display:block;object-fit:contain}.portfolio-experience>button span{position:absolute;bottom:18px;left:18px;background:#a50a04;padding:12px 20px;border-radius:25px}.experience-video-dialog{width:min(1400px,96vw);max-width:96vw;padding:0;background:#080808;color:#fff;border:1px solid #555;border-radius:12px;max-height:94dvh}.experience-video-dialog::backdrop{background:#000d}.experience-video-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;font-size:12px;gap:12px}.experience-video-bar .dialog-close{position:static;color:#fff;flex-shrink:0}.experience-video-dialog video{display:block;width:100%;max-height:calc(94dvh - 70px);object-fit:contain;background:#000}

.need-world .experience-mockups{display:flex;flex-direction:column;align-items:center;gap:0;min-height:590px}.experience-view-switch{display:flex;justify-content:center;gap:6px;padding:5px;border:1px solid #737373;border-radius:30px;width:max-content;margin:0 auto 12px;background:#151515}.experience-view-switch button{font:inherit;padding:9px 22px;border:0;border-radius:24px;color:#ddd;background:transparent;cursor:pointer}.experience-view-switch button[aria-pressed=true]{background:#f5ead5;color:#171717}.experience-view-hint{font-size:13px;color:#bbb;margin:0 0 26px;text-align:center}.need-world .experience-tablet{align-self:center;aspect-ratio:auto;width:100%;height:auto;padding:16px 20px}.need-world .experience-screen{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1912 / 952}.need-world .experience-mockups[data-experience-device=phone] .experience-tablet{width:280px;max-width:90%;padding:10px;border-radius:32px}.need-world .experience-mockups[data-experience-device=phone] .experience-screen{aspect-ratio:498 / 894;border-radius:23px}.experience-mockups[data-experience-device=phone] .experience-tablet:before{display:none}.experience-video-dialog .experience-view-switch{margin-top:8px}.experience-video-dialog video{max-height:calc(94dvh - 136px)}.experience-video-dialog[data-experience-device=phone]{width:min(490px,96vw)}.experience-video-dialog[data-experience-device=phone] video{width:auto;max-width:100%;margin:auto;border-radius:18px}.experience-video-dialog[data-experience-device=phone] .experience-video-bar{font-size:10px}
@media(max-width:720px){.need-world .experience-mockups{min-height:580px}.need-world .experience-tablet{padding:8px 10px}.experience-view-hint{font-size:12px}.experience-loop-toggle{font-size:11px;padding:6px 10px}}

/* Keep recognizable device proportions independent of the supplied recordings. */
.need-world .experience-screen{aspect-ratio:3 / 2}
.need-world .experience-mockups[data-experience-device=phone] .experience-tablet{position:relative;width:280px;padding:30px 9px 22px;border:2px solid #858580;border-radius:44px;background:#080808;box-shadow:inset 0 0 0 3px #242424,0 0 0 1px #090909,0 18px 35px #0008;-webkit-box-reflect:none;overflow:visible}
.need-world .experience-mockups[data-experience-device=phone] .experience-screen{aspect-ratio:390 / 844;border-radius:23px;background:#000}
.need-world .experience-mockups[data-experience-device=phone] .experience-tablet:before{display:block;position:absolute;top:10px;left:50%;transform:translateX(-50%);width:72px;height:14px;border:1px solid #202020;border-radius:20px;background:radial-gradient(circle at 85% 50%,#182538 0 3px,#050505 4px);box-shadow:none;z-index:2}
.need-world .experience-mockups[data-experience-device=phone] .experience-tablet:after{content:'';position:absolute;bottom:8px;left:50%;transform:translateX(-50%);width:82px;height:4px;border-radius:8px;background:#ddd}
.need-world .experience-mockups[data-experience-device=phone] .experience-loop-toggle{bottom:9px;right:9px}
.need-world .experience-mockups[data-experience-device=phone]::before{display:none}
.need-world .experience-mockups[data-experience-device=phone] .experience-tablet{box-shadow:inset 0 0 0 3px #242424,0 0 0 1px #090909,0 12px 22px -12px #0009}

/* Reserve the same preview space for either device. */
.need-world .experience-mockups{min-height:700px}
.need-world .experience-mockups[data-experience-device=phone] .experience-tablet{width:260px}
.experience-view-switch{background:linear-gradient(135deg,#ffffff12,#ffffff04);border-color:#ffffff30;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:inset 0 1px 0 #ffffff17,0 5px 16px #0002}
.experience-view-switch button[aria-pressed=true]{background:linear-gradient(135deg,#ffffff2b,#ffffff0c);color:#fff;box-shadow:inset 0 0 0 1px #ffffff35,inset 0 1px 0 #ffffff29,0 2px 8px #0002}
.experience-view-switch button:focus-visible{outline:2px solid #f5ead5;outline-offset:3px}
@media(max-width:720px){.need-world .experience-mockups{min-height:670px}.need-world .experience-mockups[data-experience-device=phone] .experience-tablet{width:250px}}
/* A quiet centered halo suits the upright phone better than the tablet floor light. */
.need-world:has(.experience-mockups[data-experience-device=phone])::before{inset:290px 0 40px;background:radial-gradient(ellipse 240px 330px at 50% 48%,#292b2b 0%,#141616 48%,#06060600 100%);mask-image:none}
.need-world:has(.experience-mockups[data-experience-device=phone])::after{opacity:.06}
@media(max-width:720px){.need-world:has(.experience-mockups[data-experience-device=phone])::before{inset:290px 0 35px;background:radial-gradient(ellipse 175px 300px at 50% 48%,#242626 0%,#111313 50%,#06060600 100%)}}

.portfolio-real-landing .portfolio-landing-art{display:block}
.studio-form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* Keep the preview visible until the browser presents its first video frame. */
.experience-screen>.experience-loading-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#050505;z-index:1;pointer-events:none;opacity:1}
.experience-screen>.experience-loading-poster.frame-ready{opacity:0}
.experience-screen>.experience-loop-toggle{z-index:2}

/* Shared dark surfaces match the interactive experience stage. */
:root{--studio-black:#060606}
body,.site-header,.hero-comparison,#about,
.service-cards .interior-service-panel,.service-cards .visuals-service-panel,
.need-tile.need-world,.site-footer.reference-footer,
.detail-dialog.portfolio-dark,.detail-dialog.studio-detail,
.portfolio-dark .detail-topbar,.contact-dialog .detail-topbar{background-color:var(--studio-black)}
.hero-reel::before{background:linear-gradient(to right,#060606 0%,#060606ed 18%,#06060690 52%,#06060600 100%)}
.hero-reel::after{background:linear-gradient(to left,#060606 0%,#060606ed 18%,#06060690 52%,#06060600 100%)}

.portfolio-real-cover:has(.portfolio-full-cover){grid-column:1/-1}
.portfolio-real-cover:has(.portfolio-full-cover)>img{max-width:360px;width:100%;height:auto;margin:0 auto;display:block}
.portfolio-full-cover{margin-top:24px;border-top:1px solid #ffffff26;padding-top:20px}
.portfolio-full-cover p{font-size:12px;color:#bbb;margin:0 0 12px}
.portfolio-full-cover img{display:block;width:100%;height:auto;object-fit:contain}

.studio-security-check{margin:20px 0;min-height:105px;scroll-margin-top:110px}.studio-security-check>p{font-size:14px;margin:0 0 10px}.studio-security-check>div{min-height:65px}

.inquiry-success{display:flex;align-items:flex-start;gap:14px;padding:18px;border:1px solid #65ad8670;border-radius:12px;background:#28834b12;line-height:1.5}.inquiry-success-icon{display:grid;place-items:center;flex:0 0 36px;height:36px;border-radius:50%;background:#237a49;color:#fff;font-size:24px;font-weight:600}.inquiry-success strong{display:block;color:#237a49;font-size:16px;margin-bottom:5px}.inquiry-success>span:last-child>span{display:block;font-size:13px}.contact-dialog .inquiry-success strong{color:#8ed6ac}

/* Ground each device at its own edge, independent of the reserved switching space. */
.need-world .experience-mockups::before{display:none}
.need-world .experience-device-base{position:relative;isolation:isolate;width:100%;margin:auto 0 24px}
.need-world .experience-device-base::before{content:'';position:absolute;z-index:-1;pointer-events:none;left:-12%;right:-12%;bottom:-30px;height:95px;background:radial-gradient(ellipse at center,#777b754a 0%,#34373366 35%,transparent 72%);filter:blur(5px)}
.need-world .experience-device-base::after{content:'';position:absolute;pointer-events:none;z-index:-1;left:1%;right:1%;bottom:-9px;height:18px;border-radius:50%;background:radial-gradient(ellipse,#000 0%,#000c 45%,transparent 73%);filter:blur(3px)}
.need-world .experience-device-base .experience-tablet{position:relative;width:100%;margin:0;-webkit-box-reflect:below 4px linear-gradient(transparent 92%,#ffffff0d)}
.need-world .experience-mockups[data-experience-device=phone] .experience-device-base{width:260px;max-width:90%}
.need-world .experience-mockups[data-experience-device=phone] .experience-device-base .experience-tablet{width:100%;max-width:100%}
.need-world .experience-mockups[data-experience-device=phone] .experience-device-base::before{left:-45%;right:-45%;height:65px;bottom:-26px}
.need-world .experience-mockups[data-experience-device=phone] .experience-device-base::after{left:-5%;right:-5%}
@media(max-width:720px){.need-world .experience-mockups{justify-content:flex-start}.need-world .experience-device-base{margin:auto 0}.need-world .experience-mockups[data-experience-device=phone] .experience-device-base{width:250px}.need-world .experience-device-base .experience-tablet{padding:8px 10px;border-radius:16px}.need-world .experience-mockups[data-experience-device=phone] .experience-device-base .experience-tablet{padding:30px 9px 22px;border-radius:44px}}

/* Size the stage to the selected device instead of leaving a phone-sized gap. */
.need-world .experience-mockups{min-height:0;height:auto;justify-content:flex-start}
.need-world .experience-device-base{margin:0}
.need-tile.need-world{padding-bottom:42px}
@media(max-width:720px){.need-world .experience-mockups{min-height:0;height:auto;margin-top:36px}.need-world .experience-device-base{margin:0}.need-tile.need-world{padding-bottom:34px}}