﻿/*
 * LHM-HYBRID-004 — canonical production layer
 * Morning-light and typography layer. The canonical Hero and contact scene stay untouched.
 */
:root{
  --h004-cream:#f7f0df;
  --h004-gold:#c89b3f;
  --h004-sage:#d8e0ce;
  --h004-deep:#08251b;
  --h004-ink:#173b2b;
  --h004-glass:rgba(7,35,25,.88);
  --type-kicker:clamp(8px,.62vw,10px);
  --type-hero:clamp(48px,5.5vw,84px);
  --type-section:clamp(42px,4.8vw,70px);
  --type-subheading:clamp(32px,3.7vw,54px);
  --type-card-title:clamp(22px,1.75vw,28px);
  --type-body:clamp(14px,1.05vw,17px);
  --type-quote:clamp(17px,1.45vw,22px);
  --type-price:clamp(54px,6vw,82px);
  --type-price-suffix:clamp(9px,.72vw,11px);
  --type-button:clamp(9px,.65vw,10px);
  --type-meta:clamp(8px,.62vw,10px);
}

/* Typography from the approved 002 review direction; image and veil remain untouched. */
.hybrid-004-review .hero-copy{
  width:min(760px,58vw);
}

.hybrid-004-review .hero h1{
  font-size:var(--type-hero);
}

.hybrid-004-review .hero .lead{
  max-width:610px;
  font-size:clamp(14px,1.15vw,18px);
  line-height:1.65;
}

.hybrid-004-review .values .kicker,
.hybrid-004-review .atelier .kicker,
.hybrid-004-review .forest-story .kicker,
.hybrid-004-review .lhos .kicker,
.hybrid-004-review .partner .kicker{
  font-size:var(--type-kicker);
}

.hybrid-004-review .section-head h2,
.hybrid-004-review .atelier h2,
.hybrid-004-review .forest-story__intro h2,
.hybrid-004-review .lhos-intro h2{
  font-size:var(--type-section);
}

.hybrid-004-review .value-list p,
.hybrid-004-review .section-head>p:last-child,
.hybrid-004-review .atelier-copy>p:not(.kicker),
.hybrid-004-review .forest-story__copy p,
.hybrid-004-review .lhos-intro>p:last-child,
.hybrid-004-review .partner-card-copy p:not(.kicker),
.hybrid-004-review .partner-benefits li{
  font-size:var(--type-body);
  line-height:1.68;
}

.hybrid-004-review .forest-story__copy h3,
.hybrid-004-review .partner-card-copy h3{
  font-size:var(--type-subheading);
}

.hybrid-004-review .value-list h3{
  font-size:var(--type-card-title);
}

.hybrid-004-review .atelier-principle{
  font-size:var(--type-quote)!important;
}

.hybrid-004-review .partner-price strong{
  font-size:var(--type-price);
}

.hybrid-004-review .partner-price span{
  font-size:var(--type-price-suffix);
}

.hybrid-004-review .values .cta,
.hybrid-004-review .atelier .cta,
.hybrid-004-review .atelier .text-link,
.hybrid-004-review .forest-story .cta,
.hybrid-004-review .lhos .cta,
.hybrid-004-review .partner .cta{
  font-size:var(--type-button);
}

.hybrid-004-review .values .scene-img,
.hybrid-004-review .atelier .scene-img,
.hybrid-004-review .partner .scene-img{
  filter:none;
}

.hybrid-004-review .values:after{
  background:
    linear-gradient(180deg,rgba(5,24,18,.68) 0%,rgba(8,30,22,.18) 18%,rgba(4,20,15,.30) 72%,rgba(4,20,15,.50)),
    linear-gradient(90deg,rgba(5,22,17,.24),transparent 48%,rgba(5,22,17,.10));
}

.hybrid-004-review .value-list{
  border:1px solid rgba(216,175,88,.34);
  background:linear-gradient(145deg,rgba(7,31,23,.78),rgba(5,22,17,.64));
  box-shadow:0 28px 70px rgba(0,0,0,.28);
  backdrop-filter:blur(8px);
}

.hybrid-004-review .value-list article{
  border-color:rgba(216,175,88,.24);
}

.hybrid-004-review .value-list article:hover{
  background:rgba(16,51,37,.78);
}

.hybrid-004-review .atelier:after{
  background:
    linear-gradient(90deg,rgba(4,22,16,.54) 0%,rgba(6,27,20,.24) 40%,transparent 70%),
    linear-gradient(0deg,rgba(4,20,15,.28),transparent 55%);
}

.hybrid-004-review .atelier-copy{
  margin-left:0;
  padding:clamp(24px,3vw,42px);
  border-left:1px solid rgba(216,175,88,.42);
  background:linear-gradient(110deg,rgba(5,24,18,.78),rgba(5,24,18,.28) 72%,transparent);
  backdrop-filter:blur(5px);
}

.forest-story{
  position:relative;
  color:var(--h004-ink);
  background:
    radial-gradient(circle at 10% 8%,rgba(255,245,212,.74),transparent 34%),
    linear-gradient(180deg,#d8dfcf 0%,#eef0df 44%,#dce4d2 100%);
  isolation:isolate;
}

.forest-story__intro{
  position:relative;
  z-index:3;
  max-width:760px;
  margin:0 auto;
  padding:clamp(88px,9vw,138px) 24px clamp(52px,6vw,84px);
  text-align:center;
}

.forest-story__intro h2{
  margin:0;
  color:var(--h004-ink);
  font:500 var(--type-section)/1 Georgia,"Times New Roman",serif;
}

.forest-story__intro h2 em{
  color:var(--h004-gold);
  font-weight:400;
}

.forest-story__layout{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);
  align-items:start;
  width:min(1540px,100%);
  margin:0 auto;
  padding:0 clamp(24px,4vw,70px) clamp(90px,10vw,150px);
  gap:clamp(42px,6vw,96px);
}

.forest-story__visual{
  position:sticky;
  top:clamp(90px,10vh,120px);
  height:min(72vh,760px);
  min-height:520px;
  overflow:hidden;
  border:1px solid rgba(216,175,88,.32);
  border-radius:clamp(20px,2.2vw,34px);
  background:#aec3a4;
  box-shadow:0 32px 78px rgba(27,54,39,.24),0 0 0 1px rgba(255,255,255,.28) inset;
}

.forest-story__visual:after{
  position:absolute;
  z-index:4;
  inset:0;
  content:"";
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,248,222,.04),transparent 62%,rgba(18,50,35,.16)),
    linear-gradient(90deg,rgba(18,50,35,.10),transparent 38%);
}

.forest-story__layer{
  position:absolute;
  inset:0;
  margin:0;
  opacity:0;
  transform:scale(1.018);
  transition:opacity 1.05s ease,transform 1.4s cubic-bezier(.22,.61,.36,1);
}

.forest-story__layer.is-visible{
  opacity:1;
  transform:scale(1);
}

.forest-story__layer img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.forest-story__light{
  position:absolute;
  z-index:5;
  inset:-20%;
  pointer-events:none;
  opacity:.28;
  background:radial-gradient(circle at 72% 18%,rgba(255,241,184,.34),transparent 24%);
  animation:h004-light-breathe 10s ease-in-out infinite alternate;
}

.forest-story__steps{
  position:relative;
  z-index:3;
}

.forest-story__step{
  display:flex;
  min-height:82vh;
  align-items:center;
  opacity:.42;
  transform:translateY(18px);
  transition:opacity .55s ease,transform .55s ease;
}

.forest-story__step.is-active{
  opacity:1;
  transform:none;
}

.forest-story__copy{
  position:relative;
  width:100%;
  padding:clamp(32px,4vw,58px);
  border:1px solid rgba(216,175,88,.31);
  border-radius:24px;
  background:
    linear-gradient(145deg,rgba(252,247,229,.96),rgba(229,236,217,.93)),
    rgba(247,240,223,.95);
  box-shadow:0 24px 58px rgba(28,61,43,.18);
  backdrop-filter:blur(10px);
}

.forest-story__copy:before{
  position:absolute;
  inset:12px;
  border:1px solid rgba(244,236,218,.05);
  border-radius:16px;
  content:"";
  pointer-events:none;
}

.forest-story__copy>span{
  color:var(--h004-gold);
  font-size:10px;
  letter-spacing:.22em;
}

.forest-story__copy h3{
  margin:18px 0 16px;
  color:var(--h004-ink);
  font:500 var(--type-subheading)/1.04 Georgia,"Times New Roman",serif;
}

.forest-story__copy p{
  max-width:42ch;
  margin:0;
  color:#315441;
  font-size:var(--type-body);
  line-height:1.72;
}

.forest-story__mobile-image{
  display:none;
}

@keyframes h004-light-breathe{
  to{opacity:.52;transform:translate3d(-1.5%,1%,0)}
}

/* The canonical LHOS component remains intact; only its containing geometry is repaired. */
.hybrid-004-review .lhos{
  height:auto;
  min-height:max(900px,100svh);
  padding:clamp(84px,7vw,112px) clamp(24px,4vw,64px) clamp(60px,6vw,90px);
  background:#b9cbb0;
}

.hybrid-004-review .lhos .lhos-forest{
  filter:none;
  opacity:1;
  object-position:center;
}

.hybrid-004-review .lhos:after{
  background:
    radial-gradient(circle at 50% 58%,rgba(6,28,20,.08) 0%,rgba(6,28,20,.15) 44%,rgba(5,24,17,.40) 100%),
    linear-gradient(180deg,rgba(255,246,211,.10),rgba(5,27,19,.06) 52%,rgba(5,27,19,.30));
}

.hybrid-004-review .lhos-intro{
  position:relative;
  top:auto;
  left:auto;
  width:auto;
  max-width:610px;
  margin:0 auto clamp(22px,3vw,40px);
  padding:20px 28px 22px;
  border:1px solid rgba(206,166,81,.24);
  border-radius:20px;
  color:var(--h004-ink);
  background:rgba(247,240,223,.84);
  box-shadow:0 18px 44px rgba(15,44,31,.14);
  backdrop-filter:blur(8px);
  text-align:center;
}

.hybrid-004-review .lhos-intro h2{
  color:var(--h004-ink);
}

.hybrid-004-review .lhos-intro>p:last-child{
  color:#315441;
}

.lhos-botanical-glow{
  position:absolute;
  z-index:0;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}

.lhos-botanical-glow i{
  position:absolute;
  width:7px;
  aspect-ratio:1;
  border-radius:50%;
  opacity:.34;
  background:#ffe8a0;
  box-shadow:0 0 7px 2px rgba(255,218,115,.55),0 0 19px 5px rgba(213,168,69,.18);
  animation:h004-botanical-breathe 7.8s ease-in-out infinite alternate;
}

.lhos-botanical-glow i:nth-child(1){left:8%;bottom:18%;animation-duration:8.6s}
.lhos-botanical-glow i:nth-child(2){left:17%;bottom:31%;width:5px;animation-duration:11.2s;animation-delay:-3.4s}
.lhos-botanical-glow i:nth-child(3){left:28%;bottom:12%;width:6px;animation-duration:9.7s;animation-delay:-6.1s}
.lhos-botanical-glow i:nth-child(4){right:8%;bottom:16%;width:8px;animation-duration:10.4s;animation-delay:-2.7s}
.lhos-botanical-glow i:nth-child(5){right:19%;bottom:29%;width:5px;animation-duration:12.1s;animation-delay:-7.2s}
.lhos-botanical-glow i:nth-child(6){right:29%;bottom:10%;width:6px;animation-duration:8.9s;animation-delay:-4.8s}
.lhos-botanical-glow i:nth-child(7){right:12%;bottom:43%;width:4px;background:#aee5cf;box-shadow:0 0 7px 2px rgba(138,217,188,.46);animation-duration:13.2s;animation-delay:-8.2s}

@keyframes h004-botanical-breathe{
  0%{opacity:.18;transform:translate3d(0,4px,0) scale(.86)}
  54%{opacity:.52}
  100%{opacity:.32;transform:translate3d(4px,-12px,0) scale(1.12)}
}

.hybrid-004-review .lhos-layout{
  position:relative;
  display:grid;
  grid-template-columns:minmax(180px,1fr) minmax(500px,680px) minmax(180px,1fr);
  align-items:center;
  width:min(1460px,100%);
  height:auto;
  min-height:650px;
  margin:0 auto;
  gap:clamp(16px,2.5vw,38px);
}

.hybrid-004-review .lhos-layout .orbit{
  position:relative;
  inset:auto;
  width:min(52vw,680px);
  height:auto;
  max-width:680px;
  margin:auto;
  aspect-ratio:1;
}

.hybrid-004-review .lhos-notes,
.hybrid-004-review .assignment-map{
  height:650px;
}

.hybrid-004-review .lhos-notes{
  display:grid;
  grid-template-rows:repeat(3,1fr);
}

.hybrid-004-review .lhos-notes article{
  align-self:center;
  color:var(--h004-cream);
  background:linear-gradient(90deg,rgba(5,32,22,.86),rgba(5,32,22,.18));
}

.hybrid-004-review .lhos-notes.right article{
  background:linear-gradient(270deg,rgba(5,32,22,.86),rgba(5,32,22,.18));
}

.hybrid-004-review .orbit button:focus-visible{
  outline:2px solid #fff1bd;
  outline-offset:4px;
}

/* Offers are part of the woodland scene, not isolated SaaS cards. */
.hybrid-004-review .partner{
  background:#6f8c6e;
}

.hybrid-004-review .partner:after{
  background:
    linear-gradient(180deg,rgba(5,24,18,.20),rgba(5,24,18,.46)),
    radial-gradient(circle at 50% 30%,transparent,rgba(4,19,14,.30) 82%);
}

.hybrid-004-review .partner-card{
  border-color:rgba(216,175,88,.46);
  border-radius:26px;
  background:
    linear-gradient(150deg,rgba(244,236,218,.12),transparent 31%),
    linear-gradient(145deg,rgba(17,54,39,.91),rgba(5,24,18,.94));
  box-shadow:0 34px 78px rgba(0,0,0,.42),inset 0 1px rgba(244,236,218,.08);
  backdrop-filter:blur(9px);
}

.hybrid-004-review .partner-card:before{
  position:absolute;
  z-index:1;
  inset:13px;
  border:1px solid rgba(216,175,88,.12);
  border-radius:18px;
  content:"";
  pointer-events:none;
}

.hybrid-004-review .partner-card-copy h3,
.hybrid-004-review .partner-card-copy p:not(.kicker),
.hybrid-004-review .partner-benefits li{
  color:var(--h004-cream);
}

.hybrid-004-review .partner-card-copy p:not(.kicker){
  max-width:54ch;
}

.hybrid-004-review .partner-price{
  border-color:rgba(216,175,88,.52);
  background:linear-gradient(90deg,rgba(216,175,88,.09),transparent);
}

.hybrid-004-review .partner-price strong{
  color:#edca78;
}

@media(max-width:1100px){
  .forest-story__layout{
    grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);
    gap:34px;
  }

  .hybrid-004-review .lhos{
    min-height:auto;
  }

  .hybrid-004-review .lhos-layout{
    display:flex;
    min-height:0;
    flex-direction:column;
  }

  .hybrid-004-review .lhos-layout .orbit{
    order:1;
    width:min(76vw,650px);
    flex:0 0 auto;
  }

  .hybrid-004-review .assignment-map{
    display:none;
  }

  .hybrid-004-review .lhos-notes.left,
  .hybrid-004-review .lhos-notes.right{
    position:relative;
    inset:auto;
    order:2;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    width:100%;
    height:auto;
    margin:10px 0 0;
    gap:12px;
  }

  .hybrid-004-review .lhos-notes.right{order:3}
  .hybrid-004-review .lhos-notes p{display:block}
}

@media(max-width:850px){
  .hybrid-004-review .hero-copy{width:100%}

  .forest-story__intro{
    padding-bottom:42px;
    text-align:left;
  }

  .forest-story__layout{
    display:block;
    padding:0 20px 84px;
  }

  .forest-story__visual{display:none}

  .forest-story__step{
    display:block;
    min-height:0;
    margin:0 0 38px;
    opacity:1;
    transform:none;
  }

  .forest-story__mobile-image{
    display:block;
    width:100%;
    aspect-ratio:16/10;
    object-fit:cover;
    border:1px solid rgba(216,175,88,.30);
    border-radius:22px 22px 0 0;
  }

  .forest-story__copy{
    margin-top:-1px;
    border-radius:0 0 22px 22px;
  }

  .hybrid-004-review .lhos{
    padding:84px 20px 64px;
  }

  .hybrid-004-review .lhos-layout .orbit{
    width:min(88vw,620px);
  }

  .hybrid-004-review .lhos-notes.left,
  .hybrid-004-review .lhos-notes.right{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .hybrid-004-review .lhos-notes article{
    min-height:104px;
    padding:14px 10px;
    border:1px solid rgba(216,175,88,.22);
  }
}

@media(max-width:560px){
  :root{
    --type-section:clamp(37px,10.5vw,50px);
    --type-subheading:clamp(32px,9vw,44px);
    --type-card-title:clamp(22px,6.5vw,27px);
    --type-body:clamp(14px,3.8vw,16px);
    --type-quote:clamp(16px,4.5vw,20px);
    --type-price:clamp(54px,15vw,72px);
  }

  .hybrid-004-review .hero h1{
    font-size:clamp(37px,10.3vw,52px);
  }

  .hybrid-004-review .hero .lead{
    max-width:34ch;
    font-size:13px;
    line-height:1.58;
  }

  .hybrid-004-review .hero .kicker{
    max-width:28ch;
    font-size:7px;
    line-height:1.55;
    letter-spacing:.17em;
    overflow-wrap:anywhere;
  }

  .hybrid-004-review .values{
    padding-inline:16px;
  }

  .hybrid-004-review .atelier{
    padding-inline:16px;
  }

  .hybrid-004-review .atelier-copy{
    padding:24px 20px;
  }

  .forest-story__intro{
    padding:78px 18px 36px;
  }

  .forest-story__intro h2{
    font-size:var(--type-section);
  }

  .forest-story__layout{
    padding-inline:14px;
  }

  .forest-story__copy{
    padding:28px 22px;
  }

  .forest-story__copy h3{
    font-size:var(--type-subheading);
  }

  .hybrid-004-review .lhos{
    min-height:0;
    padding:78px 16px 58px;
  }

  .hybrid-004-review .lhos-intro h2{
    font-size:var(--type-section);
  }

  .hybrid-004-review .lhos-layout{
    width:100%;
    overflow:visible;
  }

  .hybrid-004-review .lhos-layout .orbit{
    width:min(calc(100vw - 32px),500px);
    max-width:none;
    margin:18px auto 8px;
  }

  .hybrid-004-review .orbit button{
    width:44px;
  }

  .hybrid-004-review .orbit-copy{
    width:47%;
    padding:10px;
  }

  .hybrid-004-review .orbit-copy strong{font-size:21px}
  .hybrid-004-review .orbit-copy p{font-size:8px}

  .hybrid-004-review .lhos-notes.left,
  .hybrid-004-review .lhos-notes.right{
    grid-template-columns:1fr;
    gap:8px;
  }

  .hybrid-004-review .lhos-notes article{
    min-height:82px;
  }

  .hybrid-004-review .partner{
    padding-inline:14px;
  }

  .hybrid-004-review .partner-card{
    padding:24px 22px 28px;
    border-radius:20px;
  }
}

@media(prefers-reduced-motion:reduce){
  .forest-story__light{animation:none}
  .lhos-botanical-glow i{animation:none;opacity:.28;transform:none}
  .forest-story__layer,
  .forest-story__step{transition-duration:.01ms}
}

