/* Full-width film; the homepage hero supplies its responsive height. */
.brand-hero{grid-template-columns:minmax(0,1fr);background:transparent}
.brand-hero .hero-image{grid-column:1/-1;width:100%;min-width:0}
.brand-hero video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

/* Figma1185:2: percentage positions retain the deliberately scattered composition. */
.brand-story{background:var(--color-warm)}
.brand-story-stage{position:relative;isolation:isolate}
.brand-story-collage{position:relative;height:calc(100svh - var(--header));min-height:420px;overflow:hidden}
.brand-orbit{position:absolute;margin:0;overflow:hidden}
.brand-orbit img{width:100%;height:100%;object-fit:cover}
.brand-orbit-one{left:20.36%;top:11.85%;width:11.41%;height:26.48%;opacity:.56}
.brand-orbit-two{left:70.16%;top:13.66%;width:16.4%;height:27.57%}
.brand-orbit-three{left:17.14%;top:60.82%;width:8.17%;height:25.64%}
.brand-orbit-three img{position:absolute;max-width:none;width:142.23%;height:141.21%;left:-6.5%;top:-30.01%}
.brand-orbit-four{left:70.16%;top:64.21%;width:11.87%;height:25.51%}
.brand-story-title{position:absolute;inset:0 16px auto;top:calc((100svh - var(--header))/2);transform:translateY(-50%);text-align:center;font:500 clamp(26px,2.70833vw,52px)/1.23 var(--font-heading);letter-spacing:-.02em;color:#60404d}
.brand-story-reveal{position:relative;overflow:hidden;isolation:isolate;color:var(--color-inverse)}
.brand-story-background,.brand-story-shade{position:absolute;inset:0;width:100%;height:100%}
.brand-story-background{object-fit:cover;object-position:50% 50%}
.brand-story-shade{background:rgb(18 20 17 / 38%)}
.brand-story-copy-window{position:relative;display:grid;gap:64px;padding:80px var(--gutter)}
.brand-story-copy{text-align:center;max-width:640px;margin:auto}
.brand-story-copy h3{font:500 var(--type-home-section)/1.2 var(--font-heading);color:var(--color-inverse)}
.brand-story-copy p{font:400 16px/1.6 var(--font-body);max-width:480px;margin:20px auto 0;color:var(--color-inverse)}

.brand-story.is-motion{height:calc(100svh - var(--header) + 600svh)}
.is-motion .brand-story-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header));overflow:hidden}
.is-motion .brand-story-collage{position:absolute;inset:0;height:100%;min-height:0}
.is-motion .brand-story-title{top:50%;z-index:2;will-change:transform,opacity}
.is-motion .brand-orbit{will-change:transform,opacity}
.is-motion .brand-story-reveal{position:absolute;inset:0;z-index:3;opacity:0;clip-path:inset(50% 50% 50% 50% round 50%);will-change:clip-path}
.is-motion .brand-story-copy-window{position:absolute;inset:0;padding:0;display:block}
.is-motion .brand-story-copy{position:absolute;inset:0;width:min(640px,40vw);height:max-content;opacity:0;visibility:hidden;will-change:transform,opacity}
@media(max-width:760px){
  .brand-orbit-one{left:10%;top:14%;width:25%;height:20%}
  .brand-orbit-two{left:64%;top:10%;width:28%;height:23%}
  .brand-orbit-three{left:8%;top:65%;width:21%;height:23%}
  .brand-orbit-four{left:65%;top:68%;width:27%;height:21%}
  .brand-story-title{inset-inline:20px;font-size:clamp(26px,7vw,32px);max-width:480px;margin-inline:auto}
  .brand-story.is-motion{height:calc(100svh - var(--header) + 420svh)}
  .brand-story-copy-window{padding:48px 24px;gap:40px}
  .brand-story-copy h3{font-size:26px}
  .brand-story-copy p{font-size:14px;line-height:1.6;margin-top:16px;max-width:300px}
  .is-motion .brand-story-copy{width:calc(100% - 80px);max-width:420px}
}

/* Product Features: fixed square photo and clipped text tracks share one timeline. */
.brand-features{background:var(--color-surface)}
.brand-feature-stage{padding:clamp(24px,3.4375vw,66px);display:grid;align-items:center;background:var(--color-surface)}
.brand-feature-layout{display:grid;grid-template-columns:min(49%,calc(100svh - var(--header) - 132px),748px) minmax(0,1fr);gap:clamp(32px,4.167vw,80px);align-items:center;width:100%;max-width:1520px;margin:auto}
.brand-feature-slide{margin:0}
.brand-feature-slide img{width:100%;height:100%;object-fit:cover}
.brand-feature-image-window{min-width:0}
.brand-feature-image-window .brand-feature-slide{aspect-ratio:1}
.brand-feature-label{display:inline-block;padding:9px 16px;border-radius:var(--radius-pill);background:var(--color-warm);font:400 16px/1.2 var(--font-body);color:#4b4b4b}
.brand-feature-copy{min-width:0}
.brand-feature-text-window{margin-top:16px}
.brand-feature-text-window .brand-feature-slide{padding-block:16px}
.brand-feature-text-window p{font:400 clamp(24px,1.667vw,32px)/1.45 var(--font-heading);color:var(--color-ink)}
.brand-feature-progress{height:var(--rail-height);margin-top:36px;background:#eaeaea;overflow:hidden}
.brand-feature-progress span{display:block;height:100%;background:var(--color-gold);transform-origin:left;transform:scaleX(.333333)}
.features-pinned .brand-feature-stage{height:calc(100svh - var(--header));overflow:hidden}
.features-pinned .brand-feature-image-window{aspect-ratio:1;overflow:hidden}
.features-pinned .brand-feature-text-window{height:clamp(190px,15vw,260px);overflow:hidden}
.features-pinned .brand-feature-track{display:flex;flex-direction:column;height:100%;will-change:transform}
.features-pinned .brand-feature-slide{flex:0 0 100%;min-height:0;aspect-ratio:auto}
.features-pinned .brand-feature-text-window .brand-feature-slide{display:flex;align-items:flex-start;padding:0}

/* Four review cards on wide screens; native touch browsing with seamless auto motion. */
.brand-reviews{padding-inline:var(--gutter);overflow:hidden;background:var(--color-surface)}
.brand-reviews .section-heading h2{font-size:var(--type-home-section);line-height:1.25}
.brand-reviews .section-heading .supporting{max-width:630px;margin:10px auto 0}
.brand-review-track{display:flex;gap:24px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.brand-review-track::-webkit-scrollbar{display:none}
.brand-review-card{display:flex;flex-direction:column;gap:20px;flex:0 0 calc((100% - 72px)/4);min-width:0;min-height:388px;padding:30px;background:#f6f6f6;transition:background-color 180ms ease}
@media(hover:hover){.brand-review-card:hover{background:#f8f0df}}
.brand-review-stars{width:84px;height:16px;flex-shrink:0}
.brand-review-card blockquote{flex:1;margin:0;font:400 clamp(18px,1.25vw,24px)/1.5 var(--font-body);color:var(--color-ink)}
.brand-review-buyer{display:flex;gap:12px;align-items:center}
.brand-review-buyer>img{width:48px;height:48px;flex-shrink:0;border-radius:50%}
.brand-review-buyer p{font:400 12px/1.4 var(--font-body);letter-spacing:.06em;text-transform:uppercase;color:var(--color-muted)}
.brand-review-buyer span{display:block;font:400 14px/1.4 var(--font-body);margin-top:5px;color:var(--color-muted)}
.brand-review-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px}
.brand-review-footer>p{font:400 12px/1.5 var(--font-body);color:var(--color-muted)}
@media(max-width:1100px) and (min-width:761px){.brand-review-card{flex-basis:calc((100% - 24px)/2)}}
@media(max-width:760px){
  .brand-feature-stage{padding:24px 16px}
  .brand-feature-layout{grid-template-columns:1fr;gap:20px}
  .brand-feature-copy{display:flex;flex-direction:column;min-height:0}
  .brand-feature-label{padding:8px 14px;font-size:14px;align-self:flex-start}
  .brand-feature-text-window{margin-top:14px}
  .brand-feature-text-window p{font-size:18px;line-height:1.45}
  .brand-feature-progress{margin-top:18px}
  .features-pinned .brand-feature-layout{height:100%;grid-template-rows:minmax(0,1fr) auto}
  .features-pinned .brand-feature-image-window{width:min(100%,calc(100svh - var(--header) - 300px));height:auto;aspect-ratio:1;justify-self:center;align-self:center}
  .features-pinned .brand-feature-text-window{height:142px}
  .brand-review-track{gap:14px}
  .brand-review-card{flex-basis:86%;min-height:340px;padding:24px;gap:20px}
  .brand-review-card blockquote{font-size:18px}
  .brand-review-footer{align-items:flex-start}
}