a[aria-disabled="true"]{opacity:.55;cursor:default}

/* Denser glass, preserving original icon shapes and colour accents. */
#home-navigation .home-quicklink {
  background:linear-gradient(155deg,rgba(158,187,209,.22),rgba(13,25,40,.72) 48%,rgba(10,20,33,.78));
  border-color:color-mix(in srgb,var(--link-color) 40%,transparent);
  box-shadow:inset 0 1px 0 #ffffff38,inset 0 -1px 0 #b7d9ed12,0 3px 10px #00000016;
  -webkit-backdrop-filter:blur(10px) saturate(125%);
  backdrop-filter:blur(10px) saturate(125%);
}
#home-navigation .menu-dock-fill {fill:#0b1526a8}
#home-navigation .menu-dock-line {stroke:#d7e5f180}
#home-navigation .menu-dock-bead {
  background:linear-gradient(145deg,#c4fff3e8,#7de0d5db 58%,#58bfbfd9);
  box-shadow:inset 0 1px 3px #ffffffa8,inset 0 -2px 4px #17697538,0 4px 12px #031c2630;
}
@media(hover:hover) and (pointer:fine) {
  #home-navigation .home-quicklink:hover {
    background:linear-gradient(155deg,rgba(183,214,233,.3),rgba(26,46,64,.8) 55%,rgba(13,28,43,.84));
  }
}
@media(max-width:900px) {
  #stage .scene-footer .scroll-prompt {display:none;}
  #stage .scene-footer {left:4%;right:4%;bottom:max(12px,env(safe-area-inset-bottom));}
  #stage .chapters {
    display:grid;grid-template-columns:repeat(7,minmax(0,1fr));
    width:100%;margin:0;padding:0;gap:3px 4px;overflow:visible;
  }
  #stage .chapters button,#stage .chapters button[aria-current=step] {
    min-width:0;min-height:44px;padding:4px 1px 6px;gap:2px;
    flex-direction:column;align-items:center;justify-content:flex-start;
  }
  #stage .chapters span {font-size:9px;line-height:1.15;font-weight:350;letter-spacing:0;}
  #stage .chapters b,#stage .chapters button[aria-current=step] b {
    font-size:9px;line-height:1.15;font-weight:350;letter-spacing:0;
    white-space:normal;text-align:center;overflow-wrap:normal;
  }
  #stage .chapters i {left:3px;right:3px;}
}
@media(prefers-reduced-transparency:reduce) {
  #home-navigation .home-quicklink {background:#152436;-webkit-backdrop-filter:none;backdrop-filter:none;}
  #home-navigation .menu-dock-fill {fill:#0b1526f5;}
}

/* Scene gestures share one direction; scrollable descriptions retain their own scroll. */
html,body {overscroll-behavior-y:none;}
#scene,#services,.end-strip,#stage .editorial,#stage .final-copy {touch-action:pan-x pinch-zoom;}
#stage .editorial,#stage .service-editorial,#stage .final-copy {overscroll-behavior-y:contain;}
@media(max-width:900px) and (orientation:landscape) {
  #stage .chapters {grid-template-columns:repeat(14,minmax(0,1fr));}
  #stage .chapters b {display:none;}
  #stage .chapters button,#stage .chapters button[aria-current=step] {justify-content:center;}
}

/* Compact mobile service scenes: leave the work title and current amount visible. */
@media(max-width:900px){
 #stage .service-scope, #stage .service-price small{display:none}
}

/* Two full-paint variants belong to scene 13, with one shared title. */
#stage .scene-fullpaint .service-price{margin-top:16px;padding-top:12px;gap:6px}
#stage .scene-fullpaint .service-price small{display:none}
#stage .scene-fullpaint .service-price strong{font-size:clamp(24px,2.4vw,36px);letter-spacing:-.03em}
@media(max-width:900px){
 #stage .scene-fullpaint h2{font-size:clamp(27px,7.6vw,40px);line-height:1.02;white-space:normal}
 #stage .scene-fullpaint .service-price{grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-top:10px;padding-top:8px;max-width:380px}
 #stage .scene-fullpaint .service-price>span{font-size:10px;white-space:nowrap}
 #stage .scene-fullpaint .service-price strong{font-size:clamp(20px,5.7vw,27px)}
}
@media(max-width:900px) and (max-height:550px){
 #stage .scene-fullpaint .service-price{grid-template-columns:1fr;gap:3px;margin-top:7px;padding-top:6px}
 #stage .scene-fullpaint .service-price>span{font-size:8px}
 #stage .scene-fullpaint .service-price strong{font-size:20px}
}

/* Keep the complete opening title inside the phone's available copy area. */
@media(max-width:760px) and (orientation:portrait){
 #stage .editorial-first h1{font-size:clamp(30px,8.5vw,46px);line-height:1.05}
}
@media(max-width:320px) and (orientation:portrait){
 html[data-menu-placement=side] #stage .editorial-first h1{font-size:28px}
}
/* The side rail shifts the copy on unfolded phones; its clipping edge follows. */
@media(min-width:761px) and (max-width:900px) and (orientation:portrait){
 html[data-menu-placement=side] #stage .editorial-pages{clip-path:inset(13% calc(69% - 134px) 12% 0)}
}
/* A short portrait viewport must not inherit the landscape's left-column crop. */
@media(max-width:760px) and (max-height:550px) and (orientation:portrait){
 #stage{--copy-limit:66svh}
 #stage .editorial-pages{clip-path:inset(0 0 34% 0)}
 #stage .editorial-first{right:5%;width:auto;max-width:none;overflow-y:auto;overflow-x:hidden;padding-right:5px}
}

/* On phones the workshop caption sits under the top menu, freeing the logo row. */
#stage .mobile-brand-caption { display: none; }
@media (max-width: 900px) {
  html:not([data-menu-placement=side]) #stage .header .start-logo .brand-caption { display: none; }
  html:not([data-menu-placement=side]) #stage .header { row-gap: 2px; }
  html:not([data-menu-placement=side]) #stage .mobile-brand-caption {
    display: block;
    grid-column: 1 / -1;
    grid-row: 3;
    margin: -4px 0 0;
    font-size: 10px;
    line-height: 14px;
    font-style: italic;
    font-weight: 550;
    letter-spacing: .025em;
    color: rgb(var(--ink));
    text-shadow: 0 1px 3px rgba(var(--reading-rgb, 255, 255, 255), .8);
  }
  html:not([data-menu-placement=side]) #stage[data-showroom=true] .mobile-brand-caption {
    color: #26323d;
    text-shadow: 0 1px 3px #fff;
  }
}

/* Phone service copy: preserve the scene, allow complete titles and price text. */
@media (max-width: 760px) and (orientation: portrait) {
  #stage .service-editorial h2 {
    font-size: clamp(23px, 6.6vw, 28px);
    line-height: 1.08;
    white-space: normal;
    overflow-wrap: break-word;
  }
  #stage .service-editorial h2 br { display: none; }
  #stage .service-editorial .service-price {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: 5px 10px;
    margin-top: 10px;
    padding-top: 5px;
  }
  #stage .service-editorial .service-price > span {
    min-width: 0;
    max-width: none;
    font-size: 14px;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: break-word;
  }
  #stage .service-editorial .service-price strong {
    min-width: 0;
    font-size: clamp(22px, 6.2vw, 27px);
    line-height: 1.15;
    text-align: right;
    white-space: normal;
    overflow-wrap: break-word;
  }
  #stage .service-editorial .service-price.on-request strong { font-size: 18px; }
  #stage .service-editorial .service-action { font-size: 13px; line-height: 1.3; }
}

/* Browser chrome can leave a folded phone less than 551px high.
   Keep its narrow column scrollable and let every line wrap inside it. */
@media (max-width: 760px) and (max-height: 550px) and (orientation: portrait) {
  #stage .service-editorial { overflow-y: auto; overflow-x: hidden; touch-action: pan-y pinch-zoom; }
  #stage .service-editorial h2 { font-size: 22px; }
  #stage .service-editorial .eyebrow { font-size: 10px; letter-spacing: 0; }
  #stage .service-editorial .service-price { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  #stage .service-editorial .service-price > span { font-size: 12px; }
  #stage .service-editorial .service-price strong { font-size: 20px; text-align: left; }
  #stage .service-editorial .service-price.on-request strong { font-size: 16px; }
  #stage .service-editorial .service-action { font-size: 12px; }
}