/* The Castle Rolls - shared stylesheet
   Persona: a Domesday-book / manorial muster-roll, not a fantasy castle skin.
   Parchment, iron-gall ink, wax-seal red, aged brass - not heraldic cliché. */

:root{
  --parchment: #EDE6D3;
  --parchment2: #F4EFE1;
  --parchment-dark: #DED4B8;
  --ink: #2A2318;
  --ink-soft: #55492F;
  --iron: #3B3226;
  --seal: #7A2E27;
  --seal-deep: #5C211C;
  --brass: #7B5F29;
  --brass-light: #B79A4F;
  --line: #C9BC98;
  --shadow: rgba(42,35,24,0.18);
  --radius: 3px;
  --serif: 'Spectral', Georgia, serif;
  --display: 'Cormorant SC', 'Spectral', serif;
  --mono: 'IBM Plex Mono', ui-monospace, monospace;
}

/* A local()-based metric-override fallback (matching Georgia's metrics to
   Spectral/Cormorant SC, to stop the hero heading reflowing on font swap)
   was tried 2026-07-20 and reverted - PageSpeed's own test runner measured
   it WORSE (CLS 0.416 vs 0.101 without it), almost certainly because their
   Chrome instance runs on Linux with neither Georgia nor Times New Roman
   installed, so local() can't resolve there and something about the failed
   match made timing worse rather than neutral. Real Windows/Mac visitors
   would likely have benefited, but shipping a fix that regresses on the
   very tool used to grade it isn't worth it - reverted to the plain stack. */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--parchment);
  color:var(--ink);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.55;
}
a{color:var(--seal-deep)}
a:hover{color:var(--seal)}
img{max-width:100%;display:block}

.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* Masthead */
.masthead{
  background:var(--iron);
  color:var(--parchment2);
  border-bottom:4px double var(--brass-light);
  padding:14px 0;
}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.masthead-title{
  font-family:var(--display);
  font-size:1.5rem;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:var(--parchment2);
  text-decoration:none;
}
.masthead-title small{
  display:block;
  font-family:var(--mono);
  font-size:0.6rem;
  letter-spacing:0.15em;
  color:var(--brass-light);
  text-transform:none;
  margin-top:2px;
}
.masthead-nav{display:flex;gap:4px 14px;flex-wrap:wrap;font-family:var(--mono);font-size:0.78rem;letter-spacing:0.03em;text-transform:uppercase}
.masthead-nav a{display:inline-block;color:var(--parchment2);text-decoration:none;padding:10px 2px}
.masthead-nav a:hover{text-decoration:underline;text-decoration-color:var(--brass-light);text-underline-offset:4px}

/* Hero */
.hero{
  padding:56px 0 40px;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(ellipse at top left, rgba(122,46,39,0.06), transparent 60%),
    var(--parchment);
}
/* Tighter vertical rhythm on phones - the hero (with its stacked Featured card)
   was leaving a large gap before the first section. */
@media (max-width:640px){
  .hero{padding:34px 0 22px}
  section{padding:28px 0}
}
.eyebrow{
  font-family:var(--mono);
  font-size:0.75rem;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--seal-deep);
  margin:0 0 10px;
}
h1.ap-title{
  font-family:var(--display);
  font-size:3.2rem;
  line-height:1.02;
  margin:0 0 14px;
  color:var(--iron);
}
.tagline{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--seal-deep);margin:0 0 16px;max-width:640px}
.standfirst{font-size:1.15rem;color:var(--ink-soft);max-width:640px;margin:0 0 20px}
.stat-row{display:flex;gap:28px;flex-wrap:wrap;margin-top:24px}
.stat{
  font-family:var(--mono);background:none;border:none;padding:0;text-align:left;cursor:pointer;
}
.stat:hover b{color:var(--seal)}
.stat:hover span{color:var(--ink)}
/* Non-interactive variant for secondary hero pages (no gallery-modal filter
   to click into) - same look, no pointer cursor or hover affordance. */
.stat.static{cursor:default}
.stat.static:hover b{color:var(--seal-deep)}
.stat.static:hover span{color:var(--ink-soft)}
.stat b{display:block;font-size:1.8rem;color:var(--seal-deep);font-family:var(--display)}
.stat span{font-size:0.72rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--ink-soft)}

/* Sections */
section{padding:44px 0}
h2.sec-title{
  font-family:var(--display);
  font-size:1.9rem;
  color:var(--iron);
  border-bottom:2px solid var(--brass-light);
  padding-bottom:8px;
  margin:0 0 22px;
}
h2.sec-title .count{font-family:var(--mono);font-size:0.85rem;color:var(--ink-soft);font-weight:400}

/* Regional browse */
.circuit{margin-bottom:34px}
.circuit h3{
  font-family:var(--mono);
  font-size:0.85rem;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:var(--seal-deep);
  border-left:3px solid var(--seal);
  padding-left:10px;
  margin:0 0 12px;
}
.roll-list{list-style:none;margin:0;padding:0;columns:2;column-gap:32px}
@media (max-width:720px){.roll-list{columns:1}}
.roll-list li{break-inside:avoid;margin-bottom:9px;padding-bottom:9px;border-bottom:1px dotted var(--line);display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.roll-list a{text-decoration:none;font-weight:600}
.roll-list .region{font-family:var(--mono);font-size:0.72rem;color:var(--ink-soft);white-space:nowrap}

.showcase-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin:20px 0}
@media (max-width:980px){.showcase-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.showcase-grid{grid-template-columns:repeat(2,1fr)}}
.showcase-card{
  display:flex;flex-direction:column;text-decoration:none;color:var(--ink);position:relative;
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  background:var(--parchment2);transition:transform 0.15s, box-shadow 0.15s;
}
.showcase-card:hover{transform:translateY(-3px);box-shadow:0 6px 16px var(--shadow)}
.showcase-card img{width:100%;height:170px;object-fit:cover;display:block;filter:sepia(8%) contrast(1.03) saturate(0.95)}
.showcase-rank{
  position:absolute;top:10px;left:10px;z-index:1;
  font-family:var(--mono);font-size:0.75rem;font-weight:600;
  background:var(--iron);color:var(--brass-light);padding:3px 9px;border-radius:2px;
  letter-spacing:0.03em;
}
.showcase-card-body{padding:14px 16px;flex:1;display:flex;flex-direction:column}
.showcase-tag{font-family:var(--mono);font-size:0.65rem;text-transform:uppercase;letter-spacing:0.06em;color:var(--seal-deep)}
.showcase-card h3{margin:6px 0 4px;font-family:var(--serif);font-size:1.1rem;color:var(--iron)}
.showcase-card p{margin:0;font-size:0.8rem;color:var(--ink-soft);font-family:var(--mono)}

/* Shared two-line location/rating pattern for gallery card previews
   (showcase-card, mini-card, nearby-card) - location and rating on
   separate lines so they don't wrap mid-phrase in narrow cards.
   card-location and stay-note both reserve fixed multi-line height
   (2 lines / 3 lines) so every card in a row lines up at exactly the
   same points regardless of how much its own text actually wraps -
   content-driven whitespace is what made the grid look uneven. */
.card-location{margin:0 0 3px;min-height:3.1em}
.card-rating{padding-top:8px;font-weight:600;white-space:nowrap}
.showcase-card .card-rating{color:var(--seal-deep);text-align:center;margin-top:auto;font-size:0.78rem}
.nearby-card .card-rating{color:var(--seal-deep);margin-top:auto}

/* Castle detail page */
.castle-topbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;padding-top:22px}
.castle-topbar-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.rating-pill{font-family:var(--mono);font-size:0.8rem;color:var(--ink-soft)}
/* Prominent rating lead under the castle H1 - review-intent is the top way
   searchers reach this site (Search Console 2026-07-21), so it leads. */
.castle-locale{color:var(--ink-soft);font-family:var(--mono);font-size:0.9rem;margin:0 0 8px}
.castle-rating-lead{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0;font-size:1.05rem;color:var(--iron)}
.castle-rating-lead strong{color:var(--seal-deep);font-family:var(--serif)}
.rating-lead-count{color:var(--ink-soft);font-family:var(--mono);font-size:0.82rem}
.stars{display:inline-block;font-size:1.15rem;line-height:1}
.stars::before{
  content:"★★★★★";letter-spacing:2px;
  background:linear-gradient(90deg,var(--brass-light) calc(var(--rating)/5*100%),var(--line) calc(var(--rating)/5*100%));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
/* The castle's most search-worthy named figure, surfaced near the top.
   Same visual weight as .callout ("Worth the trip" / "Before you go") -
   the earlier inline-sentence version read weak/scrappy next to those two
   boxes (Stewart, 2026-07-21). Iron accent keeps it visually distinct from
   the seal (Worth the trip) and brass (Before you go) callouts, so all
   three read as related but separate categories, not duplicates. */
.castle-figure{
  border-left:4px solid var(--iron);
  background:var(--parchment2);
  padding:16px 20px;
  margin:0 0 20px;
  max-width:720px;
}
.castle-figure h4{
  font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.1em;
  color:var(--seal-deep);margin:0 0 6px;
}
.castle-figure p{margin:0;font-size:0.95rem;color:var(--iron)}
.castle-figure strong{color:var(--seal-deep)}
.ticket-badge{
  font-family:var(--mono);font-size:0.68rem;text-transform:uppercase;letter-spacing:0.06em;
  padding:5px 12px;border:1px solid var(--iron);color:var(--iron);border-radius:2px;
  text-decoration:none;display:inline-block;transition:opacity 0.15s;
}
a.ticket-badge:hover{opacity:0.72}
.ticket-badge.free{border-color:var(--seal);color:var(--seal-deep);background:#F6E8E1}
.ticket-badge.dog{border-color:var(--brass);color:var(--brass);background:var(--parchment2)}
/* Matches the brass FEATURED graphic on the hero Featured Castle card. */
.ticket-badge.featured{border-color:var(--brass);color:var(--parchment2);background:var(--brass)}
.ticket-badge.wedding{border-color:var(--seal);color:var(--seal-deep);background:var(--parchment2)}
.ticket-badge.garden{border-color:var(--brass);color:var(--brass);background:var(--parchment2)}
.ticket-badge.haunted{border-color:var(--iron);color:var(--iron);background:var(--parchment2)}
.ticket-badge.coastal{border-color:var(--brass);color:var(--brass);background:var(--parchment2)}
.ticket-badge.family{border-color:var(--brass);color:var(--brass);background:var(--parchment2)}
.ticket-badge.train{border-color:var(--brass);color:var(--brass);background:var(--parchment2)}
/* margin-top only (not shorthand margin) - deliberately leaves margin-left/
   right/bottom untouched so .wrap's margin:0 auto centering (same specificity,
   declared earlier) isn't silently overridden. The shorthand version of this
   rule was doing exactly that site-wide on every <hr class="ap-rule wrap">
   (428 castle pages): it zeroed the left/right margin, so on any viewport
   wider than 1120px the divider hugged the left edge instead of centering,
   visibly stopping short of the right edge. Found and fixed 2026-07-21. */
.ap-rule{border:none;border-top:3px double var(--brass-light);margin-top:18px}

.castle-head{padding-top:14px;padding-bottom:20px}
.breadcrumb{font-family:var(--mono);font-size:0.75rem;color:var(--ink-soft);margin-bottom:14px}
.breadcrumb a{color:var(--ink-soft);text-decoration:none}
.breadcrumb a:hover{color:var(--seal)}
.badge-row{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}
.badge{
  font-family:var(--mono);
  font-size:0.7rem;
  text-transform:uppercase;
  letter-spacing:0.05em;
  padding:4px 10px;
  border:1px solid var(--brass);
  border-radius:20px;
  color:var(--ink-soft);
  background:var(--parchment2);
}
.badge.stay{border-color:var(--seal);color:var(--seal-deep);background:#F6E8E1}
.rating-line{font-family:var(--mono);font-size:0.9rem;color:var(--ink-soft);margin-top:6px}
.rating-line b{color:var(--seal-deep);font-size:1.1rem}

.castle-columns{display:grid;grid-template-columns:1fr 1.25fr;gap:44px;padding-top:26px}
.castle-col-left,.castle-col-right{min-width:0}
@media (max-width:860px){.castle-columns{grid-template-columns:1fr}}
.castle-hero-boxed{width:100%;height:auto;border-radius:var(--radius);display:block;filter:sepia(8%) contrast(1.03) saturate(0.95);border:1px solid var(--line)}
.photo-credit{margin:4px 0 0;font-family:var(--mono);font-size:0.62rem;color:var(--ink-soft);text-align:right}
.thumb-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.thumb-row img{width:100%;height:110px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line);filter:sepia(8%) contrast(1.03) saturate(0.95)}

.col-label{
  font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.1em;
  color:var(--seal-deep);border-bottom:1px solid var(--brass-light);padding-bottom:6px;margin:24px 0 12px;
}
.fact-list{display:grid;grid-template-columns:auto 1fr;gap:5px 16px;margin:0;font-size:0.92rem}
.fact-list dt{font-family:var(--mono);font-size:0.75rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:0.04em}
.fact-list dd{margin:0;color:var(--ink)}
.contact-grid p{margin:0 0 8px;font-size:0.9rem}

/* Review-sourced parking / guided-tour notes: quoted, attributed, never asserted. */
.note-caveat{margin:0 0 12px;font-family:var(--mono);font-size:0.72rem;color:var(--ink-soft);max-width:520px}
.visitor-notes{gap:10px 16px;align-items:baseline}
.visitor-notes dd{font-style:italic;color:var(--ink);line-height:1.5}
.visitor-notes .note-cite{display:block;font-style:normal;font-family:var(--mono);font-size:0.72rem;color:var(--ink-soft);margin-top:3px}

.field-label{font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);margin-right:6px}

.pull-quote{
  border-left:3px solid var(--brass-light);margin:24px 0;padding:2px 0 2px 20px;
  font-family:var(--serif);font-style:italic;font-size:1.08rem;color:var(--iron);max-width:720px;
}
.pull-quote cite{display:block;margin-top:8px;font-family:var(--mono);font-style:normal;font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft)}

.blurb{font-size:1.18rem;line-height:1.6;max-width:720px;margin:24px 0}

/* Essay media - inline photos, image rows and video embeds used in
   long-form supplement pages (the-concentric-castle.html and similar). */
.essay-figure{margin:30px 0}
.essay-figure img{width:100%;height:auto;max-height:480px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line);display:block;filter:sepia(8%) contrast(1.03) saturate(0.95)}
.essay-figure figcaption{margin-top:8px;font-family:var(--mono);font-size:0.75rem;color:var(--ink-soft);text-align:center}

.video-figure{margin:30px 0}
.video-embed{position:relative;width:100%;padding-top:56.25%;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:#000}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-figure figcaption{margin-top:8px;font-family:var(--mono);font-size:0.75rem;color:var(--ink-soft);text-align:center}

.callout{
  border-left:4px solid var(--seal);
  background:var(--parchment2);
  padding:16px 20px;
  margin:20px 0;
  max-width:720px;
}
.callout h4{
  font-family:var(--mono);
  font-size:0.72rem;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:var(--seal-deep);
  margin:0 0 6px;
}
.callout p{margin:0}
.callout.intel{border-left-color:var(--brass)}
.callout.intel h4{color:var(--brass)}

.hours-table{font-family:var(--mono);font-size:0.85rem;border-collapse:collapse;margin:16px 0 0;max-width:420px}
.hours-table td{padding:3px 14px 3px 0;border-bottom:1px dotted var(--line)}
.hours-disclaimer{font-size:0.78rem;color:var(--ink-soft);font-style:italic;margin:10px 0 0;max-width:420px;line-height:1.4}
.hours-disclaimer a{font-style:normal}

.ai-summary{
  border:1px solid var(--brass);
  background:linear-gradient(135deg, var(--parchment2) 0%, #EFE9D6 100%);
  padding:20px 24px;
  border-radius:var(--radius);
  margin:18px 0;
  position:relative;
}
.ai-summary-label{
  font-family:var(--mono);
  font-size:0.68rem;
  letter-spacing:0.08em;
  color:var(--brass);
  margin-bottom:10px;
  display:flex;
  align-items:center;
  gap:8px;
}
.ai-summary-label::before{
  content:"";
  width:7px;height:7px;border-radius:50%;
  background:var(--seal);
  display:inline-block;
}
.ai-summary p{margin:0;font-size:1.05rem;line-height:1.6;color:var(--ink)}

.affiliate-note{margin:6px 0 14px;font-family:var(--mono);font-size:0.72rem;color:var(--ink-soft);max-width:520px}
.affiliate-note a{color:var(--ink-soft);text-decoration:underline}
.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:16px 0;max-width:760px}
.product-card{border:1px solid var(--line);background:var(--parchment2);padding:14px;border-radius:var(--radius);display:flex;flex-direction:column}
.product-card a{margin-top:auto;align-self:flex-start}
.product-card img{width:100%;height:150px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px;padding:6px;box-sizing:border-box}
.product-card a.product-img-link{margin:0;align-self:stretch;border:none;padding:0;display:block;background:none;border-radius:0}
.product-card a.product-img-link:hover{background:none}
.nearby-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin:16px 0;max-width:760px}
.nearby-card{
  display:flex;flex-direction:column;text-decoration:none;color:var(--ink);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  background:var(--parchment2);transition:transform 0.15s, box-shadow 0.15s;
}
.nearby-card:hover{transform:translateY(-3px);box-shadow:0 6px 16px var(--shadow)}
.nearby-card img{width:100%;height:100px;object-fit:cover;display:block;filter:sepia(8%) contrast(1.03) saturate(0.95)}
.nearby-card-placeholder{
  width:100%;height:100px;box-sizing:border-box;background:var(--parchment);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:6px;
  font-family:var(--mono);font-size:0.65rem;text-transform:uppercase;letter-spacing:0.04em;color:var(--ink-soft);
}
.nearby-card-body{padding:10px 12px;flex:1;display:flex;flex-direction:column}
.guide-date{margin:0 0 4px;font-family:var(--mono);font-size:0.66rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--seal-deep)}
.nearby-card h5{margin:0 0 4px;font-family:var(--serif);font-size:0.92rem;color:var(--iron);line-height:1.25}
.nearby-card p{margin:0;font-size:0.72rem;color:var(--ink-soft);font-family:var(--mono)}
.nearby-card .stay-note{margin-top:5px;font-family:var(--serif);font-style:italic;font-size:0.8rem;color:var(--ink);min-height:4.65em}
.showcase-card .stay-note{margin-top:5px;font-family:var(--serif);font-style:italic;font-size:0.78rem;color:var(--ink);min-height:4.65em}
.star{color:#FF9900}

/* Bigger variant for full-page galleries (sleep-in page, essay galleries) */
.stay-grid{max-width:none;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px}
.stay-grid img,.stay-grid .nearby-card-placeholder{height:160px}
.stay-grid .nearby-card-body{padding:14px 16px}
.stay-grid .nearby-card h5{font-size:1.05rem}
.stay-grid .nearby-card p{font-size:0.78rem}
.stay-grid .nearby-card .stay-note{font-size:0.88rem}

.product-cover-placeholder{
  width:100%;height:150px;box-sizing:border-box;margin-bottom:10px;
  background:var(--parchment);border:1px solid var(--line);border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:10px;
  font-family:var(--mono);font-size:0.7rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);
}
.product-card .ptype{font-family:var(--mono);font-size:0.65rem;text-transform:uppercase;color:var(--brass);letter-spacing:0.08em}
.product-card h5{margin:6px 0 4px;font-size:0.98rem;font-family:var(--serif)}
.product-card p{font-size:0.85rem;color:var(--ink-soft);margin:0 0 10px}
.product-card a{font-family:var(--mono);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.04em;text-decoration:none;color:var(--seal-deep);border:1px solid var(--seal-deep);padding:5px 10px;display:inline-block;border-radius:var(--radius)}
.product-card a:hover{background:var(--seal-deep);color:var(--parchment2)}

.tag-chips{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}
.tag-chip{font-family:var(--mono);font-size:0.68rem;text-transform:uppercase;letter-spacing:0.05em;background:var(--iron);color:var(--parchment2);padding:4px 10px;border-radius:20px;text-decoration:none}
.tag-chip:hover{background:var(--seal-deep);color:var(--parchment2)}

.related{margin-top:8px}
.related ul{list-style:none;padding:0;margin:0}
.related li{margin-bottom:6px}

/* Table (the roll ledger) */
table.ledger{width:100%;border-collapse:collapse;font-size:0.92rem}
table.ledger th{
  font-family:var(--mono);
  font-size:0.7rem;
  text-transform:uppercase;
  letter-spacing:0.06em;
  text-align:left;
  padding:8px 10px;
  background:var(--iron);
  color:var(--parchment2);
  position:sticky;top:0;
}
table.ledger td{padding:7px 10px;border-bottom:1px solid var(--line)}
table.ledger tr:nth-child(even) td{background:var(--parchment2)}
table.ledger a{text-decoration:none;font-weight:600}
.ledger-wrap{overflow-x:auto;border:1px solid var(--line)}
/* Sortable headers + filter controls for the Full Ledger */
table.ledger th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
table.ledger th.sortable:hover{background:var(--seal-deep)}
table.ledger th.sortable::after{content:"\2195";opacity:0.4;margin-left:6px;font-size:0.9em}
table.ledger th.sort-asc::after{content:"\2191";opacity:1}
table.ledger th.sort-desc::after{content:"\2193";opacity:1}
.ledger-filters{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:0 0 16px}
.ledger-filters label{font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);display:flex;align-items:center;gap:6px}
.ledger-filters select{
  font-family:var(--serif);
  font-size:0.9rem;
  padding:6px 8px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--parchment2);
  color:var(--ink);
}
.ledger-count{font-family:var(--mono);font-size:0.72rem;color:var(--seal);margin-left:auto}
.ledger-checks{display:flex;flex-wrap:wrap;gap:10px 20px;margin:0 0 16px}
/* Shown only when a filter arrives via URL (?filter=...), e.g. clicking a
   badge on a castle's own page - makes clear why the visitor landed here
   filtered rather than on the full 428-castle table, and what for. */
.ledger-head-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.ledger-filter-label{display:inline-flex;align-items:center;gap:10px;background:#F6E8E1;border:1px solid var(--seal);color:var(--seal-deep);font-family:var(--mono);font-size:0.82rem;padding:9px 16px;border-radius:var(--radius);margin:0}
.ledger-filter-label strong{font-weight:700;color:var(--seal)}
.ledger-filter-label button{font-family:var(--mono);font-size:0.7rem;text-transform:uppercase;letter-spacing:0.04em;background:none;border:none;color:var(--seal-deep);text-decoration:underline;cursor:pointer;padding:0}
.ledger-check{font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-soft);display:flex;align-items:center;gap:6px;cursor:pointer}
.ledger-check input{accent-color:var(--seal);width:15px;height:15px;cursor:pointer}
.ledger-reset{
  font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;
  color:var(--seal-deep);background:none;border:none;padding:0;margin-left:auto;
  text-decoration:underline;cursor:pointer;
}
.ledger-reset:hover{color:var(--seal)}
.ledger-view-toggle{display:flex;gap:0;margin:0 0 20px;width:fit-content;border:1px solid var(--seal-deep);border-radius:var(--radius);overflow:hidden}
.ledger-view-btn{font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--seal-deep);background:var(--parchment2);border:none;padding:8px 16px;cursor:pointer}
.ledger-view-btn + .ledger-view-btn{border-left:1px solid var(--seal-deep)}
.ledger-view-btn.active{background:var(--seal-deep);color:var(--parchment2)}
.ledger-view-btn:not(.active):hover{background:#F6E8E1}
/* On phones, stack the filters and right-justify the selects into a clean
   column so their edges line up instead of stepping with the label widths. */
@media (max-width:640px){
  .ledger-filters{flex-direction:column;align-items:stretch;gap:10px}
  .ledger-filters label{width:100%;justify-content:space-between}
  .ledger-filters select{width:60%}
  .ledger-count{margin-left:0;width:100%}
  .ledger-checks{gap:10px 16px}
  .ledger-reset{margin-left:0;width:100%;text-align:right}
}

.search-box{margin:20px 0}
.search-box input{
  width:100%;
  max-width:420px;
  font-family:var(--serif);
  font-size:1.05rem;
  padding:10px 14px;
  border:1px solid var(--brass);
  background:var(--parchment2);
  border-radius:var(--radius);
}

/* Map */
#castle-map{height:420px;border:1px solid var(--line);margin:20px 0;filter:sepia(15%) contrast(1.02)}
#ledger-map{height:420px;border:1px solid var(--line);margin:16px 0;filter:sepia(15%) contrast(1.02)}
.castle-map-tooltip{background:var(--parchment2);border:1px solid var(--iron);color:var(--ink);font-family:var(--serif);font-size:0.85rem;padding:4px 10px;border-radius:2px;box-shadow:0 2px 8px var(--shadow)}
.castle-map-tooltip a{color:var(--seal-deep);text-decoration:none}
.castle-map-tooltip a:hover{text-decoration:underline}
.castle-map-tooltip::before{border-top-color:var(--iron)}
.station-map-icon{width:10px;height:10px;background:#2E5C8A;border:1px solid var(--parchment2);box-shadow:0 0 0 1px #2E5C8A}

/* End-of-page "where next" links - was a bare paragraph of default-underlined
   links separated by a middot, now a row of chips matching the Shop's
   "Find it on Amazon" button style for a consistent look across the site. */
.next-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.next-links a{font-family:var(--mono);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.04em;text-decoration:none;color:var(--seal-deep);border:1px solid var(--seal-deep);padding:8px 14px;border-radius:var(--radius);display:inline-block}
.next-links a:hover{background:var(--seal-deep);color:var(--parchment2)}

/* Footer */
footer{
  border-top:4px double var(--brass-light);
  background:var(--iron);
  color:var(--parchment2);
  padding:30px 0;
  margin-top:40px;
  font-size:0.88rem;
}
footer a{color:var(--brass-light);display:block;padding:6px 2px}
footer .foot-grid{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

.faq-item{margin-bottom:18px;max-width:760px}
.faq-item h3{font-size:1.05rem;margin:0 0 6px}
.faq-item p{margin:0;color:var(--ink-soft)}
/* /faq body: .wrap zeroes the section's vertical padding, which left the first
   question glued to the hero divider. Restore the standard section rhythm so
   the answers sit clear of the rule, and give each Q–A pair room to breathe. */
.faq-page{padding-top:40px;padding-bottom:56px}
.faq-page .faq-item{margin-bottom:26px}
.castle-faq{max-width:760px}
.castle-faq .faq-item{margin-bottom:14px}

.go-deeper ul{list-style:none;margin:10px 0 0;padding:0}
.go-deeper li{margin:0 0 8px}
.go-deeper a{font-weight:500}

.two-col{display:grid;grid-template-columns:1.3fr 0.9fr;gap:40px}
@media (max-width:820px){.two-col{grid-template-columns:1fr}}

/* Photo lightbox */
.lightbox-modal{
  display:none;position:fixed;inset:0;z-index:1000;
  background:#15110A;
  grid-template-rows:auto 1fr auto;
  padding:16px;
}
.lightbox-modal.open{display:grid}
.lightbox-top{display:flex;justify-content:space-between;align-items:center;color:var(--parchment2)}
.lightbox-counter{font-family:var(--mono);font-size:0.85rem;color:var(--brass-light);letter-spacing:0.04em}
.lightbox-close{
  font-family:var(--mono);font-size:0.8rem;text-transform:uppercase;letter-spacing:0.05em;
  background:none;border:1px solid var(--brass-light);color:var(--parchment2);
  padding:7px 14px;border-radius:2px;cursor:pointer;
}
.lightbox-close:hover{background:var(--brass-light);color:var(--iron)}
.lightbox-image{
  grid-row:2;justify-self:center;align-self:center;
  max-width:min(92vw,1100px);max-height:72vh;object-fit:contain;
  border:1px solid var(--brass-light);
}
.lightbox-nav{
  position:fixed;top:50%;transform:translateY(-50%);z-index:1001;
  width:46px;height:46px;border-radius:50%;
  background:rgba(42,35,24,0.6);border:1px solid var(--brass-light);color:var(--parchment2);
  font-size:1.2rem;cursor:pointer;
}
.lightbox-nav:hover{background:var(--seal-deep)}
.lightbox-prev{left:20px}
.lightbox-next{right:20px}
.lightbox-strip{
  grid-row:3;display:flex;gap:8px;justify-content:center;overflow-x:auto;padding-top:12px;
}
.lightbox-strip img{
  width:64px;height:48px;object-fit:cover;border-radius:2px;cursor:pointer;
  opacity:0.55;border:2px solid transparent;
}
.lightbox-strip img:hover{opacity:0.85}
.lightbox-strip img.active{opacity:1;border-color:var(--seal)}
@media (max-width:600px){
  .lightbox-nav{width:38px;height:38px;font-size:1rem}
  .lightbox-prev{left:6px}
  .lightbox-next{right:6px}
}

/* Stat gallery modal - reused by all 4 hero stats */
.gallery-modal{
  display:none;position:fixed;inset:0;z-index:1000;
  background:#15110A;padding:20px;
  grid-template-rows:auto 1fr;
}
.gallery-modal.open{display:grid}
.gallery-modal-top{display:flex;justify-content:space-between;align-items:center;color:var(--parchment2);margin-bottom:16px}
.gallery-modal-title{font-family:var(--mono);font-size:0.85rem;color:var(--brass-light);letter-spacing:0.04em;text-transform:uppercase}

.gallery-nations{display:none;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;overflow-y:auto;align-content:start;max-width:900px;margin:0 auto;width:100%}
.gallery-nations.show{display:grid}
.country-card{
  position:relative;display:flex;align-items:flex-end;min-height:150px;
  background-color:var(--parchment2);background-size:cover;background-position:center;
  border:1px solid var(--brass-light);border-radius:var(--radius);overflow:hidden;text-decoration:none;
  transition:transform 0.15s, box-shadow 0.15s;
}
.country-card:hover{transform:translateY(-3px);box-shadow:0 6px 16px var(--shadow)}
.country-card-scrim{width:100%;padding:16px 20px;text-align:center;background:linear-gradient(transparent, rgba(20,16,10,0.85) 60%)}
.country-card h3{margin:0 0 6px;font-family:var(--display);font-size:1.6rem;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,0.7)}
.country-card p{margin:0;font-family:var(--mono);font-size:0.85rem;color:var(--parchment2)}

.gallery-grid{display:none;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));grid-auto-rows:min-content;gap:16px;overflow-y:auto;align-content:start;align-items:start;padding-bottom:20px}
.gallery-grid.show{display:grid}
.mini-card{
  display:block;text-decoration:none;color:var(--parchment2);
  background:#2A2318;border:1px solid #4A4030;border-radius:var(--radius);overflow:hidden;
  transition:transform 0.15s, border-color 0.15s;
}
.mini-card:hover{border-color:var(--brass-light);transform:translateY(-2px)}
.mini-card-img{display:block;width:100%;height:150px;object-fit:cover;background-color:#3B3226;filter:sepia(8%) contrast(1.03) saturate(0.95)}
.mini-card-body{padding:12px 14px;height:100px;box-sizing:border-box;overflow:hidden}
.mini-card-body h3{
  margin:0 0 4px;font-family:var(--serif);font-size:1rem;color:var(--parchment2);line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.mini-card-body p{
  margin:0;font-family:var(--mono);font-size:0.72rem;color:var(--brass-light);line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.mini-card-body .card-location{opacity:0.85}

/* ---- Live-search gallery view -------------------------------------------
   When the visitor types a name query, showRegionalListing() adds .gallery
   to #regional-listing and the result rows flip from the 2-column text list
   into a grid of photo cards. The <img> is hidden outside gallery mode, so
   it costs nothing in the default list view. */
.gallery-thumb{display:none}
.gallery-rating{display:none}  /* shown only in the search gallery, below */

/* Cards are sized to match the "top-rated castles" showcase grid exactly:
   5 across (3 on tablet, 2 on mobile), 170px photo, same padding + fonts. */
#regional-listing.gallery .circuit h3{margin-bottom:20px}
#regional-listing.gallery .roll-list{
  columns:auto;                /* undo the 2-column text flow */
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:20px;
}
@media (max-width:980px){#regional-listing.gallery .roll-list{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){#regional-listing.gallery .roll-list{grid-template-columns:repeat(2,1fr)}}
/* Phones: one full-width card per row so the rating line can't be clipped and
   single results don't leave an empty second column. */
@media (max-width:520px){#regional-listing.gallery .roll-list{grid-template-columns:1fr}}
/* Safety net: in any narrow card the rating wraps rather than clipping. */
@media (max-width:640px){.card-rating,.gallery-rating{white-space:normal}}
#regional-listing.gallery .roll-list li{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  margin:0;
  padding:0;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--parchment2);
  overflow:hidden;
  transition:transform 0.15s, box-shadow 0.15s;
}
#regional-listing.gallery .roll-list li:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 16px var(--shadow);
}
#regional-listing.gallery .gallery-thumb{
  display:block;
  width:100%;
  height:170px;
  object-fit:cover;
  filter:sepia(8%) contrast(1.03) saturate(0.95);
  background:var(--parchment-dark);
}
#regional-listing.gallery .roll-list li a{
  font-family:var(--serif);
  font-weight:600;
  font-size:1.1rem;
  line-height:1.2;
  color:var(--iron);
  padding:14px 16px 4px;
}
#regional-listing.gallery .roll-list li .region{
  font-family:var(--mono);
  font-size:0.8rem;
  color:var(--ink-soft);
  padding:0 16px 6px;
  white-space:normal;
}
/* rating line, matched to the top-rated cards; margin-top:auto pins it to the
   bottom so ratings align across a row regardless of name/region length */
#regional-listing.gallery .roll-list li .gallery-rating{
  display:block;
  margin-top:auto;
  padding:8px 16px 14px;
  font-family:var(--mono);
  font-weight:600;
  font-size:0.78rem;
  color:var(--seal-deep);
  text-align:center;
  white-space:nowrap;
}
/* whole card is one click target */
#regional-listing.gallery .roll-list li a::after{content:"";position:absolute;inset:0}
/* lettered parchment fallback for the few castles with no hero photo */
#regional-listing.gallery .roll-list li.no-photo::before{
  content:attr(data-letter);
  display:flex;
  align-items:center;
  justify-content:center;
  height:170px;
  font-family:var(--display);
  font-size:3rem;
  color:var(--brass-light);
  background:var(--parchment-dark);
}

/* ---- Homepage hero: content + Featured Castle ad slot ------------------- */
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:44px;align-items:start}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:30px}
  /* Below 900px the grid drops to one column, so the featured-castle card
     (sized for a fixed 380px sidebar) would otherwise stretch to the full
     content width - on an iPad in portrait that reads as an oversized
     banner rather than a compact card. Cap it and center it instead. */
  .hero-aside{max-width:420px;margin:0 auto}
}

.hero-aside{align-self:start}
.ad-card{
  display:block;position:relative;text-decoration:none;color:var(--ink);
  border:1px solid var(--brass-light);border-radius:var(--radius);overflow:hidden;
  background:var(--parchment2);box-shadow:0 2px 8px var(--shadow);
  transition:transform .15s, box-shadow .15s;
}
.ad-card:hover{transform:translateY(-2px);box-shadow:0 7px 18px var(--shadow)}
.ad-card > img,.ad-media-fallback,.ad-media-logo{display:block;width:100%;height:220px;object-fit:cover}
.ad-media-fallback{background:var(--iron);display:flex;align-items:center;justify-content:center}
.ad-media-logo{background:var(--iron)}
.ad-house-icon{width:104px;height:auto}
.ad-label{
  position:absolute;top:10px;right:10px;z-index:1;
  font-family:var(--mono);font-size:0.62rem;letter-spacing:0.08em;text-transform:uppercase;
  background:rgba(42,35,24,0.82);color:var(--parchment2);padding:3px 9px;border-radius:2px;
}
.ad-label-house{background:var(--brass)}
.ad-label-editorial{background:var(--brass);letter-spacing:0.06em}
.ad-rating{font-family:var(--mono);font-weight:600;font-size:0.9rem;color:var(--seal-deep);margin:0 0 16px}
.ad-body{padding:20px 22px 24px;text-align:center}
.ad-eyebrow{font-family:var(--mono);font-size:0.66rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--brass);margin:0 0 8px}
.ad-title{font-family:var(--serif);font-weight:600;font-size:1.55rem;color:var(--iron);margin:0 0 6px;line-height:1.12}
.ad-location{font-family:var(--mono);font-size:0.78rem;color:var(--ink-soft);margin:0 0 14px}
.ad-tagline{font-family:var(--serif);font-style:italic;font-size:1.02rem;color:var(--ink);margin:0 0 18px}
.ad-cta{
  display:inline-block;font-family:var(--mono);font-size:0.72rem;text-transform:uppercase;letter-spacing:0.06em;
  color:var(--iron);border:1px solid var(--iron);border-radius:var(--radius);padding:9px 18px;transition:background .15s,color .15s;
}
.ad-card:hover .ad-cta{background:var(--iron);color:var(--parchment2)}

/* Ranked national list (best-castles-to-visit-uk) */
.rank-entry{display:grid;grid-template-columns:280px 1fr;gap:22px;align-items:start;margin-bottom:38px}
.rank-photo{position:relative;display:block}
.rank-photo img{width:100%;height:190px;object-fit:cover;border-radius:var(--radius);border:1px solid var(--line);display:block;filter:sepia(8%) contrast(1.03) saturate(0.95)}
.rank-photo .nearby-card-placeholder{height:190px;border-radius:var(--radius)}
.rank-no{position:absolute;top:10px;left:10px;background:var(--iron);color:var(--parchment2);font-family:var(--mono);font-size:0.8rem;letter-spacing:0.08em;padding:4px 10px;border-radius:var(--radius);box-shadow:0 1px 4px var(--shadow)}
.rank-body h3{margin:0 0 5px;font-family:var(--serif);font-size:1.35rem;line-height:1.25}
.rank-body h3 a{color:var(--iron);text-decoration:none}
.rank-body h3 a:hover{text-decoration:underline}
.rank-meta{margin:0 0 4px;font-family:var(--mono);font-size:0.75rem;color:var(--ink-soft)}
.rank-rating{margin:0 0 10px;font-family:var(--mono);font-size:0.85rem;color:var(--seal-deep)}
.rank-blurb{margin:0 0 8px;font-size:0.95rem;line-height:1.55}
.rank-link{margin:0;font-size:0.85rem}
@media(max-width:720px){.rank-entry{grid-template-columns:1fr;gap:12px}.rank-photo img{height:200px}}
.free-flag{display:inline-block;background:var(--brass);color:var(--parchment2);font-family:var(--mono);font-size:0.62rem;letter-spacing:0.08em;text-transform:uppercase;padding:1px 7px;border-radius:var(--radius);vertical-align:1px}
.shop-tile{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--line)}
.shop-tile img{width:100%;height:79px;object-fit:contain;background:#fff;display:block;padding:6px;box-sizing:border-box}