/* Scroll accents follow the page. Content is readable from the first paint. */
#scroll-progress{position:fixed;inset:0 0 auto;height:2px;z-index:90;pointer-events:none;background:linear-gradient(90deg,#a47a40,#f4d49c,#c39357);transform:scaleX(var(--page-progress,0));transform-origin:left}
.js .reveal{opacity:1;transform:none;transition:none}
.section-heading::after{transform:skewX(-40deg) scaleX(calc(.55 + var(--scene-progress,.5)*.45));transform-origin:left}
.device-stage{translate:0 calc(var(--hero-progress,0)*-14px)}
.muse-smug{translate:0 calc((.5 - var(--scene-progress,.5))*14px)}
.pdf-page{translate:0 calc((.5 - var(--scene-progress,.5))*-18px)}
.brand-run{translate:calc(var(--page-progress,0)*-24px) 0}
.capture-expand{display:none}
.motion-paused :is(.device-stage,.muse-smug,.pdf-page,.brand-run){translate:none}
.motion-paused .section-heading::after{transform:skewX(-40deg)}

:root{--lantern-line:#d7ad6944;--lantern-light:#e9c28a;--lantern-muted:#c4b9a9}
.hero-backdrop{background-image:linear-gradient(0deg,#0a0a0d,transparent 35%),linear-gradient(90deg,#11101360,transparent 65%),url('assets/hero-backdrop-1800.webp')}
.site-header{background:#0d0c10f5;border-bottom-color:var(--lantern-line)}
.site-header .brand{margin-right:auto}
.site-header>nav{margin-inline:24px}
.lantern-menu-button{display:none}
.js .lantern-menu-button{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 15px;border:1px solid var(--lantern-line);background:#1d1715;color:#f8e5c8;font:700 13px var(--body);cursor:pointer}
.lantern-menu-button:hover{border-color:#e9c28a}
#site-menu{position:fixed;inset:clamp(12px,4vh,40px) clamp(12px,4vw,64px) auto auto;margin:0;width:min(480px,calc(100% - 24px));max-width:none;max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;padding:clamp(20px,5vw,34px);color:#f8f0e2;background:radial-gradient(ellipse at 92% 0%,#51362066,transparent 58%),#151217;border:1px solid #d7ad6988;box-shadow:0 24px 90px #000b,inset 0 1px #f4d49c42}
#site-menu[open]{animation:menu-arrival .23s ease-out both}
#site-menu::backdrop{background:#070608c7}
html:has(#site-menu[open]){overflow:hidden}
@keyframes menu-arrival{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.menu-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}
.menu-heading .eyebrow{color:var(--lantern-light);margin:0 0 8px}
.menu-heading h2{font-size:clamp(38px,7vw,58px);line-height:.95;margin:0}
.menu-close{min-width:44px;min-height:44px;display:grid;place-items:center;border:1px solid var(--lantern-line);color:#f8e5c8}
.menu-chapters{border-top:1px solid var(--lantern-line)}
.menu-chapters a{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:14px;min-height:49px;padding:8px 5px;border-bottom:1px solid var(--lantern-line);font-weight:750}
.menu-chapters small{font-size:10px;color:var(--lantern-light);letter-spacing:.12em}
.menu-chapters a:hover,.menu-utilities a:hover{color:var(--lantern-light);background:#e9c28a0d}
.menu-utilities{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.menu-utilities a{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:8px 12px;border:1px solid var(--lantern-line);font-size:13px}
#site-menu :focus-visible,.lantern-menu-button:focus-visible,.inventory-grid summary:focus-visible{outline:2px solid #f7cf92;outline-offset:3px}

.feature-inventory,.pricing,.comparison,.fendi-home{border-color:var(--lantern-line)}
.feature-inventory{background:radial-gradient(ellipse at 90% 2%,#b2783627,transparent 52%),#131216}
.pricing{background:radial-gradient(ellipse at 14% 12%,#d29a3b29,transparent 62%),#131114}
.comparison.comparison-story{background:radial-gradient(ellipse at 86% 0%,#9b602c27,transparent 58%),#111116}
.fendi-home .closing-light{background:radial-gradient(ellipse at 85% 85%,#bb783c26,transparent 55%)}
.footer-signature{background:linear-gradient(110deg,#211911,#110f14 58%);border-color:var(--lantern-line)}
.feature-inventory h2 span,.pricing h2 span,.comparison h2 span,.fendi-home h2 span{color:var(--lantern-light)}
.inventory-intro{color:var(--lantern-muted);font-size:15px;margin-block:16px 24px}
.inventory-grid{gap:12px;align-items:start}
.inventory-grid details{border:1px solid var(--lantern-line);background:linear-gradient(140deg,#201a17,#141319 85%);min-width:0}
.inventory-grid details[open]{border-color:#d7ad6988}
.inventory-grid summary{position:relative;display:grid;gap:7px;padding:18px 42px 18px 18px;cursor:pointer;list-style:none;min-height:130px}
.inventory-grid summary::-webkit-details-marker{display:none}
.inventory-grid summary:hover{background:#ebbb8010}
.toolkit-number{text-transform:uppercase;color:var(--lantern-light);font-size:10px;font-weight:800;letter-spacing:.14em}
.inventory-grid summary strong{font-family:var(--display);font-size:clamp(23px,2.1vw,35px);font-weight:900;line-height:1.02;text-transform:uppercase}
.toolkit-teaser{font-size:13px;color:var(--lantern-muted)}
.toolkit-toggle{position:absolute;top:18px;right:16px;width:17px;height:17px;color:var(--lantern-light)}
.toolkit-toggle::before,.toolkit-toggle::after{content:"";position:absolute;inset:8px 2px auto;height:1px;background:currentColor}
.toolkit-toggle::after{transform:rotate(90deg);transition:transform .18s}
details[open] .toolkit-toggle::after{transform:none}
.inventory-grid details ul{list-style:none;margin:0;padding:0 18px 12px}
.inventory-grid details li{border-top:1px solid #d7ad6930;font-size:14px;color:#e0d5c8;padding:9px 0}
.inventory-grid details li::before{display:none}
@media(max-width:850px){
  .hero-backdrop{background-image:linear-gradient(0deg,#0a0a0d,transparent 40%),url('assets/hero-backdrop-900.webp')}
  .site-header .brand{gap:8px}
  .inventory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:540px){
  .inventory-grid{grid-template-columns:1fr}
  .inventory-grid summary{min-height:0;padding-block:14px}
  .toolkit-teaser{font-size:14px}
  .device-stage,.muse-smug,.pdf-page,.brand-run{translate:none}
  .js .site-header .byline{display:none}
}
@media(prefers-reduced-motion:reduce){
  #site-menu[open]{animation:none}
  .device-stage,.muse-smug,.pdf-page,.brand-run{translate:none}
  .section-heading::after{transform:skewX(-40deg)}
}

.site-header{position:fixed}
main [id]{scroll-margin-top:110px}
#site-menu::backdrop{backdrop-filter:none}
.workspace{background:radial-gradient(ellipse at 88% 5%,#9a66201a,transparent 45%),#0c0c11}
.workspace h2 span,.muse h2 span{color:var(--lantern-light)}
.atmosphere-showcase{background:radial-gradient(ellipse at 12% 40%,#99652919,transparent 50%),#0c0e14}
.compare-ours{background:#211a18}
.fendi-home{background:radial-gradient(ellipse at 76% 65%,#b7793928,transparent 60%),#121117}
.fendi-home::before{border-color:var(--lantern-line);box-shadow:0 0 0 35px #c18c4507,0 0 0 85px #c18c4505}
@media(max-width:1100px){.js .site-header>nav{display:none}}
@media(max-width:850px){main [id]{scroll-margin-top:92px}}

/* Editorial headlines pair the screenplay's paper tones with the gold accents. */
body :is(h1,h2,h3,h4),.inventory-grid summary strong{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  text-transform:none;
  letter-spacing:-.04em;
  line-height:1.05;
}
body :is(h2,h3,h4){text-wrap:balance}
.hero-copy h1{font-size:clamp(52px,6vw,94px);line-height:1}
.hero-copy h1 em,main h2 span{font-style:italic}
main .section h2,.fendi-home .closing-copy h2{font-size:clamp(42px,5.2vw,76px);line-height:1.03}
main .feature-card h3{font-size:clamp(24px,2.8vw,38px);min-height:0}
.inventory-grid summary strong{font-size:clamp(23px,2.15vw,33px)}
#site-menu .menu-heading h2{font-weight:400;text-transform:none;letter-spacing:-.04em}
@media(max-width:540px){
  .hero-copy h1{font-size:clamp(38px,10.8vw,56px)!important;line-height:1.05}
  main .section h2,.fendi-home .closing-copy h2{font-size:clamp(35px,9.5vw,49px)}
  main .feature-card h3{font-size:clamp(21px,6vw,29px)}
}

/* Portfolio-inspired typography and framing below the editorial hero. */
main > :is(.section,.closing) :is(h2,h3),
.inventory-grid summary strong {
  font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .005em;
  line-height: .98;
}

main > :is(.section,.closing) h2 span {
  color: #e9bd73;
  font-style: normal;
}

main > :is(.section,.closing) .eyebrow {
  font-family: ui-monospace, 'SFMono-Regular', Consolas, monospace;
  letter-spacing: .14em;
  color: #d8bc8c;
}

main > .section {
  --chapter-wash: radial-gradient(ellipse at 0% 0%, #8d622b30, transparent 58%),
    linear-gradient(145deg, #15110e, #100f16 72%);
}

main > :is(.workspace,.atmosphere-showcase,.lens,.muse,.toolkit,.pdf,.pricing,.feature-inventory,.comparison.comparison-story,.faq) {
  background: var(--chapter-wash);
}

/* Carry the color to the viewport edges while retaining the content measure. */
main > .section {
  max-width: none;
  border-inline: 0;
  border-block-color: transparent;
}

@media (min-width: 1381px) {
  main > .section {
    padding-inline: calc((100% - 1260px) / 2);
  }
}

main .section-heading::after {
  background: linear-gradient(90deg, transparent, #dca963a8);
}

#scroll-progress {
  background: linear-gradient(90deg, #d88a4e, #eaae68);
}

.inventory-grid details {
  background: linear-gradient(140deg, #271e14, #141218 85%);
}

.inventory-grid summary strong {
  font-size: clamp(24px, 2.15vw, 33px);
}