/*
Theme Name: Sailing Weather Editorial
Author: Sailing Weather
Description: Lightweight editorial theme for the independent Sailing Weather relaunch.
Version: 0.2.0
Requires at least: 6.6
Requires PHP: 8.3
Text Domain: sailing-weather
*/

:root { color-scheme: light; --ink:#10243a; --muted:#536779; --sea:#087e90; --deep:#062f44; --mist:#edf5f7; --line:#d6e2e8; --paper:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:18px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:#086f82; text-underline-offset:.2em; }
a:hover { color:#044e5e; }
a:focus-visible,button:focus-visible { outline:3px solid #edb54a; outline-offset:3px; }
img { max-width:100%; height:auto; }
.skip-link { position:absolute; left:-9999px; top:0; z-index:100; padding:.6rem 1rem; background:#fff; }
.skip-link:focus { left:1rem; }
.site-header { border-bottom:1px solid var(--line); background:#fff; }
.header-inner,.site-footer-inner,.wrap { width:min(1120px,calc(100% - 2.5rem)); margin-inline:auto; }
.header-inner { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; min-height:82px; }
.brand { display:inline-flex; align-items:center; gap:.7rem; font-weight:800; font-size:1.35rem; letter-spacing:-.04em; color:var(--deep); text-decoration:none; white-space:nowrap; }
.brand img { width:48px; height:48px; flex:none; }
.brand span span { color:var(--sea); }
.main-nav { display:flex; flex-wrap:wrap; gap:1.2rem; font-size:.94rem; font-weight:650; }
.main-nav a { color:var(--ink); text-decoration:none; }
.main-nav a:hover,.main-nav a[aria-current="page"] { color:var(--sea); }
.language-nav { display:flex; align-items:center; gap:.2rem; padding:.2rem; border:1px solid var(--line); border-radius:999px; font-size:.78rem; font-weight:800; }
.language-nav a { min-width:2.5rem; padding:.25rem .45rem; border-radius:999px; text-align:center; color:var(--deep); text-decoration:none; }
.language-nav a:hover,.language-nav a[aria-current="page"] { background:var(--deep); color:#fff; }
.masthead { background:linear-gradient(135deg,#072b42 0%,#0c5060 62%,#087e90 100%); color:#fff; }
.masthead .wrap { padding-block:5rem 5.4rem; }
.eyebrow { margin:0 0 .8rem; color:#83d4da; text-transform:uppercase; letter-spacing:.13em; font-size:.78rem; font-weight:800; }
.masthead h1 { max-width:900px; margin:0; font-size:clamp(2.5rem,6vw,5.3rem); line-height:1.03; letter-spacing:-.06em; }
.masthead p { max-width:680px; margin:1.5rem 0 0; font-size:1.12rem; color:#e6f4f5; }
.masthead-actions { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.button { display:inline-block; padding:.75rem 1.05rem; border-radius:.35rem; font-weight:700; text-decoration:none; }
.button-primary { background:#fff; color:var(--deep); }
.button-secondary { border:1px solid #b8e4e8; color:#fff; }
.section { padding-block:4rem; }
.section h2 { margin:0 0 1.5rem; font-size:clamp(1.65rem,3vw,2.4rem); line-height:1.2; letter-spacing:-.035em; }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.card { border:1px solid var(--line); border-radius:.65rem; padding:1.45rem; background:#fff; }
.card .kicker { display:block; margin-bottom:.6rem; color:var(--sea); font-size:.8rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.card h3 { margin:.2rem 0 .65rem; font-size:1.22rem; line-height:1.3; }
.card h3 a { color:var(--ink); text-decoration:none; }
.card h3 a:hover { color:var(--sea); }
.card p { color:var(--muted); margin:0; font-size:.96rem; }
.band { background:var(--mist); border-block:1px solid var(--line); }
.band-inner { display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
.band p { color:var(--muted); margin-top:0; }
.clean-list { margin:0; padding-left:1.25rem; }
.clean-list li { margin:.6rem 0; }
.page-head { padding-block:3rem 1.5rem; border-bottom:1px solid var(--line); }
.page-head .eyebrow { color:var(--sea); }
.page-head h1 { max-width:840px; margin:0; font-size:clamp(2rem,5vw,3.8rem); line-height:1.12; letter-spacing:-.05em; }
.page-head .lede { color:var(--muted); max-width:760px; }
.content-layout { display:grid; grid-template-columns:minmax(0,760px) 230px; gap:4rem; padding-block:2.5rem 5rem; }
.entry-content { overflow-wrap:anywhere; }
.entry-content h2 { margin-top:2.3rem; line-height:1.25; font-size:1.6rem; }
.entry-content h3 { margin-top:2rem; line-height:1.3; }
.entry-content p,.entry-content li { max-width:72ch; }
.entry-content ul,.entry-content ol { padding-left:1.4rem; }
.entry-content blockquote { border-left:4px solid var(--sea); padding:.4rem 0 .4rem 1.2rem; margin:2rem 0; color:var(--deep); background:var(--mist); }
.entry-meta,.small-note { color:var(--muted); font-size:.85rem; }
.side-note { border-top:3px solid var(--sea); padding-top:1rem; color:var(--muted); font-size:.87rem; }
.post-list { display:grid; gap:1rem; }
.post-list article { border-bottom:1px solid var(--line); padding-bottom:1.5rem; }
.post-list h2 { margin:.3rem 0; font-size:1.5rem; }
.post-list h2 a { text-decoration:none; color:var(--ink); }
.site-footer { background:var(--deep); color:#d9ecf0; padding-block:2.5rem; }
.site-footer a { color:#d9ecf0; }
.site-footer-inner { display:flex; justify-content:space-between; gap:2rem; flex-wrap:wrap; font-size:.86rem; }
.site-footer p { margin:.2rem 0; max-width:680px; }
@media (max-width:800px) { .cards { grid-template-columns:1fr; } .band-inner,.content-layout { grid-template-columns:1fr; gap:1rem; } .side-note { max-width:720px; } }
@media (max-width:800px) { .header-inner { flex-wrap:wrap; padding-block:.8rem; row-gap:.6rem; } .brand { margin-right:auto; } .main-nav { order:3; width:100%; } }
@media (max-width:560px) { .header-inner { gap:.55rem; } .brand { font-size:1.13rem; } .brand img { width:40px; height:40px; } .main-nav { gap:.9rem; font-size:.86rem; } .masthead .wrap { padding-block:3.6rem 4rem; } .section { padding-block:3rem; } }