/* CONSOLIDATED SOURCE: css/universal-app-nav.css */
/* NeuroBios Universal App Nav v1.0
   Parent-owned application shell.
   NeuroChill is Reference App 01.
*/

:root {
  --nb-appnav-height: 52px;
}

.nb-appnav {
  position: fixed;
  z-index: 60;
  top: 0;
  right: 0;
  left: 0;
  height: var(--nb-appnav-height);
  border-bottom: 1px solid rgba(164, 181, 255, 0.16);
  background: rgba(3, 7, 18, 0.94);
  color: #eef3ff;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18);
}

@supports ((-webkit-backdrop-filter: blur(18px)) or (backdrop-filter: blur(18px))) {
  .nb-appnav {
    background: rgba(3, 7, 18, 0.76);
    -webkit-backdrop-filter: blur(18px) saturate(125%);
    backdrop-filter: blur(18px) saturate(125%);
  }
}

.nb-appnav__inner {
  position: relative;
  width: min(calc(100% - 32px), 1180px);
  height: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
}

.nb-appnav a {
  color: inherit;
  text-decoration: none;
}

.nb-appnav__home {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  line-height: 0;
}

.nb-appnav__home-lockup {
  display: block;
max-height: 31px;
  object-fit: contain;
}

.nb-appnav__home-orb {
  display: none;
  width: 30px;
  height: 30px;
  object-fit: contain;
}

/* Ambient Weather occupies the Universal App Nav's original 144px left identity slot. */
.nb-appnav__ambient-home {
  width: 144px;
}

.nb-appnav__ambient-lockup {
  display: block;
  width: auto;
  height: 40px;
  max-width: 136px;
  object-fit: contain;
}

.nb-appnav__ambient-mobile-emblem {
  display: none;
  width: 30px;
  height: 30px;
  object-fit: contain;
}

/* NeuroBios is rendered over the existing hidden status geometry owner.
   Absolute positioning prevents any change to the three-column grid or centre rail. */
.nb-appnav__parent-home {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 0;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  line-height: 0;
  transform: translateY(-50%);
}

.nb-appnav__parent-home .nb-appnav__home-lockup {
  width: 104px;
  max-height: 23px;
}

.nb-appnav__rail {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}

.nb-appnav__rail::-webkit-scrollbar {
  display: none;
}

.nb-appnav__app {
  flex: 0 0 auto;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: rgba(233, 238, 255, 0.68);
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
  white-space: nowrap;
}

.nb-appnav__app--current {
  border-color: rgba(154, 184, 255, 0.25);
  background: rgba(112, 145, 255, 0.10);
  color: #f4f7ff;
}

.nb-appnav__app--future {
  opacity: 0.62;
}

.nb-appnav__status {
  visibility: hidden;
  pointer-events: none;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border: 1px solid rgba(200, 185, 255, 0.24);
  border-radius: 999px;
  background: rgba(200, 185, 255, 0.07);
  color: #dad3ff;
  font-size: 10px;
  font-weight: 760;
  letter-spacing: 0.075em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.nb-appnav__status-dot {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #c8b9ff;
  box-shadow: 0 0 10px rgba(200, 185, 255, 0.62);
}

@media (max-width: 800px) {
  :root {
    --nb-appnav-height: 48px;
  }

  .nb-appnav__inner {
    width: calc(100% - 22px);
    gap: 10px;
  }
.nb-appnav__rail {
    justify-content: flex-start;
    gap: 5px;
  }

  .nb-appnav__app {
    padding: 6px 8px;
    font-size: 11px;
  }

  .nb-appnav__status {
    padding: 6px 8px;
    gap: 5px;
    font-size: 9px;
    letter-spacing: 0.055em;
  }
}

@media (max-width: 600px) {
  .nb-appnav__ambient-home {
    width: 30px;
  }

  .nb-appnav__ambient-lockup {
    display: none;
  }

  .nb-appnav__ambient-mobile-emblem {
    display: block;
  }

  .nb-appnav__home-lockup {
    display: none;
  }

  .nb-appnav__home-orb {
    display: block;
  }

  .nb-appnav__app--future {
    display: none;
  }

  .nb-appnav__rail {
    overflow: visible;
  }
}

@media (max-width: 380px) {
  .nb-appnav__ambient-home {
    width: 27px;
  }

  .nb-appnav__ambient-mobile-emblem {
    width: 27px;
    height: 27px;
  }

  .nb-appnav__inner {
    width: calc(100% - 16px);
    gap: 7px;
  }

  .nb-appnav__home-orb {
    width: 27px;
    height: 27px;
  }

  .nb-appnav__app {
    padding-inline: 7px;
    font-size: 10.5px;
  }

  .nb-appnav__status {
    padding-inline: 7px;
    font-size: 8.25px;
    letter-spacing: 0.035em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nb-appnav__rail {
    scroll-behavior: auto;
  }
}

/* === NEUROBIOS UNIVERSAL APP NAV v2 === */
.nb-appnav__home-lockup { width: 144px; }

.nb-appnav__switcher {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.nb-appnav__apps { position: relative; flex: 0 0 auto; }
.nb-appnav__apps-trigger {
  display: inline-flex;
  min-height: 34px;
  padding: 0 14px;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(154, 184, 255, 0.30);
  border-radius: 999px;
  background: rgba(112, 145, 255, 0.08);
  color: #f0f3ff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.nb-appnav__apps-trigger::-webkit-details-marker { display: none; }
.nb-appnav__apps-trigger:hover {
  border-color: rgba(154, 184, 255, 0.48);
  background: rgba(112, 145, 255, 0.13);
}
.nb-appnav__apps-chevron {
  display: inline-block;
  color: #cbc8ec;
  font-size: 15px;
  line-height: 1;
  transition: transform 160ms ease;
}
.nb-appnav__apps[open] .nb-appnav__apps-chevron { transform: rotate(180deg); }
.nb-appnav__menu {
  position: absolute;
  z-index: 90;
  top: calc(100% + 10px);
  left: 0;
  width: 286px;
  padding: 8px;
  border: 1px solid rgba(164, 181, 255, 0.20);
  border-radius: 16px;
  background: rgba(7, 12, 31, 0.97);
  box-shadow: 0 24px 64px rgba(0,0,0,.48), 0 0 0 1px rgba(90,120,210,.04);
}
@supports ((-webkit-backdrop-filter: blur(22px)) or (backdrop-filter: blur(22px))) {
  .nb-appnav__menu {
    background: rgba(7,12,31,.88);
    -webkit-backdrop-filter: blur(22px) saturate(125%);
    backdrop-filter: blur(22px) saturate(125%);
  }
}
.nb-appnav__menu-item {
  display: block;
  padding: 10px 12px;
  border-radius: 10px;
  color: rgba(235,239,255,.76);
}
a.nb-appnav__menu-item:hover { background: rgba(112,145,255,.07); color: #fff; }
.nb-appnav__menu-item + .nb-appnav__menu-item { margin-top: 2px; }
.nb-appnav__menu-item--current {
  background: rgba(132,151,226,.14);
  color: #f7f8ff;
  box-shadow: inset 0 0 0 1px rgba(176,187,255,.08);
}
.nb-appnav__menu-item--future { opacity: .70; }
.nb-appnav__menu-copy { display: grid; gap: 3px; }
.nb-appnav__menu-copy strong { font-size: 13px; font-weight: 680; line-height: 1.15; }
.nb-appnav__menu-copy small {
  color: rgba(198,207,235,.56);
  font-size: 9px;
  font-weight: 680;
  letter-spacing: .10em;
  line-height: 1.2;
  text-transform: uppercase;
}
@media (max-width: 800px) {
.nb-appnav__switcher { gap: 7px; }
  .nb-appnav__apps-trigger { min-height: 32px; padding-inline: 10px; font-size: 11px; }
  .nb-appnav__menu { width: 268px; }
}
@media (max-width: 600px) {
  .nb-appnav__rail { display: none; }
  .nb-appnav__switcher { justify-content: flex-start; }
  .nb-appnav__status > span:last-child { display: none; }
  .nb-appnav__status::after { content: "Coming soon"; }
  .nb-appnav__menu {
    position: fixed;
    top: calc(var(--nb-appnav-height) + 8px);
    right: 11px;
    left: 11px;
    width: auto;
    max-height: calc(100svh - var(--nb-appnav-height) - 16px);
    overflow-y: auto;
    background: #070c1f;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: 0 24px 64px rgba(0,0,0,.58), 0 0 0 1px rgba(154,184,255,.07);
  }
  .nb-appnav__menu-item { padding: 11px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .nb-appnav__apps-chevron { transition: none; }
}

/* Desktop Ambient Weather lockup: native-size render for crispness.
   Matches the previous 1.35× visual size without browser transform resampling. */
@media (min-width:1001px){
  .nb-appnav__ambient-lockup{
    height:54px;
    max-width:184px;
    transform:none;
  }
}

/* CONSOLIDATED SOURCE: css/styles.css */
:root {
  --ink: #f5f7f8;
  --muted: #b8c2c8;
  --soft: #7f919b;
  --bg: #06111b;
  --bg-deep: #03090e;
  --panel: rgba(11, 25, 35, 0.88);
  --panel-soft: rgba(12, 31, 42, 0.68);
  --line: rgba(192, 218, 226, 0.16);
  --line-strong: rgba(216, 232, 235, 0.28);
  --gold: #f0c982;
  --gold-soft: #ffe3ad;
  --sky: #78c9ee;
  --sky-deep: #147db0;
  --green: #9ad9b4;
  --shell: 1180px;
  --gutter: clamp(20px, 4.5vw, 64px);
  --header-height: 64px;
  --radius: 18px;
  --shadow: 0 24px 70px rgba(0,0,0,.30);
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nb-appnav-height,52px) + var(--header-height) + 18px);background:var(--bg-deep)}
body{display:grid;grid-template-columns:minmax(0,1fr);min-width:320px;margin:0;overflow-x:hidden;color:var(--ink);background:linear-gradient(180deg,#07131d 0%,#05101a 44%,#030a10 100%);font-family:var(--font);font-size:16px;line-height:1.6;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
button,a{font:inherit}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button{color:inherit}:focus-visible{outline:3px solid var(--sky);outline-offset:4px}::selection{color:#071018;background:var(--gold-soft)}
.shell{width:min(calc(100% - (var(--gutter)*2)),var(--shell));margin-inline:auto}
.skip-link{position:fixed;z-index:1000;top:12px;left:12px;padding:10px 16px;color:#071018;background:#fff;border-radius:999px;font-weight:750;transform:translateY(-160%);transition:transform .18s ease}.skip-link:focus{transform:translateY(0)}

.aw-header-stack{display:grid;grid-column:1;grid-row:1;align-self:start;grid-template-rows:var(--nb-appnav-height) auto auto}
main{grid-column:1;grid-row:2}
.aw-header-stack>.aw-ecosystem-strip{grid-row:3}
@media(min-width:1001px) and (min-height:900px){
  .aw-header-stack:not(:has(.ecosystem-gateway[open]))+main{grid-row:1}
  .aw-header-stack:not(:has(.ecosystem-gateway[open]))+main .hero-content{padding-top:calc(var(--nb-appnav-height,52px) + var(--header-height) + 46px)}
}
.site-header{position:relative;grid-row:2;z-index:30;width:100%;min-height:var(--header-height);border-bottom:1px solid rgba(255,255,255,.08);background:rgba(4,13,20,.78)}
.site-nav{position:relative;display:flex;min-height:var(--header-height);align-items:center;justify-content:space-between;gap:22px}.brand{display:inline-flex;align-items:center;gap:9px;color:#fff;font-size:17px;font-weight:700;letter-spacing:-.025em}.brand-emblem{position:relative;display:inline-grid;width:30px;height:30px;place-items:center;overflow:hidden;border-radius:50%;background:linear-gradient(180deg,#f1f4ef 0 46%,#54bfe9 47% 100%);box-shadow:0 0 22px rgba(92,193,235,.25)}.brand-emblem::before,.brand-emblem::after,.brand-emblem span{content:"";position:absolute;left:5px;right:5px;height:7px;border:2px solid #157eae;border-top:0;border-left:0;border-right:0;border-radius:50%;transform:rotate(6deg)}.brand-emblem::before{top:14px}.brand-emblem::after{top:18px;opacity:.75}.brand-emblem span{top:10px;opacity:.5}
.nav-menu{display:flex;align-items:center;gap:clamp(18px,2.6vw,32px);color:rgba(239,247,249,.68);font-size:13px;font-weight:620}.nav-menu a,.footer-links a{transition:color .18s ease}.nav-menu a:hover,.footer-links a:hover{color:#fff}.nav-toggle{display:none;width:44px;height:44px;padding:11px 9px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.05);cursor:pointer}.nav-toggle span{display:block;width:22px;height:1px;margin:5px auto;background:var(--ink);transition:transform .18s ease,opacity .18s ease}.nav-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}.nav-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.nav-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@supports ((-webkit-backdrop-filter:blur(18px)) or (backdrop-filter:blur(18px))){.site-header{background:rgba(4,13,20,.48);-webkit-backdrop-filter:blur(18px) saturate(125%);backdrop-filter:blur(18px) saturate(125%)}}

.hero{position:relative;display:grid;min-height:clamp(640px,80svh,720px);overflow:hidden;isolation:isolate;transition:background-color .5s ease}.hero-sky,.hero-landscape,.hero-shade{position:absolute;inset:0;z-index:-3}.hero-sky{background:radial-gradient(circle at 76% 34%,rgba(255,218,153,.46) 0 4%,rgba(214,139,78,.18) 17%,transparent 35%),linear-gradient(145deg,#071521 0%,#132b3d 42%,#664638 76%,#8b6046 100%);transition:background .6s ease}.hero-landscape{z-index:-2;top:auto;height:38%;background:radial-gradient(ellipse at 70% 100%,rgba(205,136,74,.22),transparent 38%),linear-gradient(180deg,transparent 0%,rgba(4,15,22,.22) 36%,rgba(3,12,18,.68) 100%);clip-path:none;opacity:.62}.hero-shade{z-index:-1;background:linear-gradient(90deg,rgba(2,9,14,.76) 0%,rgba(3,13,20,.58) 43%,rgba(3,12,18,.24) 70%,rgba(3,10,15,.30) 100%),linear-gradient(180deg,rgba(3,9,14,.10),transparent 52%,rgba(3,10,16,.50) 100%)}
.hero.atmosphere-rain .hero-sky{background:radial-gradient(circle at 74% 32%,rgba(136,178,190,.24),transparent 24%),linear-gradient(145deg,#06131c,#183241 42%,#536b70 100%)}.hero.atmosphere-storm .hero-sky{background:radial-gradient(circle at 74% 34%,rgba(123,135,192,.28),transparent 20%),linear-gradient(145deg,#02060e,#11172b 44%,#30364c 100%)}.hero.atmosphere-snow .hero-sky{background:radial-gradient(circle at 73% 30%,rgba(239,247,255,.42),transparent 19%),linear-gradient(145deg,#08131c,#385365 48%,#a7b8be 100%)}
.hero-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,.64fr);min-height:inherit;padding-top:46px;padding-bottom:44px;align-items:center;gap:clamp(34px,5vw,68px)}.hero-copy-block{align-self:center}.eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 16px;color:#d7e1e5;font-size:12px;font-weight:720;letter-spacing:.17em;line-height:1.2;text-transform:uppercase}.eyebrow>span{width:32px;height:1px;background:linear-gradient(90deg,var(--sky),var(--gold));box-shadow:0 0 12px rgba(126,202,235,.3)}.hero h1{max-width:620px;margin:0;font-size:clamp(38px,4vw,58px);font-weight:555;letter-spacing:-.048em;line-height:.98;text-wrap:balance}.hero h1 span{display:block;margin-top:.08em;color:#cdd7da;font-size:.84em;font-weight:350;line-height:1.02}.hero-copy{max-width:560px;margin:22px 0 0;color:rgba(229,238,241,.72);font-size:clamp(15px,1.2vw,17px);line-height:1.58}.hero-actions{display:flex;flex-wrap:wrap;gap:18px;margin-top:26px;align-items:center}.button{display:inline-flex;min-height:44px;padding:10px 18px;align-items:center;justify-content:center;border:1px solid var(--line-strong);border-radius:13px;font-size:13px;font-weight:690;transition:transform .18s ease,background-color .18s ease,border-color .18s ease}.button:hover{transform:translateY(-2px)}.button-primary{color:#10202a;background:linear-gradient(135deg,#ffedc5,#e9bf78);border-color:rgba(255,244,218,.38);box-shadow:0 8px 24px rgba(227,173,82,.12)}.button-primary:hover{background:#fff3d1}.button-quiet{min-height:auto;padding:8px 0;border:0;border-radius:0;background:transparent;color:rgba(235,242,244,.74);box-shadow:none}.button-quiet::after{content:"↗";margin-left:8px;color:var(--gold);font-size:11px}.button-quiet:hover{transform:none;color:#fff;background:transparent;border-color:transparent}.preview-note{display:flex;align-items:center;gap:8px;margin:16px 0 0;color:rgba(218,229,232,.58);font-size:12px;letter-spacing:.025em}.preview-note span{width:7px;height:7px;background:var(--gold);border-radius:50%;box-shadow:0 0 13px rgba(240,201,130,.76)}
.weather-glass{width:min(100%,430px);justify-self:end;align-self:center;padding:18px;border:1px solid rgba(227,239,241,.17);border-radius:20px;background:linear-gradient(180deg,rgba(8,20,29,.52),rgba(7,18,27,.74));box-shadow:0 28px 70px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.065);-webkit-backdrop-filter:blur(18px) saturate(116%);backdrop-filter:blur(18px) saturate(116%);transform:translate(12px,-10px)}.weather-glass__topline{display:flex;align-items:center;justify-content:space-between;color:rgba(241,247,249,.68);font-size:11px;font-weight:650}.weather-dot{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px rgba(154,217,180,.55)}.weather-glass__hero{display:flex;align-items:center;gap:15px;padding:26px 0 24px}.weather-icon{display:grid;width:62px;height:62px;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:50%;color:#ffd778;background:radial-gradient(circle,rgba(244,198,107,.13),transparent 68%);font-size:41px}.weather-glass__hero strong{display:block;font-size:50px;font-weight:460;letter-spacing:-.055em;line-height:.9}.weather-glass__hero span{display:block;margin-top:8px;color:var(--gold-soft);font-size:13px}.weather-glass__metrics{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.weather-glass__metrics div{padding:13px 9px}.weather-glass__metrics div+div{border-left:1px solid var(--line)}.weather-glass__metrics span,.metric span{display:block;color:var(--soft);font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.weather-glass__metrics strong{display:block;margin-top:3px;font-size:14px}.forecast-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding-top:14px}.forecast-strip div{display:grid;gap:5px;place-items:center;padding:8px 4px;border-radius:10px;background:rgba(255,255,255,.035)}.forecast-strip span{color:var(--soft);font-size:10px;font-weight:700;text-transform:uppercase}.forecast-strip b{font-size:18px}.forecast-strip strong{font-size:12px}.illustrative{display:block;margin-top:10px;color:rgba(198,213,217,.44);font-size:8.5px;line-height:1.4}.hero-scroll{display:none;position:absolute;bottom:28px;left:50%;width:34px;height:52px;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:999px;transform:translateX(-50%)}.hero-scroll span{width:4px;height:9px;border-radius:999px;background:var(--gold);animation:scrollcue 1.7s ease-in-out infinite}@keyframes scrollcue{0%,100%{transform:translateY(-5px);opacity:.35}50%{transform:translateY(6px);opacity:1}}

.section{position:relative;padding:clamp(58px,6.5vw,86px) 0;border-top:1px solid rgba(209,228,233,.07)}.section-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.6fr);gap:46px;align-items:end;margin-bottom:32px}.section-heading h2,.about h2,.spatial h2,.ecosystem h2{margin:0;font-size:clamp(34px,4.1vw,54px);font-weight:500;letter-spacing:-.052em;line-height:1}.section-heading>p{margin:0 0 5px;color:var(--muted);font-size:15px;line-height:1.65}.compact-heading{margin-bottom:28px}
.feature-intro{background:radial-gradient(circle at 88% 14%,rgba(45,126,157,.12),transparent 30%),linear-gradient(180deg,#07131d,#061019)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.feature-card{min-height:240px;padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(18,40,52,.54),rgba(7,20,29,.74));box-shadow:inset 0 1px 0 rgba(255,255,255,.035);transition:transform .22s ease,border-color .22s ease}.feature-card:hover{transform:translateY(-5px);border-color:rgba(240,201,130,.28)}.feature-icon{display:grid;width:52px;height:52px;place-items:center;margin-bottom:34px;border:1px solid var(--line);border-radius:12px;color:var(--gold);background:rgba(255,255,255,.035);font-size:24px}.card-kicker{margin:0 0 9px;color:var(--soft);font-size:10px;font-weight:740;letter-spacing:.15em;text-transform:uppercase}.feature-card h3,.conditions-panel h3,.principle h3{margin:0;font-size:20px;font-weight:620;letter-spacing:-.028em}.feature-card>p:last-child{margin:12px 0 0;color:var(--muted)}
.conditions-panel{margin-top:16px;padding:22px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(12,28,39,.68),rgba(8,20,30,.82));box-shadow:var(--shadow)}.conditions-head{display:flex;align-items:end;justify-content:space-between;gap:24px;padding:2px 2px 16px}.conditions-head>span{color:var(--soft);font-size:11px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.metric{min-height:104px;padding:15px;border:1px solid rgba(215,233,238,.09);border-radius:13px;background:rgba(255,255,255,.022)}.metric strong{display:block;margin-top:9px;font-size:23px;font-weight:500;letter-spacing:-.035em}.metric small{display:block;margin-top:5px;color:var(--soft);font-size:11px}

.atmospheres{background:radial-gradient(circle at 10% 50%,rgba(219,157,71,.1),transparent 32%),#050e16}.mode-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.mode-card{position:relative;min-height:300px;padding:0;overflow:hidden;text-align:left;border:1px solid var(--line);border-radius:16px;background:#0b1821;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.mode-card:hover,.mode-card.is-selected{transform:translateY(-4px);border-color:rgba(240,201,130,.38);box-shadow:0 22px 50px rgba(0,0,0,.24)}.mode-art{position:absolute;inset:0;background-size:cover}.mode-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 28%,rgba(3,9,14,.28) 50%,rgba(3,9,14,.95) 100%)}.mode-art--rain{background:linear-gradient(160deg,#334d55,#162c36 45%,#07141c)}.mode-art--golden{background:radial-gradient(circle at 64% 30%,#ffe5a3 0 5%,rgba(241,167,77,.65) 9%,transparent 28%),linear-gradient(160deg,#855438,#503928 48%,#10202a)}.mode-art--storm{background:radial-gradient(circle at 54% 40%,rgba(180,190,255,.34),transparent 9%),linear-gradient(160deg,#1b223a,#0b1325 46%,#050910)}.mode-art--snow{background:linear-gradient(160deg,#a9bdc2,#617985 43%,#1a2a34)}.mode-content{position:absolute;right:18px;bottom:18px;left:18px;z-index:2;display:grid;gap:5px}.mode-content small{color:var(--gold-soft);font-size:10px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}.mode-content strong{font-size:20px;line-height:1.2}.mode-content span{color:#c3cfd3;font-size:13px;line-height:1.5}.mode-card.is-selected::after{content:"Selected";position:absolute;top:16px;right:16px;z-index:3;padding:5px 9px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(4,13,20,.48);color:#fff;font-size:9px;font-weight:720;letter-spacing:.08em;text-transform:uppercase}

.spatial{background:linear-gradient(180deg,#07121a,#041018)}.spatial-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(420px,1.2fr);gap:clamp(38px,6vw,72px);align-items:center}.spatial-copy>p:not(.eyebrow),.about-content>p{color:var(--muted)}.about-lead{color:#e3ebed!important;font-size:18px;line-height:1.6}.principles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:24px}.principle{padding:16px;border-top:1px solid var(--line)}.principle>span{display:block;margin-bottom:18px;color:var(--gold);font-size:10px;font-weight:780;letter-spacing:.14em}.principle p{margin:8px 0 0;color:var(--soft);font-size:13px}.spatial-media{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#07131d;box-shadow:var(--shadow)}.spatial-media img{width:100%;aspect-ratio:3/2;object-fit:cover}.spatial-media figcaption{padding:14px 18px;color:var(--soft);font-size:11px}

.about{background:radial-gradient(circle at 18% 10%,rgba(111,200,234,.08),transparent 34%),#061019}.about-grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1fr);gap:clamp(44px,7vw,88px)}.about-content>p{margin-top:0}.ecosystem{padding-top:36px;padding-bottom:58px}.ecosystem-panel{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;padding:30px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg,rgba(16,35,47,.76),rgba(7,17,26,.86));box-shadow:var(--shadow)}.ecosystem-panel h2{font-size:clamp(30px,3.8vw,48px)}.ecosystem-panel p:not(.eyebrow){margin-bottom:0;color:var(--muted)}.ecosystem-links{display:grid;gap:10px;align-content:center}.ecosystem-links>a,.ecosystem-links>span{display:flex;padding:13px 15px;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.022)}.ecosystem-links strong{font-size:14px}.ecosystem-links span span,.ecosystem-links a span{color:var(--soft);font-size:11px}.ecosystem-links>a:hover{border-color:rgba(240,201,130,.3)}

.site-footer{padding:32px 0 22px;border-top:1px solid var(--line);background:#03090e}.footer-grid{display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:center}.footer-grid>p{max-width:520px;margin:0;color:var(--soft);font-size:13px}.footer-links{display:flex;gap:20px;color:var(--muted);font-size:12px}.footer-base{display:flex;margin-top:28px;padding-top:18px;justify-content:space-between;border-top:1px solid rgba(255,255,255,.06);color:#61727a;font-size:10px}.footer-brand{font-size:15px}.footer-brand .brand-emblem{width:28px;height:28px}

@media(max-width:1000px){.hero-content{grid-template-columns:1fr;align-content:center}.weather-glass{width:min(100%,520px);margin-top:0;justify-self:start;transform:none}.hero{min-height:auto}.feature-grid{grid-template-columns:1fr 1fr}.feature-card:last-child{grid-column:1/-1;min-height:240px}.feature-icon{margin-bottom:34px}.metric-grid{grid-template-columns:repeat(2,1fr)}.mode-grid{grid-template-columns:repeat(2,1fr)}.spatial-grid{grid-template-columns:1fr}.spatial-media{max-width:820px}.ecosystem-panel{grid-template-columns:1fr}}
@media(max-width:800px){:root{--header-height:60px}.section-heading{grid-template-columns:1fr;gap:22px}.about-grid{grid-template-columns:1fr;gap:36px}.footer-grid{grid-template-columns:1fr;align-items:start}.footer-links{flex-wrap:wrap}.hero h1{max-width:560px;font-size:clamp(38px,8.6vw,52px);line-height:1}.hero-content{padding-top:22px}.spatial-grid{gap:38px}}
@media(max-width:680px){.nav-toggle{display:block}.nav-menu{position:absolute;top:calc(100% + 8px);right:0;display:none;min-width:220px;padding:12px;flex-direction:column;align-items:stretch;gap:0;border:1px solid var(--line);border-radius:18px;background:rgba(5,16,24,.98);box-shadow:0 20px 60px rgba(0,0,0,.44)}.nav-menu.is-open{display:flex}.nav-menu a{padding:11px 12px;border-radius:11px}.nav-menu a:hover{background:rgba(255,255,255,.04)}.feature-grid{grid-template-columns:1fr}.feature-card:last-child{grid-column:auto}.metric-grid,.mode-grid,.principles{grid-template-columns:1fr}.weather-glass__metrics{grid-template-columns:1fr}.weather-glass__metrics div+div{border-top:1px solid var(--line);border-left:0}.forecast-strip{grid-template-columns:repeat(4,1fr)}.conditions-head{align-items:start;flex-direction:column}.ecosystem-panel{padding:26px}.ecosystem-links>a,.ecosystem-links>span{align-items:flex-start;flex-direction:column;gap:2px}.footer-base{flex-direction:column;gap:4px}.hero-scroll{display:none}.section{padding:58px 0}}
@media(max-width:420px){.hero-actions{align-items:flex-start;flex-direction:column;gap:8px}.button{width:auto}.weather-glass{padding:17px;border-radius:16px}.weather-glass__hero strong{font-size:50px}.weather-icon{width:64px;height:64px;font-size:42px}.forecast-strip b{font-size:18px}.metric-grid{grid-template-columns:1fr}.brand{font-size:16px}.section-heading h2,.about h2,.spatial h2,.ecosystem h2{font-size:36px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* === AMBIENT WEATHER PREMIUM COMPACT PASS v1 — 25/09/2026 === */
.weather-glass__meta{display:flex;justify-content:space-between;gap:12px;margin-top:11px;padding-top:10px;border-top:1px solid rgba(215,233,238,.08);color:rgba(193,207,211,.54);font-size:9px;letter-spacing:.025em}
.button-primary span{margin-left:8px;font-size:11px;transition:transform .18s ease}.button-primary:hover span{transform:translateX(2px)}
@media(min-width:1001px){
  .hero-copy-block{padding-top:4px}
  .weather-glass{margin-right:-6px}
  .feature-intro{padding-top:64px}
}
@media(max-width:1000px){
  .hero{min-height:auto}
  .hero-content{padding-bottom:58px}
}
@media(max-width:680px){
  .weather-glass__meta{align-items:flex-start;flex-direction:column;gap:3px}
}
/* === END PREMIUM COMPACT PASS === */

/* === AMBIENT WEATHER ATMOSPHERIC HERO IMAGE v1 — 25/09/2026 === */
/* Production hero background: generated Ambient Weather golden-hour landscape. */
.hero-sky{
  background-image:
    linear-gradient(90deg,rgba(3,12,19,.18) 0%,rgba(3,12,19,.04) 43%,rgba(3,12,19,0) 66%),
    url("../assets/Ambient_Weather_bg.png");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  transform:scale(1.006);
}

/* Keep scene-switching atmospheric rather than replacing the authored landscape. */
.hero.atmosphere-golden .hero-sky{
  background-image:
    linear-gradient(90deg,rgba(3,12,19,.14) 0%,rgba(3,12,19,.03) 46%,rgba(53,29,8,.04) 100%),
    url("../assets/Ambient_Weather_bg.png");
}
.hero.atmosphere-rain .hero-sky{
  background-image:
    linear-gradient(90deg,rgba(5,20,28,.34),rgba(17,46,57,.18) 56%,rgba(64,86,91,.20)),
    url("../assets/Ambient_Weather_bg.png");
  filter:saturate(.78) brightness(.82) hue-rotate(7deg);
}
.hero.atmosphere-storm .hero-sky{
  background-image:
    linear-gradient(90deg,rgba(2,7,15,.42),rgba(11,17,36,.32) 56%,rgba(30,34,54,.30)),
    url("../assets/Ambient_Weather_bg.png");
  filter:saturate(.66) brightness(.68) hue-rotate(15deg);
}
.hero.atmosphere-snow .hero-sky{
  background-image:
    linear-gradient(90deg,rgba(13,27,36,.26),rgba(77,103,116,.16) 58%,rgba(211,224,226,.13)),
    url("../assets/Ambient_Weather_bg.png");
  filter:saturate(.58) brightness(.93) hue-rotate(8deg);
}

/* Readability is concentrated behind the copy; the weather surface keeps the light. */
.hero-shade{
  background:
    linear-gradient(90deg,
      rgba(2,9,15,.88) 0%,
      rgba(3,12,19,.74) 24%,
      rgba(4,13,20,.46) 43%,
      rgba(4,12,18,.14) 62%,
      rgba(4,11,16,.08) 78%,
      rgba(3,9,13,.16) 100%),
    linear-gradient(180deg,rgba(2,8,13,.12) 0%,rgba(2,8,13,0) 54%,rgba(3,10,16,.34) 76%,rgba(3,10,16,.96) 100%);
}

/* Replace the old synthetic landscape layer with a controlled transition into content. */
.hero-landscape{
  top:auto;
  bottom:0;
  height:31%;
  opacity:1;
  background:linear-gradient(180deg,rgba(3,10,16,0) 0%,rgba(3,10,16,.14) 28%,rgba(3,10,16,.76) 76%,#06111b 100%);
}

/* Let the artwork breathe behind the local product navigation. */
.site-header{
  background:linear-gradient(90deg,rgba(3,12,19,.82),rgba(3,12,19,.62) 55%,rgba(13,15,18,.50));
  border-bottom-color:rgba(235,240,240,.10);
}
@supports ((-webkit-backdrop-filter:blur(18px)) or (backdrop-filter:blur(18px))){
  .site-header{
    background:linear-gradient(90deg,rgba(3,12,19,.58),rgba(3,12,19,.42) 55%,rgba(13,15,18,.34));
    -webkit-backdrop-filter:blur(15px) saturate(116%);
    backdrop-filter:blur(15px) saturate(116%);
  }
}

/* Product artefact sits inside the light rather than as a flat opaque dashboard. */
.weather-glass{
  border-color:rgba(244,238,224,.23);
  background:linear-gradient(180deg,rgba(10,18,22,.48),rgba(5,15,22,.68));
  box-shadow:0 28px 76px rgba(0,0,0,.24),0 0 52px rgba(237,185,105,.055),inset 0 1px 0 rgba(255,255,255,.075);
  -webkit-backdrop-filter:blur(20px) saturate(112%);
  backdrop-filter:blur(20px) saturate(112%);
}

/* Slightly warmer hero type/supporting details against the natural environment. */
.hero .eyebrow{color:rgba(240,244,241,.84)}
.hero h1{color:#f6f7f4;text-shadow:0 2px 18px rgba(0,0,0,.14)}
.hero h1 span{color:rgba(224,232,230,.88)}
.hero-copy{color:rgba(229,236,234,.76)}
.preview-note{color:rgba(223,229,226,.62)}

@media(max-width:1000px){
  .hero-sky,
  .hero.atmosphere-golden .hero-sky,
  .hero.atmosphere-rain .hero-sky,
  .hero.atmosphere-storm .hero-sky,
  .hero.atmosphere-snow .hero-sky{
    background-position:62% center;
  }
  .hero-shade{
    background:
      linear-gradient(90deg,rgba(2,9,15,.84) 0%,rgba(3,12,19,.65) 54%,rgba(3,10,15,.24) 100%),
      linear-gradient(180deg,rgba(3,10,16,.18),rgba(3,10,16,.10) 54%,rgba(3,10,16,.92) 100%);
  }
}

@media(max-width:680px){
  .hero-sky,
  .hero.atmosphere-golden .hero-sky,
  .hero.atmosphere-rain .hero-sky,
  .hero.atmosphere-storm .hero-sky,
  .hero.atmosphere-snow .hero-sky{
    background-position:70% center;
  }
  .hero-shade{
    background:
      linear-gradient(180deg,rgba(2,9,15,.72) 0%,rgba(3,12,19,.46) 36%,rgba(3,10,16,.40) 66%,rgba(3,10,16,.94) 100%),
      linear-gradient(90deg,rgba(2,9,15,.64),rgba(3,10,16,.20));
  }
  .site-header{background:rgba(3,12,19,.68)}
}
/* === END ATMOSPHERIC HERO IMAGE v1 === */

/* === AMBIENT WEATHER ATMOSPHERE CONTINUITY PASS v1 — 25/09/2026 === */
/* Hero → golden hour → dusk → twilight → night */

/* 1. Let the hero dissolve naturally into the page below. */
.hero-shade{
  background:
    linear-gradient(
      90deg,
      rgba(2,9,14,.90) 0%,
      rgba(3,13,20,.70) 42%,
      rgba(3,12,18,.26) 70%,
      rgba(3,10,15,.34) 100%
    ),
    linear-gradient(
      180deg,
      rgba(3,9,14,.10) 0%,
      transparent 44%,
      rgba(5,17,26,.20) 70%,
      rgba(7,23,34,.88) 94%,
      #071722 100%
    );
}

/* 2. First section retains a ghost of the authored landscape. */
.feature-intro{
  background:
    linear-gradient(
      180deg,
      rgba(7,23,34,.90) 0%,
      rgba(7,20,30,.84) 34%,
      rgba(6,16,25,.96) 100%
    ),
    radial-gradient(
      circle at 86% 12%,
      rgba(224,164,88,.15),
      transparent 34%
    ),
    url("../assets/Ambient_Weather_bg.png");

  background-size:auto,auto,cover;
  background-position:center,center,center 72%;
  background-repeat:no-repeat;
}

/* 3. Keep UI cards dark, but make them feel suspended in atmosphere. */
.feature-card,
.conditions-panel{
  background:
    linear-gradient(
      180deg,
      rgba(14,35,47,.66),
      rgba(7,20,29,.78)
    );
  -webkit-backdrop-filter:blur(12px) saturate(110%);
  backdrop-filter:blur(12px) saturate(110%);
}

/* 4. Atmospheres = warmer dusk. */
.atmospheres{
  background:
    radial-gradient(
      circle at 84% 16%,
      rgba(221,156,73,.13),
      transparent 34%
    ),
    radial-gradient(
      circle at 10% 56%,
      rgba(76,138,164,.07),
      transparent 38%
    ),
    linear-gradient(
      180deg,
      #061019 0%,
      #07131b 52%,
      #061019 100%
    );
}

/* 5. Spatial = cooler twilight. */
.spatial{
  background:
    radial-gradient(
      circle at 76% 30%,
      rgba(75,145,176,.10),
      transparent 38%
    ),
    linear-gradient(
      180deg,
      #061019 0%,
      #071722 46%,
      #051019 100%
    );
}

/* 6. About = atmosphere beginning to disappear into night. */
.about{
  background:
    radial-gradient(
      circle at 18% 12%,
      rgba(111,200,234,.08),
      transparent 34%
    ),
    radial-gradient(
      circle at 84% 30%,
      rgba(213,154,78,.055),
      transparent 32%
    ),
    linear-gradient(
      180deg,
      #051019 0%,
      #040d15 100%
    );
}

/* 7. Ecosystem retains only a trace of the warm light. */
.ecosystem{
  background:
    radial-gradient(
      circle at 78% 12%,
      rgba(221,157,76,.06),
      transparent 34%
    ),
    #040d15;
}

.ecosystem-panel{
  background:
    linear-gradient(
      135deg,
      rgba(16,35,47,.66),
      rgba(7,17,26,.80)
    );
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}

/* 8. Footer completes the progression into night. */
.site-footer{
  background:
    linear-gradient(
      180deg,
      #040d15 0%,
      #03090e 44%,
      #020609 100%
    );
}

/* === END AMBIENT WEATHER ATMOSPHERE CONTINUITY PASS v1 === */

/* === AMBIENT WEATHER ATMOSPHERE CONTINUITY PASS v2 === */

/* HERO → LANDSCAPE CONTINUATION */
.feature-intro{
  position:relative;
  padding-top:clamp(48px,5vw,72px) !important;
  background:
    linear-gradient(
      180deg,
      rgba(6,18,27,.46) 0%,
      rgba(6,18,27,.58) 28%,
      rgba(6,17,26,.78) 66%,
      #061019 100%
    ),
    url("../assets/Ambient_Weather_bg.png") !important;

  background-size:cover !important;
  background-position:center 68% !important;
  background-repeat:no-repeat !important;
}

/* Warm atmospheric light continues beyond the hero */
.feature-intro::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(
      ellipse at 76% 5%,
      rgba(242,181,91,.24) 0%,
      rgba(217,143,69,.09) 24%,
      transparent 52%
    );
}

/* CONTENT MUST SIT ABOVE ATMOSPHERE */
.feature-intro > *{
  position:relative;
  z-index:1;
}

/* CARDS FLOAT IN THE ENVIRONMENT */
.feature-card,
.conditions-panel{
  background:
    linear-gradient(
      180deg,
      rgba(9,26,37,.64),
      rgba(5,17,26,.78)
    ) !important;

  border-color:rgba(217,233,237,.12);
  -webkit-backdrop-filter:blur(16px) saturate(112%);
  backdrop-filter:blur(16px) saturate(112%);
}

/* GOLDEN HOUR BECOMES DUSK */
.atmospheres{
  position:relative;
  background:
    radial-gradient(
      ellipse at 78% 6%,
      rgba(227,158,72,.22) 0%,
      rgba(174,102,57,.08) 30%,
      transparent 54%
    ),
    radial-gradient(
      ellipse at 8% 70%,
      rgba(53,121,151,.12),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      #061019 0%,
      #0a1820 42%,
      #07131c 100%
    ) !important;
}

/* DUSK BECOMES COOLER TWILIGHT */
.spatial{
  position:relative;
  background:
    radial-gradient(
      ellipse at 76% 28%,
      rgba(67,148,184,.18),
      transparent 40%
    ),
    radial-gradient(
      ellipse at 24% 85%,
      rgba(200,139,69,.07),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      #07131c 0%,
      #071a26 48%,
      #05111a 100%
    ) !important;
}

/* TWILIGHT FADES TOWARD NIGHT */
.about{
  background:
    radial-gradient(
      ellipse at 18% 12%,
      rgba(85,177,214,.13),
      transparent 38%
    ),
    radial-gradient(
      ellipse at 82% 42%,
      rgba(204,139,66,.07),
      transparent 38%
    ),
    linear-gradient(
      180deg,
      #05111a,
      #040c13
    ) !important;
}

.ecosystem{
  background:
    radial-gradient(
      ellipse at 76% 0%,
      rgba(205,143,70,.08),
      transparent 38%
    ),
    #040c13 !important;
}

.site-footer{
  background:
    linear-gradient(
      180deg,
      #040c13 0%,
      #02080d 52%,
      #010507 100%
    ) !important;
}

/* === END AMBIENT WEATHER ATMOSPHERE CONTINUITY PASS v2 === */

/* === AMBIENT WEATHER ATMOSPHERE CONTINUITY PASS v3 === */
/* Extend the authored environment deeper into the page. */

/* Tighten the first atmospheric chapter. */
.feature-intro{
  padding-bottom:46px !important;
}

/* CONDITIONS remain inside the same scene rather than ending it. */
.conditions-panel{
  margin-bottom:0 !important;
}

/* ATMOSPHERES — same world, later in the evening. */
.atmospheres{
  padding-top:64px !important;

  background:
    linear-gradient(
      180deg,
      rgba(5,16,24,.58) 0%,
      rgba(7,19,27,.66) 32%,
      rgba(6,18,27,.80) 68%,
      #061019 100%
    ),
    radial-gradient(
      ellipse at 76% 10%,
      rgba(228,158,72,.18),
      transparent 44%
    ),
    url("../assets/Ambient_Weather_bg.png") !important;

  background-size:cover !important;
  background-position:center 48% !important;
  background-repeat:no-repeat !important;
}

/* Let atmosphere cards remain clean interface objects above the landscape. */
.mode-card{
  background-color:rgba(6,17,25,.72);
  -webkit-backdrop-filter:blur(9px) saturate(108%);
  backdrop-filter:blur(9px) saturate(108%);
}

/* SPATIAL — the same landscape pushed toward blue-hour twilight. */
.spatial{
  background:
    linear-gradient(
      180deg,
      rgba(5,17,26,.78) 0%,
      rgba(5,20,30,.84) 48%,
      rgba(4,15,23,.94) 100%
    ),
    radial-gradient(
      ellipse at 72% 24%,
      rgba(76,155,188,.14),
      transparent 44%
    ),
    url("../assets/Ambient_Weather_bg.png") !important;

  background-size:cover !important;
  background-position:center 74% !important;
  background-repeat:no-repeat !important;
}

/* AFTER SPATIAL the physical landscape can finally dissolve. */
.about{
  background:
    radial-gradient(
      ellipse at 24% 0%,
      rgba(65,141,174,.12),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      #05111a 0%,
      #040c13 100%
    ) !important;
}

/* === END AMBIENT WEATHER ATMOSPHERE CONTINUITY PASS v3 === */

/* === AMBIENT WEATHER CONTINUOUS ENVIRONMENT v4 === */
/* One shared atmospheric canvas. No section-by-section image repetition. */

/* The authored landscape now belongs to the whole document. */
body{
  background:
    linear-gradient(
      180deg,
      rgba(3,10,16,.18) 0%,
      rgba(4,14,21,.34) 30%,
      rgba(4,15,23,.54) 58%,
      rgba(3,11,17,.76) 82%,
      rgba(2,7,11,.92) 100%
    ),
    url("../assets/Ambient_Weather_bg.png") !important;

  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}

/* HERO keeps its own authored treatment. */
.hero{
  background:transparent;
}

/* USEFUL — warm atmosphere, but no new copy of the image. */
.feature-intro{
  background:
    radial-gradient(
      ellipse at 82% 8%,
      rgba(237,174,88,.14),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      rgba(5,18,27,.20),
      rgba(5,17,25,.30)
    ) !important;
}

/* ATMOSPHERES — same landscape, later light. */
.atmospheres{
  background:
    radial-gradient(
      ellipse at 78% 12%,
      rgba(219,148,67,.13),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      rgba(5,17,25,.34),
      rgba(5,18,27,.44)
    ) !important;
}

/* SPATIAL — blue-hour shift over the same continuous world. */
.spatial{
  background:
    radial-gradient(
      ellipse at 74% 26%,
      rgba(77,155,187,.13),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      rgba(4,17,26,.42),
      rgba(4,15,23,.54)
    ) !important;
}

/* ABOUT — landscape still present, now approaching night. */
.about{
  background:
    radial-gradient(
      ellipse at 20% 8%,
      rgba(76,157,192,.08),
      transparent 40%
    ),
    linear-gradient(
      180deg,
      rgba(4,14,22,.52),
      rgba(3,11,17,.64)
    ) !important;
}

/* ECOSYSTEM — almost night, but not a hard opaque slab. */
.ecosystem{
  background:
    linear-gradient(
      180deg,
      rgba(3,11,17,.60),
      rgba(3,9,14,.72)
    ) !important;
}

/* Footer is where the environment finally resolves into darkness. */
.site-footer{
  background:
    linear-gradient(
      180deg,
      rgba(3,9,14,.90),
      #010507 100%
    ) !important;
}

/* Keep interface surfaces separated from the environmental layer. */
.feature-card,
.conditions-panel,
.mode-card,
.spatial-media,
.ecosystem-panel{
  -webkit-backdrop-filter:blur(14px) saturate(108%);
  backdrop-filter:blur(14px) saturate(108%);
}

/* === END AMBIENT WEATHER CONTINUOUS ENVIRONMENT v4 === */

/* === BACKGROUND OVERLAY LIFT === */
body{
  background-image:url("../assets/Ambient_Weather_bg.png") !important;
}
/* === END BACKGROUND OVERLAY LIFT === */

/* === HERO BRIGHTNESS LIFT ONLY === */
.hero-shade{
  background:
    linear-gradient(
      90deg,
      rgba(2,9,14,.72) 0%,
      rgba(3,13,20,.48) 43%,
      rgba(3,12,18,.16) 70%,
      rgba(3,10,15,.20) 100%
    ),
    linear-gradient(
      180deg,
      rgba(3,9,14,.06) 0%,
      transparent 58%,
      rgba(3,10,16,.34) 100%
    ) !important;
}
/* === END HERO BRIGHTNESS LIFT ONLY === */

/* === AMBIENT WEATHER UNIFIED BACKGROUND TREATMENT === */
/* One image. One brightness. One contrast. One ambience. */

/* Hero no longer has its own competing background treatment. */
.hero-sky{
  background:none !important;
  filter:none !important;
}

.hero-landscape{
  background:none !important;
  opacity:0 !important;
}

.hero-shade{
  background:none !important;
}

/* Main sections no longer alter the underlying image. */
.feature-intro,
.atmospheres,
.spatial,
.about,
.ecosystem{
  background:transparent !important;
}

/* Remove the extra warm wash introduced in the earlier passes. */
.feature-intro::before{
  display:none !important;
}

/* Keep the single authored image as the page-wide environment. */
body{
  background-image:url("../assets/Ambient_Weather_bg.png") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  background-attachment:fixed !important;
}

/* === END AMBIENT WEATHER UNIFIED BACKGROUND TREATMENT === */

.feature-intro .section-heading > p{
  color:rgba(245,248,250,.94);
  font-weight:500;
  text-shadow:
    0 2px 5px rgba(0,0,0,.88),
    0 8px 24px rgba(0,0,0,.60);

  background:
    radial-gradient(
      ellipse at center,
      rgba(2,8,13,.58) 0%,
      rgba(2,8,13,.38) 46%,
      rgba(2,8,13,.14) 68%,
      transparent 82%
    );

  padding:24px 28px;
  margin:-24px -28px;
  border-radius:28px;
}


/* === AMBIENT WEATHER FLOATING TEXT LEGIBILITY v2 === */

.section-heading > p,
.spatial-copy > p:not(.eyebrow),
.about-content > p{
  color:rgba(245,248,250,.94);
  font-weight:500;
  text-shadow:
    0 2px 5px rgba(0,0,0,.88),
    0 8px 24px rgba(0,0,0,.60);

  background:
    radial-gradient(
      ellipse at center,
      rgba(2,8,13,.58) 0%,
      rgba(2,8,13,.38) 46%,
      rgba(2,8,13,.14) 68%,
      transparent 82%
    );

  padding:24px 28px;
  margin:-24px -28px;
  border-radius:28px;
}

/* Exposed headings need separation, but not a haze panel. */
.section-heading h2,
.spatial-copy h2,
.about-content h2{
  text-shadow:
    0 2px 4px rgba(0,0,0,.55),
    0 8px 28px rgba(0,0,0,.34);
}

/* === END AMBIENT WEATHER FLOATING TEXT LEGIBILITY v2 === */

/* === PRINCIPLE FLOATING TEXT LEGIBILITY === */

.principle p{
  color:rgba(245,248,250,.94);
  font-weight:500;
  text-shadow:
    0 2px 5px rgba(0,0,0,.88),
    0 8px 24px rgba(0,0,0,.60);

  background:
    radial-gradient(
      ellipse at center,
      rgba(2,8,13,.58) 0%,
      rgba(2,8,13,.38) 46%,
      rgba(2,8,13,.14) 68%,
      transparent 82%
    );

  padding:18px 22px;
  margin:8px -22px 0;
  border-radius:24px;
}

.principle h3{
  text-shadow:
    0 2px 4px rgba(0,0,0,.55),
    0 8px 28px rgba(0,0,0,.34);
}

/* === END PRINCIPLE FLOATING TEXT LEGIBILITY === */

/* === AMBIENT WEATHER EMBLEM + PRINCIPLE CLEANUP === */

.brand-emblem{
  width:38px !important;
  height:38px !important;
  border-radius:10px !important;

  background-image:url("../assets/ambient-weather-emblem-256.png") !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;

  box-shadow:
    0 0 18px rgba(67,126,255,.18) !important;
}

/* Remove old generated wave/sun artwork inside the emblem. */
.brand-emblem::before,
.brand-emblem::after,
.brand-emblem span{
  display:none !important;
}

/* Remove decorative 01 / 02 labels from the principles. */
.principle > span{
  display:none !important;
}

/* === END AMBIENT WEATHER EMBLEM + PRINCIPLE CLEANUP === */


/* === AMBIENT WEATHER MODE ART v1 — 26/09/2026 === */

.mode-art--rain{
  background-image:url("../assets/02-calm-rain.png") !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

.mode-art--golden{
  background-image:url("../assets/01-golden-hour.png") !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

.mode-art--storm{
  background-image:url("../assets/03-night-storm.png") !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

.mode-art--snow{
  background-image:url("../assets/04-snow-quiet.png") !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

/* === END AMBIENT WEATHER MODE ART v1 === */


/* === AMBIENT WEATHER FEATURE VIGNETTES v1 — 26/09/2026 === */

.feature-art{
  display:block;
  width:clamp(142px,46%,184px);
  max-width:100%;
  aspect-ratio:1;
  object-fit:contain;

  margin:-8px 0 18px -6px;

  filter:
    drop-shadow(0 10px 26px rgba(0,0,0,.28))
    drop-shadow(0 0 20px rgba(91,170,255,.10));
}

/* Let the illustrations breathe without turning them into giant hero art. */
.feature-card{
  overflow:hidden;
}

/* Slightly tighter on smaller screens. */
@media (max-width:700px){
  .feature-art{
    width:142px;
    margin-top:-4px;
    margin-bottom:16px;
  }
}

/* === END AMBIENT WEATHER FEATURE VIGNETTES v1 === */


/* === AMBIENT WEATHER HERO WEATHER GLASS COLOUR PASS v1 — 26/09/2026 === */

/* Give the hero weather panel a little more atmospheric depth. */
.weather-glass{
  position:relative;
  overflow:hidden;
}

.weather-glass::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(
      circle at 28% 28%,
      rgba(255,196,78,.12),
      transparent 28%
    ),
    radial-gradient(
      circle at 82% 10%,
      rgba(255,181,62,.07),
      transparent 34%
    );
}

/* Main current-condition sun. */
.weather-icon{
  color:#ffd56a !important;
  text-shadow:
    0 0 10px rgba(255,196,67,.58),
    0 0 28px rgba(255,169,38,.30);
}

/* Golden-hour condition label. */
[data-preview-condition]{
  color:#f5cf7a !important;
}

/* Metric labels get restrained semantic accents. */
.weather-glass__metrics > div:nth-child(1) > span{
  color:#e4c996 !important;
}

.weather-glass__metrics > div:nth-child(2) > span{
  color:#8fd9eb !important;
}

.weather-glass__metrics > div:nth-child(3) > span{
  color:#9fc8ed !important;
}

/* Tiny contextual marks without changing HTML. */
.weather-glass__metrics > div{
  position:relative;
}

.weather-glass__metrics > div:nth-child(1)::before{
  content:"◦";
  margin-right:6px;
  color:#e4c996;
  text-shadow:0 0 8px rgba(228,201,150,.25);
}

.weather-glass__metrics > div:nth-child(2)::before{
  content:"●";
  margin-right:6px;
  color:#76d4e9;
  font-size:.54em;
  vertical-align:middle;
  text-shadow:0 0 8px rgba(118,212,233,.35);
}

.weather-glass__metrics > div:nth-child(3)::before{
  content:"≈";
  margin-right:6px;
  color:#8ab9e8;
  text-shadow:0 0 8px rgba(138,185,232,.30);
}

/* Forecast cells get condition-specific tinting. */
.forecast-strip > div{
  position:relative;
  overflow:hidden;
  transition:
    background-color .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

/* Saturday — clear / warm. */
.forecast-strip > div:nth-child(1){
  background:
    linear-gradient(
      180deg,
      rgba(255,186,63,.11),
      rgba(255,186,63,.025)
    ) !important;
}

/* Sunday — clear / warm. */
.forecast-strip > div:nth-child(2){
  background:
    linear-gradient(
      180deg,
      rgba(255,193,73,.09),
      rgba(255,193,73,.022)
    ) !important;
}

/* Monday — cloud / cool silver-blue. */
.forecast-strip > div:nth-child(3){
  background:
    linear-gradient(
      180deg,
      rgba(133,164,188,.10),
      rgba(100,133,158,.025)
    ) !important;
}

/* Tuesday — rain / deeper blue. */
.forecast-strip > div:nth-child(4){
  background:
    linear-gradient(
      180deg,
      rgba(59,133,190,.12),
      rgba(40,91,136,.035)
    ) !important;
}

/* Forecast icon colours. */
.forecast-strip > div:nth-child(1) b,
.forecast-strip > div:nth-child(2) b{
  color:#ffd45f !important;
  text-shadow:
    0 0 8px rgba(255,199,67,.52),
    0 0 18px rgba(255,165,35,.24);
}

.forecast-strip > div:nth-child(3) b{
  color:#b8cad7 !important;
  text-shadow:0 0 10px rgba(160,193,216,.26);
}

.forecast-strip > div:nth-child(4) b{
  color:#78c7f4 !important;
  text-shadow:
    0 0 8px rgba(84,178,237,.40),
    0 0 18px rgba(48,124,187,.22);
}

/* Slight lift for forecast day labels. */
.forecast-strip > div:nth-child(1) > span,
.forecast-strip > div:nth-child(2) > span{
  color:#dbcda9 !important;
}

.forecast-strip > div:nth-child(3) > span{
  color:#aebfca !important;
}

.forecast-strip > div:nth-child(4) > span{
  color:#98bdd6 !important;
}

/* Gentle highlight along the forecast strip, preserving the glass feel. */
.forecast-strip::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(
      90deg,
      rgba(255,195,72,.035),
      transparent 44%,
      rgba(82,164,219,.035)
    );
}

/* === END AMBIENT WEATHER HERO WEATHER GLASS COLOUR PASS v1 === */


/* === AMBIENT WEATHER HERO ICON ALIGNMENT FIX v1 — 26/09/2026 === */

.weather-icon{
  display:grid !important;
  place-items:center !important;
  width:92px;
  height:92px;
  line-height:1 !important;
  padding:0 !important;
  text-align:center !important;
}

/* Optical correction: lift the sun slightly so it sits truly centred. */
.weather-icon{
  transform:translateY(-2px);
}

/* === END AMBIENT WEATHER HERO ICON ALIGNMENT FIX v1 === */


/* === HERO SUN GLYPH SIZE REFINEMENT === */

.weather-icon{
  font-size:35px !important;
}

/* === END HERO SUN GLYPH SIZE REFINEMENT === */


/* === HERO SUN GLYPH SIZE CORRECTION === */

.weather-icon{
  font-size:45px !important;
}

/* === END HERO SUN GLYPH SIZE CORRECTION === */


/* === HERO WEATHER GROUP CENTRING === */

.weather-glass__hero{
  justify-content:center !important;
}

/* === END HERO WEATHER GROUP CENTRING === */


/* === AMBIENT WEATHER BRAND EMBLEM PRESENCE === */

.brand-emblem{
  width:44px !important;
  height:44px !important;
  flex:0 0 44px !important;
}

/* === END AMBIENT WEATHER BRAND EMBLEM PRESENCE === */


/* === AMBIENT WEATHER CONDITIONS PANEL REFINEMENT v1 — 26/09/2026 === */

/* 4 + 3 balanced metric layout. */
.metric-grid{
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  gap:10px;
}

.metric-grid > .metric:nth-child(-n+4){
  grid-column:span 3;
}

.metric-grid > .metric:nth-child(n+5){
  grid-column:span 4;
}


/* Shared instrument-card treatment. */
.metric{
  --metric-accent:#9fb6c5;
  --metric-glow:rgba(159,182,197,.08);

  position:relative;
  overflow:hidden;

  min-height:112px;
  padding:17px 17px 15px;

  background:
    radial-gradient(
      circle at 92% 8%,
      var(--metric-glow),
      transparent 42%
    ),
    rgba(7,20,29,.38) !important;

  border-color:rgba(215,233,238,.11) !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    background-color .18s ease;
}

.metric:hover{
  transform:translateY(-2px);
  border-color:rgba(215,233,238,.18) !important;
}


/* Thin semantic light line across each instrument. */
.metric::after{
  content:"";
  position:absolute;
  top:0;
  right:14px;
  left:14px;
  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      var(--metric-accent),
      transparent
    );

  opacity:.45;
}


/* Small semantic cue, upper-right. */
.metric::before{
  position:absolute;
  top:14px;
  right:15px;

  display:grid;
  width:27px;
  height:27px;
  place-items:center;

  border:1px solid color-mix(in srgb,var(--metric-accent) 34%,transparent);
  border-radius:50%;

  color:var(--metric-accent);
  background:color-mix(in srgb,var(--metric-accent) 7%,transparent);

  font-size:13px;
  font-weight:700;
  line-height:1;

  box-shadow:0 0 18px var(--metric-glow);
}


/* Metric-specific colour language. */

/* Temperature */
.metric:nth-child(1){
  --metric-accent:#efc47e;
  --metric-glow:rgba(239,196,126,.11);
}
.metric:nth-child(1)::before{
  content:"°";
}

/* Humidity */
.metric:nth-child(2){
  --metric-accent:#77d0e5;
  --metric-glow:rgba(119,208,229,.11);
}
.metric:nth-child(2)::before{
  content:"●";
  font-size:8px;
}

/* Wind */
.metric:nth-child(3){
  --metric-accent:#8ebce9;
  --metric-glow:rgba(142,188,233,.10);
}
.metric:nth-child(3)::before{
  content:"≈";
  font-size:16px;
}

/* Pressure */
.metric:nth-child(4){
  --metric-accent:#b7addd;
  --metric-glow:rgba(183,173,221,.10);
}
.metric:nth-child(4)::before{
  content:"↗";
}

/* Rain */
.metric:nth-child(5){
  --metric-accent:#69bde8;
  --metric-glow:rgba(105,189,232,.11);
}
.metric:nth-child(5)::before{
  content:"↓";
}

/* UV */
.metric:nth-child(6){
  --metric-accent:#f1c95d;
  --metric-glow:rgba(241,201,93,.12);
}
.metric:nth-child(6)::before{
  content:"☼";
  font-size:15px;
}

/* Dew point */
.metric:nth-child(7){
  --metric-accent:#81d7ce;
  --metric-glow:rgba(129,215,206,.10);
}
.metric:nth-child(7)::before{
  content:"◇";
}


/* Labels inherit the semantic colour subtly. */
.metric > span{
  color:var(--metric-accent) !important;
}


/* Keep the numerical data dominant and neutral. */
.metric strong{
  color:#f4f7f8;
  font-size:24px;
}


/* Secondary state reads quieter. */
.metric small{
  color:rgba(185,205,211,.62);
}


/* Panel itself gets a little more depth without becoming opaque. */
.conditions-panel{
  background:
    radial-gradient(
      ellipse at 82% 4%,
      rgba(232,174,93,.07),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      rgba(10,27,38,.72),
      rgba(6,18,27,.84)
    ) !important;
}


/* Responsive rebalance. */
@media (max-width:900px){
  .metric-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .metric-grid > .metric{
    grid-column:auto !important;
  }

  .metric-grid > .metric:last-child{
    grid-column:1 / -1 !important;
  }
}

@media (max-width:560px){
  .metric-grid{
    grid-template-columns:1fr !important;
  }

  .metric-grid > .metric,
  .metric-grid > .metric:last-child{
    grid-column:auto !important;
  }
}

/* === END AMBIENT WEATHER CONDITIONS PANEL REFINEMENT v1 === */


/* === AMBIENT WEATHER FOOTER SEAM CLEANUP === */

.site-footer{
  border-top:0 !important;
}

/* === END AMBIENT WEATHER FOOTER SEAM CLEANUP === */


/* === MOBILE FEATURE VIGNETTE CENTRING — 26/09/2026 === */

@media (max-width:680px){
  .feature-art{
    margin-left:auto !important;
    margin-right:auto !important;
  }
}

/* === END MOBILE FEATURE VIGNETTE CENTRING === */


/* === FEATURE ART CENTRING — GLOBAL === */

.feature-art{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* === END FEATURE ART CENTRING — GLOBAL === */



/* === ADAPTIVE WEATHER GLASS STATE — 27/09/2026 === */

.weather-glass[data-scene="golden"] .weather-icon,
.weather-glass[data-scene="golden"] [data-preview-condition]{
  color:#f0c982 !important;
}

.weather-glass[data-scene="rain"] .weather-icon,
.weather-glass[data-scene="rain"] [data-preview-condition]{
  color:#78c9ee !important;
}

.weather-glass[data-scene="storm"] .weather-icon,
.weather-glass[data-scene="storm"] [data-preview-condition]{
  color:#aaa3ff !important;
}

.weather-glass[data-scene="snow"] .weather-icon,
.weather-glass[data-scene="snow"] [data-preview-condition]{
  color:#d9f1ff !important;
}

.weather-glass[data-scene="golden"] .weather-dot{
  background:#f0c982 !important;
}

.weather-glass[data-scene="rain"] .weather-dot{
  background:#78c9ee !important;
}

.weather-glass[data-scene="storm"] .weather-dot{
  background:#aaa3ff !important;
}

.weather-glass[data-scene="snow"] .weather-dot{
  background:#d9f1ff !important;
}

/* === END ADAPTIVE WEATHER GLASS STATE === */


/* === ADAPTIVE WEATHER ICON CHAMBERS — 27/09/2026 === */

.weather-icon{
  transition:
    background .28s ease,
    border-color .28s ease,
    box-shadow .28s ease,
    color .28s ease !important;
}

/* Golden Hour — blue sky chamber, warm sun */
.weather-glass[data-scene="golden"] .weather-icon{
  color:#f2c96f !important;
  background:
    radial-gradient(
      circle at 50% 42%,
      rgba(105,190,235,.34) 0%,
      rgba(58,116,168,.24) 48%,
      rgba(22,48,78,.16) 100%
    ) !important;
  border:1px solid rgba(130,205,240,.30) !important;
  box-shadow:
    0 0 28px rgba(94,181,230,.13),
    inset 0 0 20px rgba(255,255,255,.035) !important;
}

/* Calm Rain — cool grey/slate chamber */
.weather-glass[data-scene="rain"] .weather-icon{
  color:#8ed8ff !important;
  background:
    radial-gradient(
      circle at 50% 42%,
      rgba(125,142,158,.34) 0%,
      rgba(72,86,101,.28) 50%,
      rgba(38,47,58,.20) 100%
    ) !important;
  border:1px solid rgba(168,190,207,.26) !important;
  box-shadow:
    0 0 22px rgba(105,135,158,.11),
    inset 0 0 20px rgba(255,255,255,.025) !important;
}

/* Night Storm — deep night chamber, amber lightning */
.weather-glass[data-scene="storm"] .weather-icon{
  color:#ffc247 !important;
  background:
    radial-gradient(
      circle at 50% 42%,
      rgba(42,48,91,.44) 0%,
      rgba(20,25,50,.42) 52%,
      rgba(8,11,20,.34) 100%
    ) !important;
  border:1px solid rgba(134,143,224,.24) !important;
  box-shadow:
    0 0 30px rgba(255,184,55,.13),
    inset 0 0 24px rgba(116,126,215,.06) !important;
}

/* Snow Quiet — frosted chamber with darker edge */
.weather-glass[data-scene="snow"] .weather-icon{
  color:#dff4ff !important;
  background:
    radial-gradient(
      circle at 50% 42%,
      rgba(246,250,252,.34) 0%,
      rgba(224,234,242,.27) 50%,
      rgba(185,201,214,.17) 100%
    ) !important;
  border:1px solid rgba(84,99,112,.46) !important;
  box-shadow:
    0 0 22px rgba(211,231,243,.10),
    inset 0 0 18px rgba(255,255,255,.07) !important;
}

/* === END ADAPTIVE WEATHER ICON CHAMBERS === */





/* === AMBIENT WEATHER READABILITY LOCK v2 — 20260929 === */

/* Ecosystem card secondary labels */
.ecosystem-links > a > span,
.ecosystem-links > span > span {
  color: rgba(238, 244, 246, .82);
  font-weight: 520;
}

.ecosystem-links > a:hover > span {
  color: rgba(255, 255, 255, .95);
}

/* Footer descriptive copy */
.footer-grid > p {
  color: rgba(220, 232, 236, .76);
}

/* Footer navigation */
.footer-links,
.footer-links a {
  color: rgba(226, 235, 238, .80);
}

.footer-links a:hover {
  color: #fff;
}

/* Copyright / product line */
.footer-base {
  color: rgba(198, 212, 218, .76);
  font-size: 11px;
}

/* === END AMBIENT WEATHER READABILITY LOCK v2 === */


/* === AMBIENT WEATHER TEMP SUN CLOCK v1 === */

/* Reduce the circular weather-icon surface. */
.weather-icon{
  width:76px !important;
  height:76px !important;
}

/* Reduce main temperature reading. */
.weather-glass__hero strong{
  font-size:44px !important;
}

/* Location and 24-hour clock. */
.weather-glass__location{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}

.weather-glass__location-line{
  display:flex;
  align-items:center;
}

.weather-glass__clock{
  display:block;
  margin-left:14px;
  color:rgba(221,232,235,.66);
  font-size:10px;
  font-weight:620;
  line-height:1;
  letter-spacing:.10em;
  font-variant-numeric:tabular-nums;
}

/* Keep the existing compact mobile sun treatment. */
@media (max-width:420px){
  .weather-icon{
    width:64px !important;
    height:64px !important;
  }

  .weather-glass__hero strong{
    font-size:44px !important;
  }
}

/* === END AMBIENT WEATHER TEMP SUN CLOCK v1 === */


/* === AMBIENT WEATHER CURRENT WEATHER COMPOSITION LOCK v2 === */

/*
   Compact centred current-weather composition.
   No positional transforms. No horizontal sprawl.
*/

.weather-glass .weather-glass__hero{
  display:grid !important;
  grid-template-columns:60px auto !important;
  align-items:center !important;
  justify-content:start !important;
  column-gap:22px !important;

  width:fit-content !important;
  max-width:100% !important;
  margin:0 auto !important;

  padding:20px 0 22px !important;
  transform:none !important;
}

/* Clearly smaller circular sun treatment. */
.weather-glass .weather-icon{
  width:60px !important;
  height:60px !important;
  min-width:60px !important;
  min-height:60px !important;
  flex:0 0 60px !important;

  font-size:30px !important;
  line-height:1 !important;

  align-self:center !important;
}

/*
   Temperature with date + condition stacked beneath it.
*/
.weather-glass .weather-glass__reading{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  gap:0 !important;

  width:auto !important;
  min-width:0 !important;
}

/* Clearly smaller temperature. */
.weather-glass .weather-glass__hero
.weather-glass__tempdate > strong[data-preview-temp]{
  display:block !important;

  margin:0 !important;
  padding:0 !important;

  font-size:30px !important;
  font-weight:460 !important;
  line-height:.95 !important;

  grid-column:auto !important;
  grid-row:auto !important;
  align-self:auto !important;
}

/* Date beneath temperature. */
.weather-glass .weather-glass__date{
  display:block !important;

  margin:8px 0 0 !important;

  font-size:11px !important;
  line-height:1.25 !important;

  grid-column:auto !important;
  grid-row:auto !important;
  align-self:auto !important;

  white-space:nowrap;
}

/* Condition beneath date. */
.weather-glass .weather-glass__reading > [data-preview-condition]{
  display:block !important;

  margin:4px 0 0 !important;

  font-size:13px !important;
  line-height:1.2 !important;

  grid-column:auto !important;
  grid-row:auto !important;
  align-self:auto !important;

  white-space:nowrap;
}

/* Mobile remains compact rather than inheriting old oversized rules. */
@media (max-width:460px){

  .weather-glass .weather-glass__hero{
    grid-template-columns:54px auto !important;
    column-gap:16px !important;
  }

  .weather-glass .weather-icon{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
    flex-basis:54px !important;
    font-size:27px !important;
  }

  .weather-glass .weather-glass__hero
  .weather-glass__tempdate > strong[data-preview-temp]{
    font-size:30px !important;
  }
}

/* === END AMBIENT WEATHER CURRENT WEATHER COMPOSITION LOCK v2 === */


/* === AMBIENT WEATHER TOP SECTION HEIGHT REFINEMENT v1 === */

/* Reduce vertical depth only. Preserve all current content/layout. */
.weather-glass .weather-glass__hero{
  padding:8px 0 10px !important;
}

/* === END AMBIENT WEATHER TOP SECTION HEIGHT REFINEMENT v1 === */

/* === LOCATION + CLOCK SIZE LIFT v1 === */
.weather-glass__location-line{
  font-size:13px;
}

.weather-glass__clock{
  font-size:12px;
}
/* === END LOCATION + CLOCK SIZE LIFT v1 === */

/* CONSOLIDATED SOURCE: css/weather-panel-v1.css */

/* Ambient Weather — isolated presentation panel v1 */

@media (min-width:1001px){
  .hero-content{
    width:min(calc(100% - (var(--gutter) * 2)),1460px);
    grid-template-columns:minmax(500px,1fr) minmax(560px,620px);
    gap:clamp(34px,4vw,58px);
  }

  .weather-glass{
    width:min(100%,620px);
    min-height:520px;
    margin-right:0;
    padding:22px 24px 20px;
  }
}

.weather-glass{
  border-color:rgba(242,239,230,.30);
  background:linear-gradient(180deg,rgba(52,21,82,.82),rgba(24,10,43,.86));
  box-shadow:0 30px 78px rgba(0,0,0,.30),
             inset 0 1px 0 rgba(255,255,255,.09);
  -webkit-backdrop-filter:blur(11px) saturate(106%);
  backdrop-filter:blur(11px) saturate(106%);
}

.weather-glass__hero{
  gap:20px;
  padding:30px 0 28px;
}

.weather-glass__date{
  margin-top:9px !important;
  color:rgba(241,245,245,.78) !important;
  font-size:11px !important;
  font-weight:620;
}

.weather-glass__reading > [data-preview-condition]{
  margin-top:4px !important;
}

.forecast-strip{
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:7px;
  padding-top:17px;
}

.forecast-strip div{
  min-width:0;
  gap:6px;
  padding:10px 3px 9px;
  border:1px solid rgba(231,239,241,.055);
  border-radius:11px;
  background:rgba(255,255,255,.028);
}

.forecast-strip span{
  font-size:9px;
  letter-spacing:.055em;
}

.forecast-strip b{font-size:17px}
.forecast-strip strong{font-size:11.5px}

@media (max-width:1000px){
  .weather-glass{
    width:min(100%,680px);
  }

  .forecast-strip{
    grid-template-columns:repeat(7,minmax(54px,1fr));
  }
}

@media (max-width:680px){
  .forecast-strip{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media (max-width:460px){
  .forecast-strip{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .forecast-strip > div:last-child{
    grid-column:1 / -1;
  }
}

/* === RELEASE HERO REFINEMENT v1 === */

.release-hero-copy{
  max-width:740px;
  transform:translateY(-25px);
}

.release-hero-copy .eyebrow{
  margin-bottom:24px;
}

.release-hero-copy h1{
  max-width:740px;
  margin:0;
  font-size:clamp(48px,4.4vw,68px);
  line-height:.98;
  letter-spacing:-.045em;
}

.release-hero-copy h1 span{
  font-size:.76em;
  font-weight:400;
  letter-spacing:-.035em;
  opacity:.78;
}

.release-hero-lede{
  max-width:590px;
  margin:30px 0 0;
  font-size:clamp(17px,1.35vw,21px);
  line-height:1.55;
  color:rgba(230,237,239,.72);
}

.release-hero-actions{
  margin-top:30px;
  gap:18px;
}

.release-hero-actions .button-primary{
  min-height:52px;
  padding:0 24px;
  border-radius:16px;
  font-size:15px;
}

.release-hero-actions .button-quiet{
  min-height:52px;
  padding:0 8px;
  font-size:15px;
}

/* === END RELEASE HERO REFINEMENT v1 === */

/* === RELEASE HERO SCALE v2 === */

.release-hero-copy h1{
  font-size:clamp(40px,3.4vw,54px) !important;
  line-height:1.02;
  letter-spacing:-.04em;
}

.release-hero-copy h1 span{
  font-size:.72em;
  line-height:1.08;
}

/* === END RELEASE HERO SCALE v2 === */

/* === RELEASE HERO SCALE v3 === */

.release-hero-copy h1{
  font-size:clamp(34px,2.8vw,46px) !important;
  line-height:1.04;
  letter-spacing:-.035em;
}

.release-hero-copy h1 span{
  font-size:.70em;
  line-height:1.08;
}

.release-hero-lede{
  font-size:clamp(16px,1.1vw,18px);
  max-width:560px;
}

/* === END RELEASE HERO SCALE v3 === */

/* === RELEASE HERO LEDE WIDTH FIX === */

.release-hero-lede{
  width:100%;
  max-width:520px !important;
  margin-top:28px;
  font-size:17px;
  line-height:1.55;
}

/* === END RELEASE HERO LEDE WIDTH FIX === */

/* === WEATHER PANEL HEIGHT TRIM === */

@media (min-width:1001px){
  .weather-glass{
    min-height:492px;
    padding-bottom:0;
  }
}

/* === END WEATHER PANEL HEIGHT TRIM === */

/* === WEATHER PANEL HEIGHT TRIM v2 === */

@media (min-width:1001px){
  .weather-glass{
    min-height:464px;
  }
}

/* === END WEATHER PANEL HEIGHT TRIM v2 === */

/* === WEATHER PANEL LEFT EXTENSION === */

@media (min-width:1001px){
  .weather-glass{
    width:740px;
    max-width:none;
    margin-left:-60px;
  }
}

/* === END WEATHER PANEL LEFT EXTENSION === */

/* === WEATHER TEMP + DATE ROW === */

.weather-glass__tempdate{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
}

.weather-glass__tempdate .weather-glass__date{
  margin:0;
  white-space:nowrap;
}

/* === END WEATHER TEMP + DATE ROW === */

/* === HOURLY FORECAST v1 === */

.hourly-forecast{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:10px;
  padding:18px 0;
  border-bottom:1px solid rgba(220,232,235,.12);
}

.hourly-forecast > div{
  display:grid;
  justify-items:center;
  gap:7px;
  padding:10px 6px;
  border-radius:14px;
  background:rgba(255,255,255,.025);
}

.hourly-forecast span{
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
  color:rgba(210,223,228,.58);
}

.hourly-forecast b{
  font-size:19px;
  line-height:1;
  font-weight:400;
}

.hourly-forecast strong{
  font-size:15px;
  color:rgba(248,250,250,.92);
}

@media(max-width:700px){
  .hourly-forecast{
    grid-template-columns:repeat(3,1fr);
  }
}

/* === END HOURLY FORECAST v1 === */

/* === HOURLY SUN COLOUR === */

.hourly-forecast .hourly-sun{
  color:#f5c85a;
  font-family:Arial, Helvetica, sans-serif;
  font-size:22px;
  text-shadow:0 0 12px rgba(245,200,90,.22);
}

/* === END HOURLY SUN COLOUR === */

/* === DAILY PARTLY CLOUDY ICONS === */

.forecast-strip .partly-cloudy{
  font-family:Arial, Helvetica, sans-serif;
  font-size:21px;
  line-height:1;
}

/* === END DAILY PARTLY CLOUDY ICONS === */

/* === DAILY PARTLY CLOUDY ICONS v2 === */

.forecast-strip .partly-cloudy{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 21px;
  line-height: 1;
}

/* === END DAILY PARTLY CLOUDY ICONS v2 === */

/* === DAILY PARTLY CLOUDY ICONS v3 === */

.forecast-strip .partly-cloudy{
  position:relative;
  display:block;
  width:34px;
  height:26px;
  font-family:Arial, Helvetica, sans-serif;
}

.forecast-strip .partly-cloudy i{
  position:absolute;
  font-style:normal;
  line-height:1;
}

.forecast-strip .pc-sun{
  left:1px;
  top:0;
  color:#f5c85a;
  font-size:21px;
  text-shadow:0 0 10px rgba(245,200,90,.18);
}

.forecast-strip .pc-cloud{
  right:0;
  bottom:0;
  color:#d9e4e8;
  font-size:22px;
  text-shadow:none;
}

/* === END DAILY PARTLY CLOUDY ICONS v3 === */

/* === DAILY PARTLY CLOUDY ICONS v4 — size parity fix === */

.forecast-strip .partly-cloudy{
  position:relative;
  display:block;
  width:24px;
  height:18px;
  margin:0 auto;
  font-family:Arial, Helvetica, sans-serif;
}

.forecast-strip .partly-cloudy i{
  position:absolute;
  font-style:normal;
  line-height:1;
}

.forecast-strip .pc-sun{
  left:0;
  top:0;
  color:#f5c85a;
  font-size:15px;
  text-shadow:0 0 8px rgba(245,200,90,.16);
}

.forecast-strip .pc-cloud{
  right:0;
  bottom:0;
  color:#d9e4e8;
  font-size:16px;
}

/* === END DAILY PARTLY CLOUDY ICONS v4 === */

/* === WEATHER PANEL VERTICAL COMPRESSION v1 === */

/* Main temperature / condition section — remove ~40px vertical space */
.weather-glass__hero{
  padding-top:10px !important;
  padding-bottom:8px !important;
}

/* Metrics row — modest 8px squeeze */
.weather-glass__metrics > div{
  padding-top:14px !important;
  padding-bottom:14px !important;
}

/* === END WEATHER PANEL VERTICAL COMPRESSION v1 === */

/* === WEATHER PANEL VERTICAL COMPRESSION v2 === */

.weather-glass__hero{
  padding-top:0 !important;
  padding-bottom:0 !important;
}

@media (min-width:1001px){
  .weather-glass{
    transform:translateY(-18px);
  }
}

/* === END WEATHER PANEL VERTICAL COMPRESSION v2 === */

/* === WEATHER PANEL WIDTH RESTORE / LOCK === */

@media (min-width:1001px){
  .weather-glass{
    width:740px !important;
    max-width:none !important;
    margin-left:-60px !important;
  }
}

/* === END WEATHER PANEL WIDTH RESTORE / LOCK === */

/* === WEATHER PANEL HORIZONTAL SPACE RESTORE === */

@media (min-width:1001px){
  .hero-content{
    grid-template-columns:minmax(500px,1fr) 680px !important;
  }

  .weather-glass{
    width:740px !important;
    max-width:none !important;
  }
}

/* === END WEATHER PANEL HORIZONTAL SPACE RESTORE === */

/* === WEATHER PANEL LEFT SHIFT === */

@media (min-width:1001px){
  .weather-glass{
    transform:translate(-60px,-48px) !important;
  }
}

/* === END WEATHER PANEL LEFT SHIFT === */

/* === FORECAST ROW COMPRESSION v1 === */

/* Hourly row */
.hourly-forecast{
  padding:10px 0 !important;
}

.hourly-forecast > div{
  padding:6px 6px !important;
  gap:5px !important;
}

/* Daily row */
.forecast-strip{
  padding-top:8px !important;
}

.forecast-strip > div{
  padding:5px 4px !important;
  gap:4px !important;
}

/* Tighten the space between hourly and daily rows */
.hourly-forecast + .forecast-strip{
  margin-top:0 !important;
}

/* === END FORECAST ROW COMPRESSION v1 === */

/* === PANEL ROW COMPRESSION v3 === */
/* LOCKED: hourly + daily forecast rows remain untouched */

/* Row 1 — current conditions */
.weather-glass__hero{
  margin-top:-8px !important;
  margin-bottom:-8px !important;
}

/* Row 2 — feels like / humidity / wind */
.weather-glass__metrics > div{
  padding-top:6px !important;
  padding-bottom:6px !important;
}

/* === END PANEL ROW COMPRESSION v3 === */

/* Desktop hero copy: raise the existing text block only. */
@media (min-width:1001px){
  .release-hero-copy{
    transform:translateY(-120px);
  }
}

/* === WEATHER PANEL CURRENT CONDITIONS CENTRE LOCK === */
/* Centre only the sun + temperature/date/condition composition.
   Topline and all forecast/metric rows remain unchanged. */
.weather-glass__hero{
  justify-content:center !important;
  width:100%;
  transform:translateY(-20px);
}

.weather-glass__reading{
  flex:0 0 auto;
}
/* === END WEATHER PANEL CURRENT CONDITIONS CENTRE LOCK === */

/* === WEATHER PANEL TOP GROUP VERTICAL POSITION v2 === */
/*
   Move the complete locked top-row composition as one unit only.
   Internal geometry remains untouched.
*/
.weather-glass__top-group{
  position:relative;
  width:100%;
  transform:translateY(-12px);
}
/* === END WEATHER PANEL TOP GROUP VERTICAL POSITION v2 === */

/* === CURRENT READING STACK UP 10PX v1 === */
/* Move only temperature + date + condition upward. */
.weather-glass__reading{
  transform:translateY(-10px);
}
/* === END CURRENT READING STACK UP 10PX v1 === */

/* === CURRENT SUN UP 10PX v1 === */
/* Move only the sun icon and circular surround upward. */
.weather-glass__hero .weather-icon{
  transform:translateY(-10px);
}
/* === END CURRENT SUN UP 10PX v1 === */

/* === WEATHER METRICS FOUR-COLUMN v1 === */
@media (min-width:681px){
  .weather-glass__metrics{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

/* Precipitation semantic accent, matching the existing metric treatment. */
.weather-glass__metrics > div:nth-child(4) > span{
  color:#8fcde3;
}

.weather-glass__metrics > div:nth-child(4)::before{
  content:"◌";
  margin-right:6px;
  color:#8fcde3;
  text-shadow:0 0 8px rgba(143,205,227,.28);
}
/* === END WEATHER METRICS FOUR-COLUMN v1 === */

/* === AMBIENT WEATHER PASS 1 — LEFTWARD WIDTH v3 === */
/*
  Goal:
  - keep the hero grid footprint unchanged
  - keep the panel's right-side placement stable
  - widen the panel by extending further left
  - preserve accepted vertical position
  - tighten the metrics row
*/
@media (min-width:1001px){
  .weather-glass{
    width:750px !important;
    max-width:none !important;
    margin-left:-130px !important;
  }
}

.weather-glass__metrics > div{
  padding-top:4px !important;
  padding-bottom:4px !important;
}

/* === END AMBIENT WEATHER PASS 1 — LEFTWARD WIDTH v3 === */

/* === AMBIENT WEATHER PASS 1 — PANEL 840 + COPY WRAP v4 === */
/*
  Preserve the current right edge by adding the extra width to the left.
  Previous state: 750px wide, margin-left -130px.
  New state:      840px wide, margin-left -220px.
*/
@media (min-width:1001px){
  .weather-glass{
    width:840px !important;
    max-width:none !important;
    margin-left:-220px !important;
  }
}

/* === END AMBIENT WEATHER PASS 1 — PANEL 840 + COPY WRAP v4 === */

/* === AMBIENT WEATHER HERO TYPOGRAPHY REDUCTION v2 === */
/* Typography only. Panel/header/navigation geometry untouched. */

.eyebrow{
  font-size:12px !important;
  letter-spacing:.22em !important;
  margin-bottom:18px !important;
}

#hero-title{
  font-size:clamp(25px,1.95vw,33px) !important;
  line-height:1.04 !important;
  letter-spacing:-.03em !important;
}

#hero-title span{
  font-size:.65em !important;
  line-height:1.08 !important;
}

.release-hero-lede{
  font-size:15px !important;
  line-height:1.5 !important;
  margin-top:24px !important;
  max-width:470px !important;
}

/* === END AMBIENT WEATHER HERO TYPOGRAPHY REDUCTION v2 === */

/* === AMBIENT WEATHER HERO EYEBROW + LIFT v1 === */
/*
  Scope:
  - make WEATHER, MADE AMBIENT behave as a true eyebrow
  - lift the complete left hero text stack to align approximately
    with the top of the purple weather panel
  - preserve weather panel geometry and all forecast rows
*/
.eyebrow{
  font-size:10px !important;
  letter-spacing:.18em !important;
  opacity:.72 !important;
  margin-bottom:16px !important;
}

@media (min-width:1001px){
  .release-hero-copy{
    transform:translateY(-250px) !important;
  }
}

/* === END AMBIENT WEATHER HERO EYEBROW + LIFT v1 === */

/* === AMBIENT WEATHER HERO LIFT ADJUST v2 === */
@media (min-width:1001px){
  .release-hero-copy{
    transform:translateY(-210px) !important;
  }
}
/* === END AMBIENT WEATHER HERO LIFT ADJUST v2 === */

/* === AMBIENT WEATHER HERO LIFT ADJUST v3 === */
@media (min-width:1001px){
  .release-hero-copy{
    transform:translateY(-180px) !important;
  }
}
/* === END AMBIENT WEATHER HERO LIFT ADJUST v3 === */

/* === AMBIENT WEATHER PANEL WIDTH 900 v1 === */
/*
  Controlled width test:
  - previous locked width: 840px with margin-left -220px
  - new test width: 900px with margin-left -280px
  - right edge remains visually fixed by taking the extra width leftward
  - hero text stack remains locked at translateY(-180px)
*/
@media (min-width:1001px){
  .weather-glass{
    width:900px !important;
    max-width:none !important;
    margin-left:-280px !important;
  }
}
/* === END AMBIENT WEATHER PANEL WIDTH 900 v1 === */

/* === AMBIENT WEATHER PASS 2 — HOURLY RAIL v1 === */

.hourly-forecast-shell{
  position:relative;
  border-bottom:1px solid rgba(220,232,235,.12);
}

.hourly-forecast{
  display:grid !important;
  grid-template-columns:repeat(10,minmax(0,1fr)) !important;
  gap:2px !important;
  padding:10px 20px 10px !important;
  border-bottom:0 !important;
}

.hourly-forecast .hourly-cell{
  display:grid;
  grid-template-rows:auto 24px auto auto;
  justify-items:center;
  align-items:center;
  min-width:0;
  gap:3px !important;
  padding:5px 2px 6px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}

.hourly-forecast .hourly-cell + .hourly-cell{
  border-left:1px solid rgba(220,232,235,.055) !important;
}

.hourly-forecast .hourly-time{
  font-size:9.5px !important;
  font-weight:750 !important;
  letter-spacing:.09em !important;
  color:rgba(230,238,241,.73) !important;
}

.hourly-forecast .hourly-cell b{
  display:grid;
  place-items:center;
  height:24px;
  font-size:18px !important;
  line-height:1 !important;
}

.hourly-forecast .hourly-cell strong{
  font-size:14px !important;
  line-height:1 !important;
}

.hourly-forecast .hourly-cell small{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  font-size:8.5px;
  line-height:1.15;
  white-space:nowrap;
  color:rgba(211,224,229,.62);
}

.hourly-forecast .hourly-cell small i,
.hourly-forecast .hourly-cell small em{
  font-style:normal;
}

.hourly-forecast .hourly-cell small i{
  color:rgba(111,212,235,.82);
}

.hourly-nav{
  position:absolute;
  z-index:3;
  top:50%;
  width:24px;
  height:38px;
  padding:0;
  border:1px solid rgba(231,239,241,.13);
  border-radius:12px;
  background:rgba(8,13,21,.52);
  color:rgba(239,245,247,.82);
  font-size:22px;
  line-height:1;
  cursor:pointer;
  transform:translateY(-50%);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}

.hourly-nav:hover,
.hourly-nav:focus-visible{
  background:rgba(18,26,38,.76);
  color:#fff;
  outline:none;
}

.hourly-nav--prev{left:-4px;}
.hourly-nav--next{right:-4px;}

.hourly-nav[hidden],
.hourly-cell[hidden]{
  display:none !important;
}

@media (max-width:1000px){
  .hourly-forecast{
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  }
}

/* === END AMBIENT WEATHER PASS 2 — HOURLY RAIL v1 === */

/* === AMBIENT WEATHER PASS 2 — SECONDARY READOUTS v1 === */
/*
  Increase legibility of precipitation + wind beneath hourly temperature
  without materially increasing rail height.
*/
.hourly-forecast .hourly-cell small{
  gap:2px !important;
  font-size:9.5px !important;
  line-height:1.18 !important;
}

.hourly-forecast .hourly-cell small i{
  font-size:10px !important;
  font-weight:700 !important;
  color:rgba(121,220,241,.92) !important;
}

.hourly-forecast .hourly-cell small em{
  font-size:9.5px !important;
  font-weight:600 !important;
  color:rgba(218,228,232,.72) !important;
}

/* === END AMBIENT WEATHER PASS 2 — SECONDARY READOUTS v1 === */

/* === AMBIENT WEATHER PASS 2 — HOURLY SLIDE v1 === */

.hourly-forecast-shell{
  overflow:hidden;
}

.hourly-forecast{
  will-change:transform, opacity;
}

.hourly-forecast.is-hourly-exit-left{
  animation:aw-hourly-exit-left .16s ease forwards;
}

.hourly-forecast.is-hourly-exit-right{
  animation:aw-hourly-exit-right .16s ease forwards;
}

.hourly-forecast.is-hourly-enter-right{
  animation:aw-hourly-enter-right .22s cubic-bezier(.22,.61,.36,1) forwards;
}

.hourly-forecast.is-hourly-enter-left{
  animation:aw-hourly-enter-left .22s cubic-bezier(.22,.61,.36,1) forwards;
}

@keyframes aw-hourly-exit-left{
  from{transform:translateX(0);opacity:1}
  to{transform:translateX(-24px);opacity:0}
}

@keyframes aw-hourly-exit-right{
  from{transform:translateX(0);opacity:1}
  to{transform:translateX(24px);opacity:0}
}

@keyframes aw-hourly-enter-right{
  from{transform:translateX(24px);opacity:0}
  to{transform:translateX(0);opacity:1}
}

@keyframes aw-hourly-enter-left{
  from{transform:translateX(-24px);opacity:0}
  to{transform:translateX(0);opacity:1}
}

@media (prefers-reduced-motion: reduce){
  .hourly-forecast.is-hourly-exit-left,
  .hourly-forecast.is-hourly-exit-right,
  .hourly-forecast.is-hourly-enter-right,
  .hourly-forecast.is-hourly-enter-left{
    animation:none !important;
  }
}

/* === END AMBIENT WEATHER PASS 2 — HOURLY SLIDE v1 === */

/* === AMBIENT WEATHER PASS 3 — CONDITIONS + DAILY v1 === */

/* Current conditions: shared accent, no decorative placeholder glyphs. */
.weather-glass__metrics{
  --aw-metric-accent:rgba(123,216,235,.90);
}

.weather-glass__metrics > div{
  position:relative;
}

.weather-glass__metrics > div::before{
  content:none !important;
}

.weather-glass__metrics span{
  color:var(--aw-metric-accent) !important;
}

.weather-glass__metrics strong{
  color:rgba(247,250,251,.94) !important;
}

/* Seven-day forecast: day → graphic → high/low → precipitation → wind */
.forecast-strip{
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  gap:7px !important;
}

.forecast-strip .daily-cell{
  display:grid;
  grid-template-rows:auto 24px auto auto;
  justify-items:center;
  align-items:center;
  gap:4px !important;
  padding:7px 3px 8px !important;
}

.forecast-strip .daily-cell > span{
  font-size:9px !important;
  font-weight:750 !important;
  letter-spacing:.08em !important;
  color:rgba(218,228,232,.70) !important;
}

.forecast-strip .daily-cell > b{
  display:grid;
  place-items:center;
  height:24px;
  font-size:18px !important;
  line-height:1 !important;
}

.forecast-strip .daily-cell > strong{
  display:flex;
  align-items:baseline;
  gap:4px;
  font-size:12px !important;
  line-height:1 !important;
  color:rgba(247,250,251,.94) !important;
}

.forecast-strip .daily-cell > strong i,
.forecast-strip .daily-cell > strong em,
.forecast-strip .daily-cell > small i,
.forecast-strip .daily-cell > small em{
  font-style:normal;
}

.forecast-strip .daily-cell > strong em{
  color:rgba(205,216,221,.58);
}

.forecast-strip .daily-cell > small{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1px;
  font-size:8.5px;
  line-height:1.15;
  white-space:nowrap;
}

.forecast-strip .daily-cell > small i{
  color:rgba(121,220,241,.90);
  font-weight:700;
}

.forecast-strip .daily-cell > small em{
  color:rgba(218,228,232,.68);
  font-weight:600;
}

/* === END AMBIENT WEATHER PASS 3 — CONDITIONS + DAILY v1 === */

/* === AMBIENT WEATHER PASS 3 — DAILY READOUT POLISH v1 === */
/*
  Micro-polish only:
  - improve high/low contrast separation
  - make precipitation + wind easier to scan
  - preserve card height and structure
*/
.forecast-strip .daily-cell{
  gap:5px !important;
}

.forecast-strip .daily-cell > strong{
  gap:5px !important;
  font-size:12.5px !important;
}

.forecast-strip .daily-cell > strong i{
  font-weight:750 !important;
  color:rgba(248,250,251,.97) !important;
}

.forecast-strip .daily-cell > strong em{
  font-size:11px !important;
  font-weight:600 !important;
  color:rgba(209,220,224,.68) !important;
}

.forecast-strip .daily-cell > small{
  gap:2px !important;
  font-size:9px !important;
}

.forecast-strip .daily-cell > small i{
  font-size:9.5px !important;
  color:rgba(121,220,241,.94) !important;
}

.forecast-strip .daily-cell > small em{
  font-size:9px !important;
  color:rgba(220,229,233,.74) !important;
}

/* === END AMBIENT WEATHER PASS 3 — DAILY READOUT POLISH v1 === */

/* === AMBIENT WEATHER PASS 6A — PRESENTATION LAYER SHELL v1 === */
/* Static desktop showcase only. Locked hero/weather geometry remains untouched. */

@media (min-width:1001px){
  .hero-content{
    position:relative;
  }

  .aw-presentation-layer{
    box-sizing:border-box;
    position:absolute;
    left:0;
    top:265px; /* PASS6A-DOWN60-V15 */
    z-index:2;
    width:245px;
    height:205px;
    padding:10px;
    border:1px solid rgba(210,166,78,.72);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(8,15,22,.96),rgba(4,10,16,.98));
    box-shadow:
      0 18px 44px rgba(0,0,0,.28),
      inset 0 1px 0 rgba(255,255,255,.035),
      0 0 0 1px rgba(201,155,70,.06);
    overflow:visible;
  top:250px;
}

  .aw-presentation-card{
    width:100%;
    height:100%;
    margin:0;
  }

  .aw-presentation-media{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
    border-radius:12px;
    background:#071019;
  }

  .aw-presentation-image{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
  }

  .aw-presentation-media::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(
      180deg,
      rgba(3,8,13,.02) 28%,
      rgba(3,8,13,.18) 58%,
      rgba(3,8,13,.86) 100%
    );
  }

  .aw-presentation-copy{
    position:absolute;
    z-index:1;
    left:-10px;
    right:-10px;
    display:grid;
    gap:2px;
    color:rgba(247,249,250,.96);
  top:calc(100% + 8px);
  box-sizing:border-box;
  padding:10px 12px 12px;
  min-height:62px;
  border:1px solid rgba(210,166,78,.58);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(8,15,22,.96),rgba(4,10,16,.98));
  box-shadow:0 14px 32px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.03);
}

  .aw-presentation-kicker{
    margin-bottom:2px;
    color:rgba(216,174,87,.90);
    font-size:9px;
    font-weight:750;
    letter-spacing:.14em;
    text-transform:uppercase;
  }

  .aw-presentation-copy strong{
    font-size:18px;
    font-weight:720;
    line-height:1.05;
    letter-spacing:-.02em;
  }

  .aw-presentation-copy > span:last-of-type{
    color:rgba(224,231,233,.88);
    font-size:13px;
    line-height:1.3;
  }
}

@media (max-width:1000px){
  .aw-presentation-layer{
    display:none !important;
  }
}

/* === END AMBIENT WEATHER PASS 6A — PRESENTATION LAYER SHELL v1 === */

/* === AMBIENT WEATHER LEFT COMPOSITION LIFT TEST v1 — 07/10/2026 === */
/*
  Controlled desktop-only move of the complete left hero composition.
  Text stack: accepted -180px baseline -> -205px (25px upward).
  Presentation layer: effective top 250px -> 225px (25px upward).
  Weather panel geometry is intentionally untouched.
*/
@media (min-width:1001px){
  .release-hero-copy{
    transform:translateY(-205px) !important;
  }

  .aw-presentation-layer{
    top:225px !important;
  }
}
/* === END AMBIENT WEATHER LEFT COMPOSITION LIFT TEST v1 === */

/* === AMBIENT WEATHER HERO TITLE SKY TEST v1 — 07/10/2026 === */
/*
  Desktop-only refinement:
  - move the compact title group up into the clear upper-left sky
  - remove the lower descriptive paragraph from the desktop composition
  - keep panel geometry + presentation card untouched
  - switch hero text to a dark theme for snow-day only
*/
body{
  --aw-hero-eyebrow-color:rgba(236,243,247,.86);
  --aw-hero-heading-color:rgba(248,250,251,.97);
  --aw-hero-subheading-color:rgba(225,234,238,.88);
  --aw-hero-text-shadow:0 2px 18px rgba(4,12,18,.18);
}

body[data-preview-scene="snow-day"]{
  --aw-hero-eyebrow-color:rgba(24,44,66,.88);
  --aw-hero-heading-color:rgba(12,29,48,.96);
  --aw-hero-subheading-color:rgba(23,49,74,.86);
  --aw-hero-text-shadow:0 1px 0 rgba(255,255,255,.22);
}

@media (min-width:1001px){
  .release-hero-copy{
    max-width:430px !important;
    transform:translateY(-294px) !important;
  }

  .release-hero-copy .eyebrow{
    margin-bottom:10px !important;
    color:var(--aw-hero-eyebrow-color) !important;
    text-shadow:var(--aw-hero-text-shadow);
  }

  .release-hero-copy .eyebrow > span{
    opacity:.92;
  }

  .release-hero-copy h1{
    max-width:430px !important;
    color:var(--aw-hero-heading-color) !important;
    text-shadow:var(--aw-hero-text-shadow);
  }

  .release-hero-copy h1 span{
    color:var(--aw-hero-subheading-color) !important;
    opacity:1 !important;
    text-shadow:var(--aw-hero-text-shadow);
  }

  .release-hero-lede{
    display:none !important;
  }
}

body[data-preview-scene="snow-day"] .release-hero-copy .eyebrow > span{
  background:linear-gradient(90deg,rgba(27,61,96,.88),rgba(218,170,78,.84)) !important;
  box-shadow:none !important;
}
/* === END AMBIENT WEATHER HERO TITLE SKY TEST v1 === */

/* === AMBIENT WEATHER CONTINUITY REPAIR v2 — 07/10/2026 === */
/* Authoritative final desktop-only overrides. */
@media (min-width:1001px){
  .release-hero-copy{
    max-width:380px !important;
    transform:translateY(-294px) !important;
  }
  .release-hero-copy .eyebrow{
    margin-bottom:8px !important;
    font-size:10.5px !important;
    letter-spacing:.15em !important;
  }
  .release-hero-copy h1{
    max-width:380px !important;
    font-size:32px !important;
    line-height:1.02 !important;
    letter-spacing:-.03em !important;
  }
  .release-hero-copy h1 span{
    font-size:22px !important;
    line-height:1.08 !important;
  }
  .release-hero-lede{display:none !important;}
  .aw-presentation-layer{top:210px !important;}
}
/* === END AMBIENT WEATHER CONTINUITY REPAIR v2 === */

/* === AMBIENT WEATHER HERO SCALE OWNER v2 — 07/10/2026 === */
/*
  Final title sizing owner for non-mobile hero layouts.
  Intentionally later than legacy hero scale rules.
*/
@media (min-width:681px){
  .release-hero-copy h1{
    max-width:360px !important;
    font-size:29px !important;
    line-height:1.02 !important;
    letter-spacing:-.03em !important;
  }

  .release-hero-copy h1 span{
    font-size:19px !important;
    line-height:1.08 !important;
  }
}
/* === END AMBIENT WEATHER HERO SCALE OWNER v2 === */

/* CONSOLIDATED SOURCE: css/presentation-rotation-v1.css */
/* Ambient Weather presentation rotation v1 — transition overlays only.
   No width, height, top, left, transform, border or layout changes to the
   approved .aw-presentation-layer / weather/hero geometry. */
@media (min-width: 1001px) {
  [data-presentation-layer] .aw-presentation-media > [data-aw-transition-image] {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity 600ms ease-in-out;
  }
  [data-presentation-layer] [data-aw-transition-copy] {
    opacity: 0;
    pointer-events: none;
    transition: opacity 600ms ease-in-out;
  }
  [data-presentation-layer].aw-presentation-is-changing [data-aw-transition-image],
  [data-presentation-layer].aw-presentation-is-changing [data-aw-transition-copy] {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-presentation-layer] [data-aw-transition-image],
  [data-presentation-layer] [data-aw-transition-copy] {
    transition: none !important;
  }
}

/* CONSOLIDATED SOURCE: css/ecosystem-gateways-v01.css */

/* Ambient Weather — Ecosystem gateways */

.aw-header-gateways{
  display:flex;
  gap:10px;
  align-items:flex-start;
  flex-wrap:wrap;
}

.ecosystem-gateway{
  min-width:0;
  max-width:100%;
  padding-block:4px;
}

.ecosystem-gateway summary{
  display:flex;
  min-height:32px;
  padding:0 13px 0 8px;
  align-items:center;
  gap:9px;
  list-style:none;
  border:1px solid rgba(220,232,235,.16);
  border-radius:999px;
  background:transparent;
  color:rgba(242,246,247,.82);
  font-size:12px;
  font-weight:650;
  cursor:pointer;
}

.ecosystem-gateway summary::-webkit-details-marker{
  display:none;
}

.ecosystem-gateway__asset{
  display:block;
  object-fit:contain;
}

.ecosystem-gateway__asset--studios{
  width:108px;
  height:30px;
}

.ecosystem-gateway__asset--ova{
  width:92px;
  height:30px;
}

.ecosystem-gateway__menu{
  display:grid;
  min-width:190px;
  max-width:100%;
  margin-top:7px;
  padding:8px;
  gap:2px;
  border:1px solid rgba(220,232,235,.16);
  border-radius:14px;
  background:rgba(7,12,31,.38);
  -webkit-backdrop-filter:blur(14px) saturate(112%);
  backdrop-filter:blur(14px) saturate(112%);
  box-shadow:0 18px 44px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.035);
}

.ecosystem-gateway__menu a,
.ecosystem-gateway__menu span{
  padding:8px 9px;
  color:rgba(235,242,244,.76);
  font-size:11px;
}

@media (max-width:600px){
  .aw-header-gateways{
    gap:8px;
  }

  .ecosystem-gateway summary{
    padding:3px 8px;
    gap:6px;
    font-size:11px;
  }

  .ecosystem-gateway__asset--studios{
    width:80px;
    height:24px;
  }

  .ecosystem-gateway__asset--ova{
    width:64px;
    height:24px;
  }
}


/* Studios + OVA now occupy the Ambient Weather product-header identity slot. */
.site-nav .aw-product-gateways{
  flex:0 1 auto;
  align-self:center;
  flex-wrap:nowrap;
}

.site-nav .aw-product-gateways .ecosystem-gateway{
  padding-block:0;
}

/* Compact only near the existing navigation toggle breakpoint. */
@media (max-width:720px){
  .site-nav .aw-product-gateways{
    gap:8px;
  }

  .site-nav .ecosystem-gateway summary{
    padding:3px 8px;
    gap:6px;
    font-size:11px;
  }

  .site-nav .ecosystem-gateway__asset--studios{
    width:80px;
    height:24px;
  }

  .site-nav .ecosystem-gateway__asset--ova{
    width:64px;
    height:24px;
  }
}

/* Desktop gateway lockups: equal image boxes, existing header height. */
@media (min-width:1001px){
  .site-nav .ecosystem-gateway__asset--studios,
  .site-nav .ecosystem-gateway__asset--ova{
    width:140px;
    height:38px;
  }
}

/* Gateway dropdowns float below their buttons without expanding the strip. */
.site-nav .ecosystem-gateway{
  position:relative;
}

.site-nav .ecosystem-gateway__menu{
  position:absolute;
  top:100%;
  left:0;
  width:100%;
  z-index:2;
}

/* Preserve the existing tall-screen hero placement when a gateway is open. */
@media (min-width:1001px) and (min-height:900px){
  .aw-header-stack:has(.ecosystem-gateway[open])+main{
    grid-row:1;
  }

  .aw-header-stack:has(.ecosystem-gateway[open])+main .hero-content{
    padding-top:calc(var(--nb-appnav-height,52px) + var(--header-height) + 46px);
  }
}

/* === AMBIENT WEATHER GATEWAYS — CANONICAL DESKTOP CONTROL v5 === */
/*
  Diagnosed from:
  - current DOM structure
  - current 140x38 desktop image boxes
  - measured PNG alpha bounds

  Canonical visible order:
  lockup artwork -> ~5px -> label -> 5px -> chevron

  Measured compensation:
  Studios right invisible inset ≈27px => margin-right:-22px
  OVA right invisible inset ≈26px     => margin-right:-21px
*/

.site-nav .ecosystem-gateway__site-link{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  line-height:0;
}

.site-nav .ecosystem-gateway__toggle-label{
  display:inline-flex;
  align-items:center;
}

/* Suppress native disclosure markers. */
.site-nav .ecosystem-gateway summary{
  list-style:none;
}

.site-nav .ecosystem-gateway summary::marker{
  content:"";
}

.site-nav .ecosystem-gateway summary::-webkit-details-marker{
  display:none;
}

@media (min-width:1001px){
  .site-nav .ecosystem-gateway summary{
    gap:0 !important;
  }

  .site-nav .ecosystem-gateway:has(.ecosystem-gateway__asset--studios)
  .ecosystem-gateway__site-link{
    margin-right:-19px !important;
  }

  .site-nav .ecosystem-gateway:has(.ecosystem-gateway__asset--ova)
  .ecosystem-gateway__site-link{
    margin-right:-21px !important;
  }

  .site-nav .ecosystem-gateway__toggle-label{
    gap:5px !important;
    margin-left:0 !important;
  }

  /* One chevron system only: immediately after the label. */
  .site-nav .ecosystem-gateway__toggle-label::before{
    content:none !important;
    display:none !important;
  }

  .site-nav .ecosystem-gateway__toggle-label::after{
    content:"" !important;
    display:block !important;
    width:7px !important;
    height:7px !important;
    flex:0 0 7px !important;
    border-right:1.5px solid currentColor !important;
    border-bottom:1.5px solid currentColor !important;
    transform:rotate(45deg) translateY(-1px) !important;
    transform-origin:center !important;
    opacity:.9 !important;
  }

  .site-nav .ecosystem-gateway[open] .ecosystem-gateway__toggle-label::after{
    transform:rotate(225deg) translateY(-1px) !important;
  }

  /* No second/far-right chevron. */
  .site-nav .ecosystem-gateway summary::after{
    content:none !important;
    display:none !important;
  }
}

/* === END AMBIENT WEATHER GATEWAYS — CANONICAL DESKTOP CONTROL v5 === */

/* === OVA OPTICAL +2 v1 === */
/* OVA's visible border makes its label feel closer; add 2px optical breathing room. */
@media (min-width:1001px){
  .site-nav .ecosystem-gateway:has(.ecosystem-gateway__asset--ova)
  .ecosystem-gateway__site-link{
    margin-right:-19px !important;
  }
}
/* === END OVA OPTICAL +2 v1 === */

/* === STUDIOS MOBILE LOCKUP DIMENSIONS — UNCHANGED === */
@media (max-width:1000px){
  .site-nav .ecosystem-gateway__asset--studios{
    width:92px !important;
    height:24px !important;
    object-fit:contain !important;
  }
}
/* === END STUDIOS MOBILE LOCKUP DIMENSIONS === */

/* === AMBIENT WEATHER STUDIOS OPTICAL SCALE v1 — 10/10/2026 === */
@media (min-width: 1001px) {
  img[src*="studios-ecosystem-nav-v1.png"] {
    transform: scale(1.054);
    transform-origin: center center;
  }
}
/* === END AMBIENT WEATHER STUDIOS OPTICAL SCALE v1 === */

/* CONSOLIDATED SOURCE: css/weather-scene-preview-v1.css */
/* Ambient Weather temporary scene selector — preview only.
   Fixed overlay: does not participate in or alter locked page geometry. */
.aw-scene-preview{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:10000;
  width:min(310px,calc(100vw - 32px));
  padding:12px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px;
  background:rgba(3,10,17,.78);
  box-shadow:0 14px 40px rgba(0,0,0,.34);
  -webkit-backdrop-filter:blur(14px) saturate(125%);
  backdrop-filter:blur(14px) saturate(125%);
  color:#f4f8fa;
  font:600 11px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.aw-scene-preview__title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:0 0 9px;
  color:rgba(244,248,250,.76);
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.aw-scene-preview__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
}
.aw-scene-preview button{
  min-width:0;
  padding:7px 8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  background:rgba(255,255,255,.055);
  color:rgba(244,248,250,.82);
  cursor:pointer;
  font:inherit;
  text-align:left;
}
.aw-scene-preview button:hover,
.aw-scene-preview button:focus-visible{
  background:rgba(255,255,255,.11);
  color:#fff;
}
.aw-scene-preview button[aria-pressed="true"]{
  border-color:rgba(145,207,255,.52);
  background:rgba(111,177,230,.18);
  color:#fff;
}
@media(max-width:680px){
  .aw-scene-preview{right:10px;bottom:10px;width:min(280px,calc(100vw - 20px));}
}
@media print{
  .aw-scene-preview{display:none!important;}
}

/* CONSOLIDATED SOURCE: css/presentation-activation-v4.css */
/* Ambient Weather — presentation rotation activation v4 — 12 slides */
@media (min-width:1001px) {
  [data-presentation-layer] .aw-presentation-card,
  [data-presentation-layer] .aw-presentation-media { position: relative; }
  [data-presentation-layer] [data-aw-transition-image] {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 600ms ease;
    z-index: 1;
  }
  [data-presentation-layer] [data-aw-transition-copy] {
    opacity: 0;
    transition: opacity 600ms ease;
    z-index: 2;
  }
  [data-presentation-layer].aw-presentation-is-changing [data-aw-transition-image],
  [data-presentation-layer].aw-presentation-is-changing [data-aw-transition-copy] {
    opacity: 1;
  }
  /* Text-only caption transition: one stable painted caption surface. */
  [data-presentation-layer] [data-aw-transition-copy] {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
  }
  [data-presentation-layer].aw-presentation-is-changing .aw-presentation-card > .aw-presentation-copy:not([data-aw-transition-copy]) > * {
    opacity: 0;
    transition: opacity 600ms ease;
  }
  [data-presentation-layer] .aw-pres-link-overlay {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: block;
    border-radius: inherit;
    cursor: pointer;
  }
  [data-presentation-layer] .aw-pres-link-overlay[aria-disabled="true"] {
    pointer-events: none;
    cursor: default;
  }
  [data-presentation-layer] .aw-pres-link-overlay:focus-visible {
    outline: 2px solid #e5b959;
    outline-offset: 2px;
  }
  [data-presentation-layer].aw-presentation-is-changing .aw-pres-link-overlay {
    pointer-events: none;
  }
}

/* CONSOLIDATED SOURCE: css/presentation-no-darkening-v1.css */
/* Ambient Weather — remove presentation-only darkening overlay.
 * No change to locked dimensions, position, transition or image brightness.
 * The title/caption live beneath the image and require no image scrim.
 */
@media (min-width: 1001px) {
  [data-presentation-layer] .aw-presentation-media::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }
}

/* CONSOLIDATED SOURCE: css/presentation-panel-v08.css */
/* Ambient Weather — panel correction v0.8. Applied after existing CSS.
   Targeted: 35px upward lift from current 210px, fixed captions, unified link.
   Preserve the panel's width, image dimensions and hero geometry. */
@media (min-width: 1001px) {
  .hero-content [data-presentation-layer].aw-presentation-layer {
    top: 175px !important;
  }
  [data-presentation-layer] .aw-presentation-copy {
    height: 106px !important;
    min-height: 106px !important;
    max-height: 106px !important;
    box-sizing: border-box;
    overflow: hidden;
    grid-template-rows: auto auto 1fr;
  }
  [data-presentation-layer] > .aw-pres-unified-link-v08 {
    position: absolute;
    left: -10px;
    right: -10px;
    top: 0;
    bottom: -114px;
    z-index: 30;
    display: block;
    border-radius: 18px;
    background: transparent;
    cursor: pointer;
  }
  [data-presentation-layer] > .aw-pres-unified-link-v08:focus-visible {
    outline: 2px solid #e5b959;
    outline-offset: 2px;
  }
  [data-presentation-layer].aw-presentation-is-changing > .aw-pres-unified-link-v08 {
    pointer-events: none;
  }
}

/* CONSOLIDATED SOURCE: css/presentation-image-gap-v10b.css */
/* Ambient Weather v1.0b: image-frame lift only, 9 Oct 2026.
   Based on verified v0.8 working site; v0.9 is NOT a prerequisite.
   Caption on-screen y remains unchanged; navigation hit area follows it.
*/
@media (min-width: 1001px) {
  .hero-content [data-presentation-layer].aw-presentation-layer {
    top: 159px !important; /* v0.8: 175px; frame + image move 16px up */
  }
  [data-presentation-layer] .aw-presentation-copy {
    top: calc(100% + 24px) !important; /* baseline +8px; compensates -16px */
  }
  [data-presentation-layer] > .aw-pres-unified-link-v08 {
    bottom: -130px !important; /* baseline -114px; keeps caption clickable */
  }
}

/* === MOBILE CONCEPT B REVIEW v1 — 10/10/2026 ===
 * Phone-only: one strip + two canonical gateways, full-width illustration
 * with caption BELOW image, and weather immediately after.
 * The desktop presentation geometry and cascade above remain untouched.
 */
.aw-mobile-gateway { display: none; } /* No invisible header links on desktop/tablet */
@media (max-width: 680px) {
  :root { --nb-appnav-height: 54px; }
  .aw-header-stack { display: contents !important; }
  .aw-header-stack .site-header { display: none !important; }
  main#main-content { grid-column: 1 !important; grid-row: auto !important; }

  .nb-appnav { height: var(--nb-appnav-height) !important; }
  .nb-appnav__inner {
    display: flex !important;
    width: calc(100% - 16px) !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: clamp(3px, .8vw, 7px) !important;
  }
  .nb-appnav__ambient-home {
    display: inline-flex !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin-right: auto !important;
  }
  .nb-appnav__ambient-lockup {
    display: block !important;
    width: clamp(86px, 29vw, 132px) !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 46px !important;
    object-fit: contain !important;
  }
  .nb-appnav__ambient-mobile-emblem,
  .nb-appnav__status, .nb-appnav__rail { display: none !important; }
  .nb-appnav__switcher {
    display: flex !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    justify-content: center !important;
    min-width: 0 !important;
    position: absolute !important;
    left: calc(50% - 31px) !important;
    transform: none !important;
  }
  .nb-appnav__apps-trigger {
    min-height: 38px !important;
    padding: 0 8px !important;
    font-size: 11px !important;
    gap: 4px !important;
  }
  .aw-mobile-gateway {
    order: 2;
    flex: 0 0 35px;
    width: 35px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid rgba(222,185,109,.23);
    background: rgba(6,13,24,.15);
  }
  .aw-mobile-gateway img {
    display: block;
    width: 32px;
    height: 32px;
    object-fit: contain;
  }
  .aw-mobile-gateway:focus-visible,
  .nb-appnav__parent-home:focus-visible { outline: 2px solid #e7bd74; outline-offset: 2px; }
  .nb-appnav__parent-home {
    position: static !important;
    order: 3 !important;
    flex: 0 0 35px !important;
    width: 35px !important;
    height: 40px !important;
    transform: none !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }
  .nb-appnav__parent-home .nb-appnav__home-lockup { display: none !important; }
  .nb-appnav__parent-home .nb-appnav__home-orb { display: block !important; width: 31px; height: 31px; }

  .hero { min-height: 0 !important; overflow: visible !important; }
  .hero-content.shell {
    display: flex !important;
    flex-direction: column !important;
    width: calc(100% - 20px) !important;
    min-height: 0 !important;
    margin-inline: auto !important;
    padding: calc(var(--nb-appnav-height) + 8px) 0 20px !important;
    gap: 10px !important;
    align-items: stretch !important;
  }
  .hero-content .release-hero-copy { display: none !important; }
  .hero-content [data-presentation-layer].aw-presentation-layer {
    display: block !important;
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 6px !important;
    border: 1px solid rgba(210,166,78,.72) !important;
    border-radius: 17px !important;
    background: linear-gradient(180deg,rgba(8,15,22,.96),rgba(4,10,16,.98)) !important;
    overflow: hidden !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.26) !important;
    isolation: isolate;
  }
  [data-presentation-layer] .aw-presentation-card { position: relative !important; height: auto !important; }
  [data-presentation-layer] .aw-presentation-media {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    overflow: hidden !important;
    border-radius: 11px !important;
    background: #071019 !important;
  }
  [data-presentation-layer] .aw-presentation-image {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
  [data-presentation-layer] .aw-presentation-media::after { display: none !important; content: none !important; }
  [data-presentation-layer] .aw-presentation-copy {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: 86px !important;
    min-height: 86px !important;
    max-height: 86px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    display: grid !important;
    align-content: center !important;
    grid-template-rows: auto auto auto !important;
    gap: 2px !important;
    overflow: hidden !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }
  [data-presentation-layer] .aw-presentation-kicker { font-size: 9px !important; line-height: 1.2 !important; }
  [data-presentation-layer] .aw-presentation-copy strong { font-size: clamp(15px,4vw,18px) !important; line-height: 1.15 !important; }
  [data-presentation-layer] .aw-presentation-copy > span:last-child { font-size: 11px !important; line-height: 1.28 !important; }
  [data-presentation-layer] [data-aw-transition-image] {
    position: absolute !important;
    inset: 0 !important;
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    transition: opacity 600ms ease-in-out;
  }
  [data-presentation-layer] .aw-presentation-copy[data-aw-transition-copy] {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    opacity: 0;
    z-index: 2;
    pointer-events: none;
    transition: opacity 600ms ease-in-out;
  }
  [data-presentation-layer].aw-presentation-is-changing [data-aw-transition-image],
  [data-presentation-layer].aw-presentation-is-changing [data-aw-transition-copy] { opacity: 1; }
  [data-presentation-layer].aw-presentation-is-changing .aw-presentation-card > .aw-presentation-copy:not([data-aw-transition-copy]) > * {
    opacity: 0;
    transition: opacity 600ms ease;
  }
  [data-presentation-layer] > .aw-pres-unified-link-v08 {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    z-index: 30 !important;
    background: transparent !important;
    border-radius: inherit !important;
  }
  [data-presentation-layer].aw-presentation-is-changing > .aw-pres-unified-link-v08 { pointer-events: none; }
  .hero-content .weather-glass {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
    margin: 0 !important;
    transform: none !important;
  }
  .aw-scene-preview { display: none !important; } /* Dev selector remains in code, never obstructs phone */
  .section-heading > p, .spatial-copy > p:not(.eyebrow), .about-content > p {
    margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important;
  }
  .hero-sky { transform: none !important; }
}
@media (min-width: 520px) and (max-width: 680px) {
  [data-presentation-layer] .aw-presentation-media { height: min(36vw, 245px) !important; aspect-ratio: auto !important; }
}
@media (max-width: 350px) {
  .nb-appnav__inner { width: calc(100% - 12px) !important; gap: 2px !important; }
  .nb-appnav__ambient-lockup { width: 87px !important; }
  .aw-mobile-gateway { flex-basis: 33px; width: 33px; }
  .nb-appnav__parent-home { flex-basis: 33px !important; width: 33px !important; }
  .nb-appnav__apps-trigger { padding-inline: 6px !important; }
  [data-presentation-layer] .aw-presentation-copy { height: 92px !important; min-height: 92px !important; max-height: 92px !important; }
}
@media (prefers-reduced-motion: reduce) {
  [data-presentation-layer] [data-aw-transition-image],
  [data-presentation-layer] [data-aw-transition-copy] { transition: none !important; }
}
/* === END MOBILE CONCEPT B REVIEW v1 === */