/* ============================================================
   HOMEPAGE — page styles (hero, category cards, events band,
   where-to-stay split). Carried from the approved comp.
   ============================================================ */

/* ---------------- HERO ---------------- */
.hero { position:relative; color:var(--limestone); overflow:hidden; isolation:isolate; }
.hero__media { position:absolute; inset:0; z-index:-4; background:linear-gradient(135deg,#2c4a3d 0%,#3f6152 45%,#6d8a6a 100%); }
.hero__media picture, .hero__media img { position:absolute; inset:0; width:100%; height:100%; }
.hero__media img { object-fit:cover; }
.hero__grain { position:absolute; inset:0; z-index:-3; opacity:0.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='hn'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23hn)'/%3E%3C/svg%3E"); }
.hero__ridges { position:absolute; inset:0; z-index:-2; will-change:transform; }
.hero__scrim { position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(120% 90% at 15% 100%, rgba(36,59,50,0.15), transparent 55%),
    linear-gradient(180deg, var(--spruce-70) 0%, rgba(36,59,50,0.30) 38%, var(--spruce-90) 100%); }
.hero__contours { position:absolute; inset:0; z-index:-1; opacity:0.22; mix-blend-mode:soft-light; }
.hero__contours path { stroke-dasharray:2400; stroke-dashoffset:2400; animation:draw 2.6s var(--ease) forwards; }
.hero__contours path:nth-child(2){animation-delay:.12s}
.hero__contours path:nth-child(3){animation-delay:.24s}
.hero__contours path:nth-child(4){animation-delay:.36s}
.hero__contours path:nth-child(5){animation-delay:.48s}
.hero__contours path:nth-child(6){animation-delay:.6s}
.hero__contours path:nth-child(7){animation-delay:.72s}

.hero__inner { max-width:var(--maxw); margin:0 auto; padding:clamp(5rem,12vh,9rem) var(--gutter) clamp(4rem,9vh,7rem); display:grid; align-content:end; min-height:78vh; }
.hero__eyebrow { color:var(--goldenrod); margin-bottom:1.25rem; }
.hero h1 { color:var(--limestone); font-size:var(--display-xl); font-weight:600; max-width:15ch; text-wrap:balance; }
.hero h1 em { font-style:italic; color:var(--gold-soft); font-weight:500; }
.hero__sub { font-size:var(--body-l); max-width:46ch; margin-top:1.4rem; color:rgba(239,235,227,0.9); }
.hero__actions { display:flex; flex-wrap:wrap; gap:0.9rem; margin-top:2.2rem; align-items:center; }
.hero__caption { position:absolute; right:var(--gutter); bottom:1.1rem; font-size:0.6875rem; letter-spacing:0.1em; text-transform:uppercase; color:rgba(239,235,227,0.6); font-variant:small-caps; }
.hero__caption a { color:inherit; text-decoration:none; border-bottom:1px dotted rgba(239,235,227,0.4); }
.hero__caption a:hover, .hero__caption a:focus-visible { color:rgba(239,235,227,0.9); }

/* ---------------- THINGS TO DO: 3 category cards ---------------- */
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.card { display:flex; flex-direction:column; background:var(--paper); border:1px solid var(--hairline); border-radius:12px; overflow:hidden; box-shadow:var(--shadow-card); transition:transform 0.22s var(--ease), box-shadow 0.22s var(--ease); }
.card:hover { transform:translateY(-5px); box-shadow:var(--shadow-card-hover); }
.card > a { display:flex; flex-direction:column; flex:1; } /* whole card is the link */
.card__media { aspect-ratio:4 / 3; position:relative; }
.card__media > .duo-img { position:absolute; inset:0; transition:transform 0.5s var(--ease); }
.card:hover .card__media .duo-img { transform:scale(1.05); }
.card__body { padding:1.4rem 1.4rem 1.6rem; display:flex; flex-direction:column; gap:0.5rem; flex:1; }
.card__body h3 { font-size:var(--h2); }
.card__body p { color:#4a4b44; font-size:0.95rem; }
.card__more { margin-top:auto; padding-top:0.9rem; font-weight:600; font-size:0.875rem; color:var(--ridge); display:inline-flex; align-items:center; gap:0.4rem; transition:color 0.16s, gap 0.16s; }
.card:hover .card__more { color:var(--goldenrod); gap:0.6rem; }

/* ---------------- UPCOMING EVENTS: tinted band ---------------- */
.events { background:var(--spruce); color:var(--limestone); position:relative; overflow:hidden; }
.events__topo { position:absolute; inset:0; opacity:0.06; pointer-events:none; color:var(--limestone); }
.events > .wrap { position:relative; z-index:1; }
.events h2 { color:var(--limestone); }
.events .section__intro { color:rgba(239,235,227,0.8); }
.events .section__link { color:var(--gold-soft); border-color:var(--goldenrod); }
.events .section__link:hover { color:var(--limestone); }
.events__list { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
.event { display:flex; gap:1.1rem; padding:1.4rem; background:rgba(239,235,227,0.05); border:1px solid rgba(239,235,227,0.12); border-radius:10px; transition:background 0.18s, border-color 0.18s, transform 0.18s var(--ease); }
.event:hover { background:rgba(239,235,227,0.09); border-color:rgba(239,235,227,0.3); transform:translateY(-3px); }
.event__date { flex:none; width:62px; text-align:center; border-right:1px solid rgba(239,235,227,0.18); padding-right:1.1rem; }
.event__month { font-size:0.75rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--goldenrod); font-weight:700; }
.event__day { font-family:'Fraunces',serif; font-size:2rem; color:var(--limestone); line-height:1; margin-top:2px; }
.event__body h3 { color:var(--limestone); font-size:1.15rem; margin-bottom:0.3rem; }
.event__meta { font-size:0.85rem; color:rgba(239,235,227,0.72); }
.event__place { display:inline-flex; align-items:center; gap:0.3rem; margin-top:0.5rem; font-size:0.8rem; color:rgba(239,235,227,0.62); }

/* ---------------- WHERE TO STAY: split feature ---------------- */
.stay__grid { display:grid; grid-template-columns:1.1fr 0.9fr; gap:2.5rem; align-items:center; }
.stay__media { aspect-ratio:16 / 11; border-radius:var(--radius-lg); position:relative; border:1px solid var(--hairline); box-shadow:var(--shadow-card); }
.stay__copy h2 { font-size:var(--h1); margin:0.7rem 0 1rem; }
.stay__copy p { color:var(--body-muted); font-size:var(--body-l); margin-bottom:1.2rem; max-width:44ch; }
.stay__tags { display:flex; flex-wrap:wrap; gap:0.6rem; margin-bottom:1.8rem; }
.tag { font-size:0.8125rem; font-weight:600; color:var(--spruce); background:var(--limestone-soft); border:1px solid var(--hairline); padding:0.35rem 0.8rem; border-radius:100px; transition:background 0.15s, transform 0.05s; }
.tag:hover { background:#d9d1c0; }

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:960px) {
  .cards, .events__list { grid-template-columns:1fr 1fr; }
}
@media (max-width:900px) {
  .stay__grid { grid-template-columns:1fr; gap:1.5rem; }
}
@media (max-width:680px) {
  .cards, .events__list { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .hero__contours path { stroke-dashoffset:0; }
}
