/* A crisp white/black/red photographic layer, with bounded and controllable motion. */
:root{--paper:#fafafa;--soft:#f0f1f1;--ink:#202122;--dark:#1c1e20;--muted:#64686c;--line:#dedfe0}
.motion-scene{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden;background:#e9ecec;isolation:isolate}
.motion-art{display:block;width:100%;height:100%;overflow:hidden}
.motion-scene.service-hero{margin:0;width:100%;max-height:none}
.motion-controls{position:absolute;right:25px;bottom:23px;z-index:4}
.motion-toggle{display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid #ffffff7a;background:#171c20de;backdrop-filter:blur(8px);color:#fff;font-size:11px;font-weight:600;padding:12px 17px;min-width:92px;min-height:44px;border-radius:0;line-height:1.2}
.motion-toggle:hover{background:#15191c}
.motion-symbol{font-size:15px;font-weight:600;width:15px;text-align:center}
.motion-toggle:focus-visible{outline:3px solid #fff;outline-offset:4px}
.motion-clock{position:absolute;bottom:24px;left:5%;display:flex;gap:14px;align-items:baseline;padding:10px 15px;background:#182127db;color:white;border:1px solid #ffffff3d;backdrop-filter:blur(8px);font-size:22px;font-weight:400;letter-spacing:-.035em;line-height:1.2}
.motion-clock-phase{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#e8eaec}
.motion-clock-detail{display:grid;gap:4px;letter-spacing:0}
.motion-light-state{font-size:10px;font-weight:400;color:#f4f5f6}
.motion-art .scene-motion{animation-play-state:paused}
.motion-running .motion-art .scene-motion{animation-play-state:running}
.site-motion-toggle{font:inherit;color:#f2f2f2;background:transparent;border:1px solid #ffffff4a;font-size:9px;padding:5px 9px;min-height:28px;letter-spacing:.01em;line-height:1.2;white-space:nowrap}
.site-motion-toggle:hover{background:#ffffff20}
.motion-toggle:disabled,.site-motion-toggle:disabled{cursor:default;opacity:.8}
.architecture-timeline{padding-block:30px 40px}
.architecture-timeline .eyebrow{margin-bottom:6px}
.architecture-timeline p:not(.eyebrow){font-size:14px;margin-bottom:10px}
.architecture-timeline input{width:100%;min-height:30px;accent-color:var(--red);margin:8px 0}
.architecture-hours{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}
.architecture-jumps{display:flex;gap:8px;align-items:center;margin-top:17px}
.architecture-jumps button{background:transparent;border:1px solid var(--line);padding:10px 16px;min-height:44px;font-size:11px;color:var(--ink)}
.architecture-jumps button[aria-pressed=true]{background:var(--dark);color:white;border-color:var(--dark)}
.architecture-jumps>span{margin-left:auto;font-size:11px;color:var(--muted)}
.architecture-light-controls{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;border-top:1px solid var(--line);margin-top:22px;padding-top:20px}
.architecture-control-label{font-size:12px;font-weight:600;color:var(--ink)}
.architecture-light-controls>div{display:flex;gap:6px}
.architecture-light-controls button{border:1px solid var(--line);background:transparent;color:var(--ink);font-size:11px;padding:10px 16px;min-height:44px}
.architecture-light-controls button[aria-pressed=true]{background:var(--dark);border-color:var(--dark);color:white}
.architecture-light-controls button:disabled{cursor:default;opacity:.6}
.architecture-timeline .architecture-light-controls p{font-size:12px;line-height:1.5;margin:0;flex:1 1 240px}
.architecture-timeline .architecture-preview-note{font-size:11px;margin:16px 0 0}
.scene-console .scene-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.scene-console .scene-buttons button{min-width:0}
.motion-gallery{padding-bottom:84px}
.motion-gallery .section-heading{margin-bottom:32px}
.motion-gallery .motion-scene{width:100%}
.motion-story{background:#f0f1f1}
.motion-story .motion-scene{aspect-ratio:auto;min-height:500px}
.motion-story .motion-art{position:absolute;inset:0;width:100%;height:100%}
.motion-story .motion-controls{right:18px;bottom:18px}
.motion-story .story-copy{padding:55px 9%}
.service-card>a{display:block;overflow:hidden}
.resource-card>img{transition:transform .48s cubic-bezier(.2,.75,.25,1),filter .25s}
.resource-card:hover>img{transform:scale(1.035)}
.resource-card{overflow:hidden}
.motion-photo{overflow:hidden;position:relative}
.motion-photo>img,.motion-photo>.scene-fixture-overlay{transform-origin:center;transition:transform .65s cubic-bezier(.2,.7,.2,1)}
.motion-photo:hover>img,.motion-photo:hover>.scene-fixture-overlay{transform:scale(1.035)}
.motion-photo.is-visible>img,.motion-photo.is-visible>.scene-fixture-overlay{animation:premium-photo-enter .75s cubic-bezier(.2,.75,.25,1) both}
@keyframes premium-photo-enter{from{transform:scale(1.075);filter:brightness(.8)}to{transform:scale(1);filter:brightness(1)}}
.reveal-ready{opacity:0;transform:translateY(28px);transition:opacity .5s ease,transform .55s cubic-bezier(.2,.75,.25,1);transition-delay:var(--reveal-delay,0ms)}
.reveal-ready.is-visible{opacity:1;transform:none}
.scene-photo.changing img,.scene-photo.changing>.scene-fixture-overlay{animation:premium-scene-change .5s cubic-bezier(.2,.7,.2,1)}
@keyframes premium-scene-change{from{opacity:.5;transform:scale(1.055)}to{opacity:1;transform:scale(1)}}
.button{transition:background .2s,transform .2s;will-change:auto}.button:hover{transform:translateY(-2px)}
@media(max-width:1000px){.motion-story{grid-template-columns:1fr}.motion-story .motion-scene{aspect-ratio:16/9;min-height:0}.motion-story .story-copy{padding:42px 5%}.motion-story .story-copy h2{max-width:700px}.motion-story .story-copy p{max-width:700px}}
@media(max-width:700px){.motion-controls{right:11px;bottom:11px}.motion-toggle{padding:9px 11px;min-width:76px;font-size:10px}.motion-symbol{font-size:13px}.motion-clock{bottom:11px;left:12px;gap:9px;padding:9px 11px;font-size:16px}.motion-clock-phase{font-size:8px}.motion-gallery{padding-bottom:50px}.architecture-timeline{padding-block:22px 30px}.architecture-jumps{gap:5px;flex-wrap:wrap}.architecture-jumps button{flex:1;padding:10px}.architecture-jumps>span{width:100%;margin:6px 0 0}.site-motion-toggle{font-size:8px;padding:4px 6px}.motion-story .story-copy{padding:35px 5%}.reveal-ready{transform:translateY(18px)}}
@media(prefers-reduced-motion:reduce){.reveal-ready{opacity:1;transform:none}.motion-photo.is-visible>img,.motion-photo.is-visible>.scene-fixture-overlay{animation:none}.motion-art .scene-motion{animation:none!important}.motion-toggle:disabled{min-width:100px}.service-card>a:hover img,.resource-card:hover>img,.motion-photo:hover>img,.motion-photo:hover>.scene-fixture-overlay,.button:hover{transform:none}}
html.motion-paused .motion-art .scene-motion{animation-play-state:paused!important}
html.motion-paused .reveal-ready{opacity:1;transform:none;transition:none}
html.motion-paused .motion-photo.is-visible>img,html.motion-paused .motion-photo.is-visible>.scene-fixture-overlay{animation:none}
/* A shared 12-second cycle holds all three sheer shades at open, half and full height. */
.premium-roller-shade{transform:translateY(var(--shade-travel));animation:premium-roller 12s cubic-bezier(.45,0,.25,1) infinite}
@keyframes premium-roller{0%,8%,100%{transform:translateY(var(--shade-travel))}22%,40%,84%,92%{transform:translateY(var(--shade-half-travel))}54%,71%{transform:translateY(0)}}
.premium-tv-frame{opacity:0;animation:premium-tv 9s linear infinite;animation-delay:var(--frame-delay,0s)}
@keyframes premium-tv{0%,13.333%{opacity:1}16.667%,96.667%{opacity:0}100%{opacity:1}}
.premium-speaker-notes{filter:drop-shadow(0 1px 1.4px #12394a99);pointer-events:none}
.premium-note-flight{animation:premium-note 2.6s linear infinite;animation-delay:var(--note-delay,0s);transform-box:view-box;transform-origin:0 0}
@keyframes premium-note{0%{opacity:0;transform:translate(0,0) scale(.65) rotate(-5deg)}15%{opacity:1;transform:translate(calc(var(--note-x)*.15),calc(var(--note-y)*.15)) scale(1.05)}70%{opacity:.95;transform:translate(calc(var(--note-x)*.7),calc(var(--note-y)*.7)) scale(1.08) rotate(4deg)}100%{opacity:0;transform:translate(var(--note-x),var(--note-y)) scale(.85) rotate(9deg)}}
.premium-sound-ring{transform-origin:0 0;animation:premium-sound 1.6s ease-out infinite;animation-delay:var(--ring-delay,0s)}
@keyframes premium-sound{0%{transform:scale(.7);opacity:0}20%{opacity:.7}100%{transform:scale(4);opacity:0}}
.motion-poster{position:absolute;inset:0;z-index:-1}.motion-poster>img{display:block;width:100%;height:100%;object-fit:cover}.motion-template{display:none}
/* Keep the complete living-room composition visible, including both speakers. */
.motion-story{grid-template-columns:1fr}
.motion-story .motion-scene{aspect-ratio:16/9;min-height:0}
.motion-story .motion-art{position:static}
.motion-story .story-copy{display:grid;grid-template-columns:1.2fr 1fr;gap:0 11%;padding:50px 5%;width:100%}
.motion-story .story-copy>.eyebrow{grid-column:1/-1;margin-bottom:17px}
.motion-story .story-copy>h2{grid-column:1;grid-row:2/4;margin-bottom:0}
.motion-story .story-copy>p:not(.eyebrow){grid-column:2;grid-row:2;margin:0 0 20px}
.motion-story .story-copy>.text-link{grid-column:2;grid-row:3;justify-self:start}
@media(max-width:700px){.motion-story .story-copy{display:block;padding:35px 5%}.motion-story .story-copy>h2{margin-bottom:24px}.motion-story .story-copy>p:not(.eyebrow){margin-bottom:23px}}

/* Fixed physical fixtures share the photo geometry; only emitted light toggles. */
.scene-fixture-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
