/* Flip teaser under the hero (Claude, 29 Sep 2026) */
.ft{padding:clamp(56px,7vw,104px) 0 clamp(48px,6vw,88px)}
.ft-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;margin-bottom:28px}
.ft-kicker{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--one-red,#982b24)}
.ft-kicker i{width:22px;height:1px;background:currentColor}
.ft-title{margin:0;font-size:clamp(30px,3.6vw,52px);font-weight:500;line-height:1.04;letter-spacing:-.045em;color:#15120f}
.ft-title em{font-style:normal;color:var(--one-muted,#68645b)}
.ft-side{max-width:320px;margin:0;font-size:14px;line-height:1.55;color:var(--one-muted,#68645b)}
.ft-stage{position:relative;border-radius:calc(var(--one-radius,16px) + 6px);padding:10px;background:linear-gradient(180deg,#fffefb,#efece4);border:1px solid var(--one-line,#dedbd3);
  box-shadow:0 1px 0 #fff inset,0 40px 80px -40px rgba(60,35,20,.35),0 18px 36px -24px rgba(60,35,20,.25)}
.ft-frame{position:relative;overflow:hidden;border-radius:var(--one-radius,16px);background:#efe9dd;aspect-ratio:16/9;isolation:isolate}
.ft-frame video{display:block;width:100%;height:100%;object-fit:cover}
.ft-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(21,18,15,.12);z-index:2}
.ft-bar i{display:block;height:100%;width:0;background:var(--one-red,#982b24)}
.ft-ctl{position:absolute;right:16px;bottom:16px;z-index:3;display:flex;gap:8px}
.ft-btn{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px;border:0;border-radius:999px;cursor:pointer;
  background:rgba(21,18,15,.72);color:#f8f7f3;font:500 13px/1 inherit;font-family:inherit;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .2s}
.ft-btn:hover{background:rgba(21,18,15,.9)}
.ft-btn:focus-visible{outline:2px solid var(--one-red,#982b24);outline-offset:3px}
.ft-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ft-btn.ft-icon{width:38px;padding:0;justify-content:center}
.ft-big{position:absolute;inset:0;z-index:2;display:none;place-items:center;border:0;background:rgba(21,18,15,.08);cursor:pointer}
.ft-big span{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--one-red,#982b24);color:#fff;box-shadow:0 18px 40px -12px rgba(152,43,36,.6)}
.ft-big svg{width:28px;height:28px;margin-left:4px;fill:currentColor}
.ft.is-idle .ft-big{display:grid}
.ft-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:18px;font-size:13px;color:var(--one-muted,#68645b)}
.ft-foot a{display:inline-flex;align-items:center;gap:8px;color:#15120f;font-weight:500;text-decoration:none;border-bottom:1px solid var(--one-line,#dedbd3);padding-bottom:2px}
.ft-foot a:hover{border-color:currentColor}
@media (max-width:760px){
  .ft-head{grid-template-columns:1fr}
  .ft-side{max-width:none}
  .ft-stage{padding:6px;border-radius:18px}
  .ft-frame{border-radius:13px}
  .ft-ctl{right:10px;bottom:10px}
  .ft-btn .ft-lbl{display:none}
  .ft-btn{width:36px;height:36px;padding:0;justify-content:center}
  .ft-foot{flex-direction:column;align-items:flex-start}
}

/* 29 Sep: the package, ladder and rules block sits directly under the video */
#flip-teaser{padding-bottom:clamp(28px,3vw,44px)}
#flip-teaser+.flip-home{padding-top:clamp(36px,4vw,56px)}
#flip .flip-home-diagram+.flip-home-topline{margin-top:clamp(40px,5vw,64px)}

/* 29 Sep: video and Flip combined into one section; the video leads it */
.flip-home .ft{padding:0 0 clamp(32px,4vw,48px)}
.flip-home .ft-stage{background:linear-gradient(180deg,#fbf8f2,#f1eadf);border-color:#d8cfc0}
