/* Oxygen R9 presentation authority: Welcome_FINAL.html. Product runtime and interactions remain unchanged. */
/* Welcome R6 — responsive geometry correction only; no visual redesign. */
@container welcome (max-width:480px) and (min-height:601px){
  .welcome-top{min-height:27px;}
}
@container welcome (min-width:481px) and (max-width:720px) and (min-height:601px){
  .welcome-top{min-height:30px;}
}
@container welcome (min-width:721px) and (max-height:430px){
  .welcome-page{grid-template-rows:36px minmax(0,1fr) 58px;}
  .welcome-top{min-height:36px;}
  .welcome-main{margin-top:0;padding:0;place-items:center;}
  .welcome-bottom{margin-top:0;}
  .theme-carousel,.theme-track,.theme-slide{height:100%;min-height:0;}
  .theme-slide{display:grid;place-items:center;}
  .theme-card.sky{min-height:0;height:100%;}
  .sky-hero{transform:scale(.94);transform-origin:50% 50%;}
}

/*
  Welcome R9 — cross-page alignment contract
  Standard landscape where Plan fits without page scrolling:
  1) header/brand remains outside the effective content region;
  2) Welcome visual block has the SAME total block height as Plan's
     title + flow-gap + plan-layout block, so vertical centering places
     both primary CTAs on the same bottom baseline;
  3) horizontal page gutters match Plan; the CTA right edge therefore
     matches Plan exactly;
  4) theme artwork widens substantially while retaining a reasonable cap.
  No exact-device coordinates are used.
*/
@container welcome (orientation: landscape) and (min-width:1024px) and (min-height:501px) {
  .welcome-page {
    --welcome-effective-top: calc(var(--goli-brand-top) + var(--goli-brand-mark-size));
    --welcome-plan-top-extra-half: clamp(0px, calc(4cqh - 28.8px), 7px);
    --welcome-plan-upper-gap: clamp(20px, calc(8cqh - 37.6px), 34px);
    --welcome-plan-flow-gap: calc(var(--welcome-plan-upper-gap) + var(--welcome-plan-top-extra-half) + 1px);
    --welcome-plan-action-gap: clamp(25px, calc(35cqh - 227px), 88px);
    --welcome-plan-layout-height: calc(448px + var(--welcome-plan-action-gap) + 58px);
    --welcome-plan-header-height: calc(clamp(34px, 4.1cqw, 56px) * 1.02);
    --welcome-plan-block-height: calc(var(--welcome-plan-header-height) + var(--welcome-plan-flow-gap) + var(--welcome-plan-layout-height));
    --welcome-card-footer-gap: clamp(44px, 6.2cqh, 52px);
    --welcome-card-height: calc(var(--welcome-plan-block-height) - var(--welcome-card-footer-gap) - 58px);

    padding-top: var(--welcome-effective-top);
    padding-right: max(clamp(18px, 4cqw, 52px), env(safe-area-inset-right));
    padding-bottom: 0;
    padding-left: max(clamp(18px, 4cqw, 52px), env(safe-area-inset-left));
    display: grid;
    grid-template-rows: var(--welcome-card-height) 58px;
    row-gap: var(--welcome-card-footer-gap);
    align-content: center;
  }

  .welcome-top {
    position: absolute;
    z-index: 20;
    inset: 0;
    grid-row: auto;
    grid-column: auto;
    min-height: 0;
    height: auto;
    margin: 0;
    pointer-events: none;
  }

  .welcome-main {
    grid-row: 1;
    flex: none;
    width: 100%;
    height: var(--welcome-card-height);
    min-height: 0;
    margin: 0;
    padding: 0;
    display: grid;
    place-items: center;
  }

  .theme-carousel {
    width: min(100%, 1240px);
    height: 100%;
    max-width: 100%;
  }
  .theme-track,
  .theme-slide {
    height: 100%;
    min-height: 0;
  }
  .theme-slide {
    padding-inline: 0;
  }
  .theme-card {
    height: 100%;
    min-height: 0;
  }

  .welcome-bottom {
    grid-row: 2;
    width: 100%;
    height: 58px;
    max-width: none;
    margin: 0;
    align-self: stretch;
  }
}

/* R9 correction: short landscape fits the artwork and CTA into the available height. */
@container welcome (orientation: landscape) and (min-width: 1024px) and (min-height: 501px) and (max-height: 700px) {
  .welcome-page {
    --welcome-card-height: min(
      calc(var(--welcome-plan-block-height) - var(--welcome-card-footer-gap) - 58px),
      calc(100cqh - var(--welcome-effective-top) - var(--welcome-card-footer-gap) - 58px - 18px)
    );
  }
}