/* One bounded type scale. Architecture may scale; typography never inherits its zoom. */
:root{
 --type-hero:30px;--type-subtitle:16px;--type-section:26px;--type-small:19px;--type-card:20px;--type-body:15px;--type-meta:13px;--type-brand:22px;--type-nav:15px;--type-button:15px;--type-footer:13px;
}
@media(min-width:1024px){:root{--type-hero:clamp(30px,calc(10px + 2.083333vw),50px);--type-subtitle:clamp(16px,calc(10px + .416667vw),18px);--type-section:clamp(28px,calc(20px + .833333vw),36px);--type-small:clamp(19px,calc(14px + .416667vw),22px);--type-card:clamp(20px,calc(14px + .416667vw),22px);--type-body:clamp(15px,calc(12px + .208333vw),16px);--type-brand:clamp(22px,calc(16px + .416667vw),24px)}}
@media(min-width:1920px){:root{--type-hero:clamp(50px,calc(20px + 1.5625vw),60px);--type-subtitle:clamp(18px,calc(12px + .3125vw),20px);--type-section:clamp(36px,calc(24px + .625vw),40px);--type-small:clamp(22px,calc(16px + .3125vw),24px);--type-brand:clamp(24px,calc(18px + .3125vw),26px);--type-meta:clamp(13px,calc(10px + .15625vw),14px);--type-nav:clamp(15px,calc(12px + .15625vw),16px);--type-button:var(--type-nav);--type-footer:var(--type-meta)}}
html:root:root[data-theme=light]{--light-type-section:var(--type-section);--light-type-small:var(--type-small);--light-type-body:var(--type-body);--display:var(--serif);--display-serif:var(--serif)}
html:root:root[data-theme=light] body{font-size:var(--type-body)!important;font-weight:400!important}
html:root:root[data-theme=light] :where(p,dd,li,.text-button,.library-link,.home-expertise p,.about-description,.business-content p,.cooperation-cards dl,.process-line li,.card-positioning,.contact-subtitle,.copy-contact,#form-result){font-size:var(--type-body)!important;font-weight:400!important}
html:root:root[data-theme=light] :where(h1,h2,.section-heading h2,.home-about h2,.business-content h2,.contact-content h1,.cabin-pagehead h1,#application h2,.month-heading h2,.closing-hall h2){font-size:var(--type-section)!important;font-weight:700!important}
html:root:root[data-theme=light] :where(h3,.home-expertise h3,.cooperation-cards h3){font-size:var(--type-small)!important;font-weight:600!important}
html:root:root[data-theme=light] .hero-copy h1{font-size:var(--type-hero)!important;font-weight:700!important}
html:root:root[data-theme=light] .hero-readable>p{font-size:var(--type-subtitle)!important;font-weight:400!important;letter-spacing:.22em}
html:root:root[data-theme=light] :where(.card-identity h3,.card-title-line h3){font-size:var(--type-card)!important;font-weight:700!important}
html:root:root[data-theme=light] :where(.card-details,.card-meta,.category,.tag,.card-action,.card-link,.card-month,.catalog-month,.eyebrow,.breadcrumb,.filter-footer,.filter-group summary,.filter-selection,.form-grid label,.form-notice,.field-error,.copy-contact small,.contact-channels>div>span,.contact-qr-row p,.hero-featured,.hero-video-controls button){font-size:var(--type-meta)!important;font-weight:400!important}
html:root:root[data-theme=light] :where(.brand,.museum-footer .brand){font-size:var(--type-brand)!important;font-weight:700!important}
html:root:root[data-theme=light] :where(.site-nav,.nav) nav a{font-size:var(--type-nav)!important;font-weight:400!important}
html:root:root[data-theme=light] :where(.museum-footer .footer-grid p,.museum-footer .health-notice){font-size:var(--type-footer)!important;font-weight:400!important}
html:root:root[data-theme=light] :where(.button,.hero-copy .button,.business-content .button,.nav-actions>.button){font-size:var(--type-button)!important;font-weight:500!important;min-width:0;width:fit-content;min-height:44px;height:44px;padding:0 24px;box-shadow:none;gap:16px;transition:filter 200ms}
html:root:root[data-theme=light] :where(.button:hover,.hero-copy .button:hover){box-shadow:none;filter:brightness(1.06)}
html:root:root[data-theme=light] :where(.site-nav,.nav) .nav-actions>.button{min-height:40px;height:40px;padding:0 20px;background:transparent;border:1px solid #aa8858}
html:root:root[data-theme=light] :where(.site-nav,.nav) .nav-actions>.button::before{display:none}
html:root:root[data-theme=light] .hero-enter{background:transparent;border:1px solid currentColor;box-shadow:none}
html:root:root[data-theme=light] .hero[data-tone=dark] .hero-enter{color:#fff8e9;background:#181b2070}
html:root:root[data-theme=light] .hero-links{gap:16px;margin-top:24px}
html:root:root[data-theme=light] :where(.site-nav,.nav){max-width:1360px;height:48px;top:20px}
html:root:root[data-theme=light] :where(.site-nav,.nav) .theme-toggle{width:44px;height:44px}
html:root:root[data-theme=light] :where(.site-nav,.nav).scrolled{max-width:none;height:64px;padding:8px max(3%,calc((100vw - 1360px)/2))}
html:root:root[data-theme=light] :where(.catalog-content,.home-expertise,.cooperation-compact,.library-controls,#library-groups,.footer-grid){max-width:1360px;margin-inline:auto}
html:root:root[data-theme=light] .museum-footer .footer-grid{max-width:1360px;margin-inline:auto;gap:32px}
html:root:root[data-theme=light] .museum-footer{padding:40px max(6%,calc((100vw - 1360px)/2)) 24px}
html:root:root[data-theme=light] .museum-footer .health-notice{margin-top:24px;padding-top:24px}
html:root:root[data-theme=light] .home-about{padding-block:80px}
html:root:root[data-theme=light] .home-expertise{gap:32px}
html:root:root[data-theme=light] .about-description{margin:24px auto 40px}
html:root:root[data-theme=light] .month-grid{--card-gap:24px;gap:24px}
html:root:root[data-theme=light] .version-grid{gap:64px 24px}
html:root:root[data-theme=light] .home-business{height:620px;aspect-ratio:auto}
html:root:root[data-theme=light] .home-business .section-art{object-fit:cover;object-position:center 65%}
html:root:root[data-theme=light] .business-content{top:50%;left:max(9%,calc((100vw - 1360px)/2));right:auto;width:min(55%,720px);display:flex;flex-direction:column;align-items:flex-start;gap:24px;text-align:left}
html:root:root[data-theme=light] .business-content>div{max-width:100%}
html:root:root[data-theme=light] .business-content p{margin-top:16px;max-width:34em}
html:root:root[data-theme=light] .business-content .button{height:48px;min-height:48px;max-width:200px}
html:root:root[data-theme=light] .cooperation-compact{margin-block:48px 80px}
html:root:root[data-theme=light] .contact-content input,html:root:root[data-theme=light] .contact-content select{font-size:var(--type-body)!important;height:44px}
html:root:root[data-theme=light] .contact-hero .contact-content{left:max(63%,calc(50% + 200px));width:min(31%,480px)}
html:root:root[data-theme=light] .cabin-pagehead{padding-inline:max(6%,calc((100vw - 1360px)/2))}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 html:root:root[data-theme=light][data-card-motion=true] :where(.version-card,.month-card){transition:transform 200ms,filter 200ms}
 html:root:root[data-theme=light][data-card-motion=true] :where(.version-card:hover,.month-card:hover){transform:translateY(-4px)}
 html:root:root[data-theme=light][data-card-motion=true] :where(.version-card .card-media img,.month-card .card-cover img){transition:transform 200ms}
 html:root:root[data-theme=light][data-card-motion=true] :where(.version-card:hover .card-media img,.month-card:hover .card-cover img){transform:scale(1.03)!important}
}
@media(max-width:1023px){
 html:root:root[data-theme=light] :where(.site-nav,.nav){top:12px}
 html:root:root[data-theme=light] .contact-hero .contact-content{left:auto;width:88%}
 html:root:root[data-theme=light] .hero[data-tone=dark] .hero-enter{color:#302215;background:transparent}
}
@media(max-width:767px){
 html:root:root[data-theme=light] :where(.site-nav,.nav) .nav-actions>.button{padding-inline:12px;font-size:13px!important}
 html:root:root[data-theme=light] .hero-links{flex-direction:row;justify-content:center;gap:8px}
 html:root:root[data-theme=light] .hero-copy .button{padding-inline:16px}
 html:root:root[data-theme=light] .home-about{padding-block:64px}
 html:root:root[data-theme=light] .home-business{height:480px}
 html:root:root[data-theme=light] .home-business .section-art{object-position:35% center}
 html:root:root[data-theme=light] .business-content{top:52%;left:8%;width:70%;gap:24px}
 html:root:root[data-theme=light] .business-content p{line-height:1.7}
 html:root:root[data-theme=light] .version-grid{gap:48px}
 html:root:root[data-theme=light] .museum-footer .footer-grid{gap:16px}
}

html:root:root[data-theme=light] .museum-footer .footer-grid p:empty{display:none}
/* Fit only the alpha transition, never stretch the photographic scene. */
html:root:root[data-theme=light] .home-business .section-art{mask-size:100% 100%;mask-position:center}
/* A single larger stone grain runs through the sections, including their fade zones. */
body[data-scene=grok-a] main{background-size:2048px auto}
body[data-scene=grok-a] .home-catalog::after{background:none}
/* Keep the dark composition and font face; cap heading weights there as well. */
html[data-theme=dark] :is(h1,h2,h3,h4,h5,h6){font-weight:700!important}

/* Round 2: only the cooperation scene's crop and transition change. */
html:root:root[data-theme=light] .home-business{height:min(720px,37.5vw)}
html:root:root[data-theme=light] .home-business .section-art{object-position:center top;mask-image:linear-gradient(transparent,#000 24px);mask-size:100% 100%}
html:root:root[data-theme=light] .business-content{top:62%}
@media(max-width:767px){
 html:root:root[data-theme=light] .home-business{height:480px}
 html:root:root[data-theme=light] .home-business .section-art{object-position:center top;mask-image:linear-gradient(transparent,#000 16px)}
 html:root:root[data-theme=light] .business-content{top:56%}
}
/* Keep alt in the accessibility tree; unloaded/broken covers paint only the stone below. */
html:root:root[data-theme] :is(.card-cover,.card-media)>img{opacity:0;color:transparent;transition:opacity 200ms,transform 200ms!important}
html:root:root[data-theme] :is(.card-cover,.card-media)>img[data-cover-ready=true]{opacity:1}
@media(prefers-reduced-motion:reduce){html:root:root[data-theme] :is(.card-cover,.card-media)>img{transition:none!important}}

/* Round 3: extended empty wall/sky carries the full, unblurred transition. */
html:root:root[data-theme=light] .home-business{height:clamp(640px,41.6667vw,800px)}
html:root:root[data-theme=light] .home-business .section-art{object-position:center 42%;mask-image:linear-gradient(transparent,#000 160px)}
html:root:root[data-theme=light] .business-content{top:73%;gap:16px}
@media(max-width:767px){
 html:root:root[data-theme=light] .home-business{height:560px}
 html:root:root[data-theme=light] .home-business .section-art{object-position:center 50%;mask-image:linear-gradient(transparent,#000 140px)}
 html:root:root[data-theme=light] .business-content{top:68%;gap:8px}
 html:root:root[data-theme=light] .business-content p{margin-top:8px}
}

@media(min-width:768px) and (max-width:1279px){
 html:root:root[data-theme=light] .home-business{height:clamp(720px,62.5vw,800px)}
 html:root:root[data-theme=light] .home-business .section-art{object-position:center 50%}
 html:root:root[data-theme=light] .business-content{top:78%;gap:8px}
 html:root:root[data-theme=light] .business-content p{margin-top:8px}
}

@media(min-width:1280px){
 html:root:root[data-theme=light] .business-content h2{width:fit-content}
}
@media(min-width:1280px) and (max-width:1600px){
 html:root:root[data-theme=light] .business-content{gap:8px}
}

/* The wide artwork keeps one crop and one coordinate system for the copy. */
@media(width > 1920px){
 html:root:root[data-theme=light] .home-business{
  width:min(100%,2560px);
  height:auto;
  aspect-ratio:12 / 5;
  margin-inline:auto;
 }
 html:root:root[data-theme=light] .business-content{
  left:15%;
  top:74%;
 }
}
@media(width > 2560px){
 html:root:root[data-theme=light] .home-business .section-art{
  mask-image:linear-gradient(transparent,#000 160px),
   linear-gradient(90deg,transparent,#000 128px,#000 calc(100% - 128px),transparent);
  mask-composite:intersect;
 }
}

/* The light library shares the contact stone surface and one content edge. */
html:root:root[data-theme=light] .library-main:not(.exhibit-floor){
 --library-width:min(92%,1360px);
 --library-gutter:max(4%,calc((100% - 1360px)/2));
 --description-room:calc(8px + 3.2 * var(--type-body));
 background:#eedcc7 var(--site-marble) 0 0/1024px auto repeat;
}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) :is(.cabin-pagehead,.closing-hall){
 padding-inline:var(--library-gutter);
}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) :is(.library-controls,#library-groups){
 width:var(--library-width);
 margin-inline:auto;
}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) .month-group{width:100%}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) .month-group .version-grid{
 width:100%;
 margin-inline:0;
 row-gap:calc(var(--description-room) + 32px);
 margin-bottom:calc(var(--description-room) + 32px);
}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) .card-positioning{
 top:calc(100% + 8px);
 margin:0;
 line-height:1.6;
 display:-webkit-box;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:2;
 overflow:hidden;
}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) .closing-hall{
 background:transparent;
 border-color:var(--line-soft);
 color:var(--body-copy);
 min-height:0;
 padding-block:56px;
}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) .closing-hall h2{color:var(--heading-ink)}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) .closing-hall > div:first-child > p{display:none}
html:root:root[data-theme=light] .library-main:not(.exhibit-floor) .closing-action p{color:var(--body-copy)}

/* Reuse the cooperation card outline on the light homepage. */
html[data-theme=light] .home-expertise article{
 min-width:0;
 border:1px solid var(--line-strong,#b9945c);
 border-radius:65px 65px 12px 12px;
 padding:34px 30px 22px;
}
@media(max-width:1023px){
 html[data-theme=light] .home-expertise article{
  border-radius:45px 45px 12px 12px;
  padding:28px 25px 18px;
 }
}