/* The approved composition stays intact. These rules address usable routes and edge cases. */
html { scroll-padding-top:110px }
body { overflow-wrap:break-word }
[hidden] { display:none!important }
.reveal { opacity:1; transform:none }
.js .reveal { opacity:0; transform:translateY(30px) }
.js .reveal.visible { opacity:1; transform:none }
.c-header .contact-link { display:inline-flex; min-height:44px; align-items:center }
.c-logo { flex-shrink:0 }
.contact-short { display:none }
.collection-grid { display:grid; grid-template-columns:1fr 1fr; gap:56px 32px; padding:70px 0 }
.collection-card { display:block; min-width:0 }
.collection-card img { aspect-ratio:1.5; height:auto; object-fit:cover; margin-bottom:24px }
.collection-card h2 { font-size:clamp(30px,4vw,54px); margin-top:14px }
.editorial { padding:180px 8vw 80px; min-height:80svh }
.editorial>h1 { font-size:clamp(56px,8vw,116px); line-height:1; letter-spacing:-.025em; margin:28px 0 45px }
.editorial p { font-size:16px; line-height:1.9; color:#c4c8ba; max-width:760px; margin:24px 0 }
.editorial-copy { max-width:750px }
.editorial h2 { font-size:34px; margin-top:40px }
.editorial-copy a:not(.primary) { text-decoration:underline; text-underline-offset:6px }
.service-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin:55px 0 }
.service-grid article { background:#0b0d0b; padding:42px }
.service-grid article h2 { margin:0 0 18px; font-size:34px }
.service-grid article p { margin:0; font-size:15px }
.contact-details { border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:45px 0; padding:15px 0 28px }
.purpose-label { display:flex; flex-direction:column; font-size:14px; gap:12px; margin-top:24px }
.purpose-label select { padding:14px 8px; border:1px solid #ece4d355; color:var(--ivory); background:#0f120f; width:100%; font-size:16px }
.field-hint { font-size:12px; color:#b8bdae }
.consent { display:flex; align-items:flex-start; gap:14px; font-size:14px; line-height:1.7; margin-top:28px }
.consent input { width:20px; height:20px; flex-shrink:0; margin-top:3px; accent-color:var(--gold) }
.consent a { text-decoration:underline }
.honey { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden }
#enquiry-error { color:#f2c9ae; margin-top:16px }
.fields label { font-size:14px }
.enquiry p { font-size:16px }
.enquiry .small-note { font-size:13px }
.chat-states { display:flex; flex-wrap:wrap; gap:8px; margin:26px 0 20px }
.chat-states span { border:1px solid #ece4d32b; border-radius:999px; padding:8px 12px; color:#b7bdad; font-size:11px; letter-spacing:.07em; text-transform:uppercase }
.chat-states .pass { border-color:#94a98366; color:#cbd8bd }
.chat-transcript { display:flex; flex-direction:column; gap:14px; max-height:37svh; overflow:auto; padding:18px 4px 18px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); scroll-behavior:smooth }
.chat-message { max-width:88%; padding:17px 19px; background:#181d17; border:1px solid #ece4d31c }
.chat-message.prospect { align-self:flex-end; background:#24271f }
.chat-message .micro { display:block; color:var(--gold); font-size:9px; margin-bottom:7px }
.chat-message p { color:var(--ivory); line-height:1.65; white-space:pre-wrap }
.chat-compose { margin-top:22px }
.chat-compose>label { display:block; font-size:13px; color:#cfcab9; margin-bottom:10px }
.chat-compose textarea { width:100%; resize:vertical; min-height:86px; color:var(--ivory); background:#0f120f; border:1px solid #ece4d344; padding:14px }
.chat-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; margin-top:16px }
.chat-actions .line-button { gap:12px }
.chat-error { color:#f2c9ae!important; margin:12px 0 0!important }
.c-footer { padding-bottom:65px }
.js .c-footer { padding-bottom:135px }
.noscript-note { padding:24px 8vw; background:#1a2019; line-height:1.8 }
.noscript-note a { text-decoration:underline }
html:not(.js) .reel { height:100svh; min-height:680px }
html:not(.js) .c-dock, html:not(.js) .play-button, html:not(.js) [data-begin] { display:none }
html:not(.js) .scene-title { display:none }
@media(max-width:700px) {
  .collection-grid { grid-template-columns:1fr; gap:40px; padding:50px 0 }
  .editorial { padding:135px 7vw 55px }
  .service-grid { grid-template-columns:1fr; margin:40px 0 }
  .service-grid article { padding:30px 24px }
  .c-header nav { gap:12px }
  .contact-link { max-width:180px; font-size:12px }
  .c-dialog { overscroll-behavior:contain }
  .c-dock { padding-bottom:max(15px,env(safe-area-inset-bottom)) }
  .scene-title { bottom:135px }
  .enquiry-inner { padding-top:78px }
  .chat-transcript { max-height:34svh }
  .chat-message { max-width:94% }
  .chat-actions .primary { width:100% }
}
@media(max-height:600px) {
  .screen { min-height:100svh }
  .portal-copy { padding-top:90px; padding-bottom:85px }
  .portal-copy h1 { font-size:clamp(48px,8vw,78px); line-height:.9 }
  .portal-copy>.micro, .opening-meta, .portal-copy p, .insert-shot { display:none }
  .portal-actions { margin-top:15px }
  .scene-title { bottom:100px }
  .scene-title h2 { font-size:65px; margin:12px 0 }
  .scene-title .scene-subtitle { font-size:22px; margin-bottom:10px }
  .project-hero { min-height:700px }
}
@media(prefers-reduced-motion:reduce) {
  .reel { height:100svh; min-height:640px }
  .scene-title,.scene-meta,.scene-number { display:none }
  .scene:not(:first-child) { visibility:hidden }
  .js .reveal { opacity:1; transform:none }
  .scene-title,.portal-copy { transform:none!important }
  .scene img { transform:none!important }
  .scene { clip-path:none!important }
  .transition-word { display:none }
}
@media(max-width:380px) {
  .contact-long { display:none }
  .contact-short { display:inline }
  .c-header .c-logo { font-size:27px }
  .c-header .contact-link { max-width:114px; text-align:center; line-height:1.4; padding:9px }
  .c-header nav { gap:10px }
}