/* A quiet departure between the furniture collection and the itinerary. */
#supply .s05-concierge { position:relative; background:var(--s-paper); scroll-margin-top:70px; }
#supply .s05-concierge-inner { position:relative; display:grid; grid-template-columns:.85fr 1.25fr; grid-template-rows:auto auto; column-gap:5%; align-content:center; align-items:center; min-height:760px; padding-block:90px 100px; }
#supply .s05-concierge-kicker { display:flex; align-items:center; gap:14px; margin:0 0 26px; font-size:11px; letter-spacing:.12em; color:#6b746a; }
#supply .s05-concierge-kicker::before { content:''; width:28px; height:1px; background:#9a9f87; }
#supply .s05-concierge h3 { margin:0; font:400 clamp(36px,4.3vw,62px)/1.35 var(--s-display); letter-spacing:-.035em; }
#supply .s05-concierge h3 span { color:#66745f; }
#supply .s05-concierge-promise { margin:26px 0 0; font-size:15px; line-height:1.9; }
#supply .s05-concierge-copy { margin:10px 0 0; max-width:26em; font-size:13px; line-height:1.95; color:var(--s-muted); }
#supply .s05-car-figure { grid-column:2; grid-row:1 / 3; position:relative; margin:0; align-self:center; display:flex; flex-direction:column; }
#supply .s05-car-stage { position:relative; aspect-ratio:1.32; isolation:isolate; overflow:hidden; transform-origin:50% 42%; }
#supply .s05-car-media {
  position:absolute; inset:0;
  mask-image:radial-gradient(ellipse 88% 78% at 50% 54%,#000 62%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 88% 78% at 50% 54%,#000 62%,transparent 100%);
}
#supply .s05-car-stage img,#supply .s05-car-stage canvas { display:block; position:absolute; width:143%; max-width:none; height:auto; left:-21.5%; top:50%; transform:translateY(-50%); aspect-ratio:1400 / 788; }
#supply .s05-car-stage canvas { opacity:0; }
#supply .s05-car-stage.is-ready canvas { opacity:1; }
#supply .s05-car-stage.is-ready img { opacity:0; }
#supply .s05-car-caption { position:relative; display:flex; justify-content:space-between; align-items:center; gap:15px; margin:-14px 7% 0; color:var(--s-muted); font-size:10px; letter-spacing:.06em; }
#supply .s05-car-caption strong { font-weight:500; color:var(--s-ink); letter-spacing:.16em; }
#supply .s05-car-scroll { display:flex; gap:9px; align-items:center; }
#supply .s05-car-scroll::before { content:''; display:block; height:24px; width:1px; background:linear-gradient(#9a9f8740,#6b746a); }
#supply .s05-concierge-team { grid-column:1; margin-top:35px; padding-top:24px; border-top:1px solid #d8d8cd; display:grid; grid-template-columns:auto 1fr; gap:22px; align-items:start; }
#supply .s05-concierge-ratio { margin:0; font:400 45px/1 var(--s-display); color:#66745f; white-space:nowrap; }
#supply .s05-concierge-ratio span { display:block; margin-top:10px; font:400 10px/1.6 var(--s-body); color:var(--s-muted); letter-spacing:.04em; }
#supply .s05-concierge-roles { display:grid; gap:12px; margin:0; justify-self:end; }
#supply .s05-concierge-roles div { display:grid; grid-template-columns:55px 1fr; gap:12px; }
#supply .s05-concierge-roles dt { font-size:12px; color:var(--s-ink); }
#supply .s05-concierge-roles dd { margin:0; font-size:11px; line-height:1.8; color:var(--s-muted); }
#supply .s05-departure { position:relative; left:auto; right:auto; bottom:auto; display:flex; align-items:center; justify-content:center; gap:14px; margin-top:6px; color:#79816f; font-size:10px; letter-spacing:.1em; }
#supply .s05-departure::before,#supply .s05-departure::after { content:''; width:64px; height:1px; background:#c6cbbb; }
#supply .s05-departure a { display:flex; align-items:center; gap:12px; padding:12px 0; }
#supply .s05-departure a span { font-size:16px; }
/* The map stays decorative. A paper wash protects copy; SVG labels have a halo. */
#supply .s05-route-pin { background:var(--s-paper); --s-blue:#526b7d; --s-mist:#f6f5f1; }
#supply .s05-itinerary { position:relative; isolation:isolate; background:var(--s-paper); }
#supply .s05-itinerary::before { content:''; position:absolute; inset:0; z-index:-2; background:url('./itinerary-watercolor.webp') center 65% / cover no-repeat; opacity:.9; }
#supply .s05-itinerary::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#f6f5f1 0%,#f6f5f1dd 14%,#f6f5f145 40%,#f6f5f136 59%,#f6f5f1ed 79%,#f6f5f1 100%); }
#supply .s05-route-heading h3 { color:#303a32; }
#supply .s05-route-heading h3 span { color:#526b7d; }
#supply .s05-route-heading p { color:#536050; }
#supply .s05-map { margin-top:42px; }
#supply .s05-map svg { min-height:220px; }
#supply .s05-map .s05-road { display:none; }
#supply .s05-map text { fill:#56614e; paint-order:stroke fill; stroke:var(--s-paper); stroke-width:6px; stroke-linejoin:round; }
#supply .s05-map .s05-stop-name { fill:#303d2f; font-weight:500; }
#supply .s05-route-base { fill:none; stroke:#b8c6d0; stroke-width:1.5; stroke-dasharray:3 5; opacity:.65; }
#supply .s05-route-ink { fill:none; stroke:#526b7d; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
#supply .s05-map .s05-route-halo { fill:none; stroke:#f6f5f1; stroke-width:9; opacity:.8; }
#supply .s05-stop { fill:#f6f5f1; stroke:#526b7d; stroke-width:2; }
#supply .s05-traveler { fill:#526b7d; stroke:#f6f5f1; stroke-width:4; }
#supply .s05-step { border-color:#b8bfaf; }
#supply .s05-step p { color:#56614f; }
#supply .s05-map figcaption { color:#596250; }
@media(min-width:769px) {
  #supply .s05-opening-pin { height:200vh; }
  #supply .s05-route-pin { height:180vh; }
  #supply .s05-concierge.has-sequence { height:170vh; }
  #supply .s05-concierge.has-sequence .s05-concierge-inner { position:sticky; top:60px; min-height:calc(100svh - 60px); padding-block:56px 64px; }
  #supply .s05-concierge.has-sequence .s05-concierge-promise,
  #supply .s05-concierge.has-sequence .s05-concierge-copy,
  #supply .s05-concierge.has-sequence .s05-concierge-team,
  #supply .s05-concierge.has-sequence .s05-departure {
    opacity:0; transform:translateY(14px);
    transition:opacity .65s ease,transform .75s cubic-bezier(.2,.7,.2,1);
  }
  #supply .s05-concierge.is-depart .s05-concierge-promise,
  #supply .s05-concierge.is-depart .s05-concierge-copy { opacity:1; transform:none; }
  #supply .s05-concierge.is-accompany .s05-concierge-team { opacity:1; transform:none; }
  #supply .s05-concierge.is-handoff .s05-departure { opacity:1; transform:none; }
}
@media(min-width:769px) and (max-width:1000px) {
  #supply .s05-concierge-inner { column-gap:2%; grid-template-columns:1fr 1fr; }
  #supply .s05-concierge h3 { font-size:39px; }
  #supply .s05-concierge-team { grid-template-columns:auto 1fr; gap:10px; }
  #supply .s05-concierge-roles div { display:block; }
}
@media(max-width:768px) {
  #supply .s05-concierge-inner { display:flex; flex-direction:column; align-items:stretch; min-height:0; padding-block:44px 74px; }
  #supply .s05-concierge-kicker { margin-bottom:20px; font-size:10px; }
  #supply .s05-concierge h3 { font-size:clamp(32px,9vw,42px); line-height:1.3; }
  #supply .s05-concierge-promise { margin-top:18px; font-size:13px; }
  #supply .s05-concierge-copy { font-size:12px; margin-top:7px; }
  #supply .s05-car-figure { margin:0 -16px; align-self:stretch; }
  #supply .s05-car-stage { aspect-ratio:1.6; }
  #supply .s05-car-caption { margin:-13px 18px 0; font-size:9px; }
  #supply .s05-car-caption strong { font-size:9px; }
  #supply .s05-concierge-team { display:grid; margin-top:24px; padding-top:20px; grid-template-columns:73px 1fr; gap:17px; }
  #supply .s05-concierge-ratio { font-size:39px; }
  #supply .s05-concierge-roles {
    gap: 9px;
    justify-self: end;
    width: max-content;
    max-width: 100%;
  }
  #supply .s05-concierge-roles div {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    justify-items: end;
  }
  #supply .s05-concierge-roles dt,#supply .s05-concierge-roles dd { font-size:11px; }
  #supply .s05-departure { margin-top:8px; }
  #supply .s05-itinerary::before { background-position:38% center; opacity:.7; }
  #supply .s05-itinerary::after { background:linear-gradient(180deg,#f6f5f1 0%,#f6f5f1da 18%,#f6f5f180 45%,#f6f5f1bd 77%,#f6f5f1 100%); }
  #supply .s05-steps { border-color:#a6b199; }
  #supply .s05-step h4,#supply .s05-step p { text-shadow:0 1px 7px #f6f5f1,0 0 12px #f6f5f1; }
  #supply .s05-route-heading h3 { font-size:32px; }
  #supply .s05-concierge.has-sequence { height:auto; }
  #supply .s05-concierge.has-sequence .s05-concierge-inner { position:relative; top:auto; min-height:0; }
}
@media(prefers-reduced-motion:reduce) {
  #supply .s05-concierge.has-sequence { height:auto; }
  #supply .s05-concierge.has-sequence .s05-concierge-inner { position:relative; top:auto; min-height:0; }
  #supply .s05-car-scroll { display:none; }
  #supply .s05-concierge-promise,
  #supply .s05-concierge-copy,
  #supply .s05-concierge-team,
  #supply .s05-departure { opacity:1 !important; transform:none !important; }
}

#supply .s05-car-scroll[hidden] { display:none; }
#supply .s05-car-scroll { display:none; }
#supply .has-sequence .s05-car-scroll { display:flex; }
#supply .s05-car-scroll[hidden] { display:none; }
@media(prefers-reduced-motion:reduce) { #supply .has-sequence .s05-car-scroll { display:none; } }

@media(max-width:768px) {
  #supply .s05-route-pin .s05-itinerary { position:relative; }
}
@media(prefers-reduced-motion:reduce) {
  #supply .s05-route-pin .s05-itinerary { position:relative !important; }
}

#supply .s05-mobile-map-note { display:none; }
@media(max-width:768px) {
  #supply .s05-mobile-map-note { display:block; margin:25px 0 0; color:#687360; font-size:9px; line-height:1.8; }
}
