/* GENERATED by scripts/build_v2_css.py - edit the source files, not this one. */

/* ==== tokens.css ==== */
/* VeriaGuide v2 design tokens. Single source for color, type, space, radius, shadow, motion. */
@font-face {
    font-family: "Literata";
    src: url("/static/fonts/literata-latin-wght-normal.woff2") format("woff2");
    font-weight: 200 900;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Literata";
    src: url("/static/fonts/literata-greek-wght-normal.woff2") format("woff2");
    font-weight: 200 900;
    font-display: swap;
    unicode-range: U+0370-03FF;
}
@font-face {
    font-family: "Inter";
    src: url("/static/fonts/inter-latin-wght-normal.woff2") format("woff2");
    font-weight: 100 900;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Inter";
    src: url("/static/fonts/inter-greek-wght-normal.woff2") format("woff2");
    font-weight: 100 900;
    font-display: swap;
    unicode-range: U+0370-03FF;
}

:root {
    /* Color: sand, ink, olive, terracotta, blue */
    --sand-50: #fbf7f0;
    --sand-100: #f3ebdd;
    --sand-200: #e9dfcb;
    --sand-300: #dccfb6;
    --ink-900: #241f19;
    --ink-700: #3d362d;
    --ink-600: #5b5247;
    --olive-600: #566a33;
    --olive-100: #e6ecd8;
    --terracotta-600: #a9472a;
    --terracotta-700: #8a3a22;
    --terracotta-100: #f6e1d8;
    --blue-800: #123c70;
    --blue-700: #194c8c;
    --blue-600: #1f5aa6;
    --blue-100: #dde8f5;
    --white: #fff;
    --danger: #b3261e;
    --success: var(--olive-600);

    /* Semantic roles */
    --bg: var(--sand-50);
    --surface: var(--white);
    --surface-alt: var(--sand-100);
    --border: var(--sand-300);
    --text: var(--ink-900);
    --text-muted: var(--ink-600);
    --link: var(--blue-800);
    --link-hover: var(--blue-600);
    --cta: var(--terracotta-600);
    --cta-hover: var(--terracotta-700);
    --focus: var(--blue-600);

    /* Type */
    --font-display: "Literata", Georgia, "Times New Roman", serif;
    --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
    --text-2xl: clamp(1.5rem, 1.25rem + 1vw, 1.875rem);
    --text-3xl: clamp(1.875rem, 1.45rem + 1.8vw, 2.5rem);
    --text-4xl: clamp(2.25rem, 1.6rem + 3vw, 3.75rem);
    --leading-body: 1.6;
    --leading-display: 1.15;

    /* Space (4px base) */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4.5rem;
    --space-9: 6rem;

    /* Shape and depth */
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 24px;
    --radius-pill: 999px;
    --shadow-1: 0 1px 2px rgba(60, 40, 20, 0.08), 0 2px 8px rgba(60, 40, 20, 0.06);
    --shadow-2: 0 4px 12px rgba(60, 40, 20, 0.10), 0 12px 32px rgba(60, 40, 20, 0.10);

    /* Layout */
    --container: 72rem;
    --gutter: clamp(1rem, 4vw, 2rem);
    --tap-min: 44px;

    /* Motion */
    --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
    --dur-fast: 150ms;
    --dur: 250ms;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --dur-fast: 0.01ms;
        --dur: 0.01ms;
    }
}


/* ==== base.css ==== */
/* VeriaGuide v2 base: reset, typography, layout primitives, shared controls. */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-padding-top: 5rem; }

body.theme-new {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: var(--font-body);
    font-size: var(--text-base);
    line-height: var(--leading-body);
    -webkit-font-smoothing: antialiased;
}

:where(.theme-new) :is(img, svg, video) { max-width: 100%; height: auto; display: block; }

:where(.theme-new) :is(h1, h2, h3, h4) {
    font-family: var(--font-display);
    font-weight: 600;
    line-height: var(--leading-display);
    letter-spacing: -0.01em;
    margin: 0 0 var(--space-4);
    text-wrap: balance;
}
:where(.theme-new) h1 { font-size: var(--text-4xl); }
:where(.theme-new) h2 { font-size: var(--text-3xl); }
:where(.theme-new) h3 { font-size: var(--text-2xl); }
:where(.theme-new) h4 { font-size: var(--text-xl); }
:where(.theme-new) p { margin: 0 0 var(--space-4); text-wrap: pretty; }

:where(.theme-new) a { color: var(--link); text-underline-offset: 0.2em; }
:where(.theme-new) a:hover { color: var(--link-hover); }

/* Focus: always visible */
.theme-new :focus-visible {
    outline: 3px solid var(--focus);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

.skip-link {
    position: absolute;
    left: var(--space-4);
    top: -4rem;
    z-index: 2000;
    padding: var(--space-3) var(--space-4);
    background: var(--blue-800);
    color: var(--white);
    border-radius: var(--radius-sm);
    transition: top var(--dur-fast) var(--ease);
}
.skip-link:focus { top: var(--space-3); color: var(--white); }

.visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* Layout primitives */
.container-v2 { width: min(100% - 2 * var(--gutter), var(--container)); margin-inline: auto; }
.section { padding-block: var(--space-8); }
.section--alt { background: var(--surface-alt); }
.stack > * + * { margin-top: var(--space-4); }
.cluster { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.grid-cards {
    display: grid;
    gap: var(--space-5);
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
}
.eyebrow {
    font-size: var(--text-sm);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--terracotta-700);
}

/* Buttons */
.btn-v2 {
    display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
    min-height: var(--tap-min); padding: 0 var(--space-5);
    border: 2px solid transparent; border-radius: var(--radius-pill);
    font: 600 var(--text-base)/1 var(--font-body);
    text-decoration: none; cursor: pointer;
    transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.btn-v2--primary { background: var(--cta); color: var(--white); }
.btn-v2--primary:hover { background: var(--cta-hover); color: var(--white); }
.btn-v2--secondary { background: transparent; color: var(--blue-800); border-color: var(--blue-800); }
.btn-v2--secondary:hover { background: var(--blue-800); color: var(--white); }

/* Tags */
.tag {
    display: inline-flex; align-items: center;
    padding: 0.2rem 0.7rem; border-radius: var(--radius-pill);
    background: var(--sand-200); color: var(--ink-700);
    font-size: var(--text-xs); font-weight: 600;
}
.tag--olive { background: var(--olive-100); color: #3f4f23; }
.tag--blue { background: var(--blue-100); color: var(--blue-800); }

/* Skeleton */
.skeleton {
    background: linear-gradient(90deg, var(--sand-100) 25%, var(--sand-200) 50%, var(--sand-100) 75%);
    background-size: 200% 100%;
    border-radius: var(--radius-sm);
    animation: skeleton-shimmer 1.4s linear infinite;
}
@keyframes skeleton-shimmer { to { background-position: -200% 0; } }

@media (prefers-reduced-motion: reduce) {
    .skeleton { animation: none; }
    html { scroll-behavior: auto; }
}

/* Mini reboot (replaces the parts of Bootstrap's reboot the markup relied on) */
body.theme-new { min-height: 100vh; }
:where(.theme-new) :is(ul, ol) { padding-left: 1.5rem; margin: 0 0 var(--space-4); }
:where(.theme-new) :is(button, input, select, textarea) { font-family: inherit; }
:where(.theme-new) button { cursor: pointer; }
:where(.theme-new) hr { border: 0; border-top: 1px solid var(--border); margin: var(--space-5) 0; }
:where(.theme-new) table { border-collapse: collapse; }
:where(.theme-new) label { display: inline-block; }
:where(.theme-new) :is(iframe) { border: 0; max-width: 100%; }
:where(.theme-new) :is(blockquote) { margin: 0 0 var(--space-4); padding-left: var(--space-4); border-left: 3px solid var(--sand-300); color: var(--ink-700); }
:where(.theme-new) fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }


/* ==== compat.css ==== */
/* VeriaGuide v2 compat layer: the subset of Bootstrap utilities/components still used by shared markup,
   rebuilt on v2 tokens so Bootstrap itself is no longer loaded in the new theme.
   Generated sections (grid, spacing) are plain CSS; edit with care. */
:root { --g: 1.5rem; --bp-md: 768px; --bp-lg: 992px; --bp-xl: 1200px; }

/* ---- Grid ---- */
.container, .container-fluid { width: min(100% - 2 * var(--gutter), var(--container)); margin-inline: auto; }
.container-fluid { width: 100%; padding-inline: var(--gutter); }
.row { --gx: var(--g); --gy: 0px; display: flex; flex-wrap: wrap; margin-inline: calc(var(--gx) / -2); margin-top: calc(var(--gy) * -1); }
.row > * { box-sizing: border-box; flex-shrink: 0; width: 100%; max-width: 100%; padding-inline: calc(var(--gx) / 2); margin-top: var(--gy); }
.col { flex: 1 0 0%; }
.col-auto { flex: 0 0 auto; width: auto; }

.col-1 { flex: 0 0 auto; width: 8.33333%; }
.col-2 { flex: 0 0 auto; width: 16.6667%; }
.col-3 { flex: 0 0 auto; width: 25%; }
.col-4 { flex: 0 0 auto; width: 33.3333%; }
.col-5 { flex: 0 0 auto; width: 41.6667%; }
.col-6 { flex: 0 0 auto; width: 50%; }
.col-7 { flex: 0 0 auto; width: 58.3333%; }
.col-8 { flex: 0 0 auto; width: 66.6667%; }
.col-9 { flex: 0 0 auto; width: 75%; }
.col-10 { flex: 0 0 auto; width: 83.3333%; }
.col-11 { flex: 0 0 auto; width: 91.6667%; }
.col-12 { flex: 0 0 auto; width: 100%; }
@media (min-width: 768px) {
  .col-md { flex: 1 0 0%; } .col-md-auto { flex: 0 0 auto; width: auto; }
  .col-md-1 { flex: 0 0 auto; width: 8.33333%; }
  .col-md-2 { flex: 0 0 auto; width: 16.6667%; }
  .col-md-3 { flex: 0 0 auto; width: 25%; }
  .col-md-4 { flex: 0 0 auto; width: 33.3333%; }
  .col-md-5 { flex: 0 0 auto; width: 41.6667%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
  .col-md-7 { flex: 0 0 auto; width: 58.3333%; }
  .col-md-8 { flex: 0 0 auto; width: 66.6667%; }
  .col-md-9 { flex: 0 0 auto; width: 75%; }
  .col-md-10 { flex: 0 0 auto; width: 83.3333%; }
  .col-md-11 { flex: 0 0 auto; width: 91.6667%; }
  .col-md-12 { flex: 0 0 auto; width: 100%; }
}
@media (min-width: 992px) {
  .col-lg { flex: 1 0 0%; } .col-lg-auto { flex: 0 0 auto; width: auto; }
  .col-lg-1 { flex: 0 0 auto; width: 8.33333%; }
  .col-lg-2 { flex: 0 0 auto; width: 16.6667%; }
  .col-lg-3 { flex: 0 0 auto; width: 25%; }
  .col-lg-4 { flex: 0 0 auto; width: 33.3333%; }
  .col-lg-5 { flex: 0 0 auto; width: 41.6667%; }
  .col-lg-6 { flex: 0 0 auto; width: 50%; }
  .col-lg-7 { flex: 0 0 auto; width: 58.3333%; }
  .col-lg-8 { flex: 0 0 auto; width: 66.6667%; }
  .col-lg-9 { flex: 0 0 auto; width: 75%; }
  .col-lg-10 { flex: 0 0 auto; width: 83.3333%; }
  .col-lg-11 { flex: 0 0 auto; width: 91.6667%; }
  .col-lg-12 { flex: 0 0 auto; width: 100%; }
}
@media (min-width: 1200px) {
  .col-xl { flex: 1 0 0%; } .col-xl-auto { flex: 0 0 auto; width: auto; }
  .col-xl-1 { flex: 0 0 auto; width: 8.33333%; }
  .col-xl-2 { flex: 0 0 auto; width: 16.6667%; }
  .col-xl-3 { flex: 0 0 auto; width: 25%; }
  .col-xl-4 { flex: 0 0 auto; width: 33.3333%; }
  .col-xl-5 { flex: 0 0 auto; width: 41.6667%; }
  .col-xl-6 { flex: 0 0 auto; width: 50%; }
  .col-xl-7 { flex: 0 0 auto; width: 58.3333%; }
  .col-xl-8 { flex: 0 0 auto; width: 66.6667%; }
  .col-xl-9 { flex: 0 0 auto; width: 75%; }
  .col-xl-10 { flex: 0 0 auto; width: 83.3333%; }
  .col-xl-11 { flex: 0 0 auto; width: 91.6667%; }
  .col-xl-12 { flex: 0 0 auto; width: 100%; }
}
.g-0 { --gx: 0; --gy: 0; } .gx-0 { --gx: 0; } .gy-0 { --gy: 0; }
.g-1 { --gx: .25rem; --gy: .25rem; } .gx-1 { --gx: .25rem; } .gy-1 { --gy: .25rem; }
.g-2 { --gx: .5rem; --gy: .5rem; } .gx-2 { --gx: .5rem; } .gy-2 { --gy: .5rem; }
.g-3 { --gx: 1rem; --gy: 1rem; } .gx-3 { --gx: 1rem; } .gy-3 { --gy: 1rem; }
.g-4 { --gx: 1.5rem; --gy: 1.5rem; } .gx-4 { --gx: 1.5rem; } .gy-4 { --gy: 1.5rem; }
.g-5 { --gx: 3rem; --gy: 3rem; } .gx-5 { --gx: 3rem; } .gy-5 { --gy: 3rem; }
@media (min-width: 992px) { .g-lg-0 { --gx: 0; --gy: 0; } .g-lg-1 { --gx: .25rem; --gy: .25rem; } .g-lg-2 { --gx: .5rem; --gy: .5rem; } .g-lg-3 { --gx: 1rem; --gy: 1rem; } .g-lg-4 { --gx: 1.5rem; --gy: 1.5rem; } .g-lg-5 { --gx: 3rem; --gy: 3rem; } }

/* ---- Spacing ---- */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: .25rem !important; }
.mt-2 { margin-top: .5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.mt-auto { margin-top: auto !important; }
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: .25rem !important; }
.mb-2 { margin-bottom: .5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
.mb-auto { margin-bottom: auto !important; }
.ms-0 { margin-inline-start: 0 !important; }
.ms-1 { margin-inline-start: .25rem !important; }
.ms-2 { margin-inline-start: .5rem !important; }
.ms-3 { margin-inline-start: 1rem !important; }
.ms-4 { margin-inline-start: 1.5rem !important; }
.ms-5 { margin-inline-start: 3rem !important; }
.ms-auto { margin-inline-start: auto !important; }
.me-0 { margin-inline-end: 0 !important; }
.me-1 { margin-inline-end: .25rem !important; }
.me-2 { margin-inline-end: .5rem !important; }
.me-3 { margin-inline-end: 1rem !important; }
.me-4 { margin-inline-end: 1.5rem !important; }
.me-5 { margin-inline-end: 3rem !important; }
.me-auto { margin-inline-end: auto !important; }
.mx-0 { margin-inline: 0 !important; }
.mx-1 { margin-inline: .25rem !important; }
.mx-2 { margin-inline: .5rem !important; }
.mx-3 { margin-inline: 1rem !important; }
.mx-4 { margin-inline: 1.5rem !important; }
.mx-5 { margin-inline: 3rem !important; }
.mx-auto { margin-inline: auto !important; }
.my-0 { margin-block: 0 !important; }
.my-1 { margin-block: .25rem !important; }
.my-2 { margin-block: .5rem !important; }
.my-3 { margin-block: 1rem !important; }
.my-4 { margin-block: 1.5rem !important; }
.my-5 { margin-block: 3rem !important; }
.my-auto { margin-block: auto !important; }
.m-0 { margin: 0 !important; }
.m-1 { margin: .25rem !important; }
.m-2 { margin: .5rem !important; }
.m-3 { margin: 1rem !important; }
.m-4 { margin: 1.5rem !important; }
.m-5 { margin: 3rem !important; }
.m-auto { margin: auto !important; }
.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: .25rem !important; }
.pt-2 { padding-top: .5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }
.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: .25rem !important; }
.pb-2 { padding-bottom: .5rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pb-5 { padding-bottom: 3rem !important; }
.ps-0 { padding-inline-start: 0 !important; }
.ps-1 { padding-inline-start: .25rem !important; }
.ps-2 { padding-inline-start: .5rem !important; }
.ps-3 { padding-inline-start: 1rem !important; }
.ps-4 { padding-inline-start: 1.5rem !important; }
.ps-5 { padding-inline-start: 3rem !important; }
.pe-0 { padding-inline-end: 0 !important; }
.pe-1 { padding-inline-end: .25rem !important; }
.pe-2 { padding-inline-end: .5rem !important; }
.pe-3 { padding-inline-end: 1rem !important; }
.pe-4 { padding-inline-end: 1.5rem !important; }
.pe-5 { padding-inline-end: 3rem !important; }
.px-0 { padding-inline: 0 !important; }
.px-1 { padding-inline: .25rem !important; }
.px-2 { padding-inline: .5rem !important; }
.px-3 { padding-inline: 1rem !important; }
.px-4 { padding-inline: 1.5rem !important; }
.px-5 { padding-inline: 3rem !important; }
.py-0 { padding-block: 0 !important; }
.py-1 { padding-block: .25rem !important; }
.py-2 { padding-block: .5rem !important; }
.py-3 { padding-block: 1rem !important; }
.py-4 { padding-block: 1.5rem !important; }
.py-5 { padding-block: 3rem !important; }
.p-0 { padding: 0 !important; }
.p-1 { padding: .25rem !important; }
.p-2 { padding: .5rem !important; }
.p-3 { padding: 1rem !important; }
.p-4 { padding: 1.5rem !important; }
.p-5 { padding: 3rem !important; }
@media (min-width: 768px) {
  .mb-md-0 { margin-bottom: 0 !important; } .mt-md-0 { margin-top: 0 !important; } .me-md-0 { margin-inline-end: 0 !important; }
  .mb-md-1 { margin-bottom: .25rem !important; } .mt-md-1 { margin-top: .25rem !important; } .me-md-1 { margin-inline-end: .25rem !important; }
  .mb-md-2 { margin-bottom: .5rem !important; } .mt-md-2 { margin-top: .5rem !important; } .me-md-2 { margin-inline-end: .5rem !important; }
  .mb-md-3 { margin-bottom: 1rem !important; } .mt-md-3 { margin-top: 1rem !important; } .me-md-3 { margin-inline-end: 1rem !important; }
  .mb-md-4 { margin-bottom: 1.5rem !important; } .mt-md-4 { margin-top: 1.5rem !important; } .me-md-4 { margin-inline-end: 1.5rem !important; }
  .mb-md-5 { margin-bottom: 3rem !important; } .mt-md-5 { margin-top: 3rem !important; } .me-md-5 { margin-inline-end: 3rem !important; }
}
@media (min-width: 992px) {
  .mb-lg-0 { margin-bottom: 0 !important; } .mt-lg-0 { margin-top: 0 !important; } .me-lg-0 { margin-inline-end: 0 !important; }
  .mb-lg-1 { margin-bottom: .25rem !important; } .mt-lg-1 { margin-top: .25rem !important; } .me-lg-1 { margin-inline-end: .25rem !important; }
  .mb-lg-2 { margin-bottom: .5rem !important; } .mt-lg-2 { margin-top: .5rem !important; } .me-lg-2 { margin-inline-end: .5rem !important; }
  .mb-lg-3 { margin-bottom: 1rem !important; } .mt-lg-3 { margin-top: 1rem !important; } .me-lg-3 { margin-inline-end: 1rem !important; }
  .mb-lg-4 { margin-bottom: 1.5rem !important; } .mt-lg-4 { margin-top: 1.5rem !important; } .me-lg-4 { margin-inline-end: 1.5rem !important; }
  .mb-lg-5 { margin-bottom: 3rem !important; } .mt-lg-5 { margin-top: 3rem !important; } .me-lg-5 { margin-inline-end: 3rem !important; }
}
@media (min-width: 1200px) {
  .mb-xl-0 { margin-bottom: 0 !important; } .mt-xl-0 { margin-top: 0 !important; } .me-xl-0 { margin-inline-end: 0 !important; }
  .mb-xl-1 { margin-bottom: .25rem !important; } .mt-xl-1 { margin-top: .25rem !important; } .me-xl-1 { margin-inline-end: .25rem !important; }
  .mb-xl-2 { margin-bottom: .5rem !important; } .mt-xl-2 { margin-top: .5rem !important; } .me-xl-2 { margin-inline-end: .5rem !important; }
  .mb-xl-3 { margin-bottom: 1rem !important; } .mt-xl-3 { margin-top: 1rem !important; } .me-xl-3 { margin-inline-end: 1rem !important; }
  .mb-xl-4 { margin-bottom: 1.5rem !important; } .mt-xl-4 { margin-top: 1.5rem !important; } .me-xl-4 { margin-inline-end: 1.5rem !important; }
  .mb-xl-5 { margin-bottom: 3rem !important; } .mt-xl-5 { margin-top: 3rem !important; } .me-xl-5 { margin-inline-end: 3rem !important; }
}
.gap-0 { gap: 0 !important; }
.gap-1 { gap: .25rem !important; }
.gap-2 { gap: .5rem !important; }
.gap-3 { gap: 1rem !important; }
.gap-4 { gap: 1.5rem !important; }
.gap-5 { gap: 3rem !important; }

/* ---- Display / flex / position / sizing ---- */
.d-none { display: none !important; } .d-block { display: block !important; } .d-flex { display: flex !important; }
.d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-inline-flex { display: inline-flex !important; }
@media (min-width: 768px) { .d-md-none { display: none !important; } .d-md-block { display: block !important; } .d-md-inline { display: inline !important; } .d-md-flex { display: flex !important; } }
@media (min-width: 992px) { .d-lg-none { display: none !important; } .d-lg-block { display: block !important; } .d-lg-flex { display: flex !important; } }
.flex-column { flex-direction: column !important; } .flex-row { flex-direction: row !important; } .flex-wrap { flex-wrap: wrap !important; } .flex-grow-1 { flex-grow: 1 !important; } .flex-shrink-0 { flex-shrink: 0 !important; }
.align-items-start { align-items: flex-start !important; } .align-items-center { align-items: center !important; } .align-items-end { align-items: flex-end !important; }
.justify-content-start { justify-content: flex-start !important; } .justify-content-center { justify-content: center !important; } .justify-content-end { justify-content: flex-end !important; } .justify-content-between { justify-content: space-between !important; }
.position-relative { position: relative !important; } .position-absolute { position: absolute !important; } .position-fixed { position: fixed !important; }
.sticky-top { position: sticky; top: 4.5rem; z-index: 40; }
.top-0 { top: 0 !important; } .end-0 { right: 0 !important; } .start-0 { left: 0 !important; } .bottom-0 { bottom: 0 !important; }
.w-100 { width: 100% !important; } .h-100 { height: 100% !important; } .w-auto { width: auto !important; }
.overflow-hidden { overflow: hidden !important; }
.list-unstyled { list-style: none; padding-left: 0; }
.text-start { text-align: start !important; } .text-center { text-align: center !important; } .text-end { text-align: end !important; }
@media (min-width: 992px) { .text-lg-start { text-align: start !important; } .text-lg-end { text-align: end !important; } }
.text-uppercase { text-transform: uppercase !important; } .text-decoration-none { text-decoration: none !important; } .text-nowrap { white-space: nowrap !important; }

/* ---- Text & color utilities ---- */
.fw-normal { font-weight: 400 !important; } .fw-medium { font-weight: 500 !important; } .fw-semibold { font-weight: 600 !important; } .fw-bold { font-weight: 700 !important; }
.fs-1 { font-size: var(--text-4xl) !important; } .fs-2 { font-size: var(--text-3xl) !important; } .fs-3 { font-size: var(--text-2xl) !important; } .fs-4 { font-size: var(--text-xl) !important; } .fs-5 { font-size: var(--text-lg) !important; } .fs-6 { font-size: var(--text-base) !important; }
.small, small { font-size: var(--text-sm); }
.lead { font-size: var(--text-lg); font-weight: 400; }
.display-4 { font: 600 var(--text-4xl)/var(--leading-display) var(--font-display); }
.h4 { font: 600 var(--text-xl)/1.2 var(--font-display); } .h5 { font: 600 var(--text-lg)/1.3 var(--font-display); } .h6 { font: 700 var(--text-base)/1.4 var(--font-body); }
.text-white { color: var(--white) !important; } .text-dark { color: var(--ink-900) !important; } .text-muted, .text-secondary { color: var(--ink-600) !important; }
.text-primary { color: var(--blue-800) !important; } .text-success { color: var(--olive-600) !important; } .text-danger { color: var(--danger) !important; } .text-warning { color: #8a5a00 !important; } .text-info { color: var(--blue-600) !important; }
.bg-white { background-color: var(--white) !important; } .bg-light { background-color: var(--sand-100) !important; } .bg-primary { background-color: var(--blue-800) !important; color: var(--white); }
.bg-success { background-color: var(--olive-600) !important; color: var(--white); } .bg-danger { background-color: var(--danger) !important; color: var(--white); } .bg-warning { background-color: #f1d9a8 !important; color: var(--ink-900); }
.bg-info { background-color: var(--blue-600) !important; color: var(--white); } .bg-secondary { background-color: var(--ink-600) !important; color: var(--white); }
.border { border: 1px solid var(--border) !important; } .border-0 { border: 0 !important; } .border-bottom { border-bottom: 1px solid var(--border) !important; } .border-top { border-top: 1px solid var(--border) !important; }
.border-primary { border-color: var(--blue-800) !important; }
.rounded { border-radius: var(--radius-sm) !important; } .rounded-pill { border-radius: var(--radius-pill) !important; } .rounded-circle { border-radius: 50% !important; }
.shadow-sm { box-shadow: var(--shadow-1) !important; } .shadow { box-shadow: var(--shadow-1) !important; } .shadow-lg { box-shadow: var(--shadow-2) !important; }

/* ---- Buttons ---- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--tap-min); padding: 0 var(--space-5); border: 2px solid transparent; border-radius: var(--radius-pill); background: none; font: 600 var(--text-base)/1.2 var(--font-body); text-decoration: none; text-align: center; cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease); }
.btn:disabled, .btn.disabled { opacity: .55; pointer-events: none; }
.btn-sm { min-height: 36px; padding: 0 var(--space-4); font-size: var(--text-sm); } .btn-lg { min-height: 52px; padding: 0 var(--space-6); font-size: var(--text-lg); }
.btn-primary, .btn-accent { background: var(--cta); border-color: var(--cta); color: var(--white); } .btn-primary:hover, .btn-accent:hover { background: var(--cta-hover); border-color: var(--cta-hover); color: var(--white); }
.btn-secondary { background: var(--ink-700); border-color: var(--ink-700); color: var(--white); } .btn-secondary:hover { background: var(--ink-900); color: var(--white); }
.btn-light { background: var(--white); border-color: var(--border); color: var(--ink-900); } .btn-light:hover { background: var(--sand-100); color: var(--ink-900); }
.btn-danger { background: var(--danger); border-color: var(--danger); color: var(--white); }
.btn-outline-primary { border-color: var(--blue-800); color: var(--blue-800); } .btn-outline-primary:hover { background: var(--blue-800); color: var(--white); }
.btn-outline-secondary { border-color: var(--ink-600); color: var(--ink-700); } .btn-outline-secondary:hover { background: var(--ink-700); color: var(--white); }
.btn-outline-danger { border-color: var(--terracotta-600); color: var(--terracotta-700); } .btn-outline-danger:hover { background: var(--terracotta-600); color: var(--white); }
.btn-outline-light { border-color: rgba(255,255,255,.7); color: var(--white); } .btn-outline-light:hover { background: var(--white); color: var(--ink-900); }
.btn-close { width: var(--tap-min); height: var(--tap-min); border: 0; border-radius: 50%; background: transparent; cursor: pointer; position: relative; }
.btn-close::before { content: "\00d7"; font-size: 1.75rem; line-height: 1; color: var(--ink-700); }
.btn-group { display: inline-flex; gap: 2px; }
.input-group { display: flex; align-items: stretch; width: 100%; } .input-group > .form-control, .input-group > .form-select { flex: 1; min-width: 0; } .input-group > .btn { flex: none; }

/* ---- Forms ---- */
.form-label { display: block; margin-bottom: var(--space-2); font-size: var(--text-sm); font-weight: 600; }
.form-control, .form-select { display: block; width: 100%; min-height: var(--tap-min); padding: var(--space-2) var(--space-3); border: 1px solid var(--sand-300); border-radius: var(--radius-sm); background-color: var(--white); color: var(--ink-900); font: 400 var(--text-base)/1.4 var(--font-body); }
textarea.form-control { min-height: 8rem; }
.form-control-lg { min-height: 52px; font-size: var(--text-lg); } .form-select-sm { min-height: 36px; font-size: var(--text-sm); }
.form-control:focus, .form-select:focus { outline: 3px solid var(--focus); outline-offset: 1px; border-color: var(--blue-600); }
.form-control::placeholder { color: var(--ink-600); }
.form-text { display: block; margin-top: var(--space-1); color: var(--ink-600); font-size: var(--text-sm); }
.form-check { display: flex; align-items: center; gap: var(--space-3); min-height: var(--tap-min); padding-left: 0; }
.form-check-input { width: 20px; height: 20px; accent-color: var(--blue-800); flex: none; margin: 0; }
.form-check-label { cursor: pointer; }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--danger); }
.invalid-feedback { margin-top: var(--space-1); color: var(--danger); font-size: var(--text-sm); }
.form-control.is-invalid ~ .invalid-feedback { display: block; }

/* ---- Cards, badges, alerts, lists ---- */
.card { position: relative; display: flex; flex-direction: column; min-width: 0; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.card-body { flex: 1 1 auto; padding: var(--space-4); } .card-header { padding: var(--space-3) var(--space-4); background: var(--sand-100); border-bottom: 1px solid var(--border); }
.card-title { margin-bottom: var(--space-2); font: 600 var(--text-lg)/1.3 var(--font-display); } .card-text:last-child { margin-bottom: 0; }
.card-img-top { width: 100%; border-radius: var(--radius-md) var(--radius-md) 0 0; }
.badge { display: inline-flex; align-items: center; padding: .2rem .65rem; border-radius: var(--radius-pill); font-size: var(--text-xs); font-weight: 700; }
.alert { padding: var(--space-4); margin-bottom: var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--sand-100); }
.alert-info { background: var(--blue-100); border-color: #b9cfe9; color: var(--blue-800); } .alert-success { background: var(--olive-100); border-color: #c5d2a8; color: #3f4f23; }
.alert-warning { background: #faefd6; border-color: #e8cf98; color: #6b4500; } .alert-danger { background: var(--terracotta-100); border-color: #e5b7a6; color: var(--terracotta-700); }
.list-group { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; border-radius: var(--radius-sm); }
.list-group-item { display: block; padding: var(--space-3) var(--space-4); background: var(--white); border: 1px solid var(--border); color: var(--ink-900); text-decoration: none; }
.list-group-item + .list-group-item { border-top-width: 0; } .list-group-item-action:hover { background: var(--sand-100); }
.table { width: 100%; border-collapse: collapse; } .table th, .table td { padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--border); text-align: left; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; padding: 0; list-style: none; font-size: var(--text-sm); }
.breadcrumb-item + .breadcrumb-item::before { content: "/"; margin-right: var(--space-2); color: var(--ink-600); } .breadcrumb-item.active { color: var(--ink-600); }

/* ---- Collapse / accordion ---- */
.collapse:not(.show) { display: none; } .collapsing { overflow: hidden; }
.accordion-item { border: 1px solid var(--border); background: var(--surface); } .accordion-item:first-child { border-radius: var(--radius-md) var(--radius-md) 0 0; } .accordion-item:last-child { border-radius: 0 0 var(--radius-md) var(--radius-md); } .accordion-item + .accordion-item { border-top: 0; }
.accordion-button { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: var(--tap-min); padding: var(--space-3) var(--space-4); border: 0; background: none; font: 600 var(--text-base)/1.3 var(--font-body); text-align: left; cursor: pointer; }
.accordion-button::after { content: "\2212"; font-size: var(--text-xl); } .accordion-button.collapsed::after { content: "+"; }
.accordion-body { padding: var(--space-3) var(--space-4) var(--space-4); }

/* ---- Modal ---- */
.modal { position: fixed; inset: 0; z-index: 1060; display: none; overflow-y: auto; padding: var(--space-4); }
.modal.show { display: block; }
.modal-backdrop { position: fixed; inset: 0; z-index: 1050; background: rgba(36, 31, 25, .72); }
.modal-dialog { position: relative; width: 100%; max-width: 32rem; margin: var(--space-6) auto; } .modal-lg { max-width: 50rem; } .modal-xl { max-width: 72rem; }
.modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - 3rem); } .modal-dialog-centered .modal-content { width: 100%; }
.modal-content { background: var(--surface); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-2); }
.modal-header, .modal-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); }
.modal-title { margin: 0; font: 600 var(--text-lg)/1.3 var(--font-display); } .modal-body { padding: var(--space-4); } .modal-body.p-0 { padding: 0; }

/* ---- Carousel ---- */
.carousel { position: relative; } .carousel-inner { position: relative; width: 100%; overflow: hidden; }
.carousel-item { display: none; } .carousel-item.active { display: block; }
.carousel-control-prev, .carousel-control-next { position: absolute; top: 50%; z-index: 2; display: grid; place-items: center; width: var(--tap-min); height: var(--tap-min); margin-top: calc(var(--tap-min) / -2); padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--ink-900); cursor: pointer; }
.carousel-control-prev { left: var(--space-3); } .carousel-control-next { right: var(--space-3); }
.carousel-control-prev-icon::before { content: "\2039"; font-size: 2rem; line-height: 1; } .carousel-control-next-icon::before { content: "\203A"; font-size: 2rem; line-height: 1; }
.fade { transition: opacity var(--dur) var(--ease); }

/* Headings/paragraphs inside coloured bands inherit the band's text colour (Bootstrap relied on reboot for this) */
.text-white :is(h1, h2, h3, h4, h5, h6, p, .lead), .bg-primary :is(h1, h2, h3, h4, h5, h6, p, .lead), .bg-success :is(h1, h2, h3, h4, h5, h6, p), .bg-danger :is(h1, h2, h3, h4, h5, h6, p), .bg-info :is(h1, h2, h3, h4, h5, h6, p), .bg-secondary :is(h1, h2, h3, h4, h5, h6, p) { color: inherit; }
.card-header > :is(h1, h2, h3, h4, h5, h6) { margin: 0; }


/* ==== shell.css ==== */
/* VeriaGuide v2 shell: header, navigation, language switch, footer. */
.vg-header {
    position: sticky; top: 0; z-index: 1030;
    background: color-mix(in srgb, var(--bg) 92%, transparent);
    backdrop-filter: saturate(1.4) blur(10px);
    border-bottom: 1px solid var(--border);
}
.vg-header__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-height: 4rem; }

.vg-brand { display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--tap-min); color: var(--blue-800); text-decoration: none; }
.vg-brand:hover { color: var(--blue-800); }
.vg-brand__name { font: 700 var(--text-xl)/1 var(--font-display); letter-spacing: -0.01em; }
.vg-brand__name span { color: var(--terracotta-700); }

.vg-menu-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: var(--tap-min); height: var(--tap-min);
    border: 1px solid var(--border); border-radius: var(--radius-pill);
    background: var(--surface); color: var(--ink-900); cursor: pointer;
}
.vg-menu-toggle .vg-icon-close, .vg-menu-toggle[aria-expanded="true"] .vg-icon-open { display: none; }
.vg-menu-toggle[aria-expanded="true"] .vg-icon-close { display: block; }

/* Mobile: panel under the bar */
.vg-nav {
    display: none;
    position: absolute; left: 0; right: 0; top: 100%;
    max-height: calc(100vh - 4rem); overflow-y: auto;
    padding: var(--space-4) var(--gutter) var(--space-6);
    background: var(--bg); border-bottom: 1px solid var(--border); box-shadow: var(--shadow-2);
}
.vg-nav.is-open { display: block; }
.vg-nav__list, .vg-subnav { list-style: none; margin: 0; padding: 0; }
.vg-nav__link, .vg-subnav a {
    display: flex; align-items: center; justify-content: space-between; gap: var(--space-2);
    width: 100%; min-height: var(--tap-min); padding: var(--space-2) var(--space-3);
    border: 0; border-radius: var(--radius-sm); background: none;
    color: var(--ink-900); font: 500 var(--text-base)/1.3 var(--font-body); text-align: left; text-decoration: none; cursor: pointer;
}
.vg-nav__link:hover, .vg-subnav a:hover { background: var(--sand-100); color: var(--blue-800); }
.vg-nav__link[aria-current="page"] { color: var(--blue-800); font-weight: 700; }
.vg-chevron { transition: transform var(--dur-fast) var(--ease); }
.vg-nav__toggle[aria-expanded="true"] .vg-chevron { transform: rotate(180deg); }
.vg-subnav { display: none; padding-left: var(--space-4); }
.vg-nav__toggle[aria-expanded="true"] + .vg-subnav { display: block; }

.vg-nav__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-5); padding-top: var(--space-4); border-top: 1px solid var(--border); }
.vg-lang { display: inline-flex; padding: 3px; border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface); }
.vg-lang a {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: var(--tap-min); min-height: 38px; padding: 0 var(--space-2);
    border-radius: var(--radius-pill); color: var(--ink-700); font-size: var(--text-sm); font-weight: 600; text-decoration: none;
}
.vg-lang a[aria-current] { background: var(--blue-800); color: var(--white); }
.vg-lang a:not([aria-current]):hover { background: var(--sand-100); color: var(--blue-800); }

.vg-fav {
    display: inline-flex; align-items: center; gap: var(--space-2);
    min-height: var(--tap-min); padding: 0 var(--space-4);
    border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface);
    color: var(--ink-900); font-weight: 600; font-size: var(--text-sm); text-decoration: none;
}
.vg-fav:hover { border-color: var(--terracotta-600); color: var(--terracotta-700); }
.vg-fav__count { min-width: 1.5rem; padding: 0 0.4rem; border-radius: var(--radius-pill); background: var(--terracotta-600); color: var(--white); font-size: var(--text-xs); line-height: 1.5rem; text-align: center; }

/* Desktop: inline nav with popover submenus */
@media (min-width: 64em) {
    .vg-menu-toggle { display: none; }
    .vg-nav { display: flex; position: static; align-items: center; justify-content: flex-end; gap: var(--space-5); flex: 1; max-height: none; overflow: visible; padding: 0; background: none; border: 0; box-shadow: none; }
    .vg-nav__list { display: flex; align-items: center; gap: var(--space-1); }
    .vg-nav__item { position: relative; }
    .vg-nav__link { width: auto; padding-inline: var(--space-3); border-radius: var(--radius-pill); }
    .vg-subnav {
        position: absolute; left: 0; top: calc(100% + 6px); min-width: 14rem; padding: var(--space-2);
        background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-2);
    }
    .vg-nav__actions { margin: 0; padding: 0; border: 0; flex-wrap: nowrap; }
    .vg-fav__label { display: none; }
}
@media (min-width: 80em) { .vg-fav__label { display: inline; } }

/* Footer */
.vg-footer { margin-top: var(--space-9); padding-block: var(--space-8) var(--space-6); background: var(--ink-900); color: #e7dfd2; }
.vg-footer a { color: #f3ebdd; text-underline-offset: 0.2em; }
.vg-footer a:hover { color: var(--white); }
.vg-footer__grid { display: grid; gap: var(--space-6); grid-template-columns: 1fr; }
@media (min-width: 40em) { .vg-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 64em) { .vg-footer__grid { grid-template-columns: 1.6fr 1.2fr 1fr 1fr; } }
.vg-footer__brand { font: 700 var(--text-2xl)/1.1 var(--font-display); color: var(--white); }
.vg-footer__heading { margin: 0 0 var(--space-3); font: 600 var(--text-sm)/1.4 var(--font-body); letter-spacing: 0.08em; text-transform: uppercase; color: #cdbf9f; }
.vg-footer ul { list-style: none; margin: 0; padding: 0; }
.vg-footer li a { display: inline-block; padding-block: 0.4rem; text-decoration: none; }
.vg-footer li a:hover { text-decoration: underline; }
.vg-footer address { font-style: normal; }
.vg-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-7); padding-top: var(--space-5); border-top: 1px solid rgba(255, 255, 255, 0.15); font-size: var(--text-sm); color: #cdbf9f; }
.vg-footer__bottom p { margin: 0; }

/* Cookie banner (markup from the shared layout) */
.theme-new .cookie-consent { left: var(--space-4); right: var(--space-4); bottom: var(--space-4); width: auto; max-width: 64rem; margin-inline: auto; padding: var(--space-4) var(--space-5); border-radius: var(--radius-lg); background: var(--ink-900); color: #f3ebdd; box-shadow: var(--shadow-2); }
.theme-new .cookie-consent__inner { padding: 0; }
.theme-new .cookie-consent__title { font: 700 var(--text-base)/1.3 var(--font-display); color: var(--white); }
.theme-new .cookie-consent__text { color: #e7dfd2; font-size: var(--text-sm); }
.theme-new .cookie-consent__link { color: #f3ebdd; text-decoration: underline; }
.theme-new .cookie-consent__btn { min-height: var(--tap-min); border-radius: var(--radius-pill); font-weight: 600; }
.theme-new .cookie-consent .btn-light { background: var(--white); color: var(--ink-900); }
.theme-new .cookie-consent .btn-outline-light { border-color: rgba(255, 255, 255, 0.6); color: var(--white); }


/* ==== components.css ==== */
/* VeriaGuide v2 components: hero, search, tiles, listing cards, hub, filters, pagination, empty state. */

/* Section headers */
.vg-section-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-6); }
.vg-section-head h2 { margin: var(--space-1) 0 0; }
.vg-more { display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--tap-min); font-weight: 600; text-decoration: none; }
.vg-more:hover .vg-icon { transform: translateX(3px); }
.vg-icon { flex: none; transition: transform var(--dur-fast) var(--ease); }

/* Hero */
.vg-hero { position: relative; display: grid; align-items: end; min-height: clamp(30rem, 78svh, 44rem); color: var(--white); isolation: isolate; background: var(--ink-900); }
.vg-hero__img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.vg-hero__scrim { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(36, 31, 25, 0.35) 0%, rgba(36, 31, 25, 0.55) 45%, rgba(36, 31, 25, 0.82) 100%); }
.vg-hero__inner { padding-block: var(--space-9) var(--space-7); max-width: var(--container); }
.vg-hero__eyebrow { margin: 0 0 var(--space-3); font-size: var(--text-sm); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: #f1d9a8; }
.theme-new .vg-hero__title { max-width: 18ch; margin-bottom: var(--space-4); font-size: var(--text-4xl); color: var(--white); }
.vg-hero__lead { max-width: 46ch; font-size: var(--text-lg); color: #f3ebdd; }
.vg-hero__chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); }
.vg-hero__chips a { display: inline-flex; align-items: center; min-height: var(--tap-min); padding: 0 var(--space-4); border: 1px solid rgba(255, 255, 255, 0.55); border-radius: var(--radius-pill); color: var(--white); font-size: var(--text-sm); font-weight: 600; text-decoration: none; backdrop-filter: blur(4px); background: rgba(255, 255, 255, 0.1); }
.vg-hero__chips a:hover { background: var(--white); color: var(--ink-900); }

/* Search + suggestions */
.vg-search { position: relative; max-width: 44rem; }
.vg-search__field { display: flex; align-items: center; gap: var(--space-2); padding: 6px 6px 6px var(--space-4); background: var(--white); border-radius: var(--radius-pill); box-shadow: var(--shadow-2); color: var(--ink-900); }
.vg-search__field:focus-within { outline: 3px solid var(--blue-600); outline-offset: 2px; }
.vg-search__icon { flex: none; color: var(--ink-600); }
.vg-search__input { flex: 1; min-width: 0; min-height: var(--tap-min); border: 0; background: none; font: 500 var(--text-base)/1.2 var(--font-body); color: var(--ink-900); }
.vg-search__input:focus, .vg-search__input:focus-visible { outline: none; }
.vg-search__input::placeholder { color: var(--ink-600); }
.vg-search__btn { flex: none; }
@media (max-width: 30em) { .vg-search__btn { padding-inline: var(--space-4); } }
.vg-suggest { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 8px); margin: 0; padding: var(--space-2); max-height: 22rem; overflow-y: auto; list-style: none; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-2); color: var(--ink-900); }
.vg-suggest[hidden] { display: none; }
.vg-suggest a { display: flex; align-items: center; gap: var(--space-3); min-height: var(--tap-min); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); color: inherit; text-decoration: none; }
.vg-suggest a img, .vg-suggest__ph { flex: none; width: 44px; height: 44px; border-radius: var(--radius-sm); object-fit: cover; background: var(--sand-200); }
.vg-suggest a > span:not(.vg-suggest__ph) { display: grid; line-height: 1.3; min-width: 0; }
.vg-suggest small { color: var(--ink-600); }
.vg-suggest [role="option"][aria-selected="true"] a, .vg-suggest a:hover { background: var(--sand-100); }
.vg-suggest__skel { padding: var(--space-2) var(--space-3); }
.vg-suggest__skel .skeleton { display: block; height: 44px; }
.vg-suggest__empty { padding: var(--space-3); color: var(--ink-600); }

/* Theme tiles */
.vg-tiles { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.vg-tile { display: flex; align-items: center; gap: var(--space-3); min-height: 4.5rem; padding: var(--space-3) var(--space-4); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); color: var(--ink-900); font-weight: 600; text-decoration: none; transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease); }
.vg-tile > span { flex: 1; }
.vg-tile > .vg-icon:first-child { color: var(--terracotta-600); }
.vg-tile > .vg-icon:last-child { color: var(--ink-600); }
.vg-tile:hover { border-color: var(--blue-800); box-shadow: var(--shadow-1); transform: translateY(-2px); color: var(--blue-800); }

/* About + callout */
.vg-about { display: grid; gap: var(--space-6); align-items: center; }
@media (min-width: 52em) { .vg-about { grid-template-columns: 5fr 7fr; gap: var(--space-8); } }
.vg-about__img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-lg); box-shadow: var(--shadow-2); }
.vg-prose { max-width: 62ch; }
.vg-callout { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); padding: var(--space-7) var(--space-6); border-radius: var(--radius-lg); background: var(--blue-800); color: var(--white); }
.theme-new .vg-callout h2 { margin-bottom: var(--space-2); color: var(--white); }
.vg-callout p { margin: 0; max-width: 52ch; color: #dce7f6; }
.vg-callout .eyebrow { margin-bottom: var(--space-2); color: #f1d9a8; }

/* Listing card */
.vg-card { position: relative; display: flex; flex-direction: column; overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease); }
.vg-card:hover, .vg-card:focus-within { box-shadow: var(--shadow-2); transform: translateY(-2px); }
.vg-card__media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 0; }
.vg-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease); }
.vg-card:hover .vg-card__media img { transform: scale(1.04); }
.vg-card__ph { display: grid; place-items: center; width: 100%; height: 100%; background: var(--sand-200); color: var(--ink-600); }
.vg-card__ph .vg-icon { width: 48px; height: 48px; }
.vg-card__fav { position: absolute; z-index: 2; top: var(--space-3); right: var(--space-3); display: grid; place-items: center; width: var(--tap-min); height: var(--tap-min); border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.92); color: var(--ink-900); cursor: pointer; box-shadow: var(--shadow-1); }
.vg-card__fav:hover { color: var(--terracotta-600); }
.vg-card__fav .text-danger { color: var(--danger) !important; }
.vg-card__body { display: flex; flex: 1; flex-direction: column; gap: var(--space-2); padding: var(--space-4) var(--space-4) var(--space-5); }
.vg-card__tags { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.theme-new .vg-card__title { margin: 0; font-size: var(--text-xl); }
.vg-card__title a { color: var(--ink-900); text-decoration: none; }
.vg-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }   /* whole card is the link */
.vg-card__title a:focus-visible { outline: none; }
.vg-card:has(.vg-card__title a:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }
.vg-card__title a:hover { color: var(--blue-800); }
.vg-card__excerpt { margin: 0; color: var(--ink-600); font-size: var(--text-sm); }
.vg-card__meta { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; margin-top: auto; padding-top: var(--space-2); color: var(--ink-600); font-size: var(--text-sm); }
.vg-card__place { display: inline-flex; align-items: center; gap: var(--space-1); }
.vg-card__distance { font-weight: 600; color: var(--olive-600); }
.vg-card__distance:empty { display: none; }

/* Hub */
.vg-pagehead { padding-block: var(--space-6) var(--space-7); background: var(--surface-alt); border-bottom: 1px solid var(--border); }
.vg-pagehead h1 { margin-bottom: var(--space-3); }
.vg-pagehead__intro { max-width: 68ch; font-size: var(--text-lg); color: var(--ink-700); }
.vg-pagehead__more { max-width: 68ch; margin: 0; color: var(--ink-600); font-size: var(--text-sm); }
.vg-breadcrumbs { margin-bottom: var(--space-4); font-size: var(--text-sm); }
.vg-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.vg-breadcrumbs li + li::before { content: "/"; margin-right: var(--space-2); color: var(--ink-600); }
.vg-breadcrumbs a { display: inline-flex; align-items: center; min-height: 32px; }
.vg-breadcrumbs [aria-current] { color: var(--ink-600); }
.vg-hub { padding-block: var(--space-6) var(--space-8); }
.vg-hub__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-5); }
.vg-hub__count { margin: 0; font-weight: 600; color: var(--ink-700); }
.vg-hub__layout { display: grid; gap: var(--space-6); }
@media (min-width: 64em) { .vg-hub__layout { grid-template-columns: 18rem 1fr; align-items: start; } .vg-filters { position: sticky; top: 5rem; } }
.vg-hub__grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.vg-hub__range { margin-top: var(--space-4); text-align: center; color: var(--ink-600); font-size: var(--text-sm); }

/* Filters */
.vg-filters__panel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.vg-filters__panel > summary { display: flex; align-items: center; min-height: var(--tap-min); padding: 0 var(--space-4); font-weight: 700; cursor: pointer; list-style: none; }
.vg-filters__panel > summary::-webkit-details-marker { display: none; }
.vg-filters__panel > summary::after { content: "+"; margin-left: auto; font-size: var(--text-xl); }
.vg-filters__panel[open] > summary::after { content: "−"; }
@media (min-width: 64em) { .vg-filters__panel > summary { pointer-events: none; } .vg-filters__panel > summary::after { content: none; } }
.vg-filters__map { padding: 0 var(--space-3); }
#sidebar-map { height: 220px; border-radius: var(--radius-sm); overflow: hidden; background: var(--sand-100); }
.vg-filters__form { display: grid; gap: var(--space-4); padding: var(--space-4); }
.vg-field { position: relative; margin: 0; padding: 0; border: 0; min-width: 0; }
.vg-field > label, .vg-field > legend { display: block; margin-bottom: var(--space-2); padding: 0; font-size: var(--text-sm); font-weight: 700; }
.vg-field input[type="search"], .vg-field select { width: 100%; min-height: var(--tap-min); padding: 0 var(--space-3); border: 1px solid var(--sand-300); border-radius: var(--radius-sm); background: var(--white); font: inherit; color: var(--ink-900); }
.vg-choice { display: flex; align-items: center; gap: var(--space-3); min-height: var(--tap-min); cursor: pointer; }
.vg-choice input { width: 20px; height: 20px; accent-color: var(--blue-800); }
.vg-choice span:first-of-type { flex: 1; }
.vg-choice__n { color: var(--ink-600); font-size: var(--text-sm); }
.vg-legacy-suggest { position: absolute; z-index: 20; left: 0; right: 0; top: 100%; max-height: 18rem; overflow-y: auto; border-radius: var(--radius-sm); box-shadow: var(--shadow-2); }
.vg-link-btn { min-height: var(--tap-min); padding: 0; border: 0; background: none; color: var(--link); text-decoration: underline; cursor: pointer; font: inherit; }
.vg-filters__clear { margin: 0 var(--space-4) var(--space-4); }

/* Pagination */
.vg-pagination { margin-top: var(--space-7); }
.vg-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.vg-pagination a { display: inline-flex; align-items: center; justify-content: center; min-width: var(--tap-min); min-height: var(--tap-min); padding: 0 var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface); color: var(--ink-900); font-weight: 600; text-decoration: none; }
.vg-pagination a:hover { border-color: var(--blue-800); }
.vg-pagination a[aria-current] { background: var(--blue-800); border-color: var(--blue-800); color: var(--white); }

/* Empty state */
.vg-empty { display: grid; justify-items: center; gap: var(--space-3); padding: var(--space-8) var(--space-5); border: 2px dashed var(--sand-300); border-radius: var(--radius-lg); background: var(--surface); text-align: center; color: var(--ink-600); }
.theme-new .vg-empty h2 { margin: 0; font-size: var(--text-2xl); color: var(--ink-900); }
.vg-empty p { max-width: 40ch; margin: 0 0 var(--space-3); }

@media (prefers-reduced-motion: reduce) {
    .vg-card, .vg-tile, .vg-card__media img, .vg-icon { transition: none; }
    .vg-card:hover, .vg-tile:hover { transform: none; }
    .vg-card:hover .vg-card__media img { transform: none; }
}

/* Chips (filter / popular searches) */
.vg-chips { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-5); padding: 0; list-style: none; }
.vg-chips a, .vg-chips--static li { display: inline-flex; align-items: center; min-height: var(--tap-min); padding: 0 var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface); color: var(--ink-900); font-size: var(--text-sm); font-weight: 600; text-decoration: none; }
.vg-chips a:hover { border-color: var(--blue-800); color: var(--blue-800); }
.vg-chips a[aria-current] { background: var(--blue-800); border-color: var(--blue-800); color: var(--white); }
.vg-chips--static li { font-weight: 500; color: var(--ink-700); min-height: 36px; }
.vg-chips--popular { margin-top: var(--space-7); }
.vg-chips__label { width: 100%; font-weight: 600; color: var(--ink-700); }
.vg-pagehead__search { margin-top: var(--space-5); }
.vg-pagehead__search .vg-search__field { box-shadow: var(--shadow-1); border: 1px solid var(--border); }
.vg-inline-field { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--text-sm); color: var(--ink-700); }
.vg-inline-field select { min-height: var(--tap-min); padding: 0 var(--space-3); border: 1px solid var(--sand-300); border-radius: var(--radius-sm); background: var(--white); font: inherit; }
#search-results-map { height: 260px; border-radius: var(--radius-sm); overflow: hidden; background: var(--sand-100); }
.theme-new .vg-pagehead__search .vg-suggest { z-index: 30; }

/* Legacy hub autocomplete (classic script fills #autocomplete-results with .list-group-item) */
.vg-legacy-suggest { background: var(--white); border: 1px solid var(--border); padding: var(--space-1); }
.vg-legacy-suggest .list-group-item { display: flex; align-items: center; gap: var(--space-3); min-height: var(--tap-min); border: 0; border-radius: var(--radius-sm); color: var(--ink-900); font-size: var(--text-sm); text-decoration: none; }
.vg-legacy-suggest .list-group-item:hover, .vg-legacy-suggest .list-group-item:focus { background: var(--sand-100); color: var(--blue-800); }


/* ==== detail.css ==== */
/* VeriaGuide v2 detail pages. Re-skins the shared classic detail markup (Bootstrap grid, .card sidebar, gallery). */
.theme-new .detail-page { width: min(100% - 2 * var(--gutter), var(--container)); max-width: none; margin-inline: auto; padding: var(--space-5) 0 var(--space-8); }

/* Header */
.theme-new .vg-breadcrumbs { margin-bottom: var(--space-4); }
.vg-detail-head { margin-bottom: var(--space-5); }
.vg-detail-head .eyebrow { margin: 0 0 var(--space-2); }
.theme-new .detail-breadcrumb { display: none; }   /* v2 title partial renders the breadcrumb */
.theme-new .detail-page-title { margin: 0 0 var(--space-2); font-family: var(--font-display); font-weight: 600; line-height: var(--leading-display); font-size: var(--text-4xl); color: var(--ink-900); }
.theme-new .detail-page-subtitle { margin: 0 0 var(--space-3); font-size: var(--text-xl); color: var(--ink-700); }
.theme-new .detail-page-meta { margin: var(--space-3) 0 0; font-size: var(--text-sm); color: var(--ink-600); }

/* Sticky in-page nav */
.vg-sectionnav { position: sticky; top: 4rem; z-index: 40; margin: 0 0 var(--space-5); background: color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter: blur(8px); border-block: 1px solid var(--border); }
.vg-sectionnav[hidden] { display: none; }
.vg-sectionnav ul { display: flex; gap: var(--space-2); margin: 0; padding: var(--space-2) 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.vg-sectionnav ul::-webkit-scrollbar { display: none; }
.vg-sectionnav a { display: inline-flex; align-items: center; min-height: var(--tap-min); padding: 0 var(--space-4); border-radius: var(--radius-pill); color: var(--ink-700); font-size: var(--text-sm); font-weight: 600; white-space: nowrap; text-decoration: none; }
.vg-sectionnav a:hover { background: var(--sand-100); color: var(--blue-800); }
.vg-sectionnav a[aria-current] { background: var(--blue-800); color: var(--white); }
.theme-new [data-vg-section] { scroll-margin-top: 8rem; }

/* Gallery */
.theme-new .detail-gallery__main { border-radius: var(--radius-lg); overflow: hidden; background: var(--sand-100); box-shadow: var(--shadow-1); }
.theme-new .detail-gallery__main-btn { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.theme-new .detail-gallery__main-img { width: 100%; aspect-ratio: 16 / 10; max-height: 34rem; object-fit: cover; }
.theme-new .detail-gallery__thumbs { display: flex; gap: var(--space-2); margin-top: var(--space-3); overflow-x: auto; }
.theme-new .detail-gallery__thumb { flex: none; width: 5.5rem; padding: 0; border: 2px solid transparent; border-radius: var(--radius-sm); overflow: hidden; background: none; cursor: pointer; }
.theme-new .detail-gallery__thumb img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.theme-new .detail-gallery__thumb.active { border-color: var(--blue-800); }
.theme-new .detail-gallery__main--empty { aspect-ratio: 16 / 10; display: grid; place-items: center; }

/* Content */
.theme-new .detail-content-section { margin: 0 0 var(--space-6); padding: 0 0 var(--space-6); border-bottom: 1px solid var(--border); }
.theme-new .detail-page-seo-intro { max-width: 68ch; font-size: var(--text-lg); color: var(--ink-700) !important; }
.theme-new .detail-section-title { margin: 0 0 var(--space-4); padding: 0; border: 0; font-family: var(--font-display); font-weight: 600; line-height: var(--leading-display); font-size: var(--text-2xl); color: var(--ink-900); }
.theme-new .detail-prose, .theme-new .content-styles { max-width: 68ch; font-size: var(--text-lg); line-height: 1.7; color: var(--ink-700); }
.theme-new .detail-prose img { border-radius: var(--radius-md); }
.theme-new .detail-prose a { text-decoration: underline; }

/* Sidebar cards (classic .card / .detail-sidebar-card markup) */
.theme-new .detail-sidebar-card, .theme-new .detail-page .card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: none; overflow: hidden; }
.theme-new .detail-sidebar-card:not(.card) { padding: var(--space-4); }
.theme-new .detail-sidebar-card__header, .theme-new .detail-page .card-header { background: var(--sand-100); border-bottom: 1px solid var(--border); padding: var(--space-3) var(--space-4); }
.theme-new .detail-sidebar-card__title { margin: 0 0 var(--space-3); font: 700 var(--text-sm)/1.3 var(--font-body); letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-700); }
.theme-new .detail-sidebar-card__header .detail-sidebar-card__title { margin: 0; }
.theme-new .detail-page .card-body { padding: var(--space-4); }
.theme-new .detail-page .card-body.p-0 { padding: 0; }
.theme-new .detail-page .card-body .h6 { font: 700 var(--text-sm)/1.4 var(--font-body); color: var(--ink-900); }
.theme-new .detail-page .card-body .h6 i { color: var(--terracotta-600); }
.theme-new .detail-page-sidebar #map { height: 260px !important; background: var(--sand-100); }
.theme-new .detail-page .btn { min-height: var(--tap-min); display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-pill); font-weight: 600; }
.theme-new .detail-page .btn-outline-primary { color: var(--blue-800); border-color: var(--blue-800); }
.theme-new .detail-page .btn-outline-primary:hover { background: var(--blue-800); color: var(--white); }
.theme-new .detail-page .btn-outline-danger { color: var(--terracotta-700); border-color: var(--terracotta-600); }
.theme-new .detail-page .btn-outline-danger:hover { background: var(--terracotta-600); color: var(--white); }
.theme-new .detail-page .btn-danger { background: var(--terracotta-600); border-color: var(--terracotta-600); color: var(--white); }
.theme-new .detail-share-btn { display: inline-grid; place-items: center; width: var(--tap-min); height: var(--tap-min); border-radius: 50%; background: var(--sand-100); color: var(--ink-700); text-decoration: none; }
.theme-new .detail-share-btn:hover { background: var(--blue-800); color: var(--white); }
.theme-new .detail-share-buttons { display: flex; gap: var(--space-2); }

/* Related / nearby */
.theme-new .detail-related-list { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.theme-new .detail-related-link { display: flex; align-items: center; gap: var(--space-3); min-height: var(--tap-min); padding: var(--space-2); border-radius: var(--radius-sm); color: var(--ink-900); font-weight: 600; text-decoration: none; }
.theme-new .detail-related-link:hover { background: var(--sand-100); color: var(--blue-800); }
.theme-new .detail-related-thumb-wrap { flex: none; width: 56px; height: 56px; border-radius: var(--radius-sm); overflow: hidden; background: var(--sand-200); }
.theme-new .detail-related-thumb { width: 100%; height: 100%; object-fit: cover; }
.theme-new .detail-nearby-meta { display: block; font-size: var(--text-xs); font-weight: 500; color: var(--ink-600); }
.theme-new .detail-related-all { display: inline-flex; align-items: center; min-height: var(--tap-min); font-weight: 600; }

/* Trust box */
.theme-new .detail-trust-box { margin-top: var(--space-6); background: var(--sand-100) !important; }
.theme-new .detail-trust-box__title { font-family: var(--font-display); font-size: var(--text-lg); }

.theme-new .detail-trust-box__text { font-size: var(--text-sm); color: var(--ink-700); }
.theme-new .detail-trust-box__date { margin: 0 0 var(--space-2); font-size: var(--text-sm); color: var(--ink-600); }