/* CCC Site Factory base design system. Tokens are injected per site from site.json. */
:root{--ink:#1F2C42;--paper:#F7F4F0;--card:#FFFFFF;--wash:#EEE8DD;--line:#DCD4C6;--line-strong:#7A7466;--muted:#545C69;--signal:#F2A900;--signal-deep:#8A5700;--link:#1F2C42;--focus:#1F5FD0;--err:#B42318;}
@font-face{font-family:"Site";src:url(/assets/font.258a93fe93.woff2) format("woff2");font-weight:400 900;font-stretch:62% 125%;font-display:swap}
:root{
  --body:"Site",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
  --radius:14px;--maxw:1200px;--gutter:clamp(16px,4vw,40px);
  --step-0:clamp(1.0625rem,1rem + .25vw,1.1875rem);
  --step-1:clamp(1.25rem,1.1rem + .6vw,1.5rem);
  --step-2:clamp(1.6rem,1.3rem + 1.4vw,2.25rem);
  --step-3:clamp(2.1rem,1.6rem + 2.6vw,3.5rem);
  --step-4:clamp(2.6rem,1.8rem + 4.2vw,5.25rem);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:var(--step-0);line-height:1.6;font-variation-settings:"wdth" 100;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
picture{display:block}
a{color:var(--link);text-underline-offset:.18em;text-decoration-thickness:.08em}
a:hover{text-decoration-thickness:.14em}
h1,h2,h3{line-height:1.08;margin:0 0 var(--s4);font-weight:600;font-stretch:112%;letter-spacing:-.015em;text-wrap:balance}
h1{font-size:var(--step-4)}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-1);font-weight:600;line-height:1.2;letter-spacing:-.005em}
p{margin:0 0 var(--s4);max-width:66ch;text-wrap:pretty}
.lede{font-size:var(--step-1);line-height:1.5;max-width:52ch}
.eyebrow{font-size:.875rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin:0 0 var(--s3);color:var(--muted);font-stretch:118%}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.on-dark :focus-visible,.hero :focus-visible{outline-color:var(--signal)}
.skip{position:absolute;left:8px;top:-60px;z-index:100;background:var(--ink);color:var(--paper);padding:12px 16px;border-radius:8px;font-weight:600}
.skip:focus{top:8px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:48px;padding:.75em 1.35em;border-radius:999px;background:var(--signal);color:var(--ink);font-weight:600;text-decoration:none;border:2px solid var(--signal);font-stretch:108%;white-space:nowrap;transition:transform .2s var(--ease),background .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px -10px rgba(0,0,0,.45)}
.btn-ghost{background:transparent;color:inherit;border-color:currentColor}
.btn-sm{min-height:44px;padding:.5em 1.1em;font-size:.95rem}
.ctas{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s5)}

/* header */
.site-head{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.head-row{display:flex;align-items:center;gap:var(--s4);min-height:72px}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;min-height:44px}
.brand-word{font-weight:600;font-stretch:122%;letter-spacing:.01em;text-transform:uppercase;line-height:1;font-size:1.02rem;display:flex;flex-direction:column}
.brand-word span{font-weight:600;letter-spacing:.32em;font-size:.72rem;margin-top:3px;color:var(--muted)}
.menu{margin-left:auto;position:relative}
.menu summary{list-style:none;display:flex;align-items:center;gap:8px;min-height:44px;min-width:44px;padding:0 10px;cursor:pointer;border-radius:10px;font-weight:600}
.menu summary::-webkit-details-marker{display:none}
.burger,.burger::before,.burger::after{display:block;width:20px;height:2px;background:currentColor;border-radius:2px;position:relative}
.burger::before,.burger::after{content:"";position:absolute;left:0}
.burger::before{top:-6px}.burger::after{top:6px}
.menu nav{position:absolute;right:0;top:calc(100% + 10px);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 20px 40px -20px rgba(0,0,0,.35);padding:var(--s3);min-width:240px}
.menu ul{list-style:none;margin:0;padding:0}
.menu nav a{display:flex;align-items:center;min-height:44px;padding:0 var(--s3);border-radius:10px;color:var(--ink);text-decoration:none;font-weight:600;white-space:nowrap}
.menu nav a:hover{background:var(--wash)}
.menu nav a[aria-current=page]{box-shadow:inset 3px 0 0 var(--signal-deep);background:var(--wash)}
.head-actions{display:flex;align-items:center;gap:var(--s3)}
.head-tel{display:none;color:var(--ink);font-weight:600;text-decoration:none;min-height:44px;align-items:center;white-space:nowrap;font-variant-numeric:tabular-nums}
.nav-desk{display:none}
.nav-desk ul{list-style:none;margin:0;padding:0;display:flex;gap:2px}
.nav-desk a{display:flex;align-items:center;min-height:44px;padding:0 11px;color:var(--ink);text-decoration:none;font-weight:600;font-size:.97rem;white-space:nowrap}
.nav-desk a:hover{text-decoration:underline}
.nav-desk a[aria-current=page]{box-shadow:inset 0 -3px 0 var(--signal-deep)}
@media (min-width:1100px){
  .nav-desk{display:block;margin-left:auto}
  .menu{display:none}
  .head-tel{display:inline-flex}
}
@media (max-width:420px){.head-actions .btn-sm{padding:.5em .8em;font-size:.88rem}.menu-word{display:none}.brand-word{font-size:.86rem}.menu summary{padding:0 6px}}
.brand-word{white-space:nowrap}
h1 .l{display:block}
address{font-style:normal;line-height:1.7}
address a{display:inline-flex;align-items:center;min-height:44px}
.hero a:not(.btn){color:#fff}

/* hero */
.hero{position:relative;isolation:isolate;color:#fff;min-height:min(88svh,820px);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.hero-short{min-height:min(62svh,560px)}
.hero.no-img{min-height:auto;padding-top:var(--s8)}
.hero-img,.hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero-scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,12,16,0) 30%,rgba(10,12,16,.55) 62%,rgba(10,12,16,.88) 100%)}
.hero-body{padding-block:var(--s9) var(--s8);width:100%}
.hero .eyebrow{color:var(--signal)}
.hero h1{max-width:15ch;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.hero .lede{color:#F4F1EA}
.hero .btn-ghost{color:#fff}
.facts{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:var(--s5) 0 0;padding:0}
.facts li{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:6px 12px;border-radius:999px;font-size:.92rem;font-weight:600;color:#fff}
.hero-cap{font-size:.875rem;color:#E8E4DA;margin:var(--s4) 0 0}
.stripe{position:absolute;left:0;right:0;bottom:0;height:8px;background:linear-gradient(90deg,var(--signal) 0 72%,var(--ink) 72% 74%,var(--signal) 74%)}

/* bands */
.band{padding-block:clamp(56px,8vw,112px);position:relative}
.band + .band:not(.on-dark):not(.band-specs){border-top:1px solid var(--line)}
.on-dark{background:var(--ink);color:#F4F1EA}
.on-dark .eyebrow{color:var(--signal)}
.on-dark a:not(.btn){color:#fff}
.on-dark .btn{color:var(--ink)}
.on-dark .btn-ghost{color:#fff}
.on-dark .lede,.on-dark p{color:#E4E0D6}
.sec-head{margin-bottom:var(--s6);max-width:760px}

/* tiles */
.tiles{list-style:none;margin:0;padding:0;display:grid;gap:var(--s3);grid-template-columns:1fr}
@media (min-width:600px){.tiles{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.tiles{grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(220px,auto)}.tile-big{grid-column:span 2;grid-row:span 2}
  .tiles > li:last-child:nth-child(5){grid-column:span 2}
  .tiles > li:last-child:nth-child(5) img{aspect-ratio:auto;max-height:340px}}
@media (min-width:600px) and (max-width:899px){.tile-big{grid-column:1/-1}.tiles > li:last-child:nth-child(odd):not(.tile-big){grid-column:1/-1}}
.tile{min-width:0}
.tile a{position:relative;display:block;height:100%;border-radius:var(--radius);overflow:hidden;color:#fff;text-decoration:none;background:var(--ink)}
.tile picture,.tile img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.tile-big img{aspect-ratio:auto}
.tile-cap{position:absolute;left:0;right:0;bottom:0;padding:40px 16px 14px;background:linear-gradient(180deg,transparent,rgba(10,12,16,.85));font-weight:600;font-size:.98rem}
.tile a:hover img{transform:scale(1.03)}
.tile img{transition:transform .6s var(--ease)}

/* specs */
.band-specs{background:var(--wash)}
.specs{list-style:none;margin:0;padding:0;display:grid;gap:var(--s3);grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:900px){.specs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.spec{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s5);display:flex;flex-direction:column;gap:6px;min-width:0}
.spec-big{font-size:var(--step-3);font-weight:600;font-stretch:112%;line-height:1;letter-spacing:-.02em}
.spec-small{color:var(--muted);font-weight:600}
.spec-note{margin-top:var(--s5);font-size:1.05rem}

/* cards */
.cards{list-style:none;margin:0;padding:0;display:grid;gap:var(--s5);grid-template-columns:1fr}
@media (min-width:700px){.cards.cols-2,.cards.cols-3{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.cards.cols-3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;min-width:0}
.on-dark .card{background:#20242B;border-color:#343a44}
.card-img img{aspect-ratio:3/2;object-fit:cover;width:100%;height:auto}
.card-body{padding:var(--s5);display:flex;flex-direction:column;gap:2px;flex:1}
.card-body p{font-size:1rem}
.tag{display:inline-block;align-self:flex-start;background:var(--wash);color:var(--ink);font-size:.875rem;font-weight:600;padding:4px 10px;border-radius:999px;margin:auto 0 0}
.card-link{font-weight:600;margin-top:auto;min-height:44px;display:inline-flex;align-items:center;gap:.35em}
.split-fig.portrait img{aspect-ratio:4/5;object-position:50% 18%;max-height:640px}

/* route: the signature element, a transit line with stops */
.route{list-style:none;margin:0;padding:0;display:grid;gap:var(--s5);position:relative;counter-reset:stop}
@media (min-width:900px){.route{grid-template-columns:repeat(4,1fr);gap:var(--s4)}
  .route::before{content:"";position:absolute;left:12px;right:12px;top:11px;height:4px;background:var(--signal);border-radius:4px}}
@media (max-width:899px){.route{padding-left:36px}.route::before{content:"";position:absolute;left:10px;top:6px;bottom:6px;width:4px;background:var(--signal);border-radius:4px}}
.stop{position:relative;min-width:0}
.stop-dot{display:block;width:26px;height:26px;border-radius:50%;background:var(--paper);border:5px solid var(--ink);margin-bottom:var(--s4);position:relative;z-index:1}
@media (max-width:899px){.stop-dot{position:absolute;left:-36px;top:0;margin:0}}
.on-dark .stop-dot{background:var(--ink);border-color:var(--signal)}
.stop-n{font-size:.875rem;font-weight:600;letter-spacing:.12em;color:var(--muted);display:block;margin-bottom:4px}
.on-dark .stop-n{color:var(--signal)}
.stop p{font-size:1rem}

/* split */
.split{display:grid;gap:var(--s7);align-items:center}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr}.split-rev .split-fig{order:-1}}
.split-text,.split-fig{min-width:0}
.split-fig{margin:0}
.split-fig img{border-radius:var(--radius);width:100%;aspect-ratio:4/3;object-fit:cover;height:auto}
figcaption{font-size:.88rem;color:var(--muted);margin-top:var(--s2)}
.on-dark figcaption{color:#CFCABF}
.ticks{list-style:none;padding:0;margin:0 0 var(--s4)}
.ticks li{position:relative;padding-left:30px;margin-bottom:10px;max-width:60ch}
.ticks li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:8px;border-left:3px solid var(--signal-deep);border-bottom:3px solid var(--signal-deep);transform:rotate(-45deg)}
.on-dark .ticks li::before{border-color:var(--signal)}

/* moment */
.moment-grid{display:grid;gap:var(--s6);align-items:center}
@media (min-width:900px){.moment-grid{grid-template-columns:1.2fr 1fr}}
.moment figure{margin:0}
.moment img{border-radius:var(--radius);width:100%;height:auto}
.moment-line{font-size:var(--step-3);color:#fff;max-width:18ch}

/* table */
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
table{border-collapse:collapse;width:100%;min-width:520px;font-variant-numeric:tabular-nums}
caption{text-align:left;padding:var(--s4);font-weight:600}
th,td{text-align:left;padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{font-size:.875rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);background:var(--wash)}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}
.table-note{font-size:.95rem;color:var(--muted);margin-top:var(--s4)}

/* planner */
.planner-grid{display:grid;gap:var(--s6)}
.planner{display:grid;gap:var(--s4);background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s5)}
@media (min-width:900px){.planner{grid-template-columns:repeat(3,1fr)}.planner-out{grid-column:1/-1}}
.field label{display:block;font-weight:600;margin-bottom:6px;font-size:.98rem}
.field input{width:100%;min-height:48px;font:inherit;padding:10px 14px;border:2px solid var(--line-strong);border-radius:10px;background:#fff;color:var(--ink)}
.field input:focus-visible{border-color:var(--ink)}
.planner-out{display:block;background:var(--ink);color:#fff;border-radius:12px;padding:var(--s5);font-size:1.05rem}
.planner-out strong{color:var(--signal);font-size:1.25em}
.planner-out p{color:#EDE9DF;margin:0 0 6px}
.js-only{display:none}
html.js .js-only{display:grid}
html.js .planner-static{display:none}

/* faq */
.faq{display:grid;gap:var(--s3);max-width:860px}
.qa{border:1px solid var(--line);border-radius:12px;background:var(--card)}
.qa summary{cursor:pointer;list-style:none;padding:var(--s4) var(--s5);display:flex;justify-content:space-between;gap:var(--s4);align-items:center;min-height:56px}
.qa summary::-webkit-details-marker{display:none}
.qa summary h3{font-size:1.1rem;margin:0;font-stretch:104%}
.qa summary::after{content:"+";font-size:1.6rem;font-weight:600;line-height:1;flex:none;transition:transform .2s}
.qa[open] summary::after{transform:rotate(45deg)}
.qa-a{padding:0 var(--s5) var(--s4)}

/* strip (the family) */
.strip{list-style:none;margin:0;padding:0 0 8px;display:grid;gap:var(--s4);grid-auto-flow:column;grid-auto-columns:minmax(260px,82%);overflow-x:auto;scroll-snap-type:x mandatory}
.strip > li{scroll-snap-align:start}
@media (min-width:900px){.strip{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);overflow:visible}}
.strip-card a{color:inherit;text-decoration:none;display:flex;flex-direction:column;height:100%}
.strip-card h3{margin-top:8px}

/* prose and sources */
.prose p{font-size:1.08rem}
.sources{padding-left:1.2em}
.sources li{margin-bottom:8px;font-size:.95rem}

/* cta band */
.cta-band{overflow:hidden}
.cta-inner{text-align:left;padding-bottom:var(--s4)}
.cta-inner h2{color:#fff;max-width:18ch}
.cta-band .btn-ghost{color:#fff}

/* form */
.band-form{background:var(--wash)}
.form-split{align-items:start}
.form-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s5);box-shadow:0 20px 50px -30px rgba(0,0,0,.35)}
#tripleseat_link{font-size:.875rem;color:var(--muted)}
#tripleseat_embed_form_inline{font-family:var(--body);color:var(--ink)}
#tripleseat_embed_form_inline h2,#tripleseat_embed_form_inline .row_contact_header,#tripleseat_embed_form_inline .row_details_header{font-size:1.15rem;font-weight:600;margin:var(--s5) 0 var(--s3);letter-spacing:0;font-stretch:106%}
#tripleseat_embed_form_inline h2:first-of-type{margin-top:0}
#tripleseat_embed_form_inline .tripleseat_field_section{display:block;width:100%}
#tripleseat_embed_form_inline .tripleseat_field{display:block;width:100%;margin-bottom:var(--s4)}
#tripleseat_embed_form_inline label{display:block;font-weight:600;margin-bottom:6px;font-size:.98rem}
#tripleseat_embed_form_inline label em{font-weight:400;font-style:normal;color:var(--muted);margin-left:6px;font-size:.9rem}
#tripleseat_embed_form_inline label .required{color:var(--err);margin-left:2px}
#tripleseat_embed_form_inline input[type=text],#tripleseat_embed_form_inline input[type=email],#tripleseat_embed_form_inline input[type=tel],#tripleseat_embed_form_inline input[type=number],#tripleseat_embed_form_inline input.text,#tripleseat_embed_form_inline select,#tripleseat_embed_form_inline textarea,#tripleseat_embed_form_inline .timeselect_input{width:100%;min-height:48px;font:inherit;font-size:1rem;padding:10px 14px;border:2px solid var(--line-strong);border-radius:10px;background:#fff;color:var(--ink)}
#tripleseat_embed_form_inline textarea{min-height:110px;resize:vertical}
#tripleseat_embed_form_inline input:focus,#tripleseat_embed_form_inline select:focus,#tripleseat_embed_form_inline textarea:focus{border-color:var(--ink);outline:3px solid var(--focus);outline-offset:2px}
#tripleseat_embed_form_inline input[type=submit],#tripleseat_embed_form_inline #lead_submit,#tripleseat_embed_form_inline .button{min-height:52px;padding:.8em 1.6em;border-radius:999px;background:var(--signal);color:var(--ink);border:2px solid var(--signal);font:inherit;font-weight:600;cursor:pointer;width:100%}
#tripleseat_embed_form_inline input[name=website]{position:absolute;left:-9999px}
#tripleseat_embed_form_inline .col-sm-4,#tripleseat_embed_form_inline .control-label{width:auto;float:none;padding:0;text-align:left}
#ui-datepicker-div{max-width:calc(100vw - 16px);z-index:9999;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px}
#ui-datepicker-div table{min-width:0}

/* footer */
.site-foot{padding-block:var(--s8) var(--s5);background:var(--ink)}
.site-foot a{color:#fff}
.brand-foot{color:#fff}
.brand-foot .brand-word span{color:#CFCABF}
.foot-grid{display:grid;gap:var(--s6)}
@media (min-width:800px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr}}
.foot-h{font-size:.875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--signal);margin:0 0 var(--s3);font-weight:600}
.site-foot ul{list-style:none;margin:0 0 var(--s5);padding:0}
.site-foot li a{display:inline-flex;min-height:36px;align-items:center}
.foot-legal{border-top:1px solid #343a44;margin-top:var(--s6);padding-top:var(--s4)}
.foot-legal p{font-size:.875rem;color:#BDB8AD;max-width:none}

/* motion: felt, never required */
@media (prefers-reduced-motion:no-preference){
  html.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
  html.js .reveal.in{opacity:1;transform:none}
  .hero-img img{animation:settle 9s var(--ease) both}
  @keyframes settle{from{transform:scale(1.06)}to{transform:scale(1)}}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;scroll-behavior:auto !important}}
@media print{.site-head,.hero-scrim,.stripe,.cta-band,.band-form{display:none}.hero{min-height:0;color:#000}.hero-img{position:static}}
.ready-h{font-size:var(--step-1);margin-top:var(--s5)}
/* tables become stacked cards on a phone: no sideways scrolling for the buyer */
@media (max-width:639px){
  .tablewrap{overflow:visible;border:0;background:none}
  .tablewrap table{min-width:0}
  .tablewrap thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .tablewrap tbody tr{display:block;background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:var(--s3);padding:var(--s2) 0}
  .tablewrap tbody th,.tablewrap tbody td{display:flex;justify-content:space-between;gap:var(--s4);border:0;padding:8px 16px}
  .tablewrap tbody th{font-size:1.08rem}
  .tablewrap tbody td::before{content:attr(data-label);color:var(--muted);font-weight:600;font-size:.9rem;flex:0 0 45%}
  .tablewrap tbody td{text-align:right}
  .tablewrap caption{padding:0 0 var(--s3)}
}
p,li,address,dd,figcaption{overflow-wrap:anywhere}
.tablewrap a{display:inline-flex;align-items:center;min-height:44px}
.lbl-short{display:none}
@media (max-width:380px){.head-actions .lbl-long{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.head-actions .lbl-short{display:inline}}
.split > *{min-width:0}
#tripleseat_embed_form_inline, #tripleseat_embed_form_inline *{max-width:100%;box-sizing:border-box}
@media (max-width:380px){.form-card{padding:var(--s4)}}
.specs > li:last-child:nth-child(odd){grid-column:1/-1}
@media (min-width:900px){.specs > li:last-child:nth-child(odd){grid-column:auto}}

/* round 2: hero label reads on any photo; no-JS planner table stays inside a phone */
.hero .eyebrow{display:inline-block;background:rgba(10,12,16,.78);padding:5px 10px;border-radius:6px}
.planner-static table{min-width:0}
#ui-datepicker-div{font-size:1rem}
/* round 2: the scrim is measured against real photo pixels now (runtime gate hero_pixels). Darken where the text sits:
   a bottom-weighted wash on every width, plus a left-weighted wash on wide screens where the text column is on the left. */
.hero-scrim{background:linear-gradient(180deg,rgba(10,12,16,.30) 0%,rgba(10,12,16,.62) 38%,rgba(10,12,16,.86) 70%,rgba(10,12,16,.94) 100%)}
@media (min-width:900px){.hero-scrim{background:linear-gradient(90deg,rgba(10,12,16,.90) 0%,rgba(10,12,16,.78) 42%,rgba(10,12,16,.25) 75%,rgba(10,12,16,.10) 100%),linear-gradient(180deg,rgba(10,12,16,0) 55%,rgba(10,12,16,.55) 100%)}}
.hero h1,.hero .lede{text-shadow:0 1px 18px rgba(0,0,0,.45)}
/* third-party frames (reCAPTCHA inside the booking form) take keyboard focus; give them a visible ring too */
iframe:focus-visible,iframe:focus{outline:3px solid var(--focus);outline-offset:3px}
/* our own ring around the reCAPTCHA checkbox: Google's in-frame ring does not show on every browser (CI, Linux) */
#tripleseat_embed_form_inline div:has(> iframe):focus-within{outline:3px solid var(--focus);outline-offset:4px;border-radius:4px}

/* round 3: on a phone the photo is the product, so it sits above the words instead of under them */
@media (max-width:599px){
  .hero{display:block;min-height:0;background:var(--ink)}
  .hero-img,.hero-img img{position:static;height:auto;aspect-ratio:4/3;width:100%;object-fit:cover}
  .hero-short .hero-img img{aspect-ratio:16/10}
  .hero-scrim{display:none}
  .hero-body{padding-block:var(--s5) var(--s7)}
  .hero .eyebrow{background:none;padding:0}
}
/* with JavaScript off the booking card would be empty: hide it, the noscript card carries the phone and email */
html:not(.js) #ts-slot{display:none}
/* round 4: captions on photos were measured at 3.05-4.34:1 against the real pixels (bright skies). A solid band, not a fade. */
.tile-cap{background:rgba(10,12,16,.86);padding:10px 14px;left:0;right:0;bottom:0}

/* round 5: stat grids fill every row at every width (grader E: a lone leftover tile) */
.specs{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
@media (min-width:900px){.specs{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}}
.specs > li:last-child:nth-child(odd){grid-column:auto}
.planner{grid-template-columns:1fr}
@media (min-width:900px){.planner{grid-template-columns:repeat(2,1fr)}}

/* round 6: call and text first */
.head-call{display:none}
@media (max-width:1099px){.head-call{display:inline-flex}}
@media (max-width:420px){.head-call{padding:.5em .7em}}
@media (min-width:1100px){.nav-desk{display:none}.menu{display:block}}
@media (min-width:1240px){.nav-desk{display:block;margin-left:auto}.menu{display:none}}
.cta-more{display:inline-flex;align-items:center;min-height:48px;color:#fff;font-weight:600;text-underline-offset:.2em}
.band:not(.on-dark) .cta-more{color:var(--ink)}
/* round 6b: Call + Text + menu + brand must fit a 320 px phone (runtime gate A11Y-11) */
@media (max-width:480px){
  .head-row{gap:8px}
  .head-actions{gap:6px}
  .head-actions .lbl-long{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .head-actions .lbl-short{display:inline}
  .head-actions .btn-sm{padding:.5em .75em;font-size:.9rem}
  .menu summary{padding:0 4px}
}
@media (max-width:360px){.brand-mark svg{width:32px}.brand-word{font-size:.8rem}.brand-word span{letter-spacing:.2em}}
@media (max-width:340px){.site-head .wrap{padding-inline:12px}.head-actions .btn-sm{padding:.5em .6em}}

/* endorsed-brand line under the footer wordmark: small caps, neutral grey, behind a hairline, 12px minimum (endorsed-brand lockup practice); the header keeps the plain wordmark so its buttons always fit */
.brand-word .brand-endorse{display:block;margin-top:6px;padding-top:5px;border-top:1px solid var(--line);font-size:.75rem;font-weight:600;letter-spacing:.08em;color:var(--muted);font-stretch:100%}
.brand-foot .brand-word .brand-endorse{color:#CFCABF;border-top-color:rgba(255,255,255,.28)}
.site-head .brand-endorse{display:none}

/* reviews: exact quotes, stars carry a text alternative */
.reviews{display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));margin:0;padding:0}
.review figure{margin:0;height:100%;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s3)}
.review .stars{margin:0;color:var(--signal-deep);letter-spacing:.12em;font-size:1.05rem}
.review blockquote{margin:0;flex:1}.review blockquote p{margin:0;font-size:1.05rem;line-height:1.5}
.review figcaption{font-size:.9rem;color:var(--muted)}

/* ===== Design pass r8, 2026-09-27 (Bobby: "feels a bit amateur, hype this up"; the photo grid is unbalanced).
   Win the reader in two seconds: the designed logo, a hero photo at full strength with a bottom-third scrim only,
   balanced grids, the leaning stripe from the logo as the site's signature, the key numbers in a bold dark band. ===== */

/* designed logo (brand.logo in site.json): the SVG lockup replaces the drawn mark */
.brand-lockup{display:flex;flex-direction:column;gap:6px}
.brand-logo{display:block;height:40px;width:auto}
.brand-foot .brand-logo{height:52px}
@media (max-width:480px){.site-head .brand-logo{height:31px}}
@media (max-width:360px){.site-head .brand-logo{height:26px}}
.brand-lockup .brand-endorse{display:block;margin-top:2px;padding-top:6px;border-top:1px solid rgba(255,255,255,.28);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#CFCABF;font-stretch:100%;max-width:max-content}

/* the signature: a short leaning stripe before every section eyebrow */
.eyebrow{display:flex;align-items:center;gap:.7em}
.eyebrow::before{content:"";flex:0 0 auto;width:30px;height:10px;background:var(--signal);clip-path:polygon(0 0,70% 0,100% 100%,0 100%)}

/* hero: the photograph at full strength; only the bottom third darkens so the type still measures */
.hero-scrim{background:linear-gradient(180deg,rgba(15,22,34,0) 38%,rgba(15,22,34,.5) 60%,rgba(15,22,34,.9) 100%)}
.hero h1{font-size:clamp(2.9rem,1.7rem + 5.4vw,6.25rem);max-width:13ch;letter-spacing:-.025em;font-stretch:118%}
.hero .eyebrow{color:#fff}
.stripe{height:14px;background:var(--signal);clip-path:polygon(0 0,calc(100% - 64px) 0,100% 100%,0 100%);left:0;right:18%}

/* headings a step bigger and wider everywhere: confident, not a document */
h2{font-size:clamp(2.3rem,1.6rem + 3vw,4rem);font-stretch:118%;letter-spacing:-.025em}

/* the bus photos: balanced mosaic for four (big left, two stacked right, the wide shot across the bottom) */
@media (min-width:900px){
  .tiles:has(> li:nth-child(4):last-child){grid-template-columns:2fr 1fr;grid-auto-rows:178px}
  .tiles:has(> li:nth-child(4):last-child) > li:nth-child(1){grid-column:1;grid-row:1 / span 3}
  .tiles:has(> li:nth-child(4):last-child) > li:nth-child(n+2){grid-column:2}
  .tiles:has(> li:nth-child(4):last-child) img{aspect-ratio:auto;height:100%}
}
@media (min-width:600px) and (max-width:899px){
  .tiles:has(> li:nth-child(4):last-child) > li:nth-child(4){grid-column:1 / -1}
}
.tile-cap{font-size:1.02rem;padding:56px 18px 16px}

/* the numbers: a bold dark band, amber figures (7:1 on navy) */
.band-specs{background:var(--ink);color:#F4F1EA}
.band-specs h2{color:#fff}
.band-specs .eyebrow{color:var(--signal)}
.band-specs .spec{background:transparent;border:0;border-top:3px solid var(--signal);border-radius:0;padding:var(--s4) 0 0}
.band-specs .spec-big{color:var(--signal);font-size:clamp(3rem,2rem + 3.4vw,4.75rem);font-stretch:122%}
.band-specs .spec-small{color:#E4E0D6;font-size:1rem}
.band-specs .spec-note{color:#E4E0D6}
.band-specs a:not(.btn){color:#fff}
.band + .band-specs,.band-specs + .band{border-top:0}

/* reviews: no stray bullets; four sit in a 2 x 2, never three and an orphan */
.reviews{list-style:none}
@media (min-width:760px){.reviews:has(> li:nth-child(4):last-child),.reviews:has(> li:nth-child(2):last-child){grid-template-columns:1fr 1fr}}
.review figure{position:relative;padding:var(--s5);border:0;border-left:6px solid var(--signal);border-radius:var(--radius)}
.review blockquote p{font-size:clamp(1.15rem,1rem + .5vw,1.35rem);font-weight:600;line-height:1.4}
.band-reviews .note,.reviews + .note{font-size:.95rem;color:var(--muted);margin-top:var(--s4)}

/* cards and tiles lift a little under the pointer; photos fill the card top */
@media (prefers-reduced-motion:no-preference){
  .card{transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
  .card:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(15,22,34,.45)}
}
.card{border:0;box-shadow:0 1px 0 var(--line),0 10px 30px -24px rgba(15,22,34,.35)}

/* closing call band: the stripe runs across its top edge */
.cta-band{position:relative}
.cta-band::before{content:"";position:absolute;left:0;top:0;width:min(62%,760px);height:12px;background:var(--signal);clip-path:polygon(0 0,100% 0,calc(100% - 48px) 100%,0 100%)}
/* photo captions as a compact navy label in the corner, so the photograph stays the picture */
.tile-cap{left:14px;right:auto;bottom:14px;max-width:calc(100% - 28px);padding:8px 14px;border-radius:10px;background:var(--ink);font-size:.95rem;line-height:1.3}
/* r8 fixes from the runtime gate: the photo stays full strength where the bus is (right); the text side (left) and the
   bottom third darken so white type measures at least 3:1 at every width; the logos fit a 320px phone */
.hero-scrim{background:
  linear-gradient(90deg,rgba(15,22,34,.82) 0%,rgba(15,22,34,.62) 38%,rgba(15,22,34,.18) 66%,rgba(15,22,34,0) 82%),
  linear-gradient(180deg,rgba(15,22,34,0) 30%,rgba(15,22,34,.45) 62%,rgba(15,22,34,.88) 100%)}
@media (max-width:899px){.hero-scrim{background:linear-gradient(180deg,rgba(15,22,34,.35) 0%,rgba(15,22,34,.6) 40%,rgba(15,22,34,.9) 100%)}}
@media (max-width:360px){.site-head .brand-logo{height:21px}}
.brand-foot .brand-logo{height:auto;width:min(300px,100%)}

/* ===== Polish r10, 2026-09-27: calm premium (elite-site benchmark: Blacklane, Wheels Up, Soho House, Aman, Ace Hotel,
   Linear, Stripe, Revel, measured with Playwright). Findings: display type at regular-to-medium weight, 2-3 weights total,
   one button shape, no fact chips, labels only where they help, photos big with few captions, flow from photos and white
   space rather than stripes and colour bands. This block overrides the louder r8 treatments above it. ===== */

/* type: one heading weight, calmer sizes, less stretch */
h1,h2,h3{font-weight:600;font-stretch:106%;letter-spacing:-.018em}
h1{font-size:clamp(2.4rem,1.7rem + 3vw,4.25rem)}
.hero h1{font-size:clamp(2.5rem,1.6rem + 3.6vw,4.5rem);max-width:16ch;letter-spacing:-.02em;font-stretch:106%}
h2{font-size:clamp(1.9rem,1.45rem + 1.7vw,3rem);font-stretch:106%;letter-spacing:-.018em}
h3{font-weight:600}
strong,b{font-weight:600}
.btn{font-weight:600;font-stretch:100%}

/* labels: only the hero keeps one, and it loses the stripe tick and the dark box */
.eyebrow::before{content:none}
.hero .eyebrow{background:none;padding:0;color:#fff;letter-spacing:.12em;font-size:.875rem;font-weight:600}

/* one amber stripe on the site: under the hero; none above the closing band */
.cta-band::before{content:none}

/* photo captions sit under the photo in plain text, not as chips on it */
.tile a{display:flex;flex-direction:column;background:transparent;color:var(--ink);height:100%}
.tile picture{flex:1 1 auto;min-height:0;border-radius:var(--radius);overflow:hidden;display:block}
.tile-cap{position:static;left:auto;bottom:auto;max-width:none;padding:10px 2px 0;background:none;border-radius:0;color:var(--muted);font-weight:600;font-size:.95rem}
@media (min-width:900px){.tiles:has(> li:nth-child(4):last-child){grid-auto-rows:196px}}

/* the numbers: back to a quiet light band (the benchmark sites put facts in sentences, not stat rows) */
.band-specs{background:var(--wash);color:var(--ink)}
.band-specs h2{color:var(--ink)}
.band-specs .spec{border-top:2px solid var(--ink)}
.band-specs .spec-big{color:var(--ink);font-weight:600;font-size:clamp(2.2rem,1.6rem + 2vw,3.25rem);font-stretch:106%}
.band-specs .spec-small,.band-specs .spec-note{color:var(--muted)}
.band-specs a:not(.btn){color:var(--ink)}

/* reviews: plain cards, no amber rule; stars small */
.review figure{border-left:0;border:1px solid var(--line);box-shadow:none}
.review blockquote p{font-weight:600}
.review .stars{font-size:.9rem;letter-spacing:.08em}

/* cards: one soft surface, no lift */
.card{box-shadow:none;border:1px solid var(--line)}
@media (prefers-reduced-motion:no-preference){.card:hover{transform:none;box-shadow:0 12px 32px -24px rgba(15,22,34,.35)}}

/* a text link does nothing on most computers: show Text on phones, the booking page on computers */
.only-desk{display:none}
@media (hover:hover) and (pointer:fine) and (min-width:900px){.only-touch{display:none}.only-desk{display:inline-flex}}

/* Polish r10b: benchmark rules 17, 18 and 24: amber only fills the main button (and lives in the logo); no stripes */
.stripe{display:none}
.review .stars{color:var(--ink)}
.foot-h{color:#CFCABF}
.band-specs .eyebrow{color:var(--muted)}