:root {
  --milk: #f6f2e9;
  --sand: #e8d8bd;
  --aqua: #9fcfd0;
  --aqua-deep: #4f9194;
  --coral: #cf725f;
  --ink: #24312f;
  --muted: #66716e;
  --line: rgba(36, 49, 47, .15);
  --soft-radius: 22px;
  --shadow: 0 24px 70px rgba(87, 112, 105, .15);
  --ease: cubic-bezier(.22, 1, .36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--milk);
  font-family: "Avenir Next", Avenir, "Segoe UI", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.55;
  overflow-x: hidden;
}
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
button { color: inherit; }
::selection { color: var(--ink); background: #f1b7a9; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 100; padding: 10px 16px; background: #fff; transform: translateY(-150%); }
.skip-link:focus { transform: none; }

.site-header {
  position: fixed; z-index: 30; top: 14px; left: 50%; transform: translateX(-50%);
  width: min(calc(100% - 32px), 1380px); height: 66px; display: flex; align-items: center;
  justify-content: space-between; padding: 0 10px 0 22px; border: 1px solid rgba(255,255,255,.5);
  border-radius: 999px; background: rgba(246,242,233,.72); backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 12px 36px rgba(55,74,70,.08);
  transition: background .3s ease, box-shadow .3s ease;
}
.site-header.scrolled { background: rgba(246,242,233,.93); box-shadow: 0 12px 38px rgba(55,74,70,.13); }
.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 650; letter-spacing: -.02em; }
.brand-mark { position: relative; width: 31px; height: 16px; display: inline-block; overflow: hidden; }
.brand-mark i { position: absolute; width: 25px; height: 11px; border: 1.5px solid var(--aqua-deep); border-radius: 50%; }
.brand-mark i:first-child { left: 0; top: -4px; }
.brand-mark i:last-child { right: 0; bottom: -4px; }
.main-nav { display: flex; align-items: center; gap: clamp(18px, 2.2vw, 34px); font-size: 14px; }
.main-nav > a { position: relative; color: #3d4a48; }
.main-nav > a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -5px; height: 1px; background: var(--coral); transition: right .35s var(--ease); }
.main-nav > a:hover::after, .main-nav > a:focus-visible::after { right: 0; }
.menu-toggle { display: none; }

.button {
  min-height: 50px; display: inline-flex; align-items: center; justify-content: center; border: 0;
  border-radius: 999px; padding: 0 25px; font-weight: 700; font-size: 14px; white-space: nowrap;
  cursor: pointer; transition: transform .3s var(--ease), box-shadow .3s ease, background .3s ease;
}
.button:hover { transform: translateY(-2px); }
.button:active { transform: translateY(1px) scale(.98); }
.button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid rgba(79,145,148,.45); outline-offset: 3px; }
.button-small { min-height: 46px; padding-inline: 21px; }
.button-dark { color: #fff; background: var(--ink); box-shadow: 0 10px 25px rgba(36,49,47,.2); }
.button-dark:hover { background: #344642; }
.button-coral { color: #fff; background: #b95c4b; box-shadow: 0 14px 32px rgba(185,92,75,.28); }
.button-coral:hover { background: #a84e40; box-shadow: 0 18px 38px rgba(185,92,75,.34); }
.button-wide { min-width: 210px; }

.hero {
  position: relative; min-height: 100dvh; overflow: hidden; isolation: isolate; padding: 132px max(24px, calc((100vw - 1380px)/2)) 48px;
  display: grid; grid-template-columns: 1.05fr 1.15fr; grid-template-rows: 1fr auto; align-items: center;
  background: radial-gradient(circle at 4% 20%, rgba(255,255,255,.95), transparent 30%), linear-gradient(145deg, #f8f4ec 0%, #e9e3d7 100%);
}
.hero-photo {
  position: absolute; z-index: -2; inset: 92px 0 28px 43%; border-radius: 34% 0 0 52% / 38% 0 0 56%;
  background: url("assets/hero.webp") center / cover no-repeat; box-shadow: var(--shadow); transform: scale(1.02);
  animation: photo-arrive 1.5s var(--ease) both;
}
.hero-photo-shade { position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(90deg, rgba(246,242,233,.45), transparent 32%); }
.hero-glow { position: absolute; z-index: -1; border-radius: 50%; filter: blur(10px); pointer-events: none; }
.hero-glow-one { width: 28vw; height: 28vw; top: -10vw; left: 12vw; background: rgba(255,210,173,.26); animation: drift 10s ease-in-out infinite alternate; }
.hero-glow-two { width: 17vw; height: 17vw; bottom: -4vw; left: 36vw; background: rgba(112,190,193,.22); animation: drift 13s ease-in-out -3s infinite alternate-reverse; }
.hero-copy { z-index: 2; align-self: center; max-width: 790px; padding-left: clamp(0px, 3vw, 42px); }
.eyebrow { margin-bottom: 24px; color: #586a66; font-size: 11px; font-weight: 750; letter-spacing: .18em; text-transform: uppercase; }
.hero h1 { margin-bottom: 26px; font-size: clamp(52px, 6.6vw, 102px); font-weight: 520; letter-spacing: -.065em; line-height: .93; }
.hero h1 em, .contact h2 em { color: var(--aqua-deep); font-family: Georgia, "Times New Roman", serif; font-weight: 400; line-height: 1.08; }
.hero h1 em { display: block; white-space: nowrap; }
.hero-lead { max-width: 470px; margin-bottom: 29px; color: #53625f; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; }
.hero-actions { display: flex; align-items: center; gap: 29px; }
.text-link { font-size: 14px; font-weight: 700; border-bottom: 1px solid rgba(36,49,47,.25); padding-bottom: 5px; }
.text-link span { display: inline-block; margin-left: 7px; transition: transform .3s var(--ease); }
.text-link:hover span { transform: translateY(4px); }
.weather-card {
  z-index: 3; position: absolute; right: max(24px, calc((100vw - 1380px)/2 + 18px)); bottom: 55px;
  width: 280px; min-height: 110px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 13px;
  padding: 17px 20px; border: 1px solid rgba(255,255,255,.52); border-radius: var(--soft-radius);
  color: #24312f; background: rgba(248,244,236,.67); backdrop-filter: blur(18px) saturate(140%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 14px 38px rgba(42,67,63,.15);
}
.weather-sun { width: 37px; height: 37px; border-radius: 50%; background: #e7aa71; box-shadow: inset -8px -7px 0 rgba(196,104,82,.18), 0 0 0 7px rgba(255,255,255,.3); }
.weather-card strong { display: block; font-size: 22px; line-height: 1.15; }
.weather-card span { font-size: 12px; color: #5f6e6a; }
.weather-card p { margin: 0; padding-left: 15px; border-left: 1px solid rgba(36,49,47,.14); color: #5f6e6a; font-size: 11px; line-height: 1.6; }
.hero-index { position: absolute; left: 30px; bottom: 34px; color: #72807d; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; transform: rotate(-90deg); transform-origin: left top; }
.hero-enter { animation: reveal-up 1s var(--ease) both; }
.hero-enter:nth-child(2) { animation-delay: .1s; }
.hero-enter:nth-child(3) { animation-delay: .22s; }
.hero-enter:nth-child(4) { animation-delay: .34s; }
.weather-card.hero-enter { animation-delay: .65s; }

.section { width: min(100%, 1440px); margin-inline: auto; padding: clamp(90px, 11vw, 165px) clamp(24px, 5vw, 72px); }
.intro { position: relative; display: grid; grid-template-columns: .75fr 1.5fr; align-items: center; min-height: 620px; overflow: hidden; }
.intro-number { color: transparent; font-family: Georgia, serif; font-size: clamp(290px, 38vw, 540px); line-height: .7; -webkit-text-stroke: 1px rgba(79,145,148,.18); transform: translateX(-8%); }
.intro-copy { position: relative; z-index: 2; max-width: 720px; }
.intro h2, .section-heading h2 { margin-bottom: 30px; font-size: clamp(42px, 5vw, 76px); font-weight: 520; letter-spacing: -.055em; line-height: 1.02; }
.intro-copy p { max-width: 590px; color: var(--muted); font-size: clamp(18px, 1.6vw, 22px); }
.tideline { position: absolute; left: 4%; right: 5%; bottom: 82px; height: 26px; overflow: hidden; opacity: .45; }
.tideline::before, .tideline::after { content: ""; position: absolute; top: 5px; width: 55%; height: 22px; border: 1px solid var(--aqua-deep); border-radius: 50%; }
.tideline::before { left: 0; }
.tideline::after { right: 0; transform: translateY(6px); }

.atmosphere { padding-top: 90px; }
.section-heading { max-width: 760px; margin-bottom: clamp(50px, 7vw, 95px); }
.mood-grid { display: grid; grid-template-columns: 1.04fr .92fr 1.04fr; gap: clamp(14px, 2vw, 30px); align-items: stretch; }
.mood-card { position: relative; min-height: 480px; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 27px; border: 1px solid rgba(255,255,255,.7); border-radius: var(--soft-radius); transition: transform .55s var(--ease), box-shadow .55s ease, filter .55s ease; }
.mood-card:hover { transform: translateY(-9px); box-shadow: var(--shadow); filter: saturate(1.08); }
.mood-card:nth-child(2) { margin-top: 60px; }
.mood-card h3 { margin-bottom: 9px; font-size: 27px; letter-spacing: -.035em; }
.mood-card p { max-width: 320px; margin-bottom: 0; color: #52615e; font-size: 15px; }
.card-number { position: relative; z-index: 2; align-self: flex-start; font-size: 11px; font-weight: 750; letter-spacing: .14em; }
.mood-visual { position: absolute; inset: 0; pointer-events: none; transition: transform .7s var(--ease); }
.mood-card:hover .mood-visual { transform: scale(1.035) translateY(-4px); }
.mood-card > div:last-child { position: relative; z-index: 2; }
.mood-card-sand { background: linear-gradient(145deg, #e7d2ae, #f4ead9 70%); }
.sand-rings::before, .sand-rings::after, .sand-rings span { content: ""; position: absolute; left: 50%; top: 39%; border: 1px solid rgba(132,104,67,.22); border-radius: 50%; transform: translate(-50%,-50%); }
.sand-rings::before { width: 310px; height: 210px; }
.sand-rings::after { width: 230px; height: 150px; }
.sand-rings span { width: 130px; height: 86px; background: rgba(255,255,255,.12); }
.mood-card-water { color: #eaf7f5; background: #6da6a6 url("assets/hero.webp") 18% 78% / 220% no-repeat; }
.mood-card-water::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,83,87,.06), rgba(20,74,78,.62)); }
.mood-card-water p { color: rgba(255,255,255,.84); }
.water-light { z-index: 1; background: radial-gradient(ellipse at 70% 25%, rgba(255,255,255,.46), transparent 28%); mix-blend-mode: soft-light; }
.mood-card-sunset { background: linear-gradient(160deg, #f2c3a6 0%, #f7ded0 55%, #d2e4df 100%); }
.sunset-orbit span { position: absolute; width: 180px; height: 180px; right: -20px; top: 80px; border-radius: 50%; background: rgba(207,114,95,.72); box-shadow: 0 0 80px rgba(226,146,111,.35); }
.sunset-orbit::after { content: ""; position: absolute; left: -15%; right: -15%; top: 47%; height: 100px; border-top: 1px solid rgba(55,112,115,.3); border-radius: 50%; transform: rotate(-7deg); }

.showcase { width: min(100%, 1560px); padding-inline: clamp(18px, 3vw, 48px); }
.showcase-frame { position: relative; min-height: min(78vw, 850px); overflow: hidden; border-radius: var(--soft-radius); background: #8ab9b6; box-shadow: 0 35px 90px rgba(51,83,78,.18); }
.showcase-frame img { position: absolute; inset: -7% 0; width: 100%; height: 114%; object-fit: cover; object-position: center; transform: translate3d(0, var(--parallax, 0px), 0) scale(1.04); will-change: transform; }
.showcase-scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(23,47,46,.54) 0%, rgba(23,47,46,.1) 55%, transparent 75%), linear-gradient(0deg, rgba(21,43,42,.23), transparent 40%); }
.showcase-copy { position: absolute; z-index: 2; left: clamp(27px, 6vw, 92px); top: 50%; width: min(560px, 65%); color: #fff; transform: translateY(-50%); }
.showcase-copy > span { display: inline-block; margin-bottom: 25px; font-size: 12px; letter-spacing: .1em; }
.showcase h2 { margin-bottom: 26px; font-size: clamp(45px, 6vw, 89px); font-weight: 500; letter-spacing: -.06em; line-height: .98; }
.showcase-copy p { max-width: 430px; margin-bottom: 0; color: rgba(255,255,255,.85); font-size: 17px; }
.showcase-note { position: absolute; z-index: 2; right: 28px; bottom: 28px; width: 160px; padding: 17px 20px; border: 1px solid rgba(255,255,255,.38); border-radius: 16px; color: #fff; background: rgba(23,47,46,.2); backdrop-filter: blur(12px); }
.showcase-note span { display: block; font-size: 11px; }
.showcase-note strong { font-size: 24px; }
.showcase-note i { display: block; position: absolute; top: 22px; right: 19px; width: 24px; height: 24px; border-radius: 50%; background: var(--coral); }
.rest-details { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; border-bottom: 1px solid var(--line); }
.rest-details p { margin: 0; padding: 25px 5px; border-right: 1px solid var(--line); color: #5f6e6a; font-size: 13px; text-align: center; }
.rest-details p:last-child { border-right: 0; }

.contact { position: relative; width: 100%; max-width: none; min-height: 700px; overflow: hidden; padding: 140px max(24px, calc((100vw - 1380px)/2)) 30px; background: linear-gradient(150deg, #d8e8e3 0%, #f1e9dc 54%, #ecc3ae 120%); }
.contact::before, .contact::after { content: ""; position: absolute; left: -10%; right: -10%; height: 140px; border-top: 1px solid rgba(79,145,148,.23); border-radius: 50%; }
.contact::before { bottom: 170px; transform: rotate(2deg); }
.contact::after { bottom: 135px; transform: rotate(-2deg); }
.contact-sun { position: absolute; width: min(42vw, 560px); aspect-ratio: 1; right: -8vw; top: -14vw; border-radius: 50%; background: rgba(222,141,111,.52); box-shadow: 0 0 120px rgba(222,141,111,.25); animation: drift 14s ease-in-out infinite alternate; }
.contact-shell { position: relative; z-index: 2; max-width: 820px; }
.contact-kicker { margin-bottom: 25px; color: #536660; font-size: 14px; }
.contact h2 { margin-bottom: 30px; font-size: clamp(48px, 6.2vw, 92px); font-weight: 520; letter-spacing: -.06em; line-height: .98; }
.contact-shell > p:not(.contact-kicker) { max-width: 590px; margin-bottom: 32px; color: #596864; font-size: 18px; }
.footer { position: relative; z-index: 2; margin-top: 120px; min-height: 85px; display: grid; grid-template-columns: 1fr auto auto; align-items: end; gap: 45px; border-top: 1px solid rgba(36,49,47,.18); padding-top: 28px; font-size: 13px; }
.footer-links { display: flex; flex-wrap: wrap; gap: 18px 28px; color: #52615e; }
.footer-links a:hover { color: var(--coral); }
.footer-year { color: #71807c; }

[data-reveal] { opacity: 0; transform: translateY(34px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
[data-reveal].revealed { opacity: 1; transform: none; }
.mood-card:nth-child(2)[data-reveal] { transform: translateY(94px); }
.mood-card:nth-child(2)[data-reveal].revealed { transform: translateY(60px); }

.booking { width: min(92vw, 570px); border: 0; border-radius: var(--soft-radius); padding: 0; color: var(--ink); background: var(--milk); box-shadow: 0 35px 110px rgba(21,40,38,.3); }
.booking::backdrop { background: rgba(33,49,47,.55); backdrop-filter: blur(6px); }
.booking[open] { animation: dialog-in .45s var(--ease); }
.booking-content, .booking-success { padding: clamp(33px, 6vw, 58px); }
.booking-close { position: absolute; z-index: 3; right: 17px; top: 15px; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.6); cursor: pointer; font-size: 25px; line-height: 1; }
.booking-kicker { color: var(--aqua-deep); font-size: 12px; font-weight: 750; letter-spacing: .1em; }
.booking h2 { margin-bottom: 12px; font-size: clamp(35px, 6vw, 51px); letter-spacing: -.05em; line-height: 1; }
.booking-content > p:not(.booking-kicker), .booking-success p { color: var(--muted); }
.booking-form { display: grid; gap: 18px; margin-top: 30px; }
.booking-form label { display: grid; gap: 7px; font-size: 13px; font-weight: 700; }
.booking-form input { width: 100%; min-height: 50px; border: 1px solid rgba(36,49,47,.23); border-radius: 12px; padding: 0 15px; color: var(--ink); background: #fff; }
.booking-form input::placeholder { color: #707a78; opacity: 1; }
.booking-form input.invalid { border-color: #9f3d30; background: #fff8f6; }
.form-error { min-height: 20px; margin: -7px 0 0; color: #8d3027; font-size: 13px; }
.booking-success { text-align: center; }
.success-mark { width: 68px; height: 68px; margin: 0 auto 24px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--aqua-deep); font-size: 30px; }

@keyframes reveal-up { from { opacity: 0; transform: translateY(35px); } to { opacity: 1; transform: none; } }
@keyframes photo-arrive { from { opacity: 0; transform: scale(1.08); } to { opacity: 1; transform: scale(1.02); } }
@keyframes drift { to { transform: translate3d(3vw, 2vw, 0) scale(1.08); } }
@keyframes dialog-in { from { opacity: 0; transform: translateY(22px) scale(.97); } }

@media (max-width: 980px) {
  .hero { grid-template-columns: 1fr; padding-top: 120px; align-items: end; }
  .hero-photo { inset: 88px 0 22px 22%; opacity: .92; }
  .hero-copy { padding: 0 0 65px; }
  .hero h1 { font-size: clamp(53px, 9vw, 80px); }
  .hero-photo-shade { background: linear-gradient(90deg, rgba(246,242,233,.8), rgba(246,242,233,.15) 70%); }
  .weather-card { display: none; }
  .intro { grid-template-columns: .55fr 1.45fr; }
  .mood-grid { grid-template-columns: 1fr 1fr; }
  .mood-card:last-child { grid-column: 1 / -1; min-height: 390px; }
  .mood-card:nth-child(2) { margin-top: 35px; }
  .mood-card:nth-child(2)[data-reveal].revealed { transform: translateY(35px); }
}

@media (max-width: 760px) {
  body { font-size: 16px; }
  .site-header { top: 9px; width: calc(100% - 18px); height: 60px; padding-left: 16px; }
  .menu-toggle { width: 44px; height: 44px; border: 0; border-radius: 50%; display: grid; align-content: center; gap: 6px; padding: 0 12px; background: var(--ink); cursor: pointer; }
  .menu-toggle i { display: block; height: 1.5px; background: #fff; transition: transform .3s ease; }
  .menu-toggle[aria-expanded="true"] i:first-of-type { transform: translateY(3.8px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] i:last-of-type { transform: translateY(-3.8px) rotate(-45deg); }
  .main-nav { position: fixed; top: 69px; left: 9px; right: 9px; display: grid; gap: 0; padding: 13px; border: 1px solid rgba(255,255,255,.6); border-radius: 20px; background: rgba(246,242,233,.98); box-shadow: var(--shadow); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: .3s var(--ease); }
  .main-nav.open { opacity: 1; visibility: visible; transform: none; }
  .main-nav > a { padding: 12px 8px; }
  .main-nav .button { margin-top: 8px; width: 100%; }

  .hero { min-height: 820px; padding: 108px 22px 35px; align-items: end; }
  .hero-photo { inset: 82px -18% 145px 8%; border-radius: 42% 0 0 38% / 30% 0 0 38%; background-position: 64% center; }
  .hero-photo-shade { background: linear-gradient(0deg, rgba(246,242,233,.95), transparent 65%), linear-gradient(90deg, rgba(246,242,233,.4), transparent 60%); }
  .hero-copy { padding: 0; align-self: end; }
  .eyebrow { margin-bottom: 15px; }
  .hero h1 { margin-bottom: 18px; font-size: clamp(46px, 13vw, 65px); line-height: .97; }
  .hero h1 em { white-space: normal; }
  .hero-lead { margin-bottom: 22px; font-size: 16px; max-width: 340px; }
  .hero-actions { gap: 18px; }
  .hero .button { min-height: 48px; padding-inline: 21px; }
  .text-link { font-size: 13px; }
  .hero-index { display: none; }

  .section { padding: 88px 22px; }
  .intro { display: block; min-height: 550px; padding-top: 130px; }
  .intro-number { position: absolute; top: 25px; left: -5px; font-size: 330px; }
  .intro-copy { margin-left: 12%; }
  .intro h2, .section-heading h2 { font-size: clamp(38px, 11vw, 56px); }
  .intro-copy p { font-size: 17px; }
  .tideline { bottom: 35px; }
  .mood-grid { grid-template-columns: 1fr; }
  .mood-card { min-height: 410px; }
  .mood-card:nth-child(2) { margin-top: 0; }
  .mood-card:nth-child(2)[data-reveal], .mood-card:nth-child(2)[data-reveal].revealed { transform: translateY(34px); }
  .mood-card:nth-child(2)[data-reveal].revealed { transform: none; }
  .mood-card:last-child { grid-column: auto; min-height: 410px; }

  .showcase { padding: 75px 12px; }
  .showcase-frame { min-height: 690px; }
  .showcase-frame img { object-position: 58% center; }
  .showcase-scrim { background: linear-gradient(0deg, rgba(19,43,42,.68) 0%, rgba(19,43,42,.1) 68%); }
  .showcase-copy { left: 24px; right: 24px; top: auto; bottom: 39px; width: auto; transform: none; }
  .showcase-copy > span { margin-bottom: 15px; }
  .showcase h2 { font-size: clamp(44px, 12vw, 61px); }
  .showcase-copy p { font-size: 15px; max-width: 330px; }
  .showcase-note { top: 18px; right: 18px; bottom: auto; }
  .rest-details { grid-template-columns: 1fr; padding: 14px 8px; }
  .rest-details p { padding: 10px; border-right: 0; }

  .contact { min-height: 760px; padding: 110px 22px 26px; }
  .contact h2 { font-size: clamp(45px, 12vw, 64px); }
  .contact-sun { width: 300px; right: -150px; top: -80px; }
  .footer { margin-top: 105px; grid-template-columns: 1fr auto; align-items: start; gap: 28px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-links { display: grid; gap: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1; transform: none !important; }
  .showcase-frame img { transform: scale(1.04); }
}

@supports not (backdrop-filter: blur(1px)) {
  .site-header { background: rgba(246,242,233,.97); }
  .weather-card { background: rgba(246,242,233,.95); }
}