/* Approved fare example and practical dock tips. */
    .fare-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,7vw,110px); align-items:center; }
    .fare-copy > .eyebrow { color:var(--accent-text); }
    .fare-copy h2 { font-size:clamp(42px,4.8vw,66px); }
    .fare-intro { color:var(--muted); font-size:18px; line-height:1.7; margin-top:25px; max-width:430px; }
    .fare-points { list-style:none; display:grid; gap:17px; margin-top:30px; }
    .fare-points li { display:flex; gap:15px; align-items:baseline; font-size:14px; }
    .fare-points span { color:var(--accent-text); font-size:11px; font-weight:700; }
    .fare-note { color:var(--muted); font-size:12px; margin-top:29px; }
    .fare-demo { border:1px solid #d8dfdf; border-radius:22px; background:var(--paper); box-shadow:0 20px 55px -38px #17364e55; overflow:hidden; }
    .demo-header { background:#e5edf8; padding:22px 26px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
    .demo-header p { font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:#53728a; font-weight:700; margin-bottom:5px; }
    .demo-header strong { color:#102b35; font-size:17px; letter-spacing:-.025em; }
    .demo-header strong span { color:#1e6fe0; padding-inline:10px; }
    .demo-badge { color:#416378; border:1px solid #c7d6e7; border-radius:20px; font-size:9px; padding:5px 10px; white-space:nowrap; }
    .demo-body { padding:26px; }
    .offer-row { display:flex; align-items:center; gap:14px; }
    .offer-avatar { flex:none; width:39px; height:39px; border-radius:50%; display:grid; place-items:center; color:#1e6fe0; background:#e7effc; }
    .offer-avatar svg { width:20px; height:20px; }
    .offer-label { flex:1; }
    .offer-label strong { display:block; font-size:14px; }
    .offer-label small { display:block; font-size:11px; color:var(--muted); }
    .offer-price { font-size:29px; font-weight:750; letter-spacing:-.045em; line-height:1; }
    .reply-line { margin:11px 0 11px 19px; height:26px; border-left:1px dashed #b8c8cd; }
    .captain-avatar { background:#e5ecdf; color:#506b4e; }
    .captain-price { color:var(--accent-text); }
    .choice-box { margin-top:25px; padding:22px 20px 19px; border-radius:14px; background:#f2f4ef; }
    .choice-box h3 { font-size:19px; letter-spacing:-.025em; margin-bottom:8px; }
    .choice-box p { font-size:12px; color:var(--muted); line-height:1.6; min-height:39px; }
    .choice-actions { display:flex; gap:9px; margin-top:16px; }
    .choice-actions button { flex:1; min-height:43px; padding:9px 12px; border-radius:8px; border:1px solid #bac8c7; background:transparent; color:#28434d; font-size:12px; font-weight:650; }
    .choice-actions .accept { background:#1e6fe0; border-color:#1e6fe0; color:white; }
    .choice-actions button:hover { filter:brightness(.95); }
    .choice-actions button:disabled { cursor:default; opacity:.55; }
    .demo-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:17px; }
    .demo-footer span { font-size:10px; color:var(--muted); }
    .reset-demo { border:0; padding:4px 0; background:transparent; color:var(--accent-text); font-size:11px; text-decoration:underline; text-underline-offset:3px; }
    .example-note { text-align:center; margin-top:11px; font-size:10px; color:var(--muted); }

.fare-section { padding-bottom:0; }
.fare-grid > div { min-width:0; }
.demo-footer { flex-wrap:wrap; }
@media(max-width:900px) { .fare-grid {gap:35px;} .demo-header,.demo-body {padding:20px;} .fare-intro {font-size:16px;} .demo-header strong {font-size:15px;} .demo-badge {display:none;} }
@media(max-width:699px) { .fare-grid {grid-template-columns:1fr;gap:32px;} .fare-copy h2 {font-size:48px;} .fare-intro {max-width:100%;} .fare-note {margin-top:20px;} .choice-actions {gap:7px;} .choice-actions button {font-size:11px;} }
[data-theme="dark"] .fare-demo { --text:#102b35; --muted:#536165; --accent-text:#195ebf; --paper:#fffdf8; color:var(--text); }
.trip-tips { margin:66px 0 60px; padding-top:34px; border-top:1px solid var(--outline); }
.trip-tips-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:31px; }
.trip-tips-heading .eyebrow { color:var(--accent-text); margin-bottom:13px; font-size:10px; }
.trip-tips-heading h2 { font-size:clamp(30px,3vw,42px); }
.trip-tips-heading > p { max-width:245px; color:var(--muted); font-size:13px; line-height:1.7; }
.trip-tips-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:34px; }
.trip-tip { padding-top:22px; border-top:1px solid var(--outline); }
.tip-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:13px; margin-bottom:19px; background:#e4ecf7; color:#1e6fe0; }
.tip-icon svg { width:24px; height:24px; }
.tip-stops {background:#efe6d5;color:#8c6b3b;}
.tip-return {background:#e2ebde;color:#4d7156;}
.trip-tip h3 {font-size:21px;letter-spacing:-.03em;line-height:1.2;margin-bottom:12px;}
.trip-tip p {font-size:14px;line-height:1.75;color:var(--muted);max-width:345px;}
@media(max-width:699px) {
 .trip-tips {margin-top:45px;}
 .trip-tips-heading {display:block;margin-bottom:25px;}
 .trip-tips-heading > p {margin-top:16px;max-width:100%;}
 .trip-tips-grid {grid-template-columns:1fr;gap:25px;}
 .trip-tip {display:grid;grid-template-columns:44px 1fr;gap:13px 17px;}
 .tip-icon {grid-row:1 / 3;margin:0;}
 .trip-tip h3 {margin:0;align-self:center;}
 .trip-tip p {grid-column:2;font-size:13px;}
}