/* One card layout for the static fallback and the enhanced scroll scene. */
#home-packs-section .home-packs-grid { display:grid; grid-template-columns:1fr; max-width:1100px; gap:24px; }
#home-packs-section .home-pack-card {
  position:relative; inset:auto; grid-column:auto; width:100%; height:auto; min-height:0; margin:0;
  display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);
  grid-template-areas:"heading art" "summary art" "pricing benefits" "cta benefits";
  grid-template-rows:minmax(104px,auto) minmax(64px,auto) minmax(132px,auto) minmax(62px,auto);
  gap:16px 32px; align-items:start; justify-items:stretch; padding:32px;
  border:2px solid var(--line); border-radius:28px; background:#fff; color:var(--ink); text-align:left;
  overflow:visible; box-shadow:0 12px 32px #07111b08;
}
#home-packs-section .pack-team { border-color:var(--orange); }
#home-packs-section .pack-heading { grid-area:heading; min-width:0; }
#home-packs-section .pack-labels { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; min-height:28px; margin-bottom:12px; }
#home-packs-section .pack-eyebrow { margin:0; color:#a74400; font-size:12px; font-weight:800; letter-spacing:.14em; }
#home-packs-section .pack-highlight { position:static; padding:5px 9px; border-radius:999px; background:#fff0df; color:#a74400; font-size:10px; line-height:1.4; letter-spacing:.08em; }
#home-packs-section .home-pack-card h3 { margin:0; color:var(--ink); font:750 clamp(25px,2.3vw,30px)/1.12 var(--font-display); letter-spacing:-.035em; }
#home-packs-section .pack-summary { grid-area:summary; display:grid; gap:6px; }
#home-packs-section .pack-volume { margin:0; color:var(--ink); font-size:16px; font-weight:750; line-height:1.4; }
#home-packs-section .pack-composition { margin:0; color:#55606a; font-size:15px; line-height:1.5; }
#home-packs-section .pack-pricing { grid-area:pricing; display:grid; align-content:start; gap:12px; }
#home-packs-section .pack-price { margin:0; color:var(--ink); text-align:left; font:800 42px/1.1 var(--font-display); letter-spacing:-.04em; }
#home-packs-section .pack-price small { font:700 14px var(--font-body); letter-spacing:0; }
#home-packs-section .pack-commercial-value { margin:0; width:fit-content; justify-items:start; font-size:13px; background:#fff7ed; border-radius:16px; }
#home-packs-section .pack-garments[data-pack-visual] { grid-area:art; width:100%; height:220px; margin:0; gap:16px; align-self:start; }
#home-packs-section .pack-garments:not([data-pack-animation="ready"]) { display:flex; align-items:center; justify-content:center; }
#home-packs-section .pack-garments img { width:44%; height:190px; max-height:100%; object-fit:contain; }
#home-packs-section .pack-garments::before { content:none; }
#home-packs-section .pack-motion-stage { height:190px; min-height:0; overflow:visible; }
#home-packs-section .pack-motion-frame { gap:12px; }
#home-packs-section .pack-motion-frame img { width:44%; height:100%; max-height:100%; transform:none; }
#home-packs-section .pack-garments > .pack-motion-caption { position:static; display:block; margin-top:8px; padding:0; background:transparent; color:#55606a; font-size:11px; line-height:1.4; text-align:center; }
#home-packs-section .pack-benefits { grid-area:benefits; min-width:0; padding-top:4px; }
#home-packs-section .pack-benefits ul { margin:0; padding:0; display:grid; gap:12px; color:#55606a; text-align:left; font-size:15px; line-height:1.5; }
#home-packs-section .pack-benefits li { display:grid; grid-template-columns:20px minmax(0,1fr); gap:10px; align-items:start; }
#home-packs-section .pack-benefits li::before { margin:0; color:#a74400; font-size:18px; line-height:1.25; }
#home-packs-section .pack-team-invitation { margin:16px 0 0; max-width:36ch; color:#55606a; font-size:14px; line-height:1.5; }
#home-packs-section .home-pack-card .pack-choose { grid-area:cta; align-self:end; width:100%; max-width:none; min-height:62px; margin:0; padding:10px 12px 10px 24px; color:var(--ink); background:var(--orange); font-size:15px; text-align:left; box-shadow:0 10px 24px #ff790020; }
#home-packs-section .home-pack-card .pack-choose span { color:var(--ink); background:#ffffff8c; }
#home-packs-section .home-pack-card .pack-choose:hover { color:var(--ink); background:var(--orange); }
#home-packs-section .home-pack-card .pack-choose:focus-visible { outline:3px solid var(--ink); outline-offset:4px; }

/* Grid overlap sizes the scene to its longest card, without clipping content. */
.home-view .pack-story-enabled { overflow:clip; }
.pack-story-scene { padding:8px 0 16px; }
.home-view .pack-story-enabled > .pin-spacer { overflow:visible!important; }
.home-view .pack-story-enabled .section-heading { display:block; position:static; width:100%; max-width:760px; text-align:center; margin:0 auto 16px!important; }
.home-view .pack-story-enabled .section-heading .eyebrow { margin:0 0 8px; }
.home-view .pack-story-enabled .section-heading h2 { font-size:clamp(30px,3vw,44px); margin:0 0 8px; line-height:1; }
.home-view .pack-story-enabled .section-heading .lead { font-size:15px; margin:0 auto; }
#home-packs-section.pack-story-enabled .home-packs-grid { position:relative; gap:0; }
#home-packs-section.pack-story-enabled .home-pack-card { grid-area:1 / 1; }
.pack-story-nav { display:flex; justify-content:center; gap:8px; padding-top:16px; }
.pack-story-nav button { min-height:44px; padding:8px 20px; font:700 14px var(--font-ui); border:1px solid var(--line); border-radius:999px; color:var(--ink); background:var(--paper); }
.pack-story-nav button[aria-current="true"] { color:var(--ink); background:var(--orange); border-color:var(--ink); text-decoration:underline; text-underline-offset:4px; }
.pack-story-nav button:focus-visible { outline:3px solid var(--ink); outline-offset:3px; }

@media (min-width:1100px) and (max-height:899px) {
  #home-packs-section.pack-story-enabled .home-pack-card { padding:24px; gap:12px 28px; grid-template-rows:minmax(100px,auto) minmax(64px,auto) minmax(112px,auto) minmax(58px,auto); }
  #home-packs-section.pack-story-enabled .pack-garments[data-pack-visual] { height:200px; }
  #home-packs-section.pack-story-enabled .pack-motion-stage { height:170px; }
  #home-packs-section.pack-story-enabled .pack-choose { min-height:58px; }
}
@media (max-width:767px) {
  #home-packs-section .home-pack-card { grid-template-columns:minmax(0,1fr); grid-template-areas:"heading" "summary" "pricing" "art" "benefits" "cta"; grid-template-rows:none; gap:20px; padding:24px 20px; border-radius:24px; }
  #home-packs-section .pack-garments[data-pack-visual] { height:210px; }
  #home-packs-section .pack-motion-stage { height:180px; }
  #home-packs-section .pack-price { font-size:38px; }
  #home-packs-section .pack-benefits { padding:0; }
  #home-packs-section .home-pack-card .pack-choose { min-height:58px; padding-left:18px; }
}
@media (prefers-reduced-motion:reduce) {
  #home-packs-section .home-pack-card,#home-packs-section .pack-garments img,#home-packs-section .pack-choose span { animation:none!important; transition:none!important; transform:none!important; }
}