/* === PREMIUM HOMEPAGE V1 / ART DIRECTION PASS === */

/*
  Premium art-direction layer.
  Keeps the existing PHP/data contract intact and upgrades composition,
  hierarchy, depth and motion without replacing real Ellipse screenshots.
*/
:root{
  --os-navy-2:#0d1c43;
  --os-navy-3:#132852;
  --os-sky:#eef4fb;
  --os-glass:rgba(255,255,255,.74);
  --os-glass-line:rgba(8,20,52,.10);
  --os-shadow-soft:0 18px 55px rgba(8,20,52,.09);
  --os-shadow-premium:0 30px 90px rgba(8,20,52,.15);
  --os-ease:cubic-bezier(.2,.75,.2,1);
}

html{scroll-behavior:smooth}
.os-home{
  position:relative;
  overflow:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  background:
    radial-gradient(900px 520px at 85% -120px, rgba(88,137,255,.09), transparent 68%),
    #fff;
}
.os-home::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:920px;
  pointer-events:none;
  background:
    radial-gradient(640px 420px at 78% 18%, rgba(255,0,69,.055), transparent 72%),
    radial-gradient(760px 520px at 18% 10%, rgba(34,86,170,.055), transparent 70%);
  z-index:0;
}
.os-home > section{position:relative;z-index:1}
.os-home .os-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:auto;
  margin-bottom:18px;
  font-size:11px;
  line-height:1;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#536581;
}
.os-home .os-kicker::before{
  content:"";
  width:22px;
  height:1px;
  background:var(--os-magenta);
  box-shadow:0 0 12px rgba(255,0,69,.28);
}
.os-home section > h2,
.os-home .os-hero h1{
  text-wrap:balance;
  letter-spacing:-.055em;
}
.os-home .os-lead{
  font-size:clamp(17px,1.4vw,20px);
  line-height:1.65;
  letter-spacing:-.018em;
}

/* Hero — editorial, asymmetric, product-led */
.os-home .os-hero{
  width:min(1480px,100%);
  min-height:clamp(720px,calc(100vh - 72px),900px);
  margin:0 auto;
  padding:clamp(72px,9vh,118px) var(--os-pad) clamp(64px,8vh,92px);
  display:grid;
  grid-template-columns:minmax(360px,.86fr) minmax(520px,1.14fr);
  gap:clamp(42px,6vw,92px);
  align-items:center;
  text-align:left;
}
.os-home .os-hero > *{
  width:auto;
  max-width:none;
  margin:0;
  padding:0;
  align-items:flex-start;
}
.os-home .os-hero-copy{
  position:relative;
  z-index:5;
}
.os-home .os-hero h1{
  max-width:10.6ch;
  margin:0;
  font-size:clamp(58px,6.15vw,92px);
  line-height:.94;
  font-weight:600;
  color:var(--os-navy);
}
.os-home .os-hero .os-lead{
  max-width:600px;
  margin:28px 0 0;
  text-align:left;
  color:#5d6c85;
}
.os-home .os-hero .os-actions{
  justify-content:flex-start;
  margin-top:34px;
}
.os-home .button{
  min-height:52px;
  padding:0 22px;
  border-radius:999px;
  transition:transform .28s var(--os-ease), box-shadow .28s var(--os-ease), background .28s ease, border-color .28s ease;
}
.os-home .button:not(.ghost){
  box-shadow:0 12px 28px rgba(255,0,69,.17);
}
.os-home .button:hover{
  transform:translateY(-2px);
}
.os-home .button:not(.ghost):hover{
  box-shadow:0 18px 36px rgba(255,0,69,.23);
}
.os-home .button.ghost{
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.os-home .os-hero-visual{
  --mx:0;
  --my:0;
  position:relative;
  display:block;
  width:100%;
  height:clamp(500px,46vw,650px);
  margin:0;
  perspective:1400px;
}
.os-home .os-hero-visual::before{
  content:"";
  position:absolute;
  width:74%;
  aspect-ratio:1;
  left:11%;
  top:8%;
  border-radius:50%;
  background:radial-gradient(circle, rgba(76,125,224,.14), rgba(76,125,224,.03) 48%, transparent 72%);
  filter:blur(12px);
}
.os-home .os-ui-hero{
  left:0;
  right:11%;
  top:18%;
  z-index:2;
  border-radius:22px;
  transform:
    rotateX(calc(var(--my) * -1deg))
    rotateY(calc(var(--mx) * 1deg))
    translate3d(calc(var(--mx) * 2px),calc(var(--my) * 1px),0);
  transition:transform .16s ease-out;
  box-shadow:0 34px 90px rgba(8,20,52,.17);
}
.os-home .os-ui-layer{
  width:48%;
  right:0;
  top:1%;
  z-index:3;
  border-radius:18px;
  transform:translate3d(calc(var(--mx) * -3px),calc(var(--my) * -2px),36px);
  transition:transform .18s ease-out;
  box-shadow:0 26px 70px rgba(8,20,52,.16);
}
.os-home .os-phone-hero{
  width:clamp(150px,12vw,200px);
  right:5%;
  bottom:0;
  z-index:4;
  transform:translate3d(calc(var(--mx) * 4px),calc(var(--my) * 2px),58px) rotate(1.5deg);
  transition:transform .2s ease-out;
  box-shadow:0 30px 70px rgba(8,20,52,.2);
}
.os-home .os-ui-hero::after,
.os-home .os-ui-layer::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82);
}

/* Trust — calm proof, not a logo wall */
.os-home .os-trust{
  position:relative;
  padding:34px var(--os-pad) 42px;
  border-color:rgba(8,20,52,.075);
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.os-home .os-trust > *{
  width:min(1260px,100%);
  margin-inline:auto;
  padding-inline:0;
}
.os-home .os-trust-logos{
  gap:22px 44px;
}
.os-home .os-trust-logos img{
  opacity:.52;
  filter:grayscale(1);
  transition:opacity .25s ease, filter .25s ease, transform .25s ease;
}
.os-home .os-trust-logos img:hover{
  opacity:.88;
  filter:grayscale(0);
  transform:translateY(-1px);
}
.os-home .os-trust-stats{
  margin-top:28px;
  padding-top:24px;
  border-top:1px solid rgba(8,20,52,.07);
  gap:10px 46px;
}
.os-home .os-trust-stats li{
  list-style:none;
  color:#718099;
}

/* Hospitality OS — the central visual moment */
.os-home .os-canvas{
  height:310vh;
  background:
    radial-gradient(800px 520px at 50% 58%, rgba(74,115,211,.10), transparent 68%),
    linear-gradient(180deg,#fbfdff 0%,#f5f8fc 54%,#fff 100%);
}
.os-home .os-stage{
  padding:clamp(56px,7vh,82px) var(--os-pad) clamp(22px,3vh,34px);
}
.os-home .os-canvas-copy{
  width:min(900px,100%);
  margin:0 auto;
  text-align:center;
}
.os-home .os-canvas-copy .os-kicker{
  justify-content:center;
}
.os-home .os-canvas-copy h2{
  font-size:clamp(44px,5vw,72px);
  letter-spacing:-.055em;
}
.os-home .os-canvas-copy .os-lead{
  max-width:760px;
  margin:14px auto 0;
}
.os-home .os-eco{
  width:min(1120px,100%);
  height:min(52vh,500px);
  min-height:430px;
  margin:6px auto 0;
  isolation:isolate;
}
.os-home .os-eco::before{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.98) 0%,rgba(241,246,253,.76) 46%,rgba(241,246,253,0) 72%);
  z-index:-2;
}
.os-home .os-eco-lines{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  overflow:visible;
  z-index:-1;
}
.os-home .os-eco-lines line{
  stroke:rgba(28,69,139,.18);
  stroke-width:1.25;
  stroke-dasharray:5 7;
  opacity:0;
  transition:opacity .65s var(--os-ease), stroke .65s ease;
}
.os-home .os-eco-lines line.is-on{
  opacity:1;
  stroke:rgba(28,69,139,.32);
}
.os-home .os-eco .os-node{
  width:238px;
  min-height:96px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:18px 20px;
  border:1px solid rgba(8,20,52,.075);
  border-radius:20px;
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 16px 46px rgba(8,20,52,.075);
  transform:translateY(14px) scale(.985);
  transition:opacity .62s var(--os-ease), transform .62s var(--os-ease), box-shadow .3s ease, border-color .3s ease;
}
.os-home .os-eco .os-node.is-on{
  transform:translateY(0) scale(1);
}
.os-home .os-eco .os-node:not(.os-core):hover{
  border-color:rgba(255,0,69,.18);
  box-shadow:0 22px 58px rgba(8,20,52,.11);
}
.os-home .os-eco .os-core{
  width:250px;
  min-height:150px;
  border-radius:999px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(247,250,255,.84));
  border:1px solid rgba(8,20,52,.09);
  box-shadow:0 30px 80px rgba(8,20,52,.13), inset 0 1px 0 #fff;
}
.os-home .os-eco .os-core b{
  font-size:31px;
  font-weight:700;
  letter-spacing:-.055em;
}
.os-home .os-eco .os-core b span{
  display:inline-block;
  width:8px;
  height:8px;
  margin-left:2px;
  border-radius:50%;
  background:var(--os-magenta);
  box-shadow:0 0 20px rgba(255,0,69,.38);
}

/* Product proof */
.os-home .os-product{
  background:#fff;
  padding-top:clamp(100px,11vw,150px)!important;
  padding-bottom:clamp(100px,11vw,150px)!important;
}
.os-home .os-product > h2{
  max-width:12ch!important;
  font-size:clamp(48px,5.2vw,76px)!important;
}
.os-home .os-product > .os-lead{
  max-width:700px;
}
.os-home .os-product .os-ui-wide{
  width:min(1180px,100%);
  margin-top:24px;
  border-radius:24px!important;
  box-shadow:var(--os-shadow-premium)!important;
}
.os-home .os-product .os-callouts{
  width:min(1050px,100%);
  margin-top:20px;
}
.os-home .os-callouts li{
  padding-top:18px;
  border-color:rgba(8,20,52,.10);
}
.os-home .os-callouts b{
  font-size:17px;
  letter-spacing:-.02em;
}

/* Value — three oversized statements */
.os-home .os-value{
  gap:42px 54px;
  padding-top:clamp(92px,10vw,136px)!important;
  padding-bottom:clamp(92px,10vw,136px)!important;
  border-top:1px solid rgba(8,20,52,.07);
  border-bottom:1px solid rgba(8,20,52,.07);
}
.os-home .os-value .os-statement{
  padding:0;
  border:0;
}
.os-home .os-value .os-statement h2{
  margin-bottom:14px;
  font-size:clamp(40px,4vw,58px)!important;
  line-height:.98;
}
.os-home .os-value .os-statement p{
  max-width:29ch;
  font-size:16px;
  line-height:1.65;
}

/* Product sections — varied rhythm */
.os-home .os-booking,
.os-home .os-journey,
.os-home .os-team,
.os-home .os-ai,
.os-home .os-case,
.os-home .os-segments,
.os-home .os-integrations,
.os-home .os-security,
.os-home .os-faq{
  padding-top:clamp(96px,10vw,142px)!important;
  padding-bottom:clamp(96px,10vw,142px)!important;
}
.os-home .os-booking-flow{
  margin-top:44px;
  gap:22px;
  align-items:start;
}
.os-home .os-booking-flow .os-ui{
  border-radius:20px;
  box-shadow:0 22px 60px rgba(8,20,52,.09);
  transition:transform .4s var(--os-ease),box-shadow .4s ease;
}
.os-home .os-booking-flow .os-ui:nth-child(2){transform:translateY(34px)}
.os-home .os-booking-flow .os-ui:nth-child(3){transform:translateY(68px)}
.os-home .os-booking-flow .os-ui:hover{
  transform:translateY(-6px);
  box-shadow:0 34px 78px rgba(8,20,52,.14);
}
.os-home .os-booking-flow .os-ui:nth-child(2):hover{transform:translateY(28px)}
.os-home .os-booking-flow .os-ui:nth-child(3):hover{transform:translateY(62px)}
.os-home .os-booking .os-actions{margin-top:92px}

/* Dark signature sections */
.os-home .os-inbox,
.os-home .os-mcp,
.os-home .os-final{
  background:
    radial-gradient(720px 440px at 82% 18%,rgba(56,95,174,.24),transparent 70%),
    radial-gradient(520px 360px at 10% 85%,rgba(255,0,69,.10),transparent 72%),
    linear-gradient(145deg,#07122f,#0b1839 58%,#0d1d43);
}
.os-home .os-inbox{
  padding-top:clamp(104px,11vw,150px)!important;
  padding-bottom:clamp(104px,11vw,150px)!important;
}
.os-home .os-inbox-grid{
  margin-top:44px;
  grid-template-columns:minmax(0,1.35fr) minmax(220px,.52fr);
  gap:clamp(34px,5vw,74px);
}
.os-home .os-inbox-desk{
  padding:26px 26px 14px;
  border-radius:24px;
  background:rgba(255,255,255,.055);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 30px 85px rgba(0,0,0,.24);
}
.os-home .os-inbox-guest,
.os-home .os-inbox-reply{
  padding:18px 20px;
  border-radius:17px;
  line-height:1.55;
}
.os-home .os-inbox-reply{
  margin-left:10%;
  background:linear-gradient(135deg,rgba(255,0,69,.19),rgba(255,255,255,.07));
}
.os-home .os-inbox .os-phone{
  transform:rotate(2deg);
  box-shadow:0 34px 84px rgba(0,0,0,.34);
}

/* Journey and reviews — editorial timelines */
.os-home .os-journey{
  background:linear-gradient(180deg,#fff,#f8fafd);
}
.os-home .os-journey .os-ui{
  border-radius:24px!important;
  box-shadow:var(--os-shadow-premium)!important;
}
.os-home .os-journey-steps{
  gap:0;
  border-top:1px solid rgba(8,20,52,.09);
}
.os-home .os-journey-steps li{
  padding:18px 0;
  border-bottom:1px solid rgba(8,20,52,.09);
  font-weight:550;
}
.os-home .os-journey-steps li span{
  font-size:12px;
  letter-spacing:.08em;
  color:var(--os-magenta);
}
.os-home .os-reviews{
  background:#f7f9fc;
}
.os-home .os-review-flow{
  margin-top:40px;
}
.os-home .os-review-flow li{
  padding:24px 22px 26px;
  border:1px solid rgba(8,20,52,.08);
  border-radius:20px;
  background:rgba(255,255,255,.74);
  box-shadow:0 12px 34px rgba(8,20,52,.055);
}
.os-home .os-review-flow li small{
  color:var(--os-magenta);
}

/* Payments */
.os-home .os-pay{
  background:#fff;
}
.os-home .os-pay-grid{
  margin-top:42px;
  grid-template-columns:minmax(0,1.48fr) minmax(190px,.52fr);
  gap:clamp(28px,5vw,70px);
  align-items:center;
}
.os-home .os-pay-grid .os-ui:first-child{
  border-radius:24px;
  box-shadow:var(--os-shadow-premium);
}
.os-home .os-pay-grid .os-ui:last-child{
  transform:rotate(1.3deg);
  box-shadow:0 26px 70px rgba(8,20,52,.16);
}

/* Team — phone fan, real screenshots remain untouched */
.os-home .os-team{
  overflow:hidden;
  background:
    radial-gradient(720px 400px at 50% 72%,rgba(70,111,208,.09),transparent 72%),
    #fff;
}
.os-home .os-team > h2{
  max-width:12ch!important;
  font-size:clamp(48px,5vw,74px)!important;
}
.os-home .os-team-phones{
  min-height:520px;
  margin-top:46px;
  align-items:flex-end;
  gap:10px;
}
.os-home .os-team-phones .os-phone{
  width:190px;
  flex-basis:190px;
  transform-origin:50% 100%;
  transition:transform .45s var(--os-ease),filter .35s ease;
  box-shadow:0 22px 55px rgba(8,20,52,.14);
}
.os-home .os-team-phones .os-phone:nth-child(1){transform:translateY(34px) rotate(-6deg)}
.os-home .os-team-phones .os-phone:nth-child(2){transform:translateY(12px) rotate(-3deg)}
.os-home .os-team-phones .os-phone:nth-child(3){transform:translateY(-12px) scale(1.06)}
.os-home .os-team-phones .os-phone:nth-child(4){transform:translateY(12px) rotate(3deg)}
.os-home .os-team-phones .os-phone:nth-child(5){transform:translateY(34px) rotate(6deg)}
.os-home .os-team-phones:hover .os-phone{filter:saturate(.92)}
.os-home .os-team-phones .os-phone:hover{
  transform:translateY(-24px) scale(1.045)!important;
  filter:saturate(1);
  z-index:4;
}

/* AI and MCP */
.os-home .os-ai{
  background:linear-gradient(180deg,#fbfcff,#f3f7fc);
}
.os-home .os-ai-task{
  position:relative;
  max-width:800px;
  margin-top:34px;
  padding:30px 32px;
  border-radius:24px;
  box-shadow:0 18px 50px rgba(8,20,52,.08);
}
.os-home .os-ai-task::before{
  content:"";
  position:absolute;
  left:0;
  top:28px;
  bottom:28px;
  width:3px;
  border-radius:9px;
  background:linear-gradient(var(--os-magenta),#6e83ff);
}
.os-home .os-mcp{
  padding-top:clamp(110px,12vw,160px)!important;
  padding-bottom:clamp(110px,12vw,160px)!important;
}
.os-home .os-mcp > *{
  max-width:920px;
}
.os-home .os-mcp-flow{
  margin:12px 0 4px;
  gap:12px;
}
.os-home .os-mcp-flow span{
  padding:10px 16px;
  background:rgba(255,255,255,.055);
  backdrop-filter:blur(10px);
}
.os-home .os-mcp .os-ai-task{
  padding:26px 28px;
  background:rgba(255,255,255,.055);
  backdrop-filter:blur(14px);
}

/* Case / segments / integrations */
.os-home .os-case{
  background:#fff;
}
.os-home .os-case-grid{
  margin-top:44px;
  gap:clamp(36px,6vw,80px);
  align-items:center;
}
.os-home .os-case-results b{
  font-size:clamp(32px,3.2vw,48px);
}
.os-home .os-case blockquote{
  font-family:var(--os-font)!important;
  font-style:normal!important;
  font-weight:500!important;
  line-height:1.28!important;
  letter-spacing:-.035em!important;
}
.os-home .os-segments{
  background:#f7f9fc;
}
.os-home .os-segment-tabs{
  margin:32px 0 42px;
}
.os-home .os-segment-tabs button{
  padding:10px 17px;
  border-radius:999px;
  transition:all .25s ease;
}
.os-home .os-segment-tabs button:not(.is-on):hover{
  border-color:rgba(8,20,52,.25);
  transform:translateY(-1px);
}
.os-home .os-integrations .os-int-cats{
  margin-top:34px;
  gap:10px;
}
.os-home .os-int-cats li{
  padding:10px 15px;
  background:#fff;
  box-shadow:0 8px 24px rgba(8,20,52,.04);
}

/* Security + FAQ */
.os-home .os-security{
  background:#f8fafc;
}
.os-home .os-security-facts{
  margin-top:34px;
  border-top:1px solid rgba(8,20,52,.09);
}
.os-home .os-security-facts > *{
  padding:20px 0;
  border-bottom:1px solid rgba(8,20,52,.09);
}
.os-home .os-faq-list{
  margin-top:34px;
  border-top:1px solid rgba(8,20,52,.1);
}
.os-home .os-faq details{
  border-bottom:1px solid rgba(8,20,52,.1);
}
.os-home .os-faq summary{
  padding:24px 0;
  font-size:18px;
  cursor:pointer;
  transition:color .2s ease;
}
.os-home .os-faq summary:hover{color:var(--os-magenta)}
.os-home .os-faq details > *:not(summary){
  max-width:780px;
}

/* Final CTA — one clean closing moment */
.os-home .os-final{
  min-height:560px;
  display:grid;
  place-items:center;
  text-align:center;
  padding-top:clamp(110px,12vw,170px)!important;
  padding-bottom:clamp(110px,12vw,170px)!important;
}
.os-home .os-final > *{
  width:min(980px,100%);
}
.os-home .os-final h2{
  max-width:12ch!important;
  margin-inline:auto;
  font-size:clamp(50px,6vw,84px)!important;
  line-height:.98!important;
  letter-spacing:-.06em!important;
}

/* Keep content readable immediately, including during fast scrolling. */
@media (max-width:1100px){
  .os-home .os-hero{
    grid-template-columns:minmax(320px,.9fr) minmax(450px,1.1fr);
    gap:36px;
  }
  .os-home .os-hero h1{font-size:clamp(54px,6.8vw,78px)}
  .os-home .os-team-phones .os-phone{width:164px;flex-basis:164px}
}

@media (max-width:800px){
  .os-home::before{height:680px}
  .os-home .os-hero{
    min-height:auto;
    grid-template-columns:1fr;
    padding-top:60px;
    padding-bottom:72px;
    gap:36px;
  }
  .os-home .os-hero > *{width:100%}
  .os-home .os-hero h1{
    max-width:11ch;
    font-size:clamp(48px,14vw,68px);
  }
  .os-home .os-hero .os-lead{font-size:17px}
  .os-home .os-hero-visual{
    height:auto;
    min-height:380px;
    margin-top:8px;
  }
  .os-home .os-ui-hero{
    position:relative;
    left:auto;right:auto;top:auto;
    width:94%;
    margin:0;
    transform:none!important;
  }
  .os-home .os-ui-layer{display:block;width:52%;right:0;top:-22px;transform:none!important}
  .os-home .os-phone-hero{
    position:absolute;
    width:128px;
    right:4%;
    bottom:-34px;
    transform:rotate(2deg)!important;
  }
  .os-home .os-trust{padding-inline:20px}
  .os-home .os-trust-logos{gap:18px 26px}
  .os-home .os-trust-logos img{height:28px;max-height:28px}
  .os-home .os-canvas{height:auto}
  .os-home .os-stage{padding-top:84px;padding-bottom:84px}
  .os-home .os-eco{min-height:0}
  .os-home .os-eco::before,.os-home .os-eco-lines{display:none}
  .os-home .os-eco .os-node{
    min-height:auto;
    border-radius:16px;
    transform:none;
  }
  .os-home .os-eco .os-core{
    min-height:112px;
    border-radius:24px;
  }
  .os-home .os-booking-flow .os-ui,
  .os-home .os-booking-flow .os-ui:nth-child(2),
  .os-home .os-booking-flow .os-ui:nth-child(3),
  .os-home .os-booking-flow .os-ui:hover{
    transform:none;
  }
  .os-home .os-booking .os-actions{margin-top:30px}
  .os-home .os-inbox-grid,.os-home .os-pay-grid{grid-template-columns:1fr}
  .os-home .os-inbox .os-phone,.os-home .os-pay-grid .os-ui:last-child{transform:none}
  .os-home .os-team-phones{
    min-height:390px;
    overflow:visible;
    gap:0;
    justify-content:center;
  }
  .os-home .os-team-phones .os-phone{
    width:142px;
    flex-basis:142px;
  }
  .os-home .os-team-phones .os-phone:nth-child(1){transform:translate(38px,28px) rotate(-7deg)}
  .os-home .os-team-phones .os-phone:nth-child(2){transform:translate(18px,10px) rotate(-3deg)}
  .os-home .os-team-phones .os-phone:nth-child(3){transform:translateY(-8px) scale(1.03)}
  .os-home .os-team-phones .os-phone:nth-child(n+4){display:none}
  .os-home .os-value{grid-template-columns:1fr}
  .os-home .os-value .os-statement p{max-width:none}
  .os-home[data-premium-ready="1"] > section:not(.os-hero):not(.os-canvas) > *{
    transform:translateY(14px);
  }
}

@media (max-width:480px){
  .os-home .os-hero{padding-top:46px}
  .os-home .os-hero h1{font-size:clamp(45px,13.6vw,60px)}
  .os-home .os-hero-visual{min-height:320px}
  .os-home .os-ui-layer{display:none}
  .os-home .os-phone-hero{width:112px;bottom:-22px}
  .os-home .os-team-phones .os-phone{width:132px;flex-basis:132px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .os-home *,
  .os-home *::before,
  .os-home *::after{
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
  .os-home[data-premium-ready="1"] > section:not(.os-hero):not(.os-canvas) > *{
    opacity:1!important;
    transform:none!important;
  }
}


/* === PREMIUM HOMEPAGE V1 / SHELL PASS === */

/* New homepage owns its reveal behavior; do not inherit the legacy global section fade. */
.homepage .os-home > section{
  opacity:1;
  transform:none;
}

/* Announcement — informative, quiet, never competing with hero. */
.homepage .announcement{
  min-height:34px;
  height:auto;
  padding:7px clamp(16px,4vw,54px);
  gap:12px;
  background:#07122f;
  border-bottom:1px solid rgba(255,255,255,.08);
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
}
.homepage .announcement span{
  max-width:min(760px,62vw);
  font-size:11px;
  font-weight:500;
  letter-spacing:0;
  color:rgba(255,255,255,.72);
}
.homepage .announcement a{
  border:0;
  font-size:11px;
  letter-spacing:0;
  color:#fff;
  opacity:.9;
}
.homepage .announcement a:hover{opacity:1}

/* Navigation — premium glass shell, compact and stable. */
.homepage .nav{
  top:0;
  width:100%;
  height:76px;
  min-height:76px;
  padding:0 clamp(22px,4.3vw,68px);
  border-bottom:1px solid rgba(8,20,52,.075);
  background:rgba(255,255,255,.90);
  backdrop-filter:saturate(145%) blur(18px);
  -webkit-backdrop-filter:saturate(145%) blur(18px);
  box-shadow:0 1px 0 rgba(255,255,255,.7);
  transition:height .28s var(--os-ease), min-height .28s var(--os-ease), background .28s ease, box-shadow .28s ease;
  z-index:100;
}
.homepage .nav.is-scrolled{
  height:68px;
  min-height:68px;
  background:rgba(255,255,255,.94);
  box-shadow:0 14px 36px rgba(8,20,52,.065);
}
.homepage .nav .brand{
  flex:0 0 auto;
}
.homepage .nav .brand img{
  width:142px;
  transition:width .28s var(--os-ease), opacity .2s ease;
}
.homepage .nav.is-scrolled .brand img{width:134px}
.homepage .nav > nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:clamp(22px,2.4vw,38px);
  margin-left:auto;
  margin-right:auto;
}
.homepage .nav-group{
  display:flex;
  align-items:center;
  height:76px;
}
.homepage .nav.is-scrolled .nav-group{height:68px}
.homepage .nav-parent{
  height:100%;
  padding:0 3px;
  gap:8px;
  font-size:13px;
  font-weight:600;
  letter-spacing:-.01em;
  color:#34415b;
  transition:color .2s ease;
}
.homepage .nav-parent:hover,
.homepage .nav-group.is-open > .nav-parent{
  color:var(--os-navy);
}
.homepage .nav-caret{
  width:6px;
  height:6px;
  opacity:.65;
}
.homepage .nav-sub{
  display:flex;
  position:absolute;
  top:calc(100% - 4px);
  left:50%;
  width:max-content;
  min-width:224px;
  max-width:300px;
  padding:10px;
  gap:2px;
  opacity:0;
  visibility:hidden;
  transform:translate(-50%,9px) scale(.985);
  transform-origin:50% 0;
  border:1px solid rgba(8,20,52,.09);
  border-radius:16px;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 24px 64px rgba(8,20,52,.13);
  transition:opacity .2s ease, visibility .2s ease, transform .24s var(--os-ease);
  pointer-events:none;
}
.homepage .nav-group.is-open > .nav-sub{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0) scale(1);
  pointer-events:auto;
}
@media (hover:hover) and (pointer:fine){
  .homepage .nav-group:hover > .nav-sub{
    opacity:1;
    visibility:visible;
    transform:translate(-50%,0) scale(1);
    pointer-events:auto;
  }
}
.homepage .nav-sub a{
  display:flex;
  align-items:center;
  min-height:40px;
  padding:9px 11px;
  border-radius:10px;
  font-size:13px!important;
  font-weight:550!important;
  color:#3e4b63!important;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.homepage .nav-sub a:hover{
  background:#f3f6fb;
  color:var(--os-navy)!important;
  transform:translateX(2px);
}
.homepage .nav-actions{
  flex:0 0 auto;
  gap:18px;
}
.homepage .nav-actions .login{
  font-size:12px;
  color:#56637a;
  transition:color .2s ease;
}
.homepage .nav-actions .login:hover{color:var(--os-navy)}
.homepage .nav .button.small{
  min-height:42px;
  padding:0 17px;
  gap:14px;
  border-radius:999px;
  font-size:12px;
  box-shadow:0 10px 24px rgba(255,0,69,.15);
}
.homepage .nav .button.small:hover{
  box-shadow:0 14px 30px rgba(255,0,69,.22);
}

/* Footer — more editorial and spacious; same information architecture. */
.homepage footer{
  position:relative;
  overflow:hidden;
  padding:clamp(78px,9vw,120px) var(--os-pad) 30px;
  grid-template-columns:minmax(270px,1.7fr) repeat(3,minmax(150px,.72fr));
  gap:clamp(34px,5vw,72px);
  background:
    radial-gradient(650px 360px at 8% 0%,rgba(255,0,69,.07),transparent 72%),
    radial-gradient(700px 420px at 94% 10%,rgba(77,111,190,.16),transparent 70%),
    #06112b;
  border-top:1px solid rgba(255,255,255,.07);
}
.homepage footer::before{
  content:"";
  position:absolute;
  left:var(--os-pad);
  right:var(--os-pad);
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);
}
.homepage footer .footer-brand{
  max-width:340px;
}
.homepage footer .footer-brand .brand img{
  width:166px;
}
.homepage footer .footer-brand p{
  margin-top:24px;
  max-width:29ch;
  font-size:14px;
  line-height:1.7;
  color:rgba(255,255,255,.52);
}
.homepage footer > div:not(.footer-brand,.copyright){
  gap:8px;
}
.homepage footer > div > b{
  margin-bottom:12px;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.94);
}
.homepage footer a,
.homepage footer span{
  color:rgba(255,255,255,.56);
  transition:color .18s ease;
}
.homepage footer a:hover{color:#fff}
.homepage footer > div:not(.footer-brand,.copyright) a{
  min-height:32px;
  font-size:13px;
}
.homepage footer .copyright{
  margin-top:26px;
  padding-top:24px;
  border-top:1px solid rgba(255,255,255,.09);
  font-size:10px;
  color:rgba(255,255,255,.38);
}
.homepage footer .copyright a{color:rgba(255,255,255,.5)}

@media (max-width:1000px){
  .homepage .nav{
    height:70px;
    min-height:70px;
    padding-inline:22px;
  }
  .homepage .nav .brand img,
  .homepage .nav.is-scrolled .brand img{width:132px}
  .homepage .nav > nav{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    bottom:auto;
    width:100%;
    height:auto;
    max-height:calc(100vh - 70px);
    padding:24px 22px 34px;
    margin:0;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    overflow-y:auto;
    background:rgba(255,255,255,.985);
    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
  }
  .homepage .nav > nav.open{display:flex}
  .homepage .nav-group,
  .homepage .nav.is-scrolled .nav-group{
    display:block;
    height:auto;
    border-bottom:1px solid rgba(8,20,52,.08);
  }
  .homepage .nav-parent{
    width:100%;
    height:auto;
    min-height:58px;
    justify-content:space-between;
    padding:0;
    font-size:17px;
    color:var(--os-navy);
  }
  .homepage .nav-sub{
    position:static;
    width:100%;
    min-width:0;
    max-width:none;
    padding:0 0 14px;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
    display:none;
  }
  .homepage .nav-group.is-open > .nav-sub{display:flex}
  .homepage .nav-sub a{
    min-height:42px;
    padding:9px 0;
    font-size:14px!important;
    background:transparent!important;
  }
  .homepage .nav nav .nav-mobile-only{
    display:flex;
    flex-direction:column;
    gap:12px;
    padding-top:24px;
  }
  .homepage .nav-mobile-only .nav-contact{
    padding-bottom:8px;
  }
  .homepage .nav-mobile-only .login{
    min-height:42px;
    display:flex;
    align-items:center;
  }
  .homepage .nav-mobile-only .button.small{
    width:100%;
    justify-content:space-between;
    min-height:50px;
    margin-top:6px;
  }
  .homepage .nav-actions{display:none}
  .homepage .menu{display:block}
  .homepage footer{
    grid-template-columns:1.4fr 1fr 1fr;
  }
  .homepage footer .footer-brand{grid-row:span 2}
}
@media (max-width:650px){
  .homepage .announcement{min-height:32px;padding:6px 14px}
  .homepage .announcement span{display:none}
  .homepage .nav{
    height:66px;
    min-height:66px;
    padding-inline:18px;
  }
  .homepage .nav > nav{
    top:100%;
    max-height:calc(100vh - 66px);
    padding-inline:18px;
  }
  .homepage footer{
    grid-template-columns:1fr 1fr;
    padding-inline:22px;
  }
  .homepage footer .footer-brand{
    grid-column:1/-1;
    grid-row:auto;
    max-width:none;
    padding-bottom:14px;
  }
  .homepage footer .copyright{
    grid-column:1/-1;
  }
}


/* === PREMIUM HOMEPAGE V1 / UI FRAGMENTS === */

/*
  Real Ellipse UI is intentionally shown as focused fragments rather than
  full admin screenshots. All fragments use existing real product assets.
*/
.os-home [data-parallax-depth]{
  --parallax-y:0px;
  translate:0 var(--parallax-y);
  will-change:translate;
}

/* Product mosaic */
.os-home .os-fragment-stage{
  position:relative;
  width:min(1180px,100%);
  height:690px;
  margin:52px auto 6px;
}
.os-home .os-fragment{
  position:absolute;
  margin:0;
  border:1px solid rgba(8,20,52,.09);
  border-radius:22px;
  overflow:hidden;
  background:rgba(255,255,255,.92);
  box-shadow:0 24px 68px rgba(8,20,52,.12);
  transition:box-shadow .35s ease, border-color .35s ease;
}
.os-home .os-fragment:hover{
  border-color:rgba(8,20,52,.14);
  box-shadow:0 32px 86px rgba(8,20,52,.16);
}
.os-home .os-fragment-viewport{
  position:relative;
  overflow:hidden;
  background:#f4f7fb;
  isolation:isolate;
}
.os-home .os-fragment-viewport::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88);
}
.os-home .os-fragment-viewport img{
  position:absolute;
  display:block;
  max-width:none!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.os-home .os-fragment figcaption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:68px;
  padding:14px 18px 15px;
  border-top:1px solid rgba(8,20,52,.07);
  background:rgba(255,255,255,.96);
}
.os-home .os-fragment figcaption span{
  flex:0 0 auto;
  font-size:10px;
  line-height:1;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--os-magenta);
}
.os-home .os-fragment figcaption b{
  max-width:31ch;
  margin-left:auto;
  text-align:right;
  font-size:13px;
  line-height:1.4;
  font-weight:600;
  color:var(--os-navy);
}
.os-home .os-fragment-kpis{
  left:5%;
  top:0;
  width:64%;
  z-index:3;
}
.os-home .os-fragment-kpis .os-fragment-viewport{height:145px}
.os-home .os-fragment-kpis img{
  width:112%;
  left:-6%;
  top:0;
  transform:translateY(-17.7%);
}
.os-home .os-fragment-tape{
  left:0;
  top:190px;
  width:72%;
  z-index:2;
}
.os-home .os-fragment-tape .os-fragment-viewport{height:420px}
.os-home .os-fragment-tape img{
  width:118%;
  left:-9%;
  top:-6%;
}
.os-home .os-fragment-revenue{
  right:0;
  top:106px;
  width:37%;
  z-index:4;
}
.os-home .os-fragment-revenue .os-fragment-viewport{height:430px}
.os-home .os-fragment-revenue img{
  height:113%;
  width:auto!important;
  left:-88%;
  top:-5%;
}
.os-home .os-fragment-stage::after{
  content:"";
  position:absolute;
  right:5%;
  bottom:18px;
  width:340px;
  height:160px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(88,127,214,.12),transparent 72%);
  filter:blur(12px);
  pointer-events:none;
  z-index:-1;
}

/* Booking — cropped real UI steps instead of three entire windows. */
.os-home .os-booking-fragments{
  align-items:start;
}
.os-home .os-crop-card{
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.os-home .os-crop-card .os-fragment-viewport{
  height:280px;
  border:1px solid rgba(8,20,52,.09);
  border-radius:20px;
  background:#f5f7fb;
  box-shadow:0 22px 62px rgba(8,20,52,.10);
}
.os-home .os-crop-card figcaption{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:4px 12px;
  padding:18px 4px 0;
  color:var(--os-navy);
}
.os-home .os-crop-card figcaption small{
  grid-row:1 / span 2;
  display:grid;
  place-items:center;
  width:31px;
  height:31px;
  border-radius:50%;
  border:1px solid rgba(8,20,52,.12);
  font-size:10px;
  font-weight:700;
  color:var(--os-magenta);
}
.os-home .os-crop-card figcaption b{
  font-size:15px;
  line-height:1.3;
}
.os-home .os-crop-card figcaption span{
  max-width:34ch;
  font-size:12px;
  line-height:1.55;
  color:var(--os-muted);
}
.os-home .os-booking-date .os-fragment-viewport img{
  width:146%;
  left:-23%;
  top:-14%;
}
.os-home .os-booking-room .os-fragment-viewport img{
  width:165%;
  left:-31%;
  top:-19%;
}
.os-home .os-booking-pms .os-fragment-viewport img{
  width:156%;
  left:-31%;
  top:-12%;
}

/* Team — reconstructed micro-widgets from real Team/lock-screen information. */
.os-home .os-team-widgets{
  display:grid;
  grid-template-columns:minmax(280px,420px) minmax(260px,360px);
  gap:16px;
  align-items:stretch;
  justify-content:center;
  width:min(850px,100%);
  margin:38px auto 8px;
}
.os-home .os-team-widget{
  min-height:164px;
  padding:22px 24px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  background:
    radial-gradient(220px 120px at 80% 0%,rgba(255,255,255,.07),transparent 72%),
    #080b12;
  color:#fff;
  box-shadow:0 24px 64px rgba(8,20,52,.16);
}
.os-home .os-team-widget > small{
  display:block;
  margin-bottom:14px;
  font-size:10px;
  font-weight:650;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:rgba(255,255,255,.47);
}
.os-home .os-team-widget > div:not(.os-mini-bars){
  display:flex;
  align-items:baseline;
  gap:9px;
}
.os-home .os-team-widget strong{
  font-size:44px;
  line-height:.95;
  font-weight:500;
  letter-spacing:-.06em;
  color:#fff;
}
.os-home .os-team-widget span{
  font-size:17px;
  font-weight:550;
  color:#fff;
}
.os-home .os-team-widget p{
  margin:9px 0 0;
  font-size:12px;
  line-height:1.55;
  color:rgba(255,255,255,.62);
}
.os-home .os-mini-bars{
  display:flex;
  align-items:flex-end;
  gap:8px;
  width:190px;
  height:32px;
  margin-top:13px;
}
.os-home .os-mini-bars i{
  display:block;
  flex:1;
  height:calc(8px + var(--v) * 24px);
  border-radius:3px 3px 1px 1px;
  background:rgba(255,255,255,.55);
}
.os-home .os-mini-bars i:nth-child(2){background:rgba(255,255,255,.80)}
.os-home .os-mini-bars i:last-child{background:#fff}

/* revPRO case — one real screenshot, two purposeful crops. */
.os-home .os-case-fragments{
  position:relative;
  min-height:500px;
  margin-top:30px;
}
.os-home .os-case-fragments .os-fragment{
  border-radius:18px;
}
.os-home .os-case-fragments .os-fragment figcaption{
  min-height:52px;
  justify-content:flex-start;
  font-size:11px;
  font-weight:650;
  color:var(--os-navy);
}
.os-home .os-rev-summary{
  left:0;
  top:0;
  width:88%;
  z-index:1;
}
.os-home .os-rev-summary .os-fragment-viewport{height:300px}
.os-home .os-rev-summary img{
  width:175%;
  left:-36%;
  top:-20%;
}
.os-home .os-rev-actions{
  right:0;
  bottom:0;
  width:43%;
  z-index:2;
}
.os-home .os-rev-actions .os-fragment-viewport{height:300px}
.os-home .os-rev-actions img{
  height:135%;
  width:auto!important;
  right:-3%;
  left:auto;
  top:-12%;
}

@media (max-width:900px){
  .os-home .os-fragment-stage{
    height:610px;
  }
  .os-home .os-fragment-kpis{left:0;width:72%}
  .os-home .os-fragment-tape{width:78%;top:175px}
  .os-home .os-fragment-revenue{width:41%;top:118px}
  .os-home .os-fragment-revenue .os-fragment-viewport{height:365px}
  .os-home .os-team-widgets{grid-template-columns:1fr 1fr}
}
@media (max-width:700px){
  .os-home [data-parallax-depth]{translate:none!important}
  .os-home .os-fragment-stage{
    display:grid;
    height:auto;
    gap:18px;
    margin-top:34px;
  }
  .os-home .os-fragment-stage .os-fragment{
    position:relative;
    inset:auto;
    width:100%;
  }
  .os-home .os-fragment-kpis .os-fragment-viewport{height:112px}
  .os-home .os-fragment-tape .os-fragment-viewport{height:300px}
  .os-home .os-fragment-revenue .os-fragment-viewport{height:320px}
  .os-home .os-fragment figcaption{
    min-height:0;
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
  }
  .os-home .os-fragment figcaption b{
    margin-left:0;
    text-align:left;
  }
  .os-home .os-booking-fragments{
    display:grid;
    grid-template-columns:1fr;
    gap:32px;
  }
  .os-home .os-crop-card .os-fragment-viewport{height:240px}
  .os-home .os-team-widgets{
    grid-template-columns:1fr;
    width:100%;
  }
  .os-home .os-team-widget{min-height:146px}
  .os-home .os-case-fragments{
    min-height:0;
    display:grid;
    gap:16px;
  }
  .os-home .os-case-fragments .os-fragment{
    position:relative;
    inset:auto;
    width:100%;
  }
  .os-home .os-rev-summary .os-fragment-viewport,
  .os-home .os-rev-actions .os-fragment-viewport{height:270px}
}


/* === PREMIUM HOMEPAGE V1 / SCROLL STORYTELLING === */

/* Scroll motion is intentionally subtle: hierarchy first, motion second. */
.os-home .os-product,
.os-home .os-booking,
.os-home .os-team,
.os-home .os-case{
  --scene-progress:0;
}

.os-home .os-product .os-fragment-kpis{
  rotate:calc((.5 - var(--scene-progress)) * -1.6deg);
}
.os-home .os-product .os-fragment-tape{
  rotate:calc((.5 - var(--scene-progress)) * .8deg);
}
.os-home .os-product .os-fragment-revenue{
  rotate:calc((.5 - var(--scene-progress)) * 1.35deg);
}
.os-home .os-fragment-stage .os-fragment{
  transition:
    box-shadow .35s ease,
    border-color .35s ease,
    rotate .18s linear,
    scale .35s var(--os-ease);
}
.os-home .os-product.is-scene-active .os-fragment-kpis{scale:1.008}
.os-home .os-product.is-scene-active .os-fragment-revenue{scale:1.012}

/* Booking: focus follows the user's reading position rather than animating everything. */
.os-home .os-booking-fragments .os-crop-card{
  opacity:.68;
  filter:saturate(.82);
  transition:opacity .42s var(--os-ease),filter .42s ease,translate .42s var(--os-ease);
}
.os-home .os-booking-fragments .os-crop-card.is-focus{
  opacity:1;
  filter:saturate(1);
  translate:0 -6px;
}
.os-home .os-booking-fragments .os-crop-card.is-focus .os-fragment-viewport{
  border-color:rgba(8,20,52,.14);
  box-shadow:0 30px 76px rgba(8,20,52,.145);
}

/* Team: the full phones stay authentic while the whole device scene breathes slightly. */
.os-home .os-team-phones{
  --team-lift:calc((var(--scene-progress) - .5) * -14px);
  translate:0 var(--team-lift);
  transition:translate .16s linear;
}
.os-home .os-team-widgets{
  --widget-lift:calc((var(--scene-progress) - .5) * 10px);
  translate:0 var(--widget-lift);
  transition:translate .16s linear;
}

/* Case-study revenue fragments resolve into place as the evidence enters view. */
.os-home .os-case-fragments .os-rev-summary{
  rotate:calc((.5 - var(--scene-progress)) * -1deg);
}
.os-home .os-case-fragments .os-rev-actions{
  rotate:calc((.5 - var(--scene-progress)) * 1.5deg);
}

/* Tiny reading-progress accent on signature dark sections. */
.os-home .os-inbox::after,
.os-home .os-mcp::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:calc(var(--scene-progress,0) * 100%);
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),var(--os-magenta));
  opacity:.55;
  pointer-events:none;
}

/* Give focused interactive objects a crisp keyboard state too. */
.os-home .os-segment-tabs button:focus-visible,
.os-home .os-faq summary:focus-visible,
.homepage .nav-parent:focus-visible{
  outline:2px solid var(--os-magenta);
  outline-offset:4px;
}

@media(max-width:700px){
  .os-home .os-product .os-fragment,
  .os-home .os-case-fragments .os-fragment{
    rotate:0deg!important;
    scale:1!important;
  }
  .os-home .os-booking-fragments .os-crop-card{
    opacity:1;
    filter:none;
    translate:none;
  }
  .os-home .os-team-phones,
  .os-home .os-team-widgets{
    translate:none!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .os-home .os-product .os-fragment,
  .os-home .os-case-fragments .os-fragment{
    rotate:0deg!important;
    scale:1!important;
  }
  .os-home .os-booking-fragments .os-crop-card{
    opacity:1!important;
    filter:none!important;
    translate:none!important;
  }
  .os-home .os-team-phones,
  .os-home .os-team-widgets{
    translate:none!important;
  }
}


/* === PREMIUM HOMEPAGE V1 / MOBILE QA + REAL DATA COMPONENTS === */

/* Exact UI facts reconstructed as responsive HTML, sourced from real Ellipse screens. */
.os-home .os-live-kpi-strip{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  width:min(1120px,100%);
  margin:40px auto 0;
}
.os-home .os-live-kpi-strip article{
  position:relative;
  min-height:112px;
  padding:18px 18px 16px;
  overflow:hidden;
  border-radius:18px;
  color:#fff;
  box-shadow:0 18px 42px rgba(8,20,52,.10);
}
.os-home .os-live-kpi-strip article::after{
  content:"";
  position:absolute;
  inset:auto -16% -52% auto;
  width:120px;
  height:120px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
  filter:blur(2px);
}
.os-home .os-live-kpi-strip article:nth-child(1){background:linear-gradient(135deg,#930091,#5540ad)}
.os-home .os-live-kpi-strip article:nth-child(2){background:linear-gradient(135deg,#e0093d,#ff0045)}
.os-home .os-live-kpi-strip article:nth-child(3){background:linear-gradient(135deg,#142b62,#264581)}
.os-home .os-live-kpi-strip article:nth-child(4){background:linear-gradient(135deg,#a90062,#9a245d)}
.os-home .os-live-kpi-strip article:nth-child(5){background:linear-gradient(135deg,#177486,#243d77)}
.os-home .os-live-kpi-strip small{
  display:block;
  min-height:28px;
  font-size:11px;
  line-height:1.25;
  font-weight:650;
  color:rgba(255,255,255,.82);
}
.os-home .os-live-kpi-strip b{
  display:inline-block;
  margin-top:4px;
  font-size:34px;
  line-height:1;
  font-weight:650;
  letter-spacing:-.055em;
  color:#fff;
}
.os-home .os-live-kpi-strip span{
  margin-left:8px;
  font-size:12px;
  color:rgba(255,255,255,.62);
}

/* revPRO: data + action, not a decorative fake chart. */
.os-home .os-revpro-insights{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(280px,.88fr);
  gap:20px;
  width:min(1040px,100%);
  margin:42px 0 8px;
  align-items:stretch;
}
.os-home .os-revpro-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.os-home .os-revpro-metrics article,
.os-home .os-revpro-recommendation{
  border:1px solid rgba(8,20,52,.08);
  border-radius:20px;
  background:rgba(255,255,255,.86);
  box-shadow:0 18px 46px rgba(8,20,52,.07);
}
.os-home .os-revpro-metrics article{
  padding:20px 18px 18px;
}
.os-home .os-revpro-metrics small,
.os-home .os-revpro-recommendation > small{
  display:block;
  margin-bottom:12px;
  font-size:9px;
  line-height:1.3;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#687793;
}
.os-home .os-revpro-metrics b{
  display:block;
  margin-bottom:7px;
  font-size:clamp(25px,2.3vw,36px);
  line-height:1;
  font-weight:600;
  letter-spacing:-.055em;
  color:var(--os-navy);
}
.os-home .os-revpro-metrics span{
  display:block;
  font-size:11px;
  line-height:1.45;
  color:#7b889e;
}
.os-home .os-revpro-recommendation{
  position:relative;
  padding:23px 24px 24px 27px;
  overflow:hidden;
}
.os-home .os-revpro-recommendation::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:var(--os-magenta);
}
.os-home .os-revpro-recommendation h3{
  margin:0 0 12px;
  font-size:18px;
  line-height:1.25;
  letter-spacing:-.025em;
}
.os-home .os-revpro-recommendation p{
  margin:0;
  font-size:12px;
  line-height:1.6;
  color:#6a7890;
}

/* Tablet QA */
@media(max-width:1100px){
  .os-home .os-live-kpi-strip{
    grid-template-columns:repeat(5,minmax(120px,1fr));
    overflow-x:auto;
    padding-bottom:5px;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
  }
  .os-home .os-live-kpi-strip::-webkit-scrollbar{display:none}
  .os-home .os-live-kpi-strip article{scroll-snap-align:start}
  .os-home .os-revpro-insights{
    grid-template-columns:1fr;
  }
}

/* Mobile QA: intentional vertical compositions, not scaled desktop. */
@media(max-width:800px){
  .os-home{
    --os-pad:20px;
    --os-section-y:88px;
  }
  .os-home .os-hero{
    padding-inline:20px;
    gap:28px;
  }
  .os-home .os-hero h1{
    max-width:10ch;
    line-height:.96;
  }
  .os-home .os-hero .os-actions{
    gap:10px;
  }
  .os-home .os-hero .os-actions .button{
    width:auto;
    min-width:0;
  }
  .os-home .os-live-kpi-strip{
    margin-top:28px;
    margin-inline:-20px;
    width:calc(100% + 40px);
    padding:0 20px 5px;
    gap:10px;
  }
  .os-home .os-live-kpi-strip article{
    min-width:148px;
    min-height:104px;
    padding:16px;
  }
  .os-home .os-live-kpi-strip b{font-size:31px}
  .os-home .os-product > h2,
  .os-home .os-team > h2{
    font-size:clamp(42px,11vw,58px)!important;
  }
  .os-home section:not(.os-hero):not(.os-canvas) > h2{
    max-width:100%!important;
  }
  .os-home .os-revpro-metrics{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .os-home .os-revpro-metrics article:last-child{
    grid-column:1/-1;
  }
  .os-home .os-team-phones{
    width:calc(100% + 28px);
    margin-left:-14px;
  }
  .os-home .os-team-widget{
    border-radius:20px;
  }
  .os-home .os-inbox-desk{
    padding:18px 16px 8px;
    border-radius:20px;
  }
  .os-home .os-inbox-bar{
    flex-direction:column;
    align-items:flex-start;
  }
  .os-home .os-inbox-reply{
    margin-left:6%;
  }
  .os-home .os-case-results b{
    font-size:38px;
  }
  .os-home .os-final{
    min-height:470px;
  }
  .os-home .os-final h2{
    font-size:clamp(46px,12vw,64px)!important;
  }
}

/* Narrow-phone QA */
@media(max-width:480px){
  .os-home{
    --os-pad:18px;
    --os-section-y:76px;
  }
  .os-home .os-hero{
    padding-inline:18px;
    padding-top:40px;
    padding-bottom:58px;
  }
  .os-home .os-hero h1{
    font-size:clamp(43px,13.2vw,56px);
    letter-spacing:-.06em;
  }
  .os-home .os-hero .os-lead{
    margin-top:20px;
    line-height:1.55;
  }
  .os-home .os-hero .os-actions{
    width:100%;
    align-items:stretch;
  }
  .os-home .os-hero .os-actions .button{
    width:100%;
    justify-content:center;
  }
  .os-home .os-hero-visual{
    min-height:294px;
  }
  .os-home .os-ui-hero{
    width:100%;
  }
  .os-home .os-phone-hero{
    width:102px;
    right:2%;
    bottom:-26px;
  }
  .os-home .os-live-kpi-strip{
    margin-inline:-18px;
    width:calc(100% + 36px);
    padding-inline:18px;
  }
  .os-home .os-live-kpi-strip article{
    min-width:142px;
  }
  .os-home .os-revpro-metrics{
    grid-template-columns:1fr;
  }
  .os-home .os-revpro-metrics article:last-child{grid-column:auto}
  .os-home .os-revpro-recommendation{
    padding:20px 20px 21px 23px;
  }
  .os-home .os-fragment-tape .os-fragment-viewport{height:260px}
  .os-home .os-fragment-revenue .os-fragment-viewport{height:285px}
  .os-home .os-crop-card .os-fragment-viewport{height:220px}
  .os-home .os-team-phones{
    min-height:335px;
  }
  .os-home .os-team-phones .os-phone{
    width:122px;
    flex-basis:122px;
  }
  .os-home .os-team-phones .os-phone:nth-child(1){transform:translate(32px,24px) rotate(-7deg)}
  .os-home .os-team-phones .os-phone:nth-child(2){transform:translate(13px,8px) rotate(-3deg)}
  .os-home .os-team-phones .os-phone:nth-child(3){transform:translateY(-6px) scale(1.02)}
  .homepage footer{
    grid-template-columns:1fr;
    gap:28px;
  }
  .homepage footer .footer-brand,
  .homepage footer .copyright{
    grid-column:1;
  }
}

/* Performance: skip paint work below the fold where safe. */
@supports(content-visibility:auto){
  .os-home .os-segments,
  .os-home .os-integrations,
  .os-home .os-security,
  .os-home .os-faq,
  .os-home .os-final{
    content-visibility:auto;
    contain-intrinsic-size:900px;
  }
}


.os-home .os-live-kpi-strip,
.os-home .os-revpro-metrics{
  font-variant-numeric:tabular-nums;
}


/* === PREMIUM HOMEPAGE V1 / RESERVATION DETAIL FRAGMENT === */
.os-home .os-reservation-card{
  position:absolute;
  left:53%;
  bottom:0;
  width:min(360px,34%);
  z-index:5;
  padding:19px 20px 18px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:20px;
  background:
    radial-gradient(240px 120px at 100% 0%,rgba(92,123,201,.18),transparent 68%),
    #071633;
  color:#fff;
  box-shadow:0 28px 72px rgba(8,20,52,.24);
}
.os-home .os-reservation-card header{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
  margin-bottom:14px;
  padding:0 0 12px;
  border:0;
  border-bottom:1px solid rgba(255,255,255,.10);
  color:#fff;
}
.os-home .os-reservation-card header small{
  font-size:10px;
  letter-spacing:.08em;
  color:rgba(255,255,255,.48);
}
.os-home .os-reservation-card header b{
  font-size:14px;
  font-weight:600;
  color:#fff;
}
.os-home .os-reservation-card dl{
  margin:0;
}
.os-home .os-reservation-card dl div{
  display:grid;
  grid-template-columns:74px minmax(0,1fr);
  gap:10px;
  padding:7px 0;
  border-bottom:1px solid rgba(255,255,255,.075);
}
.os-home .os-reservation-card dt{
  font-size:9px;
  font-weight:650;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,.43);
}
.os-home .os-reservation-card dd{
  margin:0;
  font-size:11px;
  line-height:1.35;
  color:rgba(255,255,255,.88);
}
.os-home .os-reservation-card dd.is-good{color:#a8e8b9}
.os-home .os-reservation-card footer{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:14px;
  padding:0;
  border:0;
  background:transparent;
}
.os-home .os-reservation-card footer span{
  font-size:9px;
  color:rgba(255,255,255,.46);
}
.os-home .os-reservation-card footer strong{
  font-size:21px;
  line-height:1;
  font-weight:600;
  letter-spacing:-.04em;
  color:#fff;
}

@media(max-width:900px){
  .os-home .os-reservation-card{
    left:auto;
    right:2%;
    width:38%;
  }
}
@media(max-width:700px){
  .os-home .os-reservation-card{
    position:relative;
    inset:auto;
    width:100%;
    order:4;
  }
}


/* === PREMIUM HOMEPAGE V1 / PIXEL CALIBRATION PASS === */

/* Desktop rhythm: 1440–1920 px is the primary art-directed canvas. */
.os-home{
  --os-content:1280px;
  --os-reading:760px;
  --os-tight:620px;
}
.os-home > section:not(.os-hero):not(.os-trust):not(.os-canvas):not(.os-inbox):not(.os-mcp):not(.os-final){
  padding-left:max(var(--os-pad),calc((100vw - var(--os-content))/2));
  padding-right:max(var(--os-pad),calc((100vw - var(--os-content))/2));
}
.os-home section[id]{
  scroll-margin-top:96px;
}
.os-home section > .os-kicker{
  margin-bottom:17px;
}
.os-home section > h2{
  max-width:13ch;
  margin-bottom:18px;
  font-size:clamp(42px,4.25vw,66px);
  line-height:.99;
  font-weight:600;
  letter-spacing:-.052em;
}
.os-home section > .os-lead{
  max-width:var(--os-reading);
  margin-bottom:0;
  color:#63718a;
}
.os-home .os-actions{
  gap:11px;
}
.os-home .os-actions .button{
  letter-spacing:-.01em;
}

/* Hero optical calibration */
.os-home .os-hero{
  width:min(1540px,100%);
  grid-template-columns:minmax(410px,.83fr) minmax(610px,1.17fr);
  padding-left:var(--os-pad);
  padding-right:var(--os-pad);
}
.os-home .os-hero-copy{
  padding-bottom:10px;
}
.os-home .os-hero h1{
  font-size:clamp(64px,5.75vw,88px);
  line-height:.925;
  max-width:10.15ch;
}
.os-home .os-hero .os-lead{
  max-width:555px;
  margin-top:30px;
  font-size:18px;
  line-height:1.62;
}
.os-home .os-hero .os-actions{
  margin-top:31px;
}
.os-home .os-hero-visual{
  height:610px;
}
.os-home .os-ui-hero{
  top:19%;
  right:12%;
}
.os-home .os-ui-layer{
  width:45%;
  top:2%;
}
.os-home .os-phone-hero{
  right:3%;
  bottom:7px;
}

/* Trust sits closer to hero and farther from OS canvas. */
.os-home .os-trust{
  padding-top:28px;
  padding-bottom:34px;
}
.os-home .os-trust-stats{
  margin-top:22px;
  padding-top:20px;
}

/* Hospitality OS */
.os-home .os-canvas-copy h2{
  max-width:12ch;
  margin-inline:auto;
  font-size:clamp(48px,4.8vw,72px);
}
.os-home .os-canvas-copy .os-lead{
  max-width:690px;
}
.os-home .os-eco{
  max-width:1180px;
  margin-top:16px;
}

/* Real product proof */
.os-home .os-product{
  padding-top:132px!important;
  padding-bottom:136px!important;
}
.os-home .os-product > h2{
  max-width:10.8ch!important;
}
.os-home .os-product > .os-lead{
  max-width:680px;
}
.os-home .os-live-kpi-strip{
  margin-top:38px;
}
.os-home .os-fragment-stage{
  margin-top:42px;
}
.os-home .os-callouts{
  margin-top:30px;
}

/* Business value gets a quieter, more editorial rhythm. */
.os-home .os-value{
  grid-template-columns:.8fr repeat(3,1fr);
  align-items:start;
  padding-top:110px!important;
  padding-bottom:110px!important;
}
.os-home .os-value > .os-kicker{
  padding-top:7px;
}
.os-home .os-value .os-statement h2{
  font-size:clamp(34px,3.1vw,50px)!important;
}
.os-home .os-value .os-statement p{
  max-width:25ch;
}

/* Booking flow */
.os-home .os-booking{
  padding-top:128px!important;
  padding-bottom:128px!important;
}
.os-home .os-booking > h2{
  max-width:11.2ch;
}
.os-home .os-booking-flow{
  margin-top:50px;
}
.os-home .os-crop-card .os-fragment-viewport{
  height:294px;
}
.os-home .os-booking .os-actions{
  margin-top:88px;
}

/* Signature dark sections need more breathing room than light sections. */
.os-home .os-inbox,
.os-home .os-mcp{
  padding-left:max(var(--os-pad),calc((100vw - var(--os-content))/2))!important;
  padding-right:max(var(--os-pad),calc((100vw - var(--os-content))/2))!important;
}
.os-home .os-inbox > h2,
.os-home .os-mcp > h2{
  max-width:11.5ch;
}
.os-home .os-inbox > .os-lead,
.os-home .os-mcp > .os-lead{
  max-width:700px;
}

/* Journey */
.os-home .os-journey{
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  column-gap:70px;
}
.os-home .os-journey > h2{
  max-width:11ch;
}
.os-home .os-journey > .os-lead{
  max-width:700px;
}
.os-home .os-journey .os-ui{
  align-self:start;
}

/* Payments */
.os-home .os-pay > h2{
  max-width:10.8ch;
}
.os-home .os-pay-grid{
  margin-top:48px;
}

/* Team */
.os-home .os-team{
  padding-top:126px!important;
  padding-bottom:132px!important;
}
.os-home .os-team > h2{
  max-width:10.5ch!important;
}
.os-home .os-team > .os-lead{
  max-width:650px;
}
.os-home .os-team-widgets{
  margin-top:42px;
}
.os-home .os-team-phones{
  margin-top:36px;
}

/* Reviews */
.os-home .os-reviews > h2{
  max-width:10.6ch;
}
.os-home .os-review-flow{
  gap:16px;
  margin-top:44px;
}
.os-home .os-review-flow li{
  min-height:212px;
}

/* AI */
.os-home .os-ai > h2{
  max-width:11.8ch;
}
.os-home .os-revpro-insights{
  margin-top:46px;
}
.os-home .os-ai-task{
  margin-top:28px;
}

/* Client story */
.os-home .os-case > h2{
  max-width:13.4ch;
}
.os-home .os-case-grid{
  margin-top:50px;
  grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);
}
.os-home .os-case-results{
  gap:16px;
}
.os-home .os-case-results li{
  padding-bottom:18px;
}

/* Segments */
.os-home .os-segments > h2{
  max-width:11ch;
}
.os-home .os-segment-tabs{
  gap:8px;
  margin-top:30px;
  margin-bottom:48px;
}
.os-home .os-segment-panel{
  max-width:860px;
}
.os-home .os-segment-panel h3{
  max-width:13ch;
  font-size:clamp(34px,3.7vw,52px);
  line-height:1.02;
  letter-spacing:-.045em;
}

/* Integration / trust / FAQ ending should feel calmer. */
.os-home .os-integrations > h2,
.os-home .os-security > h2,
.os-home .os-faq > h2{
  max-width:12ch;
}
.os-home .os-int-cats{
  max-width:900px;
}
.os-home .os-security{
  column-gap:76px;
}
.os-home .os-faq{
  max-width:1280px;
  margin-inline:auto;
}
.os-home .os-faq-list{
  max-width:820px;
}
.os-home .os-final h2{
  max-width:10.5ch!important;
}
.os-home .os-final .os-lead{
  max-width:690px;
  margin-inline:auto;
}

/* Large desktop: stop scaling before the page becomes billboard-sized. */
@media(min-width:1600px){
  .os-home .os-hero{
    min-height:840px;
    grid-template-columns:570px minmax(0,820px);
    justify-content:center;
    gap:82px;
  }
  .os-home .os-hero h1{
    font-size:86px;
  }
  .os-home .os-hero-visual{
    height:640px;
  }
  .os-home section > h2{
    font-size:64px;
  }
}

/* Laptop calibration */
@media(min-width:801px) and (max-width:1280px){
  .os-home{
    --os-content:1160px;
  }
  .os-home .os-hero{
    grid-template-columns:minmax(350px,.88fr) minmax(500px,1.12fr);
    gap:34px;
  }
  .os-home .os-hero h1{
    font-size:clamp(56px,6vw,76px);
  }
  .os-home .os-hero-visual{
    height:520px;
  }
  .os-home .os-value{
    grid-template-columns:1fr 1fr;
  }
  .os-home .os-value > .os-kicker{
    grid-column:1/-1;
  }
  .os-home .os-case-grid{
    grid-template-columns:1fr 1fr;
  }
}

/* Mobile optical cleanup */
@media(max-width:800px){
  .os-home section[id]{scroll-margin-top:82px}
  .os-home section > h2{
    margin-bottom:16px;
    line-height:1;
    letter-spacing:-.048em;
  }
  .os-home section > .os-lead{
    line-height:1.58;
  }
  .os-home .os-value{
    grid-template-columns:1fr;
    gap:34px;
    padding-top:82px!important;
    padding-bottom:82px!important;
  }
  .os-home .os-value > .os-kicker{
    padding-top:0;
  }
  .os-home .os-booking,
  .os-home .os-product,
  .os-home .os-team{
    padding-top:92px!important;
    padding-bottom:92px!important;
  }
  .os-home .os-booking .os-actions{
    margin-top:34px;
  }
  .os-home .os-review-flow{
    gap:12px;
  }
  .os-home .os-review-flow li{
    min-height:0;
  }
  .os-home .os-case-grid{
    margin-top:34px;
  }
  .os-home .os-segment-tabs{
    margin-bottom:34px;
  }
}


/* Live browser review — 24 September 2026.
   Resolve accumulated desktop/mobile overrides and the oversized sticky scene. */
.os-home .os-hero {
  min-height: 0;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 4vw, 64px);
  padding-top: clamp(48px, 6vw, 80px);
  padding-bottom: 56px;
}
.os-home .os-hero h1 {
  max-width: 12ch;
  font-size: clamp(52px, 5.1vw, 80px);
  line-height: 1.02;
}
.os-home .os-hero-visual { height: clamp(420px, 39vw, 560px); }
.os-home .os-trust-logos img { opacity: .78; }
.os-home .os-canvas { height: auto; }
.os-home .os-stage {
  position: relative;
  top: auto;
  height: auto;
  overflow: visible;
  padding: 80px var(--os-pad);
  gap: 40px;
}
.os-home .os-canvas-copy h2 {
  max-width: 22ch;
  font-size: clamp(38px, 4.2vw, 60px);
  line-height: 1.08;
}
.os-home .os-eco {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, .9fr) minmax(0, 1fr);
  grid-template-rows: repeat(3, auto);
  align-items: center;
  gap: 24px 64px;
  height: auto;
  min-height: 0;
  margin: 0 auto;
}
.os-home .os-eco .os-node[data-step],
.os-home .os-eco .os-node.is-on {
  position: relative;
  inset: auto;
  width: 100%;
  opacity: 1;
  pointer-events: auto;
  transform: none;
}
.os-home .os-eco .os-core[data-step] {
  grid-column: 2;
  grid-row: 1 / 4;
  min-height: 160px;
  text-align: center;
}
.os-home .os-eco .os-node[data-step="2"] { grid-column: 1; grid-row: 1; }
.os-home .os-eco .os-node[data-step="3"] { grid-column: 3; grid-row: 1; }
.os-home .os-eco .os-node[data-step="4"] { grid-column: 1; grid-row: 2; }
.os-home .os-eco .os-node[data-step="5"] { grid-column: 3; grid-row: 2; }
.os-home .os-eco .os-node[data-step="6"] { grid-column: 1; grid-row: 3; }
.os-home .os-eco .os-node[data-step="7"] { grid-column: 3; grid-row: 3; }
.os-home section:not(.os-hero) > h2 {
  max-width: 23ch !important;
  line-height: 1.08;
}
.os-home .os-inbox > .os-lead,
.os-home .os-mcp > .os-lead { color: #c4cee0; }
@media (max-width: 1000px) {
  .os-home .os-eco { gap: 18px 28px; }
  .os-home .os-eco .os-node { padding: 16px; }
}
@media (max-width: 800px) {
  .os-home .os-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 36px;
    padding-top: 42px;
    padding-bottom: 52px;
  }
  .os-home .os-hero h1 { max-width: 14ch; font-size: clamp(42px, 9vw, 64px); }
  .os-home .os-hero-visual {
    height: auto;
    min-height: clamp(300px, 65vw, 470px);
  }
  .os-home .os-stage { padding: 64px var(--os-pad); gap: 28px; }
  .os-home .os-eco { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .os-home .os-eco .os-node[data-step] { grid-column: auto; grid-row: auto; }
  .os-home .os-eco .os-core[data-step] { grid-column: 1 / -1; min-height: 110px; }
  .os-home .os-canvas-copy h2 { font-size: clamp(34px, 7vw, 48px); }
}
@media (max-width: 480px) {
  .os-home .os-eco { grid-template-columns: minmax(0, 1fr); }
  .os-home .os-hero-visual { min-height: 300px; }
}