:root { --forest:#173c32; --forest-deep:#102e26; --cream:#faf7ee; --cream-deep:#eee8d8; --rust:#d15e45; --rust-dark:#b84434; --gold:#e6b84f; --sage:#8c9d70; --ink:#17362d; --line:rgba(23,60,50,.2); --serif:Georgia,"Times New Roman",serif; --sans:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:var(--sans); font-size:1rem; line-height:1.55; }
img { display:block; max-width:100%; }
a { color:inherit; }
.skip-link { position:fixed; top:.75rem; left:.75rem; z-index:99; padding:.75rem 1rem; background:white; transform:translateY(-160%); }
.skip-link:focus { transform:translateY(0); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.site-header { min-height:88px; padding:0 max(2rem,calc((100vw - 1420px)/2)); display:flex; align-items:center; justify-content:space-between; gap:2rem; background:var(--cream); }
.brand { display:inline-flex; align-items:center; gap:.75rem; text-decoration:none; }
.brand-mark { width:44px; height:44px; display:grid; place-items:center; flex:0 0 auto; color:var(--rust); background:var(--forest); border-radius:50%; }
.brand-mark svg { width:27px; height:27px; fill:none; stroke:currentColor; stroke-width:2; }
.brand-type { display:grid; color:var(--forest); line-height:1; }
.brand-type strong { font-family:var(--serif); font-size:1.25rem; letter-spacing:-.02em; }
.brand-type small { margin-top:.35rem; font-size:.6rem; font-weight:850; letter-spacing:.26em; }
.site-nav { display:flex; align-items:center; gap:clamp(1rem,2vw,2rem); }
.site-nav a { text-decoration:none; font-size:.84rem; font-weight:750; }
.site-nav a:not(.nav-cta):hover { color:var(--rust-dark); }
.nav-socials { display:flex; align-items:center; gap:.45rem; }
.site-nav .social-link { width:2.15rem; height:2.15rem; display:grid; place-items:center; color:var(--cream); background:var(--forest); border-radius:50%; transition:transform 150ms ease,background 150ms ease; }
.site-nav .social-link:hover { color:var(--cream); background:var(--rust-dark); transform:translateY(-2px); }
.social-link svg { width:1.1rem; height:1.1rem; fill:currentColor; }
.social-link svg rect,.social-link svg circle { fill:none; stroke:currentColor; stroke-width:2; }
.social-link svg .social-icon-fill { fill:currentColor; stroke:none; }
.nav-cta { padding:.9rem 1.1rem; background:#dc8061; border-radius:.3rem; box-shadow:0 2px 0 rgba(23,60,50,.18); }
.nav-cta:hover { background:var(--rust); }
.menu-button { display:none; }
.cover { width:100%; background:#b9e4f5; overflow:hidden; }
.cover img { width:100%; height:auto; }
.intro { max-width:960px; margin:0 auto; padding:clamp(4rem,8vw,7.5rem) 2rem 5.5rem; text-align:center; }
.eyebrow { margin:0 0 1.3rem; font-size:.72rem; font-weight:850; letter-spacing:.18em; }
h1,h2,h3 { margin-top:0; font-family:var(--serif); }
h1 { margin-bottom:1.25rem; font-size:clamp(2.9rem,5.3vw,5.4rem); line-height:.98; font-weight:500; letter-spacing:-.045em; }
.intro>p:not(.eyebrow):not(.scribble) { max-width:780px; margin:0 auto 2rem; color:#3b554b; font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.65rem); line-height:1.5; }
.primary-button,.join-button { display:inline-flex; align-items:center; gap:1.5rem; padding:.95rem 1.25rem; color:var(--cream); background:var(--forest); border-radius:.25rem; text-decoration:none; font-weight:800; box-shadow:5px 5px 0 var(--gold); transition:transform 160ms ease,box-shadow 160ms ease; }
.primary-button:hover,.join-button:hover { transform:translate(2px,2px); box-shadow:3px 3px 0 var(--gold); }
.intro-actions { display:flex; justify-content:center; align-items:center; gap:1.2rem; flex-wrap:wrap; }
.stay-button { background:var(--rust-dark); box-shadow:5px 5px 0 var(--gold); }
.secondary-button { display:inline-flex; align-items:center; gap:1rem; padding:.9rem .35rem; color:var(--forest); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:.35rem; font-weight:800; }
.secondary-button:hover { color:var(--rust-dark); }
.scribble { margin:2.6rem 0 0; color:var(--rust-dark); font-family:"Bradley Hand","Segoe Print",cursive; font-size:1.05rem; transform:rotate(-1deg); }
.season-feature { padding:clamp(3.5rem,7vw,6rem) max(2rem,calc((100vw - 1420px)/2)); display:grid; grid-template-columns:1fr auto; align-items:center; gap:4rem; color:var(--cream); background:var(--forest); }.season-feature h2 { margin:0 0 1rem; font-size:clamp(2.7rem,5vw,4.8rem); line-height:1; font-weight:500; }.season-feature p:not(.eyebrow) { max-width:760px; margin:0; color:rgba(250,247,238,.78); font-family:var(--serif); font-size:1.2rem; }.season-feature .primary-button { color:var(--forest); background:var(--gold); box-shadow:5px 5px 0 var(--rust); white-space:nowrap; }
.article-page { background:var(--cream); }.article-hero { padding:clamp(4rem,8vw,8rem) max(2rem,calc((100vw - 1280px)/2)); display:grid; grid-template-columns:1fr .55fr; gap:7vw; align-items:center; background:var(--cream-deep); }.article-hero h1 em { color:var(--rust); font-weight:500; }.article-hero>div>p:last-child { max-width:760px; font-family:var(--serif); font-size:1.25rem; color:#3b554b; }.article-hero aside { padding:2rem; color:var(--cream); background:var(--forest); border-radius:.4rem; box-shadow:9px 9px 0 var(--gold); }.article-hero aside h2 { font-size:2rem; }.article-hero ul { margin:0; padding-left:1.2rem; }.article-hero li { padding:.5rem 0; }.article-grid { padding:clamp(4rem,8vw,7rem) max(2rem,calc((100vw - 1280px)/2)); display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; background:#dfe9d8; }.article-grid article { padding:2rem; background:var(--cream); border:1px solid var(--line); }.article-grid article>span { width:2.5rem; height:2.5rem; display:grid; place-items:center; color:white; background:var(--rust); border-radius:50%; font-size:.72rem; font-weight:850; }.article-grid h2 { margin:1.4rem 0 .7rem; font-size:2rem; line-height:1.05; }.article-grid p { color:#3b554b; }.article-grid small { display:block; padding:1rem; border-left:4px solid var(--gold); background:#fff5d8; color:#3b554b; }.article-sources { padding:clamp(4rem,8vw,7rem) max(2rem,calc((100vw - 1280px)/2)); display:grid; grid-template-columns:.7fr 1fr; gap:7vw; }.article-sources h2 { font-size:clamp(2.8rem,5vw,4.5rem); line-height:1; }.article-sources>div:last-child { display:grid; border-top:1px solid var(--line); }.article-sources a { padding:1.3rem 0; display:flex; justify-content:space-between; border-bottom:1px solid var(--line); text-decoration:none; font-weight:800; }
.guides { padding:clamp(5rem,9vw,8.5rem) max(2rem,calc((100vw - 1420px)/2)); background:var(--cream-deep); border-top:1px solid rgba(23,60,50,.08); }
.section-heading { margin-bottom:3.2rem; display:grid; grid-template-columns:1.25fr .65fr; gap:4rem; align-items:end; }
.section-heading h2,.about-heading h2,.join h2 { margin-bottom:0; font-size:clamp(3rem,5vw,5rem); line-height:.96; font-weight:500; letter-spacing:-.045em; }
.section-heading>p { max-width:500px; margin:0 0 .35rem; font-family:var(--serif); font-size:1.2rem; line-height:1.5; }
.guide-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.guide-card { min-height:480px; padding:1.7rem; display:flex; flex-direction:column; justify-content:space-between; color:var(--forest); background:var(--cream); border:1px solid var(--line); border-radius:.25rem; text-decoration:none; transition:transform 170ms ease,box-shadow 170ms ease; }
.guide-card:hover { transform:translateY(-5px); box-shadow:0 12px 0 rgba(23,60,50,.08); }
.guide-card-featured { color:var(--cream); background:var(--rust); border-color:var(--rust-dark); }
.guide-card-lakes { background:#d8c77d; }
.guide-card-torbay { background:#aed4d5; }
.guide-card-northumberland { color:var(--cream); background:#35594c; }
.guide-card-next { min-height:320px; grid-column:1/-1; background:var(--sage); }
.guide-number { width:2.6rem; height:2.6rem; display:grid; place-items:center; border:1px solid currentColor; border-radius:50%; font-size:.72rem; font-weight:800; }
.guide-kicker { margin:0 0 .7rem; font-size:.68rem; font-weight:850; letter-spacing:.18em; }
.guide-card h3 { margin-bottom:1.2rem; font-size:clamp(2.35rem,3.5vw,4rem); font-weight:500; line-height:.98; letter-spacing:-.04em; }
.guide-card div>p:not(.guide-kicker) { max-width:390px; margin:0 0 1.5rem; }
.guide-link { display:inline-flex; gap:.9rem; font-weight:800; text-decoration:underline; text-underline-offset:.35rem; }
.about { padding:clamp(5rem,9vw,8.5rem) max(2rem,calc((100vw - 1420px)/2)); color:var(--cream); background:var(--forest); }
.about-heading h2 em { color:var(--gold); font-weight:500; }
.reasons { margin-top:5rem; display:grid; grid-template-columns:repeat(3,1fr); gap:3rem; }
.reasons article { padding-top:1.2rem; border-top:1px solid rgba(250,247,238,.35); }
.reasons span { color:var(--gold); font-size:.75rem; font-weight:850; }
.reasons h3 { margin:2.4rem 0 .7rem; font-size:1.7rem; font-weight:500; }
.reasons p { max-width:410px; margin:0; color:rgba(250,247,238,.78); }
.join { padding:clamp(5rem,9vw,8rem) max(2rem,calc((100vw - 1420px)/2)); display:grid; grid-template-columns:1.2fr .65fr; gap:5rem; align-items:end; background:#dc8061; }
.join-copy p { max-width:520px; margin:0 0 2rem; font-family:var(--serif); font-size:1.2rem; }
.join-button { box-shadow:none; }
.join-button:hover { box-shadow:none; }
footer { padding:3.5rem max(2rem,calc((100vw - 1420px)/2)); display:grid; grid-template-columns:1.1fr .65fr 1fr; align-items:end; gap:3rem; color:var(--cream); background:var(--forest-deep); font-size:.8rem; }
.footer-brand .brand-type { color:var(--cream); }
.footer-brand .brand-mark { background:var(--cream); }
footer>div>p { margin:1rem 0 0; color:rgba(250,247,238,.7); }
footer nav { display:grid; gap:.5rem; }
footer nav a { text-decoration:none; }
footer nav a:hover { color:var(--gold); }
.copyright { margin:0; text-align:right; color:rgba(250,247,238,.62); }
.dedication { grid-column:1/-1; margin:1rem 0 0; padding-top:2rem; border-top:1px solid rgba(250,247,238,.18); color:rgba(250,247,238,.8); text-align:center; font-family:var(--serif); font-size:1rem; }
.dedication span { color:var(--rust); }
@media (max-width:900px) {
  .site-header { min-height:76px; padding-inline:1.25rem; }
  .menu-button { width:44px; height:44px; padding:10px; display:grid; align-content:center; gap:5px; border:0; background:transparent; }
  .menu-button>span:not(.sr-only) { height:2px; background:var(--forest); }
  .site-nav { position:absolute; top:76px; left:0; right:0; z-index:10; padding:1.5rem; display:none; flex-direction:column; align-items:stretch; gap:1.2rem; background:var(--cream); border-top:1px solid var(--line); box-shadow:0 8px 20px rgba(23,60,50,.12); }
  .site-nav.open { display:flex; }
  .nav-socials { justify-content:center; }
  .nav-cta { text-align:center; }
  .section-heading,.join,.season-feature,.article-hero,.article-sources { grid-template-columns:1fr; gap:2rem; }
  .guide-grid { grid-template-columns:1fr 1fr; }
  .guide-card-featured { grid-column:auto; min-height:480px; }
  .reasons { grid-template-columns:1fr; gap:2.5rem; }
  footer { grid-template-columns:1fr 1fr; }
  .copyright { grid-column:1/-1; text-align:left; }
}
@media (max-width:620px) {
  .brand-mark { width:39px; height:39px; }
  .brand-type strong { font-size:1.05rem; }
  .cover { aspect-ratio:1.33/1; }
  .cover img { width:263%; max-width:none; height:100%; object-fit:cover; object-position:62% center; transform:translateX(-31%); }
  .intro { padding:4.5rem 1.35rem; }
  .intro-actions { align-items:stretch; flex-direction:column; }
  .intro-actions .primary-button,.intro-actions .secondary-button { justify-content:center; }
  h1 { font-size:clamp(2.85rem,14vw,4rem); }
  .guides,.about,.join { padding-left:1.35rem; padding-right:1.35rem; }
  .guide-grid { grid-template-columns:1fr; }
  .article-grid { grid-template-columns:1fr; padding-left:1.35rem; padding-right:1.35rem; }
  .guide-card,.guide-card-featured { grid-column:auto; min-height:360px; }
  footer { grid-template-columns:1fr; padding:3rem 1.35rem; }
  .copyright { grid-column:auto; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms!important; } }
