/* Services catalogue, 16 September 2026. Five lines, one visual each, offers as rows.
   Palette tokens only. Loaded after centered-navigation.css on services.html. */

::selection{background:var(--gold);color:var(--navy-deep)}

.catalogue-hero{padding-bottom:40px}
.catalogue-hero h1{margin-bottom:24px}

/* Jump list: one row, scrolls sideways on narrow screens, never wraps. */
.catalogue-jump{display:flex;gap:8px;margin-top:32px;overflow-x:auto;white-space:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.catalogue-jump::-webkit-scrollbar{display:none}
.catalogue-jump a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:8px;font-size:.9375rem;font-weight:500;color:var(--ivory);transition:border-color .15s,background-color .15s}
.catalogue-jump a:hover{border-color:var(--edge-strong,var(--muted));background:var(--navy-soft)}

/* Start here: one panel, three pill groups, results as the same rows. */
.start-here{margin-top:32px;padding:28px;border:1px solid var(--line);border-radius:12px;background:var(--navy-soft)}
.start-here[hidden],.start-here [hidden]{display:none}
.start-here h2{font-size:clamp(1.5rem,2.2vw,1.875rem);font-weight:500;line-height:1.12;letter-spacing:-.025em;color:var(--ivory)}
.start-here p{max-width:none;font-size:1rem;line-height:1.6;color:var(--muted)}
.start-here-lede{margin-top:8px}
.start-here-lede a{color:var(--gold-soft);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.start-here-lede a:hover{color:var(--gold)}
.start-here-question{margin:24px 0 0;padding:0;border:0;min-width:0}
.start-here-question legend{padding:0;margin-bottom:10px;font-size:.9375rem;font-weight:500;line-height:1.4;color:var(--ivory)}
.start-here-pills{display:flex;flex-wrap:wrap;gap:8px}
.start-here-pill{display:inline-flex;align-items:center;height:40px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ivory);font-size:.9375rem;font-weight:500;line-height:1;cursor:pointer;transition:border-color .15s,color .15s,background-color .15s}
.start-here-pill:hover{border-color:var(--edge-strong,var(--muted))}
.start-here-pill[aria-pressed=true]{border-color:var(--gold);color:var(--gold);background:var(--navy-soft)}
.start-here-pill:focus-visible,.start-here-clear:focus-visible,.start-here-actions a:focus-visible,.start-here-lede a:focus-visible,.start-here-note a:focus-visible{outline:2px solid var(--gold)!important;outline-offset:2px}
.start-here-results{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
.start-here .start-here-results-title{color:var(--ivory)}
.start-here-results .offer-rows{margin-top:12px}
.start-here-note{margin-top:16px;font-size:.9375rem}
.start-here-note a{color:var(--gold-soft);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.start-here-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;margin-top:16px;font-size:.9375rem}
.start-here-actions a{color:var(--gold-soft);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.start-here-actions a:hover,.start-here-note a:hover{color:var(--gold)}
.start-here-clear{padding:0;border:0;background:none;color:var(--muted);font-size:.9375rem;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;cursor:pointer}
.start-here-clear:hover{color:var(--ivory)}

.catalogue-controls{margin-top:24px}
.catalogue-controls input{max-width:480px;font-size:1rem;font-family:inherit}
.catalogue-controls input::placeholder{color:var(--muted)}
.catalogue-status{margin-top:12px;font-variant-numeric:tabular-nums}

/* Focus rings from gold, 2px offset. */
.catalogue-jump a:focus-visible,.catalogue-controls input:focus-visible,.offer-row>a:focus-visible,.line-band-from a:focus-visible,.catalogue-cta a:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:8px}

/* Bands */
.catalogue{padding-top:8px}
.line-band{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:56px;padding:64px 0;border-top:1px solid var(--line);scroll-margin-top:96px}
.line-band:first-of-type{border-top:0;padding-top:24px}
.line-band-visual{align-self:start;position:sticky;top:104px}
.line-band-visual img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.line-band-body{min-width:0}
.line-band h2{font-size:clamp(1.75rem,2.6vw,2.25rem);font-weight:500;line-height:1.12;letter-spacing:-.025em;color:var(--ivory)}
.line-band-intro{margin-top:12px;max-width:56ch;font-size:1rem;line-height:1.6;color:var(--muted)}
.line-band-from{margin-top:16px;font-size:.9375rem;line-height:1.6;color:var(--ivory);font-variant-numeric:tabular-nums}
.line-band-from a{color:var(--gold-soft);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.line-band-from a:hover{color:var(--gold)}

/* Rows: the whole row is the link. */
.offer-rows{list-style:none;margin:24px 0 0;padding:0;border-top:1px solid var(--line)}
.offer-row{border-bottom:1px solid var(--line)}
.offer-row>a{display:grid;grid-template-columns:minmax(0,1fr) minmax(9rem,auto);column-gap:24px;align-items:center;min-height:60px;padding:10px 0;color:inherit;text-decoration:none}
.offer-row h3{font-size:1.125rem;font-weight:600;line-height:1.25;letter-spacing:-.01em;color:var(--ivory);opacity:.86;transition:opacity .15s;text-wrap:pretty}
.offer-row p{font-size:.9375rem;line-height:1.45;color:var(--muted);margin-top:2px;text-wrap:pretty}
.offer-row-price{justify-self:end;max-width:14rem;text-align:end;font-size:.9375rem;line-height:1.35;font-weight:500;color:var(--ivory);font-variant-numeric:tabular-nums;transition:color .15s}
.offer-row-price small{display:block;font-size:.8125rem;font-weight:400;color:var(--muted);margin-top:2px}
.offer-row>a:hover h3{opacity:1}
.offer-row>a:hover .offer-row-price{color:var(--gold-soft)}
.offer-row>a:active{opacity:.75}

/* Fifth band: no visual, a two-column link list. */
.line-band-quiet{display:block}
.line-band-quiet .offer-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;border-top:0;margin-top:20px}
.line-band-quiet .offer-row:first-child,.line-band-quiet .offer-row:nth-child(2){border-top:1px solid var(--line)}
.line-band-quiet .offer-row>a{grid-template-columns:minmax(0,1fr);min-height:56px}
.line-band-quiet .line-band-intro{max-width:64ch}

.catalogue>#offer-empty{padding:32px 0;color:var(--muted);font-size:1rem}
.catalogue-cta{margin-top:56px}
.catalogue-cta h2{font-size:1.875rem}

@media(max-width:1050px){
  .line-band{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;padding:48px 0}
  .line-band-quiet .offer-rows{column-gap:32px}
}

@media(max-width:820px){
  .line-band{display:block;padding:40px 0}
  .line-band-visual{position:static;margin-bottom:24px}
  .line-band-visual img{height:200px;object-fit:cover;object-position:top}
  .line-band-quiet .offer-rows{grid-template-columns:1fr}
  .line-band-quiet .offer-row:nth-child(2){border-top:0}
}

@media(max-width:600px){
  .catalogue-hero{padding-bottom:28px}
  .start-here{margin-top:24px;padding:20px;border-radius:10px}
  .start-here-pill{font-size:.875rem;padding:0 14px}
  .catalogue-jump{margin:24px -22px 0;padding:0 22px 4px}
  .catalogue-jump a{min-height:40px;padding:0 14px;font-size:.875rem}
  .offer-row>a{grid-template-columns:minmax(0,1fr);row-gap:4px;padding:12px 0}
  .offer-row-price{justify-self:start;text-align:start;max-width:none;font-size:.875rem}
  .offer-row-price small{display:inline;margin:0 0 0 6px}
  .line-band-quiet .offer-row>a{min-height:52px}
}

@media(prefers-reduced-motion:reduce){
  .catalogue-jump a,.offer-row h3,.offer-row-price,.start-here-pill{transition:none}
}