/* /guides/: English-only long-form pages. Builds on the .policy-doc typography in
   styles.css; only what those pages lack lives here. A separate file so a change here
   never forces the ?v= bump on styles.css (and the gen.py match strings with it). */
.guide-crumb{font-size:14px;color:var(--muted);margin-bottom:18px}
.guide-crumb a{color:inherit;text-decoration:none}
.guide-crumb a:hover{text-decoration:underline}
.policy-doc .guide-lead{font-size:19px;line-height:1.6;color:var(--ink);margin-bottom:24px}
.policy-doc .guide-meta{font-size:14px;color:var(--muted);margin:-12px 0 28px}
.policy-doc ol{margin:0 0 14px;padding-left:22px;list-style:decimal}

.guide-table{overflow-x:auto;margin:6px 0 22px;-webkit-overflow-scrolling:touch}
.guide-table table{border-collapse:collapse;width:100%;min-width:520px;font-size:15px}
.guide-table th,.guide-table td{text-align:left;vertical-align:top;padding:9px 10px;border-bottom:1px solid var(--rule);line-height:1.45;color:#3a3934}
.guide-table th{font-family:"Saira Condensed",sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-size:14px;color:var(--ink);border-bottom-color:var(--ink)}
.guide-table td:first-child{font-weight:600;white-space:nowrap;color:var(--ink)}

/* The example roadbook (inline SVG). It scales to the column rather than scrolling, so
   the type inside is set large enough to stay legible at phone width (about 0.55x).
   Red and the yellow CAP box are the FIA symbol conventions, not brand colours, so they
   stay confined to the drawing. */
.rb-figure{margin:12px 0 28px}
.rb-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.rb{display:block;width:100%;max-width:600px;height:auto;margin:0 auto;background:#fff}
.rb text{font-family:"Saira Condensed",sans-serif;fill:#0E0E0D}
.rb .rb-line{fill:#fff;stroke:#0E0E0D;stroke-width:1.5}
.rb .rb-div{stroke:#0E0E0D;stroke-width:1.5}
.rb .rb-no{font-size:14px;fill:#6f6e66}
.rb .rb-total{font-size:38px;font-weight:700;text-anchor:end}
.rb .rb-partial{font-size:22px;text-anchor:end;fill:#3a3934}
.rb .rb-wp{font-size:17px;font-weight:600}
.rb .rb-dot{fill:#0E0E0D}
.rb .rb-route{stroke:#0E0E0D;stroke-width:6;fill:none;stroke-linecap:round;stroke-linejoin:round}
.rb .rb-off{stroke-dasharray:10 8;stroke-linecap:butt}
.rb .rb-track{stroke:#0E0E0D;stroke-width:3;fill:none;stroke-linecap:round}
.rb .rb-cap{fill:#FFE45C;stroke:#0E0E0D;stroke-width:1.5}
.rb .rb-captext{font-size:19px;font-weight:700;text-anchor:middle}
.rb .rb-note{font-family:"Saira",sans-serif;font-size:20px}
.rb .rb-danger{fill:#D0021B;font-size:32px;font-weight:700}
.rb .rb-frame{fill:none;stroke:#D0021B;stroke-width:4}
.rb .rb-hole{fill:rgba(14,14,13,.18);stroke:#0E0E0D;stroke-width:2}
.rb .rb-house{fill:#fff;stroke:#0E0E0D;stroke-width:2}
.rb .rb-sign{fill:#fff;stroke:#D0021B;stroke-width:5}
.rb .rb-signtext{font-size:21px;font-weight:700;text-anchor:middle}
.policy-doc figcaption{font-size:14px;line-height:1.5;color:var(--muted);margin-top:8px}

.guide-app{background:var(--paper);border-radius:10px;padding:22px 24px 10px;margin:34px 0 8px}
.policy-doc .guide-app h2{margin-top:0}

.guide-more{margin-top:44px;padding-top:24px;border-top:1px solid var(--rule)}
.policy-doc .guide-more h2{margin-top:0;font-size:20px}
.guide-list{list-style:none;padding:0;margin:0}
.policy-doc .guide-list li{margin:0 0 18px}
.guide-list a{font-family:"Saira Condensed",sans-serif;font-weight:600;font-size:21px;text-decoration:none;color:var(--black)}
.guide-list a:hover{color:var(--green-ink);text-decoration:underline}
.policy-doc .guide-list p{margin:2px 0 0}