/* Shared interaction and surface language, with each example's own identity. */
html { scroll-padding-top:110px; color-scheme:light; }
@media(prefers-reduced-motion:no-preference) { html { scroll-behavior:smooth; } }
:is(.atelier,.lodge,.nord) { --demo-panel:#fffdf8; --demo-muted:#62675e; --demo-accent:#86492f; }
.lodge { --demo-accent:#375d50; }
.nord { --demo-accent:#865632; }
:is(.atelier-container,.lodge-container,.nord-container) { width:min(calc(100% - clamp(44px,9vw,152px)),1760px); max-width:1760px; }
:is(.atelier-header,.nord-header) { position:sticky; top:0; z-index:10; background:var(--paper); min-height:88px; padding-block:20px; }
:is(.atelier-header,.nord-header)::before { content:''; position:absolute; inset:0 calc((100vw - 100%) / -2); z-index:-1; background:var(--paper); border-bottom:1px solid var(--line); }
.lodge-header { position:sticky; top:0; z-index:10; min-height:88px; padding:20px clamp(22px,4.5vw,76px); }
:is(.atelier-header,.lodge-header,.nord-header) nav { margin-left:auto; }
.studio-theme-toggle { display:grid; place-items:center; width:40px; height:40px; flex:none; border:1px solid currentColor; border-radius:50%; color:inherit; background:transparent; cursor:pointer; }
.studio-theme-toggle[hidden] { display:none; }
.studio-theme-toggle svg { width:19px; height:19px; }
.theme-sun, [data-theme=dark] .theme-moon { display:none; }
[data-theme=dark] .theme-sun { display:block; }
:is(.atelier-button,.lodge-button,.nord-button) { border-radius:10px; background:var(--demo-accent); color:#fff!important; border-color:var(--demo-accent); box-shadow:0 6px 18px #0000000a; }
:is(.atelier-button,.lodge-button,.nord-button):hover { background:#573522; color:white!important; }
.atelier-hero { display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(28px,5vw,90px); align-items:center; min-height:calc(100svh - 140px); padding-block:42px 65px; }
.atelier-hero-heading { display:block; padding:0; }
.atelier-hero-heading h1 { font-size:clamp(46px,5vw,88px); margin-top:25px; }
.atelier-hero-note { display:block; max-width:440px; margin-top:28px; font-size:15px; line-height:1.8; color:var(--demo-muted); }
.atelier-hero-note > span { display:none; }
.atelier-hero-image img { height:clamp(350px,60vh,720px); border-radius:18px; box-shadow:0 22px 55px #40311e20; }
.atelier-card-image, .nord-product-image { border-radius:14px; }
.atelier-project-card:nth-child(even) { padding-top:0; }
.atelier-project-card, .lodge-stay-card, .nord-product-card { border:1px solid var(--line); padding:16px; border-radius:18px; background:var(--demo-panel); }
.atelier-card-caption, .nord-card-info { padding:22px 8px 10px; }
.lodge-stay-card { padding:0; }
.atelier-intro-grid > div > p, .atelier-card-caption p, .atelier-collection-intro { color:var(--demo-muted); }
.lodge-hero, .lodge-hero-content { min-height:calc(100svh - 140px); }
.lodge-hero-content { padding-top:clamp(50px,10vh,110px); padding-bottom:30px; }
.lodge-hero-bottom { margin-top:auto; padding-top:20px; }
.lodge-hero .lodge-button { margin-bottom:40px; }
.nord-hero { min-height:calc(100svh - 140px); padding-block:42px 65px; }
.nord-hero figure img { height:clamp(350px,60vh,720px); aspect-ratio:auto; border-radius:18px; box-shadow:0 22px 55px #40311e20; }
.nord-filters { padding:24px; border:1px solid var(--line); border-radius:16px; background:var(--demo-panel); }
.nord-filters :is(input,select), .nord-contact :is(input,textarea,select) { border-radius:8px; }
.nord-header-note { display:none; }
.start-service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.start-service-grid article { padding:28px; border:1px solid var(--line); border-radius:16px; background:var(--demo-panel); }
.start-service-grid h3 { margin-block:18px; }
.start-service-grid p { color:var(--demo-muted); font-size:14px; }
.demo-scope { padding-block:60px; }
.demo-scope h2 { font-family:inherit; font-size:clamp(25px,3vw,40px); margin-block:18px; }
.demo-scope > p:not(.atelier-kicker) { max-width:780px; font-size:14px; color:var(--demo-muted); margin-top:14px; }
[data-theme=dark] { color-scheme:dark; }
[data-theme=dark] :is(.atelier,.lodge,.nord) { --paper:#101719; --ink:#f2f0e9; --pine:#f2f0e9; --line:#39423f; --muted:#b8c1ba; --demo-muted:#b8c1ba; --demo-panel:#1c2626; --demo-accent:#975239; }
[data-theme=dark] .lodge { --demo-accent:#3d6c5d; }
[data-theme=dark] :is(.atelier-services,.lodge-experiences,.nord-footer) { background:#1c2626; }
[data-theme=dark] :is(.atelier-footer,.lodge-footer,.lodge-header) { background:#182221; color:#f2f0e9; }
[data-theme=dark] :is(.atelier-demo,.lodge-demo,.nord-demo) { background:#283330; color:#e4e8de; }
[data-theme=dark] :is(.nord-filters input,.nord-filters select,.nord-contact input,.nord-contact textarea,.nord-contact select) { background:#101719; color:var(--ink); }
[data-theme=dark] .atelier-prose p { color:var(--demo-muted); }
[data-theme=dark] .nord-product-image { background:#26302c; }
@media(max-width:800px) {
    :is(.atelier-header,.lodge-header,.nord-header) { flex-wrap:wrap; gap:14px; }
    :is(.atelier-header,.lodge-header,.nord-header) nav { order:3; width:100%; margin:0; gap:20px; font-size:12px; }
    .studio-theme-toggle { margin-left:auto; }
    .atelier-wordmark,.nord-brand { font-size:25px; }
    .atelier-hero,.nord-hero { grid-template-columns:1fr; gap:35px; padding-block:40px; min-height:0; }
    .atelier-hero-image img,.nord-hero figure img { height:380px; }
    .atelier-hero-heading h1,.nord-hero h1 { font-size:clamp(44px,9vw,65px); }
    .start-service-grid { grid-template-columns:1fr; }
    .lodge-hero,.lodge-hero-content { min-height:650px; }
    .lodge-story { max-width:800px; }
    .nord-filters { padding:16px; }
}
@media(prefers-reduced-motion:no-preference) {
    :is(.atelier-hero-heading,.nord-hero>div,.lodge-hero-content) { animation:demo-arrive .7s ease-out both; }
    @keyframes demo-arrive { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
}
