/* Styles for local-guides.html only. */

/* edge-align */
/* Logo and page content share one left edge: a 1200px column, centered. Desktop only. */
  @media (min-width: 901px) {
    nav { padding-left: max(2rem, calc((100% - 1200px) / 2)) !important; padding-right: max(2rem, calc((100% - 1200px) / 2)) !important; }
    body > :is(section, div, main, header):not(.mobile-menu):not(.photo-modal):not(.ap-overlay):not(.hb-modal):not([class*="modal"]):not([class*="promo"]):not([id*="odal"]):not([id*="romo"]):not([id*="popup"]) {
      padding-left: max(2rem, calc((100% - 1200px) / 2)) !important;
      padding-right: max(2rem, calc((100% - 1200px) / 2)) !important;
    }
    body > :is(section, div, main, header)[style*="max-width"], .blog-wrap, .gl-wrap, .page-layout { max-width: none !important; }
    .blog-wrap, .gl-wrap, .page-layout { padding-left: max(2rem, calc((100% - 1200px) / 2)) !important; padding-right: max(2rem, calc((100% - 1200px) / 2)) !important; }
  }

/* lf-light */
/* Light, boutique theme to match the rest of the site */
  .page-hero { min-height: 0; display: block; background: linear-gradient(180deg, #F3F8F7 0%, #FBF9F6 100%); padding-top: 8.2rem; padding-bottom: 2.6rem; border-bottom: 1px solid rgba(36,75,72,0.08); }
  .page-hero-pattern, .page-hero-accent { display: none; }
  .page-hero-content { max-width: 760px; }
  .page-hero-eyebrow { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 1.6rem; letter-spacing: 0; text-transform: none; color: var(--accent); font-weight: 400; margin-bottom: 0.2rem; }
  .page-hero-title { font-weight: 500; color: var(--sea); margin-bottom: 1rem; }
  .page-hero-title em { color: var(--accent); }
  .page-hero-sub { color: var(--text-muted); max-width: 620px; }
  .breadcrumb { background: #fff; }
  .cat-tabs { padding-top: 1rem; position: sticky; top: 3.9rem; z-index: 40; border-bottom: 1px solid rgba(36,75,72,0.1); }
  .cat-tab.active { color: var(--sea); border-bottom-color: var(--accent); }
  main { background: #FBF9F6; padding-top: 3rem; padding-bottom: 5rem; }
  .category-section { margin-bottom: 3.6rem; scroll-margin-top: 8rem; }
  .cat-header { margin-bottom: 1.4rem; padding-bottom: .8rem; border-bottom: 1px solid rgba(36,75,72,0.12); }
  .cat-title { font-weight: 500; color: var(--sea); font-size: 2.1rem; }
  .cat-count { color: var(--accent); }
  .vt-picks-bar { background: #fff; border: 1px solid rgba(196,149,106,0.35); border-left: 3px solid var(--accent); border-radius: 6px; margin-bottom: 1.4rem; padding: .9rem 1.2rem; }
  .vt-picks-text { color: var(--text); }
  .spots-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.1rem; }
  .spot-card { --ac: var(--sea-light); flex: 0 0 calc((100% - 4.4rem) / 5); display: flex; flex-direction: column; background: #fff; border: 1px solid rgba(36,75,72,0.1); border-top: 3px solid var(--ac); border-radius: 8px; box-shadow: 0 2px 10px rgba(36,75,72,0.05); transition: transform .25s, box-shadow .25s; }
  .spot-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(36,75,72,0.12); border-color: rgba(36,75,72,0.14); }
  .cs-sand .spot-card { --ac: var(--accent); }
  .cs-dusk .spot-card { --ac: #8E6038; }
  .spot-body { padding: 1.15rem 1.15rem 1.2rem; display: flex; flex-direction: column; flex: 1; }
  .spot-name { font-size: 1.3rem; font-weight: 600; color: var(--sea); line-height: 1.15; }
  .spot-meta { flex-wrap: wrap; row-gap: .1rem; }
  .spot-desc { font-size: .84rem; line-height: 1.55; }
  .spot-tag { align-self: flex-start; margin-top: auto; background: var(--sea-pale); border: none; color: var(--sea); padding: .28rem .7rem; }
  .spot-desc + .spot-tag { margin-top: .9rem; }
  @media (max-width: 1100px) and (min-width: 901px) { .spot-card { flex-basis: calc((100% - 3.3rem) / 4); } }
  @media (max-width: 900px) { .page-hero { padding-top: 6.5rem; } .cat-tabs { top: 3.4rem; } .spot-card { flex-basis: calc((100% - 1.1rem) / 2); } }
  @media (max-width: 600px) { .spot-card { flex-basis: 100%; } .spots-grid { gap: .9rem; } }
  .page-hero-content { max-width: 920px; }
  @media (min-width: 1101px) {
    .cs-n4 .spot-card { flex-basis: calc((100% - 3.3rem) / 4); }
    .cs-n6 .spot-card, .cs-n3 .spot-card { flex-basis: calc((100% - 2.2rem) / 3); }
  }

/* titles-mono */
/* Single-color titles: the accent word inherits the heading color */
  h1 em, h2 em, h3 em, h1 i, h2 i, h3 i, .hero-h1 em, .section-title em, .page-hero-title em { color: inherit !important; }

/* lf-n8 */
@media (min-width: 1101px) { .cs-n8 .spot-card { flex-basis: calc((100% - 3.3rem) / 4); } }

/* towns-css */
.towns { background: #FBF9F6; padding-top: 2.6rem; padding-bottom: 1.2rem; }
  .towns-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; }
  .towns-script { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 1.5rem; color: var(--accent); margin-bottom: .1rem; }
  .towns-title { font-family: 'Cormorant Garamond', serif; font-weight: 500; font-size: clamp(2rem, 3.4vw, 2.6rem); color: var(--sea); line-height: 1.1; }
  .towns-nav { display: flex; gap: .5rem; }
  .towns-nav button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(36,75,72,0.25); background: #fff; color: var(--sea); font-size: 1.05rem; cursor: pointer; transition: background .2s; }
  .towns-nav button:hover { background: var(--sea-pale); }
  .towns-track { display: flex; gap: 1.2rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: .4rem; }
  .towns-track::-webkit-scrollbar { display: none; }
  .town-card { flex: 0 0 calc((100% - 4.8rem) / 5); scroll-snap-align: start; min-width: 200px; }
  .town-card img { display: block; width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: 20px; background: var(--sea-pale); margin-bottom: .9rem; }
  .town-card h3 { font-family: 'DM Sans', sans-serif; font-size: 1rem; font-weight: 500; color: var(--text); margin-bottom: .3rem; }
  .town-card p { font-size: .84rem; line-height: 1.55; color: var(--text-muted); }
  @media (max-width: 900px) { .town-card { flex-basis: 62%; } .towns { padding-left: 1.5rem !important; padding-right: 1.5rem !important; } }

/* lf-tighten */
.page-hero { padding-top: 6.4rem; padding-bottom: 1.6rem; }
  .page-hero-content { max-width: none; }
  .page-hero-title { margin-bottom: .6rem; }
  .page-hero-sub { max-width: none; }
  .towns { padding-top: 1.8rem; padding-bottom: .6rem; }
  .towns-head { margin-bottom: 1rem; }
  .cat-tabs { padding-top: .4rem; }
  main { padding-top: 2.2rem; }
  @media (min-width: 1101px) {
    .town-card { flex-basis: calc((100% - 6rem) / 6); min-width: 0; }
    .towns-nav { display: none; }
  }
  @media (min-width: 1300px) { .page-hero-sub { font-size: .93rem; white-space: nowrap; } }
  @media (max-width: 900px) { .page-hero { padding-top: 5.4rem; } }

/* lf-pills-bottom */
.spot-card { align-self: stretch; }
  .spot-desc { margin-bottom: .9rem; }
  .spot-body .spot-tag, .spot-desc + .spot-tag { margin-top: auto !important; align-self: flex-start; }

/* lf-flip */
.spot-card { background: transparent !important; border: none !important; box-shadow: none !important; border-radius: 0 !important; overflow: visible; display: flex; }
  .spot-card:hover { box-shadow: none !important; }
  .sc-flip { position: relative; flex: 1; transform-style: preserve-3d; transition: transform .65s cubic-bezier(.3,.7,.2,1); }
  .spot-card.flipped .sc-flip { transform: rotateY(180deg); }
  .sc-face { backface-visibility: hidden; -webkit-backface-visibility: hidden; background: #fff; border: 1px solid rgba(36,75,72,0.1); border-top: 3px solid var(--ac); border-radius: 8px; box-shadow: 0 2px 10px rgba(36,75,72,0.05); }
  .spot-card:hover .sc-face { box-shadow: 0 12px 28px rgba(36,75,72,0.12); }
  .sc-front { position: relative; height: 100%; display: flex; flex-direction: column; }
  .sc-front .spot-body { flex: 1; padding-bottom: 1.2rem; }
  .sc-front .spot-tag { max-width: calc(100% - 3.2rem); }
  .sc-flipbtn { position: absolute; right: 1rem; bottom: 1.05rem; width: 32px; height: 32px; border-radius: 50%; border: 1px solid rgba(36,75,72,0.25); background: #fff; color: var(--sea); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s; padding: 0; }
  .sc-flipbtn:hover { background: var(--sea-pale); }
  .sc-flipbtn svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  .sc-back { position: absolute; inset: 0; transform: rotateY(180deg); padding: 1.15rem 1.15rem 1.2rem; display: flex; flex-direction: column; gap: .75rem; }
  .sc-back-name { font-family: 'Cormorant Garamond', serif; font-size: 1.25rem; font-weight: 600; color: var(--sea); line-height: 1.15; padding-right: 2rem; }
  .sc-back { overflow-y: auto; gap: .55rem !important; }

  .sc-row { font-size: .84rem; line-height: 1.45; color: var(--text); }
  .sc-row small { display: block; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--text-muted); margin-bottom: .1rem; }
  .sc-row a { color: var(--sea); text-decoration: underline; }
  .sc-maps { margin-top: auto; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; background: var(--sea); color: #fff !important; text-decoration: none !important; border-radius: 40px; padding: .6rem 1rem; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }
  .sc-maps:hover { background: var(--btn-dark); }
  .sc-maps svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .sc-back-close { position: absolute; top: .8rem; right: .8rem; width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgba(36,75,72,0.25); background: #fff; color: var(--sea); cursor: pointer; font-size: .9rem; line-height: 1; padding: 0; }
  @media (prefers-reduced-motion: reduce) { .sc-flip { transition: none; } }

/* tabs-follow-nav */
.category-section { scroll-margin-top: 5.2rem; }
  .cat-tabs { transition: top .35s ease; }
  html.nav-gone .cat-tabs { top: 0; }

/* nav-hover-hold */
.nav-dropdown-menu::before{content:"";position:absolute;left:0;right:0;top:-1.1rem;height:1.1rem}
.nav-dropdown:hover>.nav-dropdown-menu{display:block}

/* a11y-contrast */
/* a11y: raises text contrast to WCAG AA 4.5:1. Delete this block to revert. */
.towns-script{color:#b8804d !important}
article:nth-child(1) > p{color:#607472 !important}
article:nth-child(2) > p{color:#607472 !important}
article:nth-child(3) > p{color:#607472 !important}
article:nth-child(4) > p{color:#607472 !important}
article:nth-child(5) > p{color:#607472 !important}
article:nth-child(6) > p{color:#607472 !important}
#beaches > .cat-header > .cat-count{color:#93653a !important}
#restaurants > .cat-header > .cat-count{color:#93653a !important}
#coffee > .cat-header > .cat-count{color:#93653a !important}
#drinks > .cat-header > .cat-count{color:#93653a !important}
#activities > .cat-header > .cat-count{color:#93653a !important}
#rainy > .cat-header > .cat-count{color:#93653a !important}
#kids > .cat-header > .cat-count{color:#93653a !important}
#shopping > .cat-header > .cat-count{color:#93653a !important}
.ft-fine{color:#8e9493 !important}

/* guides-looks-css */
.gl-picker{max-width:760px;margin:1.5rem auto 1rem;padding:.8rem 1.1rem;border:1px dashed rgba(26,51,48,0.35);border-radius:12px;background:#fff;text-align:center}
.gl-picker b{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sea);margin-bottom:.55rem}
.gl-chips{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.gl-chip{padding:.4rem .95rem;border-radius:30px;border:1px solid rgba(26,51,48,0.25);background:none;font-family:'DM Sans',sans-serif;font-size:.78rem;color:var(--text);cursor:pointer}
.vote-tag{display:inline-block;margin-left:.45rem;padding:.12rem .5rem;border-radius:10px;background:#8E6038;color:#fff;font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;font-weight:500;vertical-align:middle}
.gl-chip.active{background:var(--sea);border-color:var(--sea);color:#fff}
.gl-desc{font-size:.8rem;color:var(--text-muted);margin-top:.6rem}
@media (min-width:901px){
[data-gl="2"] .spot-card{flex-basis:calc((100% - 2.2rem) / 3)}
[data-gl="2"] .spot-name,[data-gl="2"] .sc-back-name{font-size:1.5rem}
[data-gl="2"] .spot-desc{font-size:.92rem}
[data-gl="3"] .spots-grid{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x mandatory;padding:.4rem .3rem 1.2rem;gap:1.2rem}
[data-gl="3"] .spot-card{flex:0 0 290px;scroll-snap-align:start}
[data-gl="4"] .spot-card{flex-basis:calc((100% - 3.3rem) / 4)}
[data-gl="4"] .sc-face{background:#244B48;border-color:rgba(255,255,255,.12);border-top-color:var(--ac)}
[data-gl="4"] .spot-name,[data-gl="4"] .sc-back-name{color:#fff}
[data-gl="4"] .spot-meta,[data-gl="4"] .spot-desc,[data-gl="4"] .sc-row{color:rgba(255,255,255,.82)}
[data-gl="4"] .sc-row small{color:rgba(255,255,255,.55)}
[data-gl="4"] .sc-row a{color:#E3C3A0}
[data-gl="4"] .spot-tag{background:rgba(255,255,255,.14);color:#fff}
[data-gl="4"] .sc-flipbtn{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
[data-gl="4"] .sc-flipbtn:hover{background:rgba(255,255,255,.12)}
[data-gl="4"] .sc-maps{background:#fff;color:#244B48 !important}
[data-gl="5"] .spots-grid{gap:1.6rem}
[data-gl="5"] .spot-card{flex-basis:calc((100% - 4.8rem) / 4)}
[data-gl="5"] .sc-face{border:0;border-top:0;border-radius:20px;box-shadow:0 10px 34px rgba(36,75,72,.11)}
[data-gl="5"] .spot-name,[data-gl="5"] .sc-back-name{font-size:1.55rem;font-weight:500}
[data-gl="5"] .spot-body{padding:1.5rem 1.4rem 1.4rem}
[data-gl="5"] .sc-back{padding:1.5rem 1.4rem 1.4rem}
}

/* page-title-unify */
.page-hero-eyebrow{font-family:'Cormorant Garamond',serif!important;font-style:italic!important;font-weight:400!important;font-size:1.6rem!important;letter-spacing:0!important;text-transform:none!important;color:#C4956A!important;margin-bottom:.2rem!important;line-height:1.2!important}
.page-hero-title{font-family:'Cormorant Garamond',serif!important;font-weight:500!important;font-size:clamp(2.4rem,5vw,4rem)!important;color:#244B48!important;line-height:1.1!important}
.page-hero-eyebrow{margin-top:18px!important}
.page-hero-title{margin-bottom:1rem!important}
