/* The KiwiSurf 500 pages (tools/k500_pages.py, 02.11.2026): on top of /ks/ks.css (the /today/ kit: hero, cards, lists, .mt table) */
.k5 .hero{padding-top:28px}
.k5-crumbs{font:600 13px/18px var(--sans);color:var(--ink-300);margin:0 0 12px}
.k5-crumbs a{color:var(--ink-100);text-decoration:none}.k5-crumbs a:hover{text-decoration:underline}
.k5-grid1{grid-template-columns:minmax(0,680px)!important}
.k5-alt{display:block;font:600 16px/1.3 var(--sans);color:var(--ink-300);margin-top:6px;letter-spacing:0}
.k5-day{font:800 15px/20px var(--sans);color:var(--coral);text-transform:uppercase;letter-spacing:.08em;margin:22px 0 10px}
.k5 .hours h2{margin-bottom:0}
.k5-about p{max-width:760px;font:500 16px/26px var(--sans);color:var(--ink-800)}
.k5-faq details{border-radius:14px;background:var(--surface-50);box-shadow:var(--shadow);padding:0;margin:0 0 10px;max-width:760px}
.k5-faq summary{cursor:pointer;padding:14px 18px;font:800 16px/22px var(--sans);list-style:none}
.k5-faq summary::-webkit-details-marker{display:none}
.k5-faq summary::after{content:"+";float:right;color:var(--ink-500)}.k5-faq details[open] summary::after{content:"–"}
.k5-faq p{padding:0 18px 16px;margin:0;color:var(--ink-700);font:500 15px/23px var(--sans)}
.k5-foot p{font:500 13px/19px var(--sans);color:var(--ink-600);max-width:760px;margin:8px 0 40px}
.k5 section.wrap{margin-top:36px}
@media (max-width:760px){.k5 section.wrap{margin-top:28px}.k5-crumbs{font-size:12px}}
/* season (data/k500_climate.json): 12 monthly bars = share of days with 3+ stars, typical wave height under each */
.k5-sea p{max-width:760px;font:500 16px/26px var(--sans);color:var(--ink-800)}
.k5-season{margin-top:14px;padding:16px;border-radius:16px;background:var(--surface-50);box-shadow:var(--shadow);max-width:760px}
.k5-season .k5-sl{font:700 12px/16px var(--sans);color:var(--ink-600);margin:0 0 10px}
.k5-bars{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;align-items:end;height:150px}
.k5-b{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:3px;min-width:0}
.k5-b i{display:block;width:70%;height:calc(var(--v,0) * 90px + 2px);border-radius:6px 6px 2px 2px;background:var(--kiwi)}
.k5-b.k5-na i{background:var(--ink-200)}
.k5-b b{font:800 11px/1 var(--sans);color:var(--ink-800)}.k5-b small{font:600 10px/1 var(--sans);color:#16506a}
.k5-b em{font:700 10px/1 var(--sans);font-style:normal;color:var(--ink-600);white-space:nowrap}
.k5-also{font:600 13px/20px var(--sans);color:var(--ink-600)}
.k5-foot p{margin:8px 0}
@media (max-width:420px){.k5-bars{gap:2px;height:132px}.k5-b i{width:80%;height:calc(var(--v,0) * 76px + 2px)}.k5-b b{font-size:9px}.k5-b small,.k5-b em{font-size:8px}}
.k5-cmp{max-width:760px;font:600 15px/23px var(--sans);color:var(--ink-800);margin:0 0 12px}
/* /best-surf-spots-december/ (tools/build_december.py, 02.11.2026): art hero with overlay, top-10 table, 50 ranked cards */
.dec-hero{position:relative;overflow:hidden;color:#fff;padding:56px 0 44px;background:var(--night,#190922);border-radius:0 0 16px 16px}
.dec-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dec-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(25,9,34,.5),rgba(25,9,34,.78) 65%,rgba(25,9,34,.92))}
.dec-hero .wrap{position:relative;z-index:2;margin-top:0}
.dec-hero h1{color:#fff;margin:0 0 14px;max-width:760px}
.dec-hero .sub{max-width:700px;font:500 17px/27px var(--sans);color:#f3eef5;margin:0}
.dec-hero .k5-crumbs,.dec-hero .k5-crumbs a{color:#e9e1ee}
.dec-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:20px 0 0;padding:0}
.dec-chips li{padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.16);font:700 13px/18px var(--sans);color:#fff}
.dec h2{margin:0 0 14px}
.dec-tw{overflow-x:auto;border-radius:14px;background:var(--surface-50);box-shadow:var(--shadow);max-width:760px}
.dec-t{width:100%;border-collapse:collapse;font:600 15px/20px var(--sans);color:var(--ink-800)}
.dec-t th,.dec-t td{padding:10px 14px;text-align:left;border-bottom:1px solid #eeebe4;white-space:nowrap}
.dec-t thead th{font:800 12px/16px var(--sans);color:var(--ink-600);text-transform:uppercase;letter-spacing:.05em}
.dec-t tbody th small{display:block;font:600 12px/16px var(--sans);color:var(--ink-600)}
.dec-t a{color:var(--ink-900);font-weight:800;text-decoration:none}.dec-t a:hover{text-decoration:underline}
.dec-t tr:last-child th,.dec-t tr:last-child td{border-bottom:0}
.dec-g{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.dc{display:flex;flex-direction:column;border-radius:16px;background:var(--surface-50);box-shadow:var(--shadow);overflow:hidden;min-width:0}
.dc-img{position:relative;display:block;aspect-ratio:1000/558;background:#2c6f9a}
.dc-img img{width:100%;height:100%;object-fit:cover;display:block}
.dc .rk{position:absolute;left:12px;top:12px;min-width:36px;height:36px;padding:0 8px;border-radius:999px;background:#fff;color:#1d1d1c;font:800 16px/36px var(--sans);text-align:center;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.dc-b{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.dc h3{margin:0;font:600 22px/1.2 Fraunces,Georgia,serif}.dc h3 a{color:var(--ink-900);text-decoration:none}
.dc-c{margin:0;font:600 13px/18px var(--sans);color:var(--ink-600);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
.dc-c .td{display:inline-flex;align-items:center;gap:6px}.dc-c .kr{display:inline-flex;gap:1px}
.dc-s{list-style:none;margin:2px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.dc-s li{background:#fff;border-radius:10px;padding:8px 4px;text-align:center;box-shadow:0 0 0 1px #eeebe4;min-width:0}
.dc-s b{display:block;font:800 16px/20px var(--sans);color:var(--ink-900)}
.dc-s small{display:block;font:600 11px/14px var(--sans);color:var(--ink-600)}
.dc-l{margin:0;font:500 15px/23px var(--sans);color:var(--ink-800)}
.dc-go{margin-top:auto;font:800 14px/20px var(--sans);color:#1f8a4c;text-decoration:none}.dc-go:hover{text-decoration:underline}
.dc .noart{display:block;width:100%;height:100%}
@media (max-width:760px){.dec-g{grid-template-columns:minmax(0,1fr)}.dec-hero{padding:36px 0 30px}.dc-s{grid-template-columns:repeat(2,minmax(0,1fr))}}
.dec .k5-about p{margin:0 0 12px}