/* Towing guide: editorial content with progressively enhanced tools. */
.gp-towing .gp-tow-hero { padding-block: clamp(32px,5vw,72px); border: 0; }
.gp-tow-hero { display:grid; gap:32px; align-items:center; }
.gp-tow-hero h1 { font-size:clamp(2rem,3.7vw,3.5rem); }
.gp-tow-hero > figure img { width:100%; aspect-ratio:16/9; object-fit:cover; }
.gp-tow-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; padding:24px; background:var(--gp-brand); color:white; border-radius:var(--gp-radius-content); }
.gp-towing .gp-tow-facts p { margin:0; color:white; font-size:.85rem; }
.gp-tow-facts strong { font-size:1rem; }
.gp-tow-nav { display:flex; overflow-x:auto; gap:8px; padding:20px 0; scrollbar-width:thin; }
.gp-tow-nav a { flex:none; padding:10px 12px; font-size:.875rem; font-weight:650; }
.gp-tow-split,.gp-tow-two,.gp-tow-steps,.gp-tow-loading,.gp-tow-advice { display:grid; gap:24px; }
.gp-tow-split,.gp-tow-two,.gp-tow-loading { margin-top:32px; }
.gp-tow-split > * { min-width:0; }
.gp-tow-card,.gp-tow-panel,.gp-tow-loading-card { padding:24px; border:1px solid var(--gp-rule); border-radius:var(--gp-radius-content); }
.gp-towing .gp-tow-card > :last-child,.gp-towing .gp-tow-panel > :last-child { margin-bottom:0; }
.gp-tow-card h3,.gp-tow-loading-card h3 { font-size:clamp(1.1rem,1.7vw,1.4rem); }
.gp-tow-icon { margin-bottom:14px; }
.gp-towing .gp-tow-stat { color:var(--gp-brand); font-size:clamp(1.9rem,3vw,2.8rem); font-weight:750; line-height:1.2; margin-block:16px; }
.gp-tow-panel { align-self:start; background:#f6faf6; }
.gp-tow-note { margin-block:24px; padding:20px 24px; border-left:3px solid var(--gp-brand); background:#f6faf6; border-radius:0 12px 12px 0; }
.gp-towing .gp-tow-note p:last-child { margin-bottom:0; }
.gp-tow-note h3 { font-size:1.1rem; }
.gp-tow-document { align-self:start; margin:0; }
.gp-tow-document img { width:100%; max-height:560px; object-fit:contain; background:#f7f8f7; }
.gp-tow-document a { display:block; cursor:zoom-in; }
.gp-tow-document a::after { content:'Tap or click to enlarge'; display:block; padding:10px; font-size:.8rem; text-align:center; }
.gp-tow-disclosures,.gp-tow-faqs { margin-top:28px; }
.gp-towing .gp-tow-takeaway { color:var(--gp-forest); font-weight:650; }
.gp-tow-calculator:not([hidden]) { display:grid; gap:20px; margin-block:24px; }
.gp-tow-calculator label { display:grid; gap:8px; font-weight:650; }
.gp-tow-calculator input { width:100%; min-width:0; box-sizing:border-box; border:1px solid #a8b7ac; background:white; border-radius:8px; padding:14px; font:inherit; }
.gp-tow-calculator button,.gp-tow-loading-controls button,.gp-tow-zoom button { min-height:44px; border:1px solid var(--gp-brand); border-radius:6px; background:var(--gp-brand); color:white; padding:12px 16px; font:inherit; font-weight:650; cursor:pointer; }
.gp-tow-calculator button:hover,.gp-tow-zoom button:hover { background:white; color:var(--gp-brand); }
.gp-tow-calculator output { padding:18px; background:white; border:1px solid var(--gp-rule); border-radius:10px; }
.gp-tow-calculator output[data-error] { border-color:#a32828; }
.gp-towing :is(input,button,a):focus-visible { outline:3px solid var(--gp-focus); outline-offset:4px; }
.gp-tow-loading-image img { width:100%; aspect-ratio:1; object-fit:contain; }
.gp-tow-loading-card:last-child { border-color:var(--gp-brand); }
.gp-tow-loading-card:last-child h3 { color:var(--gp-brand); }
.gp-tow-loading-card[hidden] { display:none; }
.gp-tow-loading-controls { display:flex; gap:8px; margin-top:24px; }
.gp-tow-loading-controls button { flex:1; background:white; color:var(--gp-ink); font-size:.8rem; padding:12px 8px; }
.gp-tow-loading-controls button[aria-pressed=true] { background:var(--gp-brand); color:white; }
.gp-tow-advice { margin-top:32px; }
.gp-tow-advice p { padding-top:20px; border-top:1px solid var(--gp-rule); }
.gp-tow-check { display:flex; gap:14px; padding:18px 4px; border-top:1px solid var(--gp-rule); cursor:pointer; }
.gp-tow-check input { flex:0 0 22px; width:22px; height:22px; accent-color:var(--gp-brand); margin-top:3px; }
.gp-tow-check strong,.gp-tow-check span > span { display:block; }
.gp-tow-check span > span { color:var(--gp-muted); margin-top:6px; }
.gp-tow-check:has(input:checked) { background:#f3faf3; }
.gp-tow-progress { font-weight:650; color:var(--gp-forest); }
.gp-towing .gp-illustrated-cta { --gp-cta-image:url('images/cta/913-go-pod-illustrated-cta-5.webp'); }
.gp-tow-zoom { width:min(1100px,92vw); max-height:92dvh; padding:16px; border:0; border-radius:16px; background:white; }
.gp-tow-zoom::backdrop { background:rgba(15,32,24,.85); }
.gp-tow-zoom img { display:block; max-width:100%; max-height:75dvh; object-fit:contain; margin:16px auto 0; }
@media(min-width:801px) {
 .gp-tow-hero { grid-template-columns:1fr 1fr; gap:48px; }
 .gp-tow-facts { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .gp-tow-split,.gp-tow-two { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px; }
 .gp-tow-loading,.gp-tow-advice { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .gp-tow-loading-controls { display:none; }
 .gp-tow-loading-card { display:grid; grid-template-rows:auto minmax(3.5em,auto) 1fr; align-content:start; }
}
@media(prefers-reduced-motion:no-preference) { .gp-tow-loading-card { animation:gp-tow-enter .45s ease both; } @keyframes gp-tow-enter { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } } }

.gp-tow-split > .gp-tow-card { align-self:start; }
.gp-towing .gp-tow-nav a { text-decoration:none; border-radius:6px; }
.gp-towing .gp-tow-nav a:hover { background:var(--gp-brand); color:white; }
/* Keep copy opposite the right-hand Go-Pod in this illustration. */
@media(min-width:801px){
 .gp-towing .gp-illustrated-cta__copy { margin-left:0; margin-right:auto; }
 .gp-towing .gp-illustrated-cta::before { background:linear-gradient(270deg,transparent 12%,rgba(255,255,255,.15) 28%,#fff 54%),var(--gp-cta-image) right center / cover no-repeat; }
}

/* Quick answer: one compact summary, then three equally weighted checks. */
.gp-towing #quick-answer > h2 { max-width:29ch; }
.gp-towing #quick-answer > .gp-tow-split { grid-template-columns:1fr; gap:28px; }
.gp-towing #quick-answer > .gp-tow-split > .gp-tow-card { padding:24px; background:#f8faf7; border:0; border-left:3px solid var(--gp-brand); border-radius:0 12px 12px 0; }
.gp-towing #quick-answer > .gp-tow-split > .gp-tow-card > p + p { margin-top:12px; }
.gp-towing #quick-answer .gp-tow-steps { gap:24px; }
.gp-towing #quick-answer .gp-tow-steps > .gp-tow-card { display:grid; grid-template-columns:40px minmax(0,1fr); gap:10px 14px; padding:0 0 24px; border:0; border-bottom:1px solid var(--gp-rule); border-radius:0; }
.gp-towing #quick-answer .gp-tow-steps > .gp-tow-card:last-child { border-bottom:0; padding-bottom:0; }
.gp-towing #quick-answer .gp-tow-steps .gp-tow-icon { grid-column:1; grid-row:1; margin:0; padding:8px; width:40px; height:40px; box-sizing:border-box; background:#eaf7ec; border-radius:8px; }
.gp-towing #quick-answer .gp-tow-steps h3 { grid-column:2; margin:0; font-size:1.15rem; line-height:1.4; align-self:center; }
.gp-towing #quick-answer .gp-tow-steps p { grid-column:2; margin:0; }
@media(min-width:700px){
 .gp-towing #quick-answer > .gp-tow-split > .gp-tow-card { display:grid; grid-template-columns:170px minmax(0,1fr); gap:12px 28px; padding:28px; }
 .gp-towing #quick-answer > .gp-tow-split > .gp-tow-card > h3,
 .gp-towing #quick-answer > .gp-tow-split > .gp-tow-card > p:not(.gp-tow-stat) { grid-column:2; margin:0; }
 .gp-towing #quick-answer > .gp-tow-split > .gp-tow-card > .gp-tow-stat { grid-column:1; grid-row:1 / span 3; align-self:center; margin:0; font-size:clamp(2.5rem,4vw,3.25rem); }
}
@media(min-width:1000px){
 .gp-towing #quick-answer .gp-tow-steps { grid-template-columns:repeat(3,minmax(0,1fr)); column-gap:24px; row-gap:16px; }
 .gp-towing #quick-answer .gp-tow-steps > .gp-tow-card { grid-template-columns:1fr; grid-template-rows:subgrid; grid-row:span 3; gap:16px; padding:24px; border:1px solid var(--gp-rule); border-radius:16px; }
 .gp-towing #quick-answer .gp-tow-steps > .gp-tow-card:last-child { border:1px solid var(--gp-rule); padding:24px; }
 .gp-towing #quick-answer .gp-tow-steps :is(h3,p,.gp-tow-icon) { grid-column:1; grid-row:auto; }
 .gp-towing #quick-answer .gp-tow-steps h3 { align-self:start; }
}
.gp-towing #quick-answer > .gp-tow-note { margin-top:28px; }

/* Calculator feedback uses wording as well as colour to explain each threshold. */
.gp-tow-calculator output[data-result] { display:grid; gap:12px; border-left-width:4px; line-height:1.55; }
.gp-tow-calculator output[data-result="success"] { background:#eff9f0; border-color:#288638; }
.gp-tow-calculator output[data-result="threshold"] { background:#fff8e8; border-color:#a76a10; }
.gp-tow-calculator output[data-result="below"] { background:#fff2f0; border-color:#b54334; }
.gp-tow-calculator .gp-tow-result-value { font-size:clamp(1.4rem,2.2vw,1.9rem); font-weight:750; color:var(--gp-ink); }
.gp-tow-calculator output[data-result="success"] > strong { color:#226c2f; }
.gp-tow-calculator output[data-result="threshold"] > strong { color:#80520b; }
.gp-tow-calculator output[data-result="below"] > strong { color:#982f25; }
.gp-tow-result-note { border-top:1px solid #c7cec7; padding-top:12px; font-size:.9rem; }

/* VIN method: numbered explanation and plate beside the calculator, as in the prototype. */
.gp-towing #vin > .gp-tow-split { padding:clamp(18px,3vw,40px); border:1px solid var(--gp-rule); border-radius:20px; gap:32px; align-items:center; grid-template-columns:1fr; }
.gp-towing #vin .gp-tow-steps { gap:20px; min-width:0; }
.gp-towing #vin .gp-tow-steps > :is(h3,p) { margin:0; }
.gp-towing .gp-tow-equation { display:grid; gap:20px; margin:4px 0; counter-reset:vin-step; }
.gp-tow-equation__term { position:relative; min-width:0; padding-left:46px; counter-increment:vin-step; }
.gp-tow-equation__term::before { content:counter(vin-step); position:absolute; left:0; top:0; width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:var(--gp-brand); color:white; font-weight:700; }
.gp-towing .gp-tow-equation__term h4 { font-size:1rem; line-height:1.5; margin:0; color:var(--gp-forest); }
.gp-towing .gp-tow-equation__term p { margin:4px 0 0; font-size:1rem; line-height:1.6; }
.gp-towing #vin .gp-tow-panel { min-width:0; padding:clamp(18px,2.5vw,32px); background:#eff8f0; border-color:#cfe5d2; }
.gp-towing #vin .gp-tow-panel > .gp-tow-note { background:white; padding:16px; margin-bottom:0; }
@media(min-width:1000px){
 .gp-towing #vin > .gp-tow-split { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(32px,4vw,56px); }
}

/* Towbar types: visible comparisons with a touch/keyboard rail on smaller screens. */
.gp-tow-type-rail { display:grid; grid-auto-flow:column; grid-auto-columns:min(85%,340px); gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 4px 18px; scrollbar-color:var(--gp-brand) #edf2ee; }
.gp-tow-type-card { display:grid; grid-template-rows:subgrid; grid-row:span 4; gap:16px; min-width:0; padding:16px; border:1px solid var(--gp-rule); border-radius:18px; scroll-snap-align:start; }
.gp-towing .gp-tow-type-card > * { margin:0; }
.gp-tow-type-card figure { overflow:hidden; border-radius:12px; aspect-ratio:4/3; }
.gp-tow-type-card img { display:block; width:100%; height:100%; object-fit:cover; }
.gp-towing .gp-tow-type-card h3 { font-size:1.2rem; line-height:1.4; }
.gp-tow-type-card .gp-tow-takeaway { padding-top:14px; border-top:1px solid var(--gp-rule); }
.gp-tow-type-controls { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin:0 0 16px; }
.gp-tow-type-controls span { margin-right:auto; font-size:.9rem; font-weight:600; }
.gp-tow-type-controls button { width:44px; height:44px; border:1px solid var(--gp-rule); border-radius:6px; background:white; color:var(--gp-forest); font:inherit; font-size:1.4rem; cursor:pointer; }
.gp-tow-type-controls button:hover { background:var(--gp-brand); color:white; }
.gp-tow-type-controls button:disabled { opacity:.4; cursor:default; }
@media(min-width:1200px){ .gp-tow-type-rail { grid-auto-flow:row; grid-template-columns:repeat(4,minmax(0,1fr)); overflow:visible; } .gp-tow-type-controls { display:none; } }

/* Separate the electrics advice from the towbar comparison above it. */
.gp-towing #towbars > .gp-tow-subsection { margin-top:clamp(36px,5vw,64px); padding-top:clamp(28px,4vw,48px); border-top:1px solid var(--gp-rule); }
.gp-towing #towbars > .gp-tow-subsection > h3 { margin:0 0 16px; }
.gp-towing #towbars > .gp-tow-subsection > p { max-width:75ch; margin:0; }
.gp-towing #towbars > .gp-tow-subsection > .gp-tow-two { margin-top:28px; }
.gp-towing #towbars > .gp-tow-subsection > .gp-tow-note { margin-top:28px; margin-bottom:0; }

/* Compact, progressively enhanced calculator disclaimer. */
.gp-tow-disclaimer { position:relative; margin-top:16px; }
.gp-tow-disclaimer__trigger { display:flex; align-items:center; gap:8px; min-height:44px; padding:8px 0; border:0; background:transparent; color:var(--gp-forest); font:inherit; font-size:.9rem; font-weight:650; cursor:pointer; }
.gp-tow-disclaimer__trigger > span { font-size:1.25rem; }
.gp-tow-disclaimer__trigger:hover { color:var(--gp-brand); }
.gp-towing #vin .gp-tow-disclaimer > .gp-tow-note { position:absolute; top:100%; left:0; z-index:20; width:min(380px,100%); box-sizing:border-box; margin:0; padding:20px; background:#fff; border:1px solid var(--gp-rule); border-radius:12px; box-shadow:0 8px 24px rgb(20 45 28 / 14%); font-size:.9rem; line-height:1.6; }
.gp-tow-disclaimer > [hidden] { display:none; }
.gp-towing .gp-tow-disclaimer .gp-tow-note p + p { margin-top:12px; }

/* Editorial rhythm: explicit spacing wins over the shared block margin reset. */
.gp-towing .gp-section:not(.gp-tow-hero,.gp-illustrated-cta) { padding-block:clamp(64px,7.5vw,108px); }
.gp-towing .gp-section > :is(.gp-tow-two,.gp-tow-loading,.gp-tow-advice,.gp-tow-disclosures,.gp-tow-faqs,.gp-tow-checklist) { margin-top:32px; }
.gp-towing .gp-section > .gp-tow-note { margin-block:32px; }
.gp-towing .gp-section > .gp-actions { margin-top:28px; }
.gp-towing .gp-section > p:not(.gp-section-description) + p { margin-top:16px; }
.gp-towing .gp-section > .gp-tow-progress { margin-top:24px; }
.gp-towing :is(.gp-tow-card,.gp-tow-panel,.gp-tow-note) > h3 + p { margin-top:12px; }
.gp-towing :is(.gp-tow-card,.gp-tow-panel,.gp-tow-note) > p + p:not(.gp-tow-stat) { margin-top:16px; }
.gp-towing .gp-tow-loading-card { row-gap:16px; }
.gp-towing .gp-tow-loading-card > figure + h3 { margin-top:16px; }
.gp-towing .gp-tow-loading-card > h3 + p { margin-top:12px; }
.gp-towing .gp-accordion__inner > p { padding-block:8px 12px; }
.gp-towing #vin > .gp-accordion { margin-top:32px; }
.gp-towing #vin > .gp-accordion + p { margin-top:24px; }
.gp-towing #v5c .gp-tow-steps > h3 + p { margin-top:-8px; }
@media(min-width:801px){
 .gp-towing .gp-tow-loading-card > :is(h3,p) { margin-top:0; }
 .gp-towing #licence > .gp-tow-two { align-items:stretch; }
}