/* ============================================================================
   Bemus Point Lodge — bespoke design pass ("Lakeside")
   Loaded AFTER styles.css so these brand tokens win over base.css defaults.
   Palette pulled from the brand: forest-green logo, charcoal-navy buildings,
   sunset/firepit amber. Fraunces display serif for a warm, boutique feel.
   ============================================================================ */
:root {
  --brand-primary: #1F7A45;        /* lodge green (logo) */
  --brand-primary-deep: #15602F;
  --brand-secondary: #15242E;      /* charcoal-navy — night sky / buildings */
  --accent: #E0913B;               /* sunset / fire-pit amber */
  --brand-text: #1A2620;
  --brand-text-muted: #5C6B62;
  --brand-bg: #FBFAF5;             /* warm paper white */
  --brand-bg-alt: #EDF1EA;         /* soft sage mist */
  --brand-border: #DEE5DC;
  --font-heading: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --radius: 10px;
  --shadow-2: 0 18px 50px rgba(21,36,46,0.16);
}

body { background: var(--brand-bg); }
h1,h2,h3,h4 { font-family: var(--font-heading); }

/* ---- Header / nav ---- */
.site-header { backdrop-filter: none; box-shadow: 0 1px 0 rgba(21,36,46,.06); }
.nav-logo img { height: 46px; max-width: 240px; }
.nav-cta { background: var(--brand-primary); border-radius: 999px; white-space: nowrap; }
.nav-cta:hover { background: var(--brand-primary-deep); opacity: 1; }
.profile-luxury_service .nav-links { gap: 20px; }
.profile-luxury_service .nav-links > li > a { font-weight: 600; color: var(--brand-text); letter-spacing: .06em; font-size: .76rem; white-space: nowrap; }
.profile-luxury_service .nav-links > li > a:hover { color: var(--brand-primary); }
.profile-luxury_service .nav-cta { letter-spacing: .08em; }
/* Give the hamburger a little more room before the desktop bar gets cramped */
@media (max-width: 980px) and (min-width: 861px) {
  .profile-luxury_service .nav-links { gap: 15px; }
  .profile-luxury_service .nav-links > li > a { font-size: .72rem; letter-spacing: .04em; }
}

/* ---- Buttons ---- */
.x-btn { border-radius: 999px; font-weight: 600; letter-spacing: .01em; }
.x-btn-primary { background: var(--brand-primary); }
.x-btn-primary:hover { background: var(--brand-primary-deep); }
.x-btn .ic { width: 18px; height: 18px; }
.x-btn-outline {
  display:inline-flex; align-items:center; gap:10px; padding:16px 30px;
  border-radius:999px; font-weight:600; font-size:1.05rem; text-decoration:none;
  background:transparent; color:var(--brand-text); border:1.5px solid var(--brand-border);
  transition:border-color .2s, color .2s, transform .12s;
}
.x-btn-outline:hover { border-color:var(--brand-primary); color:var(--brand-primary); transform:translateY(-2px); text-decoration:none; }

/* ---- Hero (home) ---- */
.home-hero { min-height: 92vh; }
.home-hero .x-hero-scrim {
  background: linear-gradient(180deg, rgba(21,36,46,.30) 0%, rgba(21,36,46,.18) 38%, rgba(21,36,46,.86) 100%);
}
.x-eyebrow { background: var(--brand-primary); border-radius: 999px; letter-spacing: .14em; }
.home-hero h1 { font-weight: 600; font-size: clamp(2.6rem, 6.2vw, 5rem); line-height: 1.02; }
.x-hero .x-chip svg { color: var(--accent); }

/* ---- Stat strip ---- */
.x-stats { background: var(--brand-secondary); }
.x-stat .num { color: var(--accent); font-family: var(--font-heading); font-weight: 600; }

/* ---- Section heads ---- */
.x-head .k { color: var(--brand-primary); }
.x-head h2 { font-weight: 600; }

/* ---- Welcome grid (home) ---- */
.welcome-grid { display:grid; grid-template-columns: 1.05fr .95fr; gap: clamp(32px,5vw,72px); align-items:center; }
.welcome-media { border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow-2); aspect-ratio: 5/4; }
.welcome-media img { width:100%; height:100%; object-fit:cover; }
.welcome-copy .x-lead { font-size:1.2rem; color:var(--brand-text); font-weight:500; }
@media (max-width:820px){ .welcome-grid{ grid-template-columns:1fr; } .welcome-media{ aspect-ratio:16/10; } }

/* ---- Lakeside image band ---- */
.lake-band {
  position:relative; background-size:cover; background-position:center;
  padding: clamp(64px,11vw,140px) 0; color:#fff; text-align:center;
}
.lake-band-scrim { position:absolute; inset:0; background: linear-gradient(180deg, rgba(21,36,46,.55), rgba(21,36,46,.72)); }
.lake-band .container { position:relative; z-index:2; }
.lake-band-quote {
  font-family: var(--font-heading); font-weight:500; font-style:italic;
  font-size: clamp(1.4rem, 3.2vw, 2.4rem); line-height:1.3; max-width: 22ch; margin:0 auto;
  text-shadow: 0 2px 24px rgba(0,0,0,.3);
}
@media (max-width:700px){ .lake-band{ background-attachment: scroll; } }

/* ---- Rooms ---- */
.room-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.room-grid--all { grid-template-columns: repeat(3, 1fr); }
@media (max-width:920px){ .room-grid, .room-grid--all{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:560px){ .room-grid, .room-grid--all{ grid-template-columns: 1fr; } }
.room-card {
  background:var(--brand-bg); border:1px solid var(--brand-border); border-radius: var(--radius);
  overflow:hidden; transition: transform .18s, box-shadow .18s; display:flex; flex-direction:column;
}
.room-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-2); }
.room-card-img { aspect-ratio: 4/3; overflow:hidden; }
.room-card-img img { width:100%; height:100%; object-fit:cover; transition: transform .5s ease; }
.room-card:hover .room-card-img img { transform: scale(1.05); }
.room-card-body { padding: 20px 22px 22px; flex:1; display:flex; flex-direction:column; }
.room-card-body h3 { font-size:1.35rem; font-weight:600; margin:0 0 6px; }
.room-beds { font-weight:600; color:var(--brand-text); margin:0 0 2px; }
.room-extra { color:var(--brand-text-muted); font-size:.96rem; margin:0 0 16px; }
.room-meta { margin-top:auto; display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; }
.room-sleeps, .room-tag {
  display:inline-flex; align-items:center; gap:7px; font-size:.85rem; font-weight:600;
}
.room-sleeps { color:var(--brand-text); }
.room-sleeps svg { width:18px; height:18px; color:var(--brand-primary); }
.room-tag { color:var(--accent); }
.room-tag svg { width:17px; height:17px; }
.room-card.is-feature { grid-column: span 3; flex-direction:row; }
.room-card.is-feature .room-card-img { flex: 0 0 46%; aspect-ratio:auto; }
.room-card.is-feature .room-card-body { justify-content:center; padding: 32px 36px; }
.room-card.is-feature h3 { font-size: clamp(1.5rem,2.6vw,2rem); }
.room-card.is-feature .room-beds { font-size:1.1rem; }
@media (max-width:920px){ .room-card.is-feature{ grid-column: span 2; flex-direction:column; } .room-card.is-feature .room-card-img{ flex:auto; aspect-ratio:4/3; } }
@media (max-width:560px){ .room-card.is-feature{ grid-column: span 1; } }

/* ---- Book strip ---- */
.book-strip { background:var(--brand-primary); color:#fff; }
.book-strip .container { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px var(--container-pad); flex-wrap:wrap; }
.book-strip strong { display:block; font-size:1.15rem; font-family:var(--font-heading); font-weight:600; }
.book-strip span span, .book-strip > .container > div span { color:rgba(255,255,255,.85); font-size:.98rem; }
.book-strip .x-btn-primary { background:#fff; color:var(--brand-primary); }
.book-strip .x-btn-primary:hover { background:var(--brand-secondary); color:#fff; }

/* ---- Boat feature (home, dark) ---- */
.boat-feature-grid { display:grid; grid-template-columns: 1fr 1fr; gap: clamp(32px,5vw,64px); align-items:center; }
.boat-feature-media { border-radius:var(--radius); overflow:hidden; box-shadow: var(--shadow-2); aspect-ratio:4/3; }
.boat-feature-media img { width:100%; height:100%; object-fit:cover; }
.boat-feature .x-head h2 { color:#fff; }
.boat-feature p { color: rgba(255,255,255,.82); font-size:1.08rem; }
@media (max-width:820px){ .boat-feature-grid{ grid-template-columns:1fr; } }

/* ---- Amenities ---- */
.amen-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
@media (max-width:820px){ .amen-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .amen-grid{ grid-template-columns:1fr; } }
.amen-card { display:flex; gap:16px; padding:22px; background:var(--brand-bg); border:1px solid var(--brand-border); border-radius:var(--radius); transition:box-shadow .18s, transform .18s; }
.amen-card:hover { box-shadow: var(--shadow-2); transform:translateY(-3px); }
.amen-ic { flex:none; width:48px; height:48px; border-radius:12px; background: color-mix(in srgb, var(--brand-primary) 12%, transparent); display:flex; align-items:center; justify-content:center; }
.amen-ic svg { width:26px; height:26px; color:var(--brand-primary); }
.amen-card h3 { font-size:1.12rem; font-weight:600; margin:2px 0 5px; }
.amen-card p { margin:0; color:var(--brand-text-muted); font-size:.95rem; line-height:1.5; }

/* ---- Split feature (reusable) ---- */
.split-feature { display:grid; grid-template-columns: 1fr 1fr; gap: clamp(32px,5vw,64px); align-items:center; }
.split-media { border-radius:var(--radius); overflow:hidden; box-shadow: var(--shadow-2); aspect-ratio:4/3; }
.split-media img { width:100%; height:100%; object-fit:cover; }
@media (max-width:820px){ .split-feature{ grid-template-columns:1fr; } }

/* ---- Things to do ---- */
.todo-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:26px; }
@media (max-width:880px){ .todo-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .todo-grid{ grid-template-columns:1fr; } }
.todo-card { background:var(--brand-bg); border:1px solid var(--brand-border); border-radius:var(--radius); overflow:hidden; transition:transform .18s, box-shadow .18s; }
.todo-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-2); }
.todo-img { aspect-ratio: 3/2; overflow:hidden; }
.todo-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.todo-card:hover .todo-img img { transform:scale(1.05); }
.todo-body { padding: 20px 22px 24px; }
.todo-body h3 { font-size:1.3rem; font-weight:600; margin:0 0 8px; }
.todo-body p { margin:0; color:var(--brand-text-muted); }

/* ---- Reviews ---- */
.reviews-stars { display:flex; justify-content:center; gap:6px; margin-bottom:18px; }
.reviews-stars svg { width:30px; height:30px; color:var(--accent); }

/* ---- Contact ---- */
.contact-grid { display:grid; grid-template-columns: 1fr 1fr; gap: clamp(32px,5vw,64px); align-items:start; }
@media (max-width:880px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-list { list-style:none; margin:24px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; }
.contact-list a, .contact-list .static { display:flex; align-items:center; gap:16px; padding:16px; border-radius:var(--radius); color:var(--brand-text); transition:background .15s; }
.contact-list a:hover { background:var(--brand-bg-alt); text-decoration:none; }
.contact-list .ci { flex:none; width:46px; height:46px; border-radius:12px; background:color-mix(in srgb, var(--brand-primary) 12%, transparent); display:flex; align-items:center; justify-content:center; }
.contact-list .ci svg { width:24px; height:24px; color:var(--brand-primary); }
.contact-list strong { display:block; font-size:1.05rem; }
.contact-list em { font-style:normal; color:var(--brand-text-muted); font-size:.9rem; }
.contact-social { margin-top:24px; }

.contact-form-wrap { background:var(--brand-bg); border:1px solid var(--brand-border); border-radius:var(--radius); padding: clamp(24px,3vw,36px); box-shadow:var(--shadow-2); }
.contact-form h3 { font-size:1.4rem; font-weight:600; margin:0 0 18px; }
.contact-form label { display:block; font-size:.85rem; font-weight:600; color:var(--brand-text); margin-bottom:14px; }
.contact-form input, .contact-form textarea {
  width:100%; margin-top:6px; padding:12px 14px; font:inherit; font-weight:400;
  border:1px solid var(--brand-border); border-radius:8px; background:#fff; color:var(--brand-text);
}
.contact-form input:focus, .contact-form textarea:focus { outline:none; border-color:var(--brand-primary); box-shadow:0 0 0 3px color-mix(in srgb, var(--brand-primary) 18%, transparent); }
.cf-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:480px){ .cf-row{ grid-template-columns:1fr; } }
.cf-note { font-size:.82rem; color:var(--brand-text-muted); margin:14px 0 0; text-align:center; }

.map-section { line-height:0; }
.map-section iframe { width:100%; height:420px; border:0; display:block; filter: saturate(.95); }

/* ---- Footer ---- */
.footer-brand { font-family:var(--font-heading); font-weight:600; font-size:1.4rem; color:#fff; margin-bottom:14px; }
.site-footer p { color:rgba(255,255,255,.7); font-size:.95rem; line-height:1.6; }
.footer-social { display:flex; gap:12px; margin-top:18px; }
.footer-social a { width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; color:#fff; transition:background .18s; }
.footer-social a:hover { background:var(--brand-primary); }
.footer-social svg { width:20px; height:20px; }

/* ---- Banner crumbs accent ---- */
.x-banner .x-hero-scrim { background: linear-gradient(180deg, rgba(21,36,46,.5), rgba(21,36,46,.78)); }
.x-banner h1 { font-weight:600; }

/* ============================================================================
   Beef-up pass: dropdown nav parent, gallery teaser + gallery page, rooms
   intro, area-attractions grid, standalone checklist.
   ============================================================================ */

/* "The Lodge" dropdown parent — match the boutique nav links */
.profile-luxury_service .nav-parent {
  text-transform: uppercase; letter-spacing: .06em; font-size: .76rem;
  font-weight: 600; color: var(--brand-text);
}
.nav-has-children:hover .nav-parent,
.nav-has-children:focus-within .nav-parent,
.nav-has-children.is-active .nav-parent { color: var(--brand-primary); }
.nav-dropdown a[aria-current="page"] { color: var(--brand-primary); }
@media (max-width: 980px) and (min-width: 861px) {
  .profile-luxury_service .nav-parent { font-size: .72rem; letter-spacing: .04em; }
}
@media (max-width: 860px) {
  .profile-luxury_service .nav-parent {
    font-size: 1.1rem; padding: var(--space-4) 0;
    border-bottom: 1px solid var(--brand-border); width: 100%;
  }
  /* base.css's later desktop rule (opacity:0) wins over its own mobile rule at
     equal specificity — force the dropdown open inline in the mobile menu. */
  .nav-links .nav-dropdown {
    position: static; opacity: 1; visibility: visible; transform: none;
    box-shadow: none; border: none; background: transparent; min-width: 0;
    padding: 0 0 var(--space-2) var(--space-4); margin: 0;
  }
  .nav-links .nav-dropdown a { font-size: 1rem; }
}

/* Standalone checklist (rooms intro, amenities) — base only styles it inside .x-body */
.x-checklist { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 28px; margin:18px 0 22px; padding:0; list-style:none; }
.x-checklist li { display:flex; gap:11px; align-items:flex-start; padding-left:0; margin:0; line-height:1.5; font-size:1.02rem; color:var(--brand-text); }
.x-checklist li::before { display:none; }
.x-checklist .x-ck { flex:none; width:22px; height:22px; color:var(--brand-primary); margin-top:1px; }
@media (max-width:520px){ .x-checklist{ grid-template-columns:1fr; } }

/* Rooms intro split */
.intro-split { display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,64px); align-items:center; }
.intro-list p { margin:0 0 4px; color:var(--brand-text-muted); }
@media (max-width:820px){ .intro-split{ grid-template-columns:1fr; gap:22px; } }

/* Home gallery teaser strip */
.gteaser { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
.gteaser-item { aspect-ratio:1/1; border-radius:10px; overflow:hidden; box-shadow:var(--shadow-1); display:block; }
.gteaser-item img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.gteaser-item:hover img { transform:scale(1.06); }
@media (max-width:900px){ .gteaser{ grid-template-columns:repeat(3,1fr);} }
@media (max-width:520px){ .gteaser{ grid-template-columns:repeat(2,1fr);} }

/* Gallery page: caption overlay on the shared .x-gphoto tiles */
.gallery-grid .x-gphoto { position:relative; }
.gallery-grid figcaption {
  position:absolute; inset:auto 0 0 0; padding:26px 16px 13px; color:#fff;
  font-weight:600; font-size:.96rem; line-height:1.3;
  background:linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0));
  opacity:0; transform:translateY(8px); transition:opacity .25s ease, transform .25s ease;
}
.gallery-grid .x-gphoto:hover figcaption { opacity:1; transform:none; }
@media (max-width:760px){ .gallery-grid figcaption{ opacity:1; transform:none; } }

/* Things to Do: nearby attractions grid */
.attr-grid { display:grid; grid-template-columns:1fr 1fr; gap:26px 44px; }
.attr-item { display:flex; gap:16px; }
.attr-pin { flex:none; width:46px; height:46px; border-radius:12px; background:color-mix(in srgb, var(--brand-primary) 12%, transparent); display:flex; align-items:center; justify-content:center; }
.attr-pin svg { width:24px; height:24px; color:var(--brand-primary); }
.attr-item h3 { font-size:1.2rem; font-weight:600; margin:2px 0 6px; }
.attr-item p { margin:0; color:var(--brand-text-muted); line-height:1.55; }
@media (max-width:760px){ .attr-grid{ grid-template-columns:1fr; gap:22px; } }
