/* The approved Manrope label and existing tactile carton, with an open stage. */
.fragile-hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);gap:clamp(2rem,4vw,4rem);align-items:center;padding-block:3rem 4rem}
.fragile-hero h1{font-size:clamp(2.8rem,4.8vw,4.9rem);line-height:1.06;letter-spacing:-.045em;margin:1.1rem 0 1.4rem}
.fragile-hero em,.fragile-story em{font-style:normal;color:var(--blue)}
.fragile-lead{font-size:1.1rem;line-height:1.7;max-width:36rem}
.fragile-download-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.7rem 0 1rem;scroll-margin-top:2rem}
.fragile-download-grid>div{border-top:1px solid #b9bfce;padding-top:1rem;min-width:0}
.fragile-download-grid .eyebrow{font-size:.61rem;letter-spacing:.1em}
.fragile-download-grid h2{font-size:1.5rem;line-height:1.3;letter-spacing:-.035em;margin:.5rem 0 .2rem}
.fragile-download-grid p{font-size:.8rem;margin:0 0 1rem;color:var(--muted)}
.fragile-download-grid .btn{display:flex;align-items:center;justify-content:space-between;padding:1rem;font-size:.82rem;gap:.5rem;white-space:normal;min-height:54px}
.fragile-download-grid small{display:block;margin-top:.6rem;font-size:.7rem;color:var(--muted)}
.fragile-print-line{font-size:.73rem;margin:1rem 0 1.3rem;color:var(--muted)}
.fragile-hero .text-link{font-size:.82rem}
.fragile-hero-preview{margin:0;background:var(--pale);border-radius:1.5rem;padding:1.7rem 1.5rem;display:flex;flex-direction:column;align-items:center;gap:1.3rem}
.fragile-hero-preview .eyebrow{font-size:.61rem;letter-spacing:.12em;text-align:center}
.fragile-hero-preview>a{width:100%;max-width:245px;display:block;box-shadow:6px 7px 0 #12205120}
.fragile-hero-preview img{display:block;width:100%;height:auto}
.fragile-hero-preview figcaption{text-align:center;font-size:.78rem;line-height:1.65}
.fragile-story{position:relative;padding:0;background:#eeeee7;scroll-margin-top:0;overflow-anchor:none}
.fragile-pin{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:clamp(2rem,4vw,4rem);padding-block:4.5rem;min-height:640px}
.fragile-story h2,.fragile-print-guide h2,.fragile-section-head h2,.fragile-faq h2{font-size:clamp(2rem,3.5vw,3.65rem);letter-spacing:-.045em;line-height:1.08;margin:1.2rem 0 1.5rem}
.fragile-story-copy>p{font-size:1rem;line-height:1.8;max-width:30rem}
.fragile-context{color:var(--muted)}
.fragile-cue{font-size:.8rem!important;font-weight:800;color:var(--blue);margin-top:1.8rem}
.fragile-view{min-width:0}
.fragile-toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:40px}
.fragile-toolbar>span{font-size:.7rem;font-weight:800;letter-spacing:.09em}
.fragile-motion-toggle{border:1px solid #a4ab9c;background:transparent;padding:.5rem .9rem;min-height:40px;border-radius:100px;color:var(--ink);font:800 .75rem/1.4 var(--font);cursor:pointer}
.fragile-motion-toggle[aria-pressed=true]{background:var(--ink);color:white}
.fragile-stage{--box-w:340px;--box-h:240px;--box-d:220px;position:relative;isolation:isolate;background:transparent;border:0;aspect-ratio:1.4;width:100%;min-height:345px}
.fragile-perspective{position:absolute;inset:0;perspective:1400px;perspective-origin:50% 42%;display:grid;place-items:center;pointer-events:none}
.fragile-carton{width:var(--box-w);height:var(--box-h);position:relative;transform-style:preserve-3d;transform:rotateX(-16deg) rotateY(-25deg)}
.fragile-shadow{position:absolute;left:22%;right:18%;bottom:8%;height:14%;border-radius:50%;background:#654e3228;filter:blur(19px)}
.fragile-carton .carton-panel{position:absolute;left:0;top:0;width:var(--box-w);height:var(--box-h);backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid #a47543;background-color:#d6a46c;background-image:repeating-linear-gradient(0deg,#00000004 0px,#00000004 1px,transparent 1px,transparent 3px),linear-gradient(130deg,#ffffff1f,#ffffff00 45%,#64451a0d);box-shadow:inset 0 0 0 2px #eac29245;transform-style:preserve-3d}
.fragile-carton .carton-panel-front{transform:translateZ(calc(var(--box-d)/2))}
.fragile-carton .carton-panel-back{transform:rotateY(180deg) translateZ(calc(var(--box-d)/2));background-color:#ca9860}
.fragile-carton .carton-panel-left{width:var(--box-d);left:calc((var(--box-w) - var(--box-d))/2);transform:rotateY(-90deg) translateZ(calc(var(--box-w)/2));background-color:#c3945d}
.fragile-carton .carton-panel-right{width:var(--box-d);left:calc((var(--box-w) - var(--box-d))/2);transform:rotateY(90deg) translateZ(calc(var(--box-w)/2));background-color:#d0a068}
.fragile-carton .carton-panel-top,.fragile-carton .carton-panel-bottom{height:var(--box-d);top:calc((var(--box-h) - var(--box-d))/2)}
.fragile-carton .carton-panel-top{transform:rotateX(90deg) translateZ(calc(var(--box-h)/2));background-color:#e2b783}
.fragile-carton .carton-panel-bottom{transform:rotateX(-90deg) translateZ(calc(var(--box-h)/2));background-color:#b88651}
.fragile-carton .carton-panel-top:before,.fragile-carton .carton-panel-bottom:before{content:'';position:absolute;top:0;bottom:0;left:45%;width:10%;border-inline:1px solid #b8895255;background:linear-gradient(90deg,#c9935866,#f0ce9866 45%,#ac773e80 49%,#ac773e80 51%,#e7bd8380 54%,#c9935866)}
.fragile-carton .carton-panel-front:before,.fragile-carton .carton-panel-back:before{content:'';position:absolute;top:0;height:13%;left:45%;width:10%;background:#c48e5160;border-inline:1px solid #aa713c40;border-bottom:1px solid #aa713c40}
.fragile-carton .carton-panel img{position:absolute;left:calc(50% - var(--label-w) / 2);top:calc(50% - var(--label-w) * .75);width:var(--label-w);height:auto;max-width:none;transform:translateZ(.3px);background:white;box-shadow:0 1px 2px #58371835;border:1px solid #f8f8f8;pointer-events:none}
.fragile-carton .carton-panel-top img{top:32%;transform:translateZ(.3px)}
.fragile-carton .carton-panel-top [data-carton-heavy-label]{left:13%;width:var(--label-w)}
.fragile-carton .carton-panel-top .carton-fba-label{left:56%;width:calc(var(--box-w) * .17425)}
.fragile-carton .carton-panel-top .carton-carrier-label{left:76%;width:var(--label-w)}

.fragile-carton .fragile-carton-label{width:100px;height:150px;left:calc(50% - 50px);top:calc(50% - 75px);transform:translateZ(1px);border:0;box-shadow:0 1px 2px #58371835}
.fragile-progress{height:3px;background:#cdd0c3;margin:1rem 0}
.fragile-progress>span{display:block;width:100%;height:100%;transform:scaleX(.05);transform-origin:left;background:var(--blue)}
.fragile-stages{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem}
.fragile-stages button{display:flex;align-items:center;gap:.5rem;border:1px solid #bdc3b4;background:transparent;color:var(--ink);font:800 .72rem/1.4 var(--font);padding:.65rem;cursor:pointer;min-height:44px;border-radius:6px;white-space:nowrap}
.fragile-stages button>span{color:#5e694e;font-size:.65rem}
.fragile-stages button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}
.fragile-stages button[aria-pressed=true]>span{color:var(--pale)}
.fragile-scene-note{font-size:.65rem;line-height:1.6;color:var(--muted);margin:.8rem 0 0}
.fragile-story.is-scrolling{height:240vh}
.fragile-story.is-scrolling .fragile-pin{height:100vh;min-height:0;position:sticky;top:0;padding-block:2rem}
.fragile-story.is-scrolling .fragile-carton{will-change:transform}
.fragile-print-guide{display:grid;grid-template-columns:.8fr 1.2fr;gap:4rem;padding-block:5rem}
.fragile-print-guide>div>p{font-size:.95rem;color:var(--muted)}
.fragile-print-guide ol{margin:0;padding:0;list-style:none;counter-reset:print}
.fragile-print-guide li{position:relative;padding:0 0 1.6rem 3.2rem;counter-increment:print}
.fragile-print-guide li:before{content:'0' counter(print);position:absolute;top:0;left:0;font-size:.8rem;font-weight:800;border:1px solid #c8ccd6;border-radius:50%;width:34px;height:34px;display:grid;place-items:center}
.fragile-print-guide h3{font-size:1.1rem;margin:0 0 .5rem;line-height:1.5}
.fragile-print-guide p{font-size:.9rem;line-height:1.8;margin:0}
.fragile-print-guide li a{font-size:.8rem;display:inline-block;margin-top:.6rem;color:var(--blue);text-underline-offset:3px}
.fragile-images{padding-block:0 5rem}
.fragile-section-head{max-width:640px}.fragile-section-head p{font-size:.95rem;line-height:1.8}
.fragile-image-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:2rem}
.fragile-image-grid figure{margin:0;border-top:1px solid #ccd0d9;display:flex;align-items:center;gap:2rem;padding-top:1.6rem}
.fragile-image-grid figure>a{display:block;max-width:95px;flex:0 0 95px;box-shadow:3px 4px 0 #12205116}
.fragile-image-grid img{width:100%;height:auto;display:block}
.fragile-image-grid figcaption{display:flex;flex-direction:column;gap:.5rem}
.fragile-image-grid strong{font-size:1.12rem}.fragile-image-grid span{font-size:.75rem;color:var(--muted)}.fragile-image-grid .text-link{font-size:.8rem}
.fragile-faq{padding-bottom:5rem}
.fragile-faq details{border-top:1px solid #ccd0d9;padding:1.15rem 0}
.fragile-faq summary{font-size:1rem;font-weight:800;cursor:pointer}
.fragile-faq details>div{max-width:820px;font-size:.9rem;line-height:1.85;padding-top:1rem}
.fragile-faq a{color:var(--blue);text-underline-offset:3px}
.fragile-stages[hidden],.fragile-motion-toggle[hidden],.fragile-cue[hidden]{display:none}
@media(max-width:1050px){.fragile-hero{grid-template-columns:1.3fr .7fr;gap:1.5rem}.fragile-hero-preview{padding:1.3rem 1rem}.fragile-download-grid .btn{font-size:.71rem;padding:.8rem}.fragile-pin{gap:2rem;grid-template-columns:.8fr 1.2fr}.fragile-stages button{font-size:.65rem;gap:.3rem;padding:.6rem .4rem}}
@media(max-width:800px){.fragile-hero{grid-template-columns:1fr;padding-block:2rem 3rem;gap:2rem}.fragile-hero h1{font-size:clamp(2.7rem,8vw,4rem)}.fragile-hero-preview{max-width:420px;width:100%;justify-self:center;padding:1.6rem}.fragile-hero-preview>a{max-width:220px}.fragile-download-grid .btn{font-size:.8rem}.fragile-pin{grid-template-columns:1fr;gap:1.8rem;padding-block:3rem;min-height:0}.fragile-story-copy>p{max-width:100%;font-size:.9rem}.fragile-story h2{margin:.75rem 0 1rem}.fragile-context{display:none}.fragile-cue{margin:.7rem 0 0}.fragile-view{max-width:540px;width:100%;justify-self:center}.fragile-stage{min-height:310px;aspect-ratio:1.5}.fragile-stages button{font-size:.75rem;padding:.7rem}.fragile-story.is-scrolling .fragile-pin{padding-block:1.5rem}.fragile-print-guide{grid-template-columns:1fr;gap:1.5rem;padding-block:3rem}.fragile-image-grid{gap:1.5rem}.fragile-image-grid figure{gap:1rem}.fragile-image-grid figure>a{max-width:75px;flex-basis:75px}.fragile-images,.fragile-faq{padding-bottom:3rem}}
@media(max-width:480px){.fragile-download-grid{gap:.8rem}.fragile-download-grid h2{font-size:1.25rem}.fragile-download-grid .btn{font-size:.72rem;padding:.8rem .65rem}.fragile-download-grid small{font-size:.65rem}.fragile-stage{--box-w:280px;--box-h:198px;--box-d:181px;min-height:285px}.fragile-carton .fragile-carton-label{width:82px;height:123px;left:calc(50% - 41px);top:calc(50% - 61.5px)}.fragile-stages button{font-size:.63rem;gap:.3rem;padding:.65rem .4rem}.fragile-story h2{font-size:2.3rem}.fragile-image-grid{grid-template-columns:1fr}.fragile-image-grid figure>a{max-width:85px;flex-basis:85px}.fragile-hero .eyebrow{letter-spacing:.09em}}
@media(prefers-reduced-motion:reduce){.fragile-carton{will-change:auto}html:has([data-fragile-story]){scroll-behavior:auto}}
@media print{.fragile-story.is-scrolling{height:auto}.fragile-story.is-scrolling .fragile-pin{position:static;height:auto}.fragile-motion-toggle,.fragile-stages,.fragile-cue{display:none!important}}
