/* =========================================================================
   Cookie consent banner + re-open chip
   Uses the same paper palette as the rest of the site.
   ========================================================================= */

.cc-banner{
    position:fixed;
    left:50%;
    bottom:24px;
    transform:translateX(-50%);
    width:calc(100% - 48px);
    max-width:920px;
    background:var(--paper, #f3ede2);
    color:var(--ink, #1a1612);
    border:1px solid var(--rule, #d6cdb9);
    border-radius:14px;
    box-shadow:0 18px 40px -18px rgba(0,0,0,.25), 0 4px 14px -8px rgba(0,0,0,.15);
    z-index:9000;
    font-family:'Inter',system-ui,-apple-system,sans-serif;
    font-size:14px;
    line-height:1.55;
}
.cc-banner.cc-hidden{ display:none; }

.cc-inner{
    padding:22px 24px;
    display:flex;
    flex-direction:column;
    gap:16px;
}

.cc-title{
    font-family:'Fraunces',serif;
    font-weight:400;
    font-size:20px;
    margin:0 0 4px;
    letter-spacing:-0.01em;
}
.cc-text{ margin:0; color:var(--ink-soft, #3a322a); }
.cc-text a{ color:var(--accent, #b6532d); text-decoration:underline; text-underline-offset:2px; }
.cc-text a:hover{ color:var(--accent-deep, #7d3a1f); }

/* Preferences (granular categories) — hidden until "Customize" is clicked. */
.cc-prefs{
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:14px 16px;
    background:var(--paper-deep, #ebe3d4);
    border-radius:10px;
    border:1px solid var(--rule, #d6cdb9);
}
.cc-row{
    display:flex;
    gap:12px;
    align-items:flex-start;
    font-size:13px;
    color:var(--ink-soft, #3a322a);
    cursor:pointer;
}
.cc-row input[type="checkbox"]{
    margin:3px 0 0;
    flex-shrink:0;
    width:16px;
    height:16px;
    accent-color:var(--accent, #b6532d);
}
.cc-row input[disabled]{ opacity:.55; cursor:not-allowed; }
.cc-row strong{ color:var(--ink, #1a1612); font-weight:600; }

/* Action row */
.cc-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:flex-end;
    align-items:center;
}
.cc-btn{
    font:inherit;
    font-size:13px;
    font-weight:500;
    padding:10px 18px;
    border-radius:999px;
    border:1px solid var(--rule, #d6cdb9);
    background:transparent;
    color:var(--ink, #1a1612);
    cursor:pointer;
    transition:background .15s ease, color .15s ease, transform .15s ease, border-color .15s ease;
}
.cc-btn:hover{ border-color:var(--ink, #1a1612); }
.cc-btn-ghost{ background:transparent; }
.cc-btn-primary{
    background:var(--accent-deep, #7d3a1f);
    color:#f3ede2;
    border-color:var(--accent-deep, #7d3a1f);
}
.cc-btn-primary:hover{
    background:var(--accent, #b6532d);
    border-color:var(--accent, #b6532d);
    color:#fff;
    transform:translateY(-1px);
}

/* Re-open chip — small floating button bottom-left so users can revisit. */
.cc-reopen{
    position:fixed;
    left:18px;
    bottom:18px;
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--paper, #f3ede2);
    color:var(--ink, #1a1612);
    border:1px solid var(--rule, #d6cdb9);
    box-shadow:0 8px 18px -10px rgba(0,0,0,.3);
    font-size:20px;
    line-height:1;
    cursor:pointer;
    z-index:8900;
    display:none; /* shown by JS only after consent is given */
    align-items:center;
    justify-content:center;
    transition:transform .15s ease;
}
.cc-reopen:hover{ transform:translateY(-2px); }
.cc-reopen.cc-visible{ display:flex; }

/* Compact paper-style sections used by the legal pages. */
.legal{
    padding:48px 0 120px;
    position:relative;
    z-index:2;
}
.legal .narrow{ max-width:780px; }
.legal h2{
    font-family:'Fraunces',serif;
    font-weight:400;
    font-size:26px;
    letter-spacing:-0.01em;
    margin:48px 0 12px;
    color:var(--ink, #1a1612);
}
.legal h3{
    font-family:'Inter',sans-serif;
    font-weight:600;
    font-size:14px;
    text-transform:uppercase;
    letter-spacing:.12em;
    color:var(--muted, #8a7e6e);
    margin:28px 0 8px;
}
.legal p, .legal li{
    color:var(--ink-soft, #3a322a);
    font-size:15.5px;
    line-height:1.72;
}
.legal ul, .legal ol{ padding-left:22px; }
.legal li{ margin:6px 0; }
.legal a{ color:var(--accent, #b6532d); text-decoration:underline; text-underline-offset:2px; }
.legal a:hover{ color:var(--accent-deep, #7d3a1f); }
.legal .meta{
    color:var(--muted, #8a7e6e);
    font-size:13px;
    border-bottom:1px solid var(--rule, #d6cdb9);
    padding-bottom:18px;
    margin-bottom:8px;
}
.legal table.cookie-table{
    width:100%;
    border-collapse:collapse;
    margin:18px 0 24px;
    font-size:14px;
}
.legal table.cookie-table th,
.legal table.cookie-table td{
    text-align:left;
    padding:10px 12px;
    border-bottom:1px solid var(--rule, #d6cdb9);
    vertical-align:top;
}
.legal table.cookie-table th{
    color:var(--muted, #8a7e6e);
    font-weight:600;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    background:var(--paper-deep, #ebe3d4);
}
.legal .callout{
    background:var(--paper-deep, #ebe3d4);
    border-left:3px solid var(--accent, #b6532d);
    padding:14px 18px;
    border-radius:6px;
    margin:18px 0;
    font-size:14.5px;
}

/* Affiliate disclosure note used on the Excursions page hero. */
.page-hero .affiliate-notice{
    margin-top:22px;
    padding:12px 16px;
    background:var(--paper-deep, #ebe3d4);
    border:1px solid var(--rule, #d6cdb9);
    border-left:3px solid var(--accent, #b6532d);
    border-radius:6px;
    font-size:13.5px;
    line-height:1.55;
    color:var(--ink-soft, #3a322a);
    max-width:760px;
}
.page-hero .affiliate-notice strong{ color:var(--ink, #1a1612); }
.page-hero .affiliate-notice a{
    color:var(--accent, #b6532d);
    text-decoration:underline;
    text-underline-offset:2px;
}

/* =========================================================================
   Mobile burger menu
   ------------------------------------------------------------------------
   The site's original nav (in site.css) is a single horizontal row that
   overflows on small screens. Below 820px we hide the inline links + Book
   CTA, show a 3-bar burger button, and slide the nav down as an overlay
   panel when toggled. Desktop behaviour is unchanged.
   ========================================================================= */

/* Burger button: hidden by default (desktop), shown on mobile. */
.nav-burger{
    display:none;
    width:42px; height:42px;
    background:transparent;
    border:0;
    padding:0;
    cursor:pointer;
    color:var(--ink, #1a1612);
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    border-radius:10px;
    transition:background .15s ease;
    margin-left:auto; /* push to the right edge */
}
.nav-burger:hover{ background:rgba(0,0,0,.04); }
.nav-burger-bar{
    display:block;
    width:22px;
    height:2px;
    background:currentColor;
    border-radius:2px;
    transition:transform .25s ease, opacity .25s ease;
}
/* X shape when open */
body.nav-open .nav-burger-bar:nth-child(1){ transform:translateY(7px) rotate(45deg); }
body.nav-open .nav-burger-bar:nth-child(2){ opacity:0; }
body.nav-open .nav-burger-bar:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* The desktop Book CTA on the right is shown by default; the mobile one
   inside the nav panel is hidden by default. We swap which is visible at
   the mobile breakpoint below. */
.book-cta-mobile{ display:none; }

/* Backdrop behind the slide-down panel */
.nav-backdrop{
    position:fixed;
    inset:0;
    background:rgba(26,22,18,.32);
    z-index:48;
    opacity:0;
    transition:opacity .2s ease;
    pointer-events:none;
}
body.nav-open .nav-backdrop{
    opacity:1;
    pointer-events:auto;
}

@media (max-width:820px){
    .nav{ padding:14px 18px; }
    .nav-burger{ display:flex; }
    .book-cta-desktop{ display:none; }

    /* Mobile nav panel — hidden off-screen above, slides down when open. */
    .nav-links{
        position:fixed;
        top:64px;
        left:12px;
        right:12px;
        max-height:calc(100vh - 80px);
        overflow-y:auto;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:0;
        padding:14px 16px;
        background:var(--paper, #f3ede2);
        border:1px solid var(--rule, #d6cdb9);
        border-radius:14px;
        box-shadow:0 18px 40px -18px rgba(0,0,0,.25), 0 4px 14px -8px rgba(0,0,0,.15);
        z-index:49;
        transform:translateY(-12px);
        opacity:0;
        pointer-events:none;
        transition:opacity .2s ease, transform .2s ease;
    }
    body.nav-open .nav-links{
        transform:translateY(0);
        opacity:1;
        pointer-events:auto;
    }

    .nav-links > a,
    .nav-dropdown > a{
        padding:14px 12px !important;
        border-bottom:1px solid var(--rule, #d6cdb9);
        font-size:15px;
        color:var(--ink, #1a1612);
    }
    .nav-links > a:last-child,
    .nav-dropdown:last-child > a{ border-bottom:0; }

    /* On mobile, expand the "The Place" submenu inline instead of as a
       hover dropdown — much more thumb-friendly. */
    .nav-dropdown{ width:100%; }
    .nav-dropdown > a{ display:flex; justify-content:space-between; align-items:center; }
    .nav-dropdown .caret{ transform:none; opacity:1; font-size:11px; }
    .nav-submenu{
        position:static !important;
        display:block !important;
        opacity:1 !important;
        visibility:visible !important;
        background:transparent !important;
        box-shadow:none !important;
        padding:4px 0 8px 8px !important;
        margin:0 !important;
        list-style:none;
        border:0 !important;
        transform:none !important;
    }
    .nav-submenu li a{
        display:block;
        padding:10px 12px;
        font-size:13.5px;
        color:var(--ink-soft, #3a322a);
        border:0;
    }

    /* The mobile-only Book CTA sits at the bottom of the open panel,
       primary-action styling. */
    .book-cta-mobile{
        display:block;
        margin-top:10px;
        padding:14px 16px !important;
        text-align:center;
        background:var(--accent-deep, #7d3a1f);
        color:#f3ede2 !important;
        border-radius:999px;
        font-weight:500;
        border:0 !important;
    }
    .book-cta-mobile:hover{ background:var(--accent, #b6532d); }
}

/* Homepage Excursions teaser — blurred preview cards.
   The cards reuse the existing .exc-card / .exc-grid styles from site.css;
   .is-preview adds the blur + badge so visitors understand these are
   teasers that link through to the real Viator widgets on /excursions.php. */
.exc-card.is-preview{ position:relative; cursor:pointer; }
.exc-card.is-preview .exc-img{
    filter:blur(4px) brightness(.92) saturate(.9);
    transform:scale(1.04); /* hide the blurred edges */
    transition:filter .35s ease, transform .35s ease;
}
.exc-card.is-preview:hover .exc-img{
    filter:blur(2px) brightness(1) saturate(1);
    transform:scale(1.02);
}
.exc-card.is-preview .preview-badge{
    position:absolute;
    top:14px; left:14px;
    z-index:2;
    display:inline-flex;
    align-items:center;
    gap:6px;
    background:rgba(26, 22, 18, .85);
    color:#f3ede2;
    font-family:'Inter',sans-serif;
    font-size:10.5px;
    font-weight:600;
    letter-spacing:.14em;
    text-transform:uppercase;
    padding:6px 12px;
    border-radius:999px;
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
    pointer-events:none;
}
.exc-card.is-preview .preview-badge > span{
    font-size:12px;
    line-height:1;
    transform:translateY(-1px);
}
.exc-card.is-preview .pad{ position:relative; z-index:2; }

/* CTA card under the teaser grid */
.exc-cta{
    margin:48px auto 0;
    max-width:620px;
    text-align:center;
    padding:32px 28px;
    background:var(--paper, #f3ede2);
    border:1px solid var(--rule, #d6cdb9);
    border-radius:12px;
}
.exc-cta-headline{
    font-family:'Fraunces',serif;
    font-weight:400;
    font-size:21px;
    line-height:1.3;
    color:var(--ink, #1a1612);
    margin:0 0 12px !important;
    display:inline-flex;
    align-items:baseline;
    gap:8px;
}
.exc-cta-icon{ font-size:18px; transform:translateY(2px); }
.exc-cta p{
    margin:0 0 18px;
    color:var(--ink-soft, #3a322a);
    font-size:15px;
    line-height:1.65;
}
.exc-cta .btn-primary{
    display:inline-block;
    text-decoration:none;
    padding:14px 28px;
    margin-top:6px;
}
.exc-cta-fine{
    margin-top:20px !important;
    font-size:12.5px !important;
    color:var(--muted, #8a7e6e) !important;
    line-height:1.6;
}
.exc-cta-fine a{
    color:var(--accent, #b6532d);
    text-decoration:underline;
    text-underline-offset:2px;
}

/* Viator widget area + consent gate */
.viator-stack{
    display:flex;
    flex-direction:column;
    gap:32px;
}
.viator-widget{
    background:var(--paper, #f3ede2);
    border:1px solid var(--rule, #d6cdb9);
    border-radius:10px;
    padding:8px;
    min-height:120px; /* avoid layout jump while Viator script loads */
}
.viator-gate{
    max-width:680px;
    margin:0 auto;
    background:var(--paper, #f3ede2);
    border:1px solid var(--rule, #d6cdb9);
    border-left:3px solid var(--accent, #b6532d);
    border-radius:10px;
    padding:28px 32px;
    text-align:left;
}
.viator-gate h3{
    font-family:'Fraunces',serif;
    font-weight:400;
    font-size:22px;
    margin:0 0 12px;
    color:var(--ink, #1a1612);
}
.viator-gate p{
    color:var(--ink-soft, #3a322a);
    font-size:15px;
    line-height:1.65;
    margin:0 0 14px;
}
.viator-gate p code{
    background:var(--paper-deep, #ebe3d4);
    padding:1px 6px;
    border-radius:4px;
    font-size:13px;
}
.viator-gate .viator-gate-fine{
    font-size:13px;
    color:var(--muted, #8a7e6e);
    line-height:1.55;
}
.viator-gate .viator-gate-fine a{
    color:var(--accent, #b6532d);
    text-decoration:underline;
    text-underline-offset:2px;
}
.viator-gate .btn-primary{ margin-top:6px; }

/* Footer additions */
footer .foot-legal{
    grid-column:1 / -1;
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    padding-top:20px;
    margin-top:20px;
    border-top:1px solid rgba(243,237,226,.18);
    font-size:12.5px;
    color:rgba(243,237,226,.55);
}
footer .foot-legal a{ color:rgba(243,237,226,.78); text-decoration:none; }
footer .foot-legal a:hover{ color:#f4caa3; text-decoration:underline; }
footer .foot-disclaimer{
    grid-column:1 / -1;
    font-size:11.5px;
    color:rgba(243,237,226,.45);
    line-height:1.6;
    margin-top:8px;
}

@media (max-width:680px){
    .cc-banner{ width:calc(100% - 24px); bottom:12px; }
    .cc-inner{ padding:18px 18px; gap:14px; }
    .cc-title{ font-size:18px; }
    .cc-text{ font-size:13.5px; }
    .cc-actions{ justify-content:stretch; }
    .cc-btn{ flex:1 1 calc(50% - 5px); text-align:center; padding:11px 14px; }
    .cc-reopen{ left:12px; bottom:12px; width:38px; height:38px; font-size:18px; }
}
