/* Four independent site compositions. Scoped to examples and their full dialog. */
.site-world{container-type:inline-size;--world-gap:clamp(24px,4cqw,64px);--world-pad:clamp(24px,6cqw,88px);background:#f7f5ef;color:#262923;isolation:isolate}
.site-world>.world-brand{position:relative;padding:28px var(--world-pad);border:0;font-size:34px;gap:24px}
.site-world>.world-brand h3{font-size:inherit;display:flex;align-items:center;gap:14px}
.world-brand-mark{width:28px;height:28px;flex:none}
.world-site-nav{gap:clamp(14px,2cqw,30px);font-size:13px;max-width:65%}
.world-site-nav a{position:relative;padding-block:8px}
.world-site-nav a::after{content:"";position:absolute;bottom:3px;left:0;right:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .4s}
.world-site-nav a:hover::after,.world-site-nav a:focus-visible::after{transform:scaleX(1)}
.site-world a:focus-visible,.site-world button:focus-visible,.site-world input:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.site-world .world-section{padding:clamp(64px,8cqw,120px) var(--world-pad);position:relative;scroll-margin-top:70px}
.site-world .world-section :is(h1,h2,h4){font-size:clamp(42px,6.8cqw,96px);line-height:1.02;letter-spacing:-.035em;margin:0 0 30px;max-width:20ch;overflow-wrap:normal;text-wrap:balance}
.site-world .world-section p{font-size:clamp(17px,1.5cqw,21px);line-height:1.65;max-width:52ch;margin:0 0 24px}
.site-world .block-heading,.site-world .block-text{margin:0;min-width:0}
.site-world .world-section>.block-image{margin:36px 0 0;min-width:0}
.site-world .block-image img{width:100%;height:auto;border-radius:0}
.site-world figcaption{font:400 13px/1.5 var(--font-body);color:inherit;letter-spacing:0;border:0;padding:14px 0 0;opacity:.72}
.site-world .gallery-art-editorial{margin:35px 0 0}
.site-world .gallery-art-editorial ul{gap:var(--world-gap);margin:0;padding:0}
.site-world .gallery-art-editorial li:nth-child(even){padding-top:0}
.site-world .gallery-art-editorial li{min-width:0}
.site-world .gallery-art-editorial img{height:auto;aspect-ratio:auto;border-radius:0}
.site-world .world-section[data-part=hero]{display:grid;grid-template-columns:1fr 1.2fr;gap:28px var(--world-gap);padding:52px var(--world-pad) 100px;align-items:center}
.site-world .world-section[data-part=hero] .world-section-title{font-size:clamp(64px,8.2cqw,118px);grid-column:1;grid-row:1;margin:0;align-self:end}
.site-world .world-section[data-part=hero] .world-section-title :is(h1,h2,h4){font-size:inherit;max-width:12ch;margin:0}
.site-world .world-section[data-part=hero] .block-text{grid-column:1;grid-row:2;align-self:start}
.site-world .world-section[data-part=hero] .block-image{grid-column:2;grid-row:1/3;margin:0}
.world-section-number{display:block;font:400 12px/1.3 var(--font-body);letter-spacing:.12em;opacity:.65;margin-bottom:28px}
.world-section[data-part=hero] .world-section-number{font-size:12px;margin-bottom:24px;letter-spacing:.16em}
.site-world .world-section[data-part=footer]{padding-block:70px;border-top:1px solid currentColor}
.site-world .world-section[data-part=footer]>.world-section-title{display:none}
.site-world .world-section[data-part=footer] .block-cta{margin:0;background:none;border:0;padding:0;display:block}
.site-world .world-section[data-part=footer] .block-cta h2{font-size:clamp(42px,6cqw,85px);max-width:16ch;margin:0 0 35px}
.site-world .world-section[data-part=footer] .block-cta p{display:flex;gap:14px;flex-wrap:wrap;max-width:none}
.site-world .btn{border-radius:0;background:transparent;color:inherit;border-color:currentColor;padding:17px 26px;line-height:1.4;min-height:54px;transition:background .3s,color .3s,transform .3s}
.site-world .btn:hover{background:var(--world-ink,#262923);color:var(--world-paper,#f7f5ef);transform:translateY(-3px)}
.world-progress{position:sticky;top:0;z-index:8;height:3px;margin-bottom:-3px;background:transparent;pointer-events:none}
.world-progress span{display:block;height:100%;background:currentColor;transform-origin:left;transform:scaleX(0)}
.world-detail{margin-top:40px;min-width:0}
.world-detail button{border:1px solid currentColor;color:inherit;background:none;cursor:pointer;padding:12px 20px;min-height:44px;font:400 13px/1.4 var(--font-body)}
.world-detail button[aria-pressed=true]{background:var(--world-ink,#262923);color:var(--world-paper,#f7f5ef)}
.world-detail-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:20px}
.world-detail output,.world-detail small{font:400 13px/1.5 var(--font-body);display:block;margin-top:15px}
/* form · field: measured margins, fine rules, large images and a working plan. */
.world-arch{--world-ink:#26352e;--world-paper:#f5f4ed;background:#f5f4ed;color:#26352e}
.world-arch>.world-brand{border-bottom:1px solid #26352e33}
.world-arch .world-section[data-part=hero]{grid-template-columns:1fr 1.3fr;padding-bottom:110px}
.world-arch .world-section[data-part=hero] .block-image{align-self:center}
.world-arch .world-section[data-part=hero] .block-image img{box-shadow:24px 24px 0 #e3e5da}
.world-arch .world-section[data-part=projects]{border-top:1px solid #26352e33}
.world-arch .world-section[data-part=projects] .gallery-art-editorial ul{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.world-arch .world-section[data-part=projects] .gallery-art-editorial li:nth-child(2){padding-top:70px}
.world-arch .world-section[data-part=projects] .gallery-art-editorial li:nth-child(3){padding-top:140px}
.world-arch .world-section[data-part=studio]{background:#e6ebdf;display:grid;grid-template-columns:1fr 1fr;gap:20px var(--world-gap)}
.world-arch .world-section[data-part=studio] .block-heading{grid-column:1}
.world-arch .world-section[data-part=studio] .block-text{grid-column:2;grid-row:1;align-self:center}
.world-arch .world-section[data-part=approach]{display:grid;grid-template-columns:1fr 1fr;gap:22px var(--world-gap)}
.world-arch .world-section[data-part=approach] .block-heading{grid-column:1;grid-row:1}
.world-arch .world-section[data-part=approach] .block-text{grid-column:1;grid-row:2}
.world-arch .world-section[data-part=approach] .block-image{grid-column:2;grid-row:1/3;margin:0}
.arch-plan{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.4fr;gap:var(--world-gap);align-items:center;padding-top:40px;border-top:1px solid #26352e33}
.arch-plan svg{width:100%;height:auto;max-height:440px;background:#f5f4ed}
.arch-plan .plan-material,.arch-plan .plan-light{opacity:0}
.arch-plan .plan-wall{fill:none;stroke:currentColor;stroke-width:3;stroke-linejoin:round}
.arch-plan text{font:12px var(--font-body);fill:currentColor;letter-spacing:.03em}
/* atelier c.: cobalt type, an airy lookbook and full photographs of the garments. */
.world-fashion{--world-ink:#243f8d;--world-paper:#faf6ed;background:#faf6ed;color:#243f8d}
.world-fashion>.world-brand{font-size:40px;padding-block:30px}
.world-fashion .world-section[data-part=hero]{padding-top:28px;grid-template-columns:.9fr 1.4fr}
.world-fashion .world-section[data-part=hero] .block-image img{box-shadow:16px 16px 0 #e5dfcf}
.world-fashion .world-section[data-part=hero] .world-section-title{font-style:italic;font-size:clamp(66px,9cqw,125px)}
.world-fashion .world-section[data-part=atelier]{display:grid;grid-template-columns:1fr 1fr;gap:24px var(--world-gap);align-items:center}
.world-fashion .world-section[data-part=atelier] .block-image{grid-column:1;grid-row:1/3;margin:0}
.world-fashion .world-section[data-part=atelier] .block-heading{grid-column:2;grid-row:1}
.world-fashion .world-section[data-part=atelier] .block-text{grid-column:2;grid-row:2}
.world-fashion .world-section[data-part=material]{background:#e6ebf4;color:#243f8d;display:grid;grid-template-columns:1fr 1fr;gap:24px var(--world-gap)}
.world-fashion .world-section[data-part=material] .block-text{display:block;grid-column:1;grid-row:2}
.world-fashion .world-section[data-part=material] .block-heading{grid-column:1;grid-row:1}
.world-fashion .world-section[data-part=material] .block-image{grid-column:2;grid-row:1/3;margin:0}
.world-fashion .world-section[data-part=lookbook] .gallery-art-editorial ul{grid-template-columns:1fr 1fr}
.world-fashion .world-section[data-part=lookbook] .gallery-art-editorial li{padding:0}
.world-fashion .lookbook-active ul{display:block;position:relative}
.world-fashion .lookbook-active li[hidden]{display:none}
.world-fashion .lookbook-active figure{margin:0}
.world-fashion .lookbook-active img{max-height:720px;object-fit:contain;background:#eee7d9}
.lookbook-controls{display:flex;align-items:center;gap:20px;justify-content:space-between;margin-top:24px}
.lookbook-controls output{margin:0;font-size:15px}
.lookbook-controls>div{display:flex;gap:10px}
.lookbook-controls button{border-radius:50%;width:52px;height:52px;padding:0;font-size:20px}
/* Casa Sol: a relaxed Mediterranean rhythm, arches and a sun you can move. */
.world-hotel{--world-ink:#874f33;--world-paper:#fff5e8;background:#fff5e8;color:#874f33}
.world-hotel>.world-brand{border-bottom:1px solid #874f332b;font-size:42px}
.world-hotel .world-section[data-part=hero]{grid-template-columns:1.2fr 1fr;gap:var(--world-gap);padding-top:48px}
.world-hotel .world-section[data-part=hero] .block-image{grid-column:1;grid-row:1/3}
.world-hotel .world-section[data-part=hero] .world-section-title{grid-column:2;grid-row:1;max-width:10ch}
.world-hotel .world-section[data-part=hero] .block-text{grid-column:2;grid-row:2}
.world-hotel .world-section[data-part=hero] img{border-radius:50% 50% 0 0 / 35% 35% 0 0}
.world-hotel .world-section[data-part=intro]{padding-block:90px;text-align:center;background:#f0e7d6}
.world-hotel .world-section[data-part=intro] :is(h1,h2,h4){max-width:19ch;margin-inline:auto}
.world-hotel .world-section[data-part=intro] p{margin-inline:auto}
.world-hotel .world-section[data-part=room]{display:grid;grid-template-columns:1fr 1.35fr;gap:24px var(--world-gap)}
.world-hotel .world-section[data-part=room] .block-heading{grid-column:1;grid-row:1}
.world-hotel .world-section[data-part=room] .block-text{grid-column:1;grid-row:2}
.world-hotel .world-section[data-part=room] .block-image{grid-column:2;grid-row:1/3;margin:0}
.world-hotel .world-section[data-part=table]{background:#f1d0ad;display:grid;grid-template-columns:1.2fr 1fr;gap:24px var(--world-gap)}
.world-hotel .world-section[data-part=table] .block-heading{grid-column:2;grid-row:1}
.world-hotel .world-section[data-part=table] .block-text{grid-column:2;grid-row:2}
.world-hotel .world-section[data-part=table] .block-image{grid-column:1;grid-row:1/3;margin:0}
.world-hotel .world-section[data-part=garden] .block-image{margin-top:50px}
.world-hotel .world-section[data-part=footer]{text-align:center;background:#eddcc4}
.world-hotel .world-section[data-part=footer] .block-cta h2{margin-inline:auto}
.world-hotel .world-section[data-part=footer] .block-cta p{justify-content:center}
.hotel-sun{display:flex;align-items:center;gap:var(--world-gap);justify-content:space-between;padding-block:28px;border-top:1px solid #874f3333;border-bottom:1px solid #874f3333}
.hotel-sun svg{width:110px;height:110px;flex:none;overflow:visible}
.hotel-sun circle{fill:#e9ad50}
.hotel-sun .sun-rays{transform-origin:60px 60px}
.hotel-sun .world-detail-controls{margin:0}
.world-hotel .btn{border-radius:100px}
/* ПОЛЕ: a curatorial poster system and a manipulable sculpture. */
.world-culture{--world-ink:#233ad1;--world-paper:#fff9eb;background:#fff9eb;color:#233ad1}
.world-culture>.world-brand{font:400 44px/1 Prata,Georgia,serif;border-bottom:1px solid #233ad133}
.world-culture .world-section[data-part=hero]{background:#fff9eb;grid-template-columns:1.5fr 1fr;gap:40px;padding-top:45px}
.world-culture .world-section[data-part=hero] .world-section-title{grid-column:1/-1;grid-row:1;align-self:start;font-size:clamp(70px,10.5cqw,148px);max-width:16ch}
.world-culture .world-section[data-part=hero] .world-section-title :is(h1,h2,h4){max-width:16ch}
.world-culture .world-section[data-part=hero] .block-image{grid-column:1;grid-row:2;margin:0}
.world-culture .world-section[data-part=hero] .block-text{grid-column:2;grid-row:2;align-self:end}
.world-culture .world-section[data-part=manifesto]{display:grid;grid-template-columns:1fr 1.1fr;gap:28px var(--world-gap);background:#ece8f4}
.world-culture .world-section[data-part=manifesto] .block-heading{grid-column:1;grid-row:1}
.world-culture .world-section[data-part=manifesto] .block-text{grid-column:1;grid-row:2}
.world-culture .world-section[data-part=manifesto] .block-image{grid-column:2;grid-row:1/3;margin:0}
.world-culture .world-section[data-part=program]{background:#f0ebaa;color:#233ad1}
.world-culture .world-section[data-part=program] .block-text{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--world-gap)}
.world-culture .world-section[data-part=program] p{margin:0;border-top:1px solid currentColor;padding-top:25px;font-size:19px}
.world-culture .world-section[data-part=installation]{display:grid;grid-template-columns:1fr 1fr;gap:30px var(--world-gap)}
.world-culture .world-section[data-part=installation] .block-heading{grid-column:1/-1}
.world-culture .world-section[data-part=installation]>.block-image{grid-column:1;margin:0}
.world-culture .world-section[data-part=installation]>.block-text{grid-column:1;grid-row:3}
.world-culture .world-section[data-part=visit]{background:#f8d3bd;display:grid;grid-template-columns:1fr 1fr;gap:var(--world-gap)}
.world-culture .world-section[data-part=visit] .block-text{align-self:center}
.world-culture .world-section[data-part=footer]{background:#233ad1;color:#fff9eb;--world-ink:#fff9eb;--world-paper:#233ad1}
.culture-art{grid-column:2;grid-row:2/4;margin:0;display:flex;flex-direction:column;justify-content:center;min-width:0}
.art-object{position:relative;width:100%;aspect-ratio:1;min-height:260px;background:#edeadf;touch-action:pan-y;cursor:grab;overflow:hidden;border-radius:50% 50% 0 0 / 25% 25% 0 0}
.art-object:active{cursor:grabbing}.art-object canvas{position:absolute;inset:0;width:100%;height:100%}.art-object .art-fallback{width:100%;height:100%;display:block;transform:rotateY(var(--art-angle,25deg));transition:transform .35s}.art-object[data-renderer=webgl] .art-fallback{visibility:hidden}
.art-object .art-ring{fill:none;stroke:var(--art-color,#3653cf);stroke-width:32;stroke-linecap:round}.art-object .art-ground{fill:#e1dac6}
.culture-art .world-detail-controls{justify-content:center;margin:22px 0 18px}.culture-art button{border-radius:100px;padding:10px 15px;font-size:12px}
.art-angle{display:flex;align-items:center;gap:18px;font-size:13px}.art-angle input{flex:1;min-width:0;accent-color:currentColor;cursor:pointer}
.art-caption{text-align:center;font-size:12px}
@media(max-width:700px){
 .site-world>.world-brand{padding:24px var(--world-pad);font-size:30px;display:block}
 .world-site-nav{max-width:none;margin-top:18px;gap:8px 16px;font-size:12px}
 .site-world .world-section,.site-world .world-section[data-part=hero],.world-arch .world-section[data-part=studio],.world-arch .world-section[data-part=approach],.world-fashion .world-section[data-part=atelier],.world-fashion .world-section[data-part=material],.world-hotel .world-section[data-part=room],.world-hotel .world-section[data-part=table],.world-culture .world-section[data-part=manifesto],.world-culture .world-section[data-part=installation],.world-culture .world-section[data-part=visit]{display:flex;flex-direction:column;padding:64px var(--world-pad);gap:24px;align-items:stretch}
 .site-world .world-section[data-part=hero]{padding-top:35px}
 .site-world .world-section[data-part=hero] .world-section-title,.world-fashion .world-section[data-part=hero] .world-section-title,.world-culture .world-section[data-part=hero] .world-section-title{font-size:clamp(52px,14cqw,75px);max-width:none;align-self:auto}
 .site-world .world-section :is(h1,h2,h4){font-size:clamp(38px,11cqw,58px);max-width:none}
 .site-world .world-section .block-text{order:initial}
 .site-world .world-section>.block-image{margin:0;order:initial}
 .world-arch .world-section[data-part=hero] .block-image{transform:none}
 .world-arch .world-section[data-part=hero] .block-image img,.world-fashion .world-section[data-part=hero] .block-image img{box-shadow:10px 10px 0 #e3e5da}
 .world-arch .world-section[data-part=projects] .gallery-art-editorial ul{grid-template-columns:1fr;gap:32px}
 .world-arch .world-section[data-part=projects] .gallery-art-editorial li:nth-child(n){padding-top:0}
 .arch-plan{display:block;padding-top:25px;margin-top:16px}.arch-plan svg{margin-top:25px}
 .world-fashion .world-section[data-part=lookbook] .gallery-art-editorial ul{display:block}.world-fashion .world-section[data-part=lookbook] .gallery-art-editorial li+li{margin-top:30px}
 .world-fashion .world-section[data-part=lookbook] .lookbook-active ul li+li{margin:0}
 .world-hotel .world-section[data-part=hero] .block-image{order:2}
 .hotel-sun{gap:18px}.hotel-sun svg{width:70px;height:70px}.hotel-sun button{padding:9px 12px}
 .world-culture .world-section[data-part=program] .block-text{display:block}.world-culture .world-section[data-part=program] p{margin-bottom:28px}
 .culture-art{margin-top:12px}.art-object{min-height:240px}.world-detail{margin-top:24px}
 .world-culture .world-section:not([data-part=hero]) :is(h1,h2,h4){font-size:clamp(30px,9.5cqw,38px)}
 .world-section-number{margin-bottom:16px}.site-world .world-section[data-part=footer]{padding-block:60px}
}
@media(prefers-reduced-motion:reduce){.site-world *{scroll-behavior:auto!important}.site-world .btn,.world-site-nav a::after,.art-object .art-fallback{transition:none}}
/* Standalone examples begin with their own site, below one honest demonstration bar. */
.world-only .editorial-hero,.world-only .breadcrumbs{display:none}
.world-only .editorial-page{padding:0;max-width:none;width:100%}
.world-only .editorial-content{margin:0;padding:0;max-width:none}
.world-only .site-worlds{margin:0}
.world-only .world-back{font:400 13px/1.5 var(--font-body);padding:18px 24px;margin:0}
.world-only .world-notice{display:inline-block;padding:18px 0;margin:0;font-size:12px}
.world-only .site-world{box-shadow:none}
@media(max-width:700px){.world-only .world-back{padding:14px 18px;font-size:12px}.world-only .world-notice{display:block;padding:0 18px 14px}}