/* Photography and a quieter typographic hierarchy. Brand tokens live in styles.css. */
.breadcrumbs { padding-top: 25px; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 0; font-size: 12px; color: var(--muted); }
.breadcrumbs li + li { border-left: 1px solid var(--line); padding-left: 10px; }
.breadcrumbs a { text-decoration: underline; text-underline-offset: 4px; }
.breadcrumbs + .page-intro { padding-top: 38px; }
.buying-guide .principle p { margin-bottom: 22px; }
.buying-guide .text-link { font-size: 13px; line-height: 1.6; }
.import-checklist { display: grid; grid-template-columns: 1fr 1.1fr; gap: 70px; }
.import-checklist > div > p { margin-top: 24px; max-width: 430px; }
.import-checklist ol { margin: 0; padding-left: 24px; }
.import-checklist li { padding: 22px 0 22px 8px; border-top: 1px solid var(--line); }
.import-checklist li::marker { color: var(--red); font-weight: 600; }
.import-checklist h3 { font-size: 21px; margin-bottom: 12px; }
.import-checklist p { font-size: 15px; line-height: 1.85; }
.import-checklist p a, .context-links a { text-decoration: underline; text-underline-offset: 4px; }
.context-links { font-size: 14px; line-height: 1.9; margin-top: 24px; }
@media (max-width: 760px) {
  .import-checklist { grid-template-columns: 1fr; gap: 28px; }
  .breadcrumbs + .page-intro { padding-top: 28px; }
}
.hero { padding-top: 72px; padding-bottom: 64px; }
.hero-visual { margin-top: -30px; }
.hero .text-link { border-bottom: 1px solid var(--ink); }
.announcement a { text-decoration: underline; text-underline-offset: 4px; }
.button { gap: 12px; transition: background .2s, border-color .2s, color .2s; }
.button:hover, .button:hover > svg:last-child, .text-link:hover > svg:last-child { transform: none; }
.text-link { transition: color .2s, border-color .2s; }
.text-link:hover { color: var(--red); border-color: var(--red); }
.text-link.light:hover { color: #fff; border-color: #fff; }
.text-link:focus-visible { outline-offset: 4px; }
.values-strip > .container { justify-content: stretch; gap: 0; padding-block: 20px; }
.values-strip span { flex: 1; justify-content: center; font-size: 13px; font-weight: 500; letter-spacing: 0; }
.values-strip span + span { border-left: 1px solid #bec5b6; }
.principle h3 { margin-top: 0; }
.principle, .principle + .principle { padding-top: 30px; padding-bottom: 30px; }
.principles { border-bottom: 1px solid var(--line); }
.section-heading { margin-bottom: 38px; }
.service-card h2 { margin-top: 0; }
.service-card, .service-card:not(:nth-child(3n+1)) { padding-block: 32px; }
.price-breakdown > h3 { font-size: 20px; margin-bottom: 20px; }
.price-breakdown > div > span:first-child { display: flex; align-items: baseline; }
.price-breakdown small { flex-shrink: 0; }
.auction-sheet, .sheet-stamp { transform: none; }
.auction-sheet { box-shadow: none; border-color: #bbc0b5; }
.sheet-stamp { text-align: center; }
.partner-note { padding-block: 15px; }
.partner-note > p { margin: 0 !important; }
.faq-item summary > .disclosure-label { font-size: 26px; font-weight: 350; color: var(--red); transform: none; flex-shrink: 0; width: 26px; text-align: center; line-height: 1; }
.when-open, details[open] .when-closed { display: none; }
details[open] .when-open { display: inline; }
.faq-item[open] summary > .disclosure-label { color: var(--red); }
.footer-bottom > span:nth-child(2) { display: none; }

/* Images stay in the document flow with reserved dimensions, even before loading. */
figure { margin: 0; }
.editorial-photo { display: block; width: 100%; height: auto; object-fit: cover; background: var(--sage); }
figcaption { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; color: var(--muted); font-size: 11px; line-height: 1.5; padding-top: 14px; }
.place-story { display: grid; grid-template-columns: 1.4fr 1fr; column-gap: 76px; row-gap: 32px; }
.place-story-heading { grid-column: 1; }
.place-story h2 { font-size: clamp(32px, 3.6vw, 50px); }
.place-story h2 > span { color: var(--red); }
.place-tabs { grid-column: 2; display: flex; align-self: end; border-bottom: 1px solid var(--line); }
.place-tabs button { background: transparent; border: 0; border-bottom: 3px solid transparent; padding: 17px 18px; flex: 1; color: var(--muted); font-size: 13px; min-height: 54px; line-height: 1.4; }
.place-tabs button[aria-selected=true] { color: var(--ink); border-bottom-color: var(--red); }
.place-tabs button:hover { color: var(--red); background: #e9e9e150; }
.place-panel { grid-column: 1 / -1; display: grid; grid-template-columns: 1.4fr 1fr; gap: 76px; align-items: center; }
.place-photo { min-width: 0; }
.place-photo .editorial-photo { aspect-ratio: 16 / 10; }
.place-photo figcaption > span:last-child { font-size: 10px; }
.place-copy { padding-bottom: 30px; }
.place-copy h3 { font-size: 29px; font-variation-settings: 'wdth' 110; font-weight: 650; }
.place-copy p { font-size: 15px; line-height: 1.85; margin-top: 22px; max-width: 365px; }
.place-copy .text-link { margin-top: 25px; }
.js .place-panel:not([hidden]) .place-copy { animation: place-reveal .3s ease-out; }
@keyframes place-reveal { from { opacity: .35; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
#a-clearer-road { padding-top: 10px; }
.journey-photo { max-width: 600px; }
.journey-photo .editorial-photo { aspect-ratio: 640 / 375; }
.journey-photo figcaption { color: #c1c4bf; padding-top: 16px; }
.journey-photo figcaption > span { font-size: 10px; max-width: 165px; text-align: right; }
.timeline-ship { padding: 0; background: transparent; }
.timeline-ship figcaption { color: var(--muted); }
.journey-index { position: sticky; top: 101px; z-index: 5; background: var(--paper); }
.journey-index a { transition: background .2s, color .2s; }
.journey-index a[aria-current=step] { background: var(--sage); box-shadow: inset 0 -3px 0 var(--red); }
.journey-index a:first-child { padding-left: 20px; }
.timeline-step { scroll-margin-top: 225px; }
.step-number span { display: none; }
.road-editorial { display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; gap: 76px; margin-bottom: 60px; }
.road-editorial figure { min-width: 0; }
.road-editorial img { aspect-ratio: 16 / 10; }
.road-editorial > p { font-size: clamp(27px, 3vw, 42px); color: var(--ink); line-height: 1.15; letter-spacing: -.04em; font-variation-settings: 'wdth' 115; font-weight: 600; }
.about-manifesto { grid-template-columns: 1fr 1fr; gap: 70px; }
.home-city { align-self: stretch; display: flex; flex-direction: column; }
.home-city .editorial-photo { aspect-ratio: 4 / 3; }
.city-signature { font-size: 35px; line-height: 1.08; font-weight: 750; font-variation-settings: var(--wide); letter-spacing: -.045em; margin-top: 32px; }
.city-signature > span { color: var(--red); }
.contact-city { margin-block: 25px; }
.contact-city .editorial-photo { aspect-ratio: 16 / 9; }
.contact-city figcaption { padding-top: 10px; }
.whatsapp-card .button { gap: 10px; }
.cta-inner .text-link:hover { color: #fff; }
.inspection-section { display: grid; grid-template-columns: 1fr 1.1fr; gap: 90px; padding-bottom: 85px; }
.inspection-intro { border-top: 1px solid var(--line); padding-top: 30px; }
.inspection-intro h2 { font-size: clamp(32px, 3.6vw, 49px); }
.inspection-intro h2 span { color: var(--red); }
.inspection-intro > p { margin-top: 24px; font-size: 15px; line-height: 1.85; max-width: 450px; }
.inspection-points article { border-top: 1px solid var(--line); padding-block: 28px; }
.inspection-points article:last-child { padding-bottom: 0; }
.inspection-points h3 { font-size: 23px; }
.inspection-points p { font-size: 14px; line-height: 1.85; margin-top: 14px; }
.inspection-source { display: inline-block; font-size: 12px; margin-top: 16px; text-decoration: underline; text-underline-offset: 4px; }
.inspection-source:hover { color: var(--red); }
@media (min-width: 761px) and (max-width: 980px) {
  .journey-index { top: 87px; }
}
@media (max-width: 980px) {
  .place-story, .place-panel, .road-editorial { column-gap: 40px; grid-template-columns: 1.2fr 1fr; }
  .place-tabs button { font-size: 11px; padding-inline: 9px; }
  .place-copy h3 { font-size: 25px; }
  .place-copy p { font-size: 14px; }
  .place-photo figcaption > span:last-child { display: none; }
  .about-manifesto { gap: 40px; }
  .city-signature { font-size: 28px; }
  .inspection-section { gap: 40px; }
}
@media (max-width: 760px) {
  .announcement a { font-size: 9px; }
  .announcement { gap: 14px; }
  .hero { padding-top: 42px; padding-bottom: 25px; }
  .hero-visual { margin-top: 0; }
  .hero .button-row { gap: 20px; }
  .hero .text-link { padding-block: 9px; }
  .values-strip > .container { display: flex; padding-inline: 12px; padding-block: 19px; }
  .values-strip span { font-size: 9px; text-align: center; line-height: 1.5; white-space: normal; padding-inline: 8px; }
  .place-story { display: flex; flex-direction: column; gap: 24px; }
  .place-story h2 { font-size: 33px; }
  .place-tabs { align-self: stretch; }
  .place-tabs button { font-size: 13px; padding: 14px 9px; }
  .place-panel { display: flex; flex-direction: column; gap: 26px; align-items: stretch; }
  .place-photo .editorial-photo { aspect-ratio: 4 / 3; }
  .place-photo figcaption { font-size: 10px; padding-top: 10px; }
  .place-copy { padding-bottom: 0; }
  .place-copy h3 { font-size: 24px; }
  .place-copy p { margin-top: 14px; font-size: 14px; max-width: none; }
  .place-copy .text-link { margin-top: 12px; font-size: 13px; }
  .journey-photo { width: 100%; }
  .journey-photo figcaption { font-size: 10px; }
  .journey-photo figcaption > span { font-size: 9px; }
  .journey-preview { gap: 28px; }
  .journey-index { position: static; }
  .timeline-step { scroll-margin-top: 90px; }
  .road-editorial { grid-template-columns: 1fr; gap: 25px; margin-bottom: 40px; }
  .road-editorial > p { font-size: 28px; }
  .about-manifesto { grid-template-columns: 1fr; gap: 38px; }
  .home-city .editorial-photo { aspect-ratio: 16 / 10; }
  .city-signature { margin-top: 23px; font-size: 29px; }
  .notice-panel .text-link { margin-left: 0; }
  .partner-note { display: block; padding-top: 25px; }
  .principle, .principle + .principle { padding-block: 25px; }
  .principle:last-child { border-bottom: 0; }
  .enquiry-panel h2 { margin-bottom: 25px; }
  .faq-item summary > .disclosure-label { font-size: 24px; width: 24px; }
  .inspection-section { grid-template-columns: 1fr; gap: 28px; padding-bottom: 55px; }
  .inspection-intro { padding-top: 26px; }
  .inspection-intro > p { font-size: 14px; margin-top: 18px; }
  .inspection-points h3 { font-size: 21px; }
  .inspection-points p { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .js .place-panel:not([hidden]) .place-copy { animation: none; }
}