.product-story{position:relative;overflow:hidden;padding:42px 0 100px;background:#111c24}
.story-topline{display:flex;justify-content:space-between;gap:24px;align-items:center;margin-bottom:44px;font-size:10px;font-weight:500;letter-spacing:.12em;color:#aab8cb}
.story-topline>span:last-child{color:#75899f}
.product-story .intro-grid{grid-template-columns:1.2fr 1fr;align-items:center;gap:80px;margin-bottom:8px}
.product-story .intro-grid h2{font-size:clamp(24px,2.2vw,34px);line-height:1.25}
.product-story .intro-grid .lead{font-size:clamp(14px,1.2vw,17px);line-height:1.85;max-width:49ch}
.product-editorial{display:grid;grid-template-columns:1.42fr 1fr;align-items:center;gap:20px;min-height:590px}
.story-visual{position:relative;margin:0 -40px 0 -70px;align-self:stretch;display:flex;align-items:center;min-width:0}
.story-visual img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent),linear-gradient(180deg,transparent,black 12%,black 86%,transparent);mask-composite:intersect;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.story-visual:hover img{transform:scale(1.025)}
.story-visual figcaption{position:absolute;bottom:18px;left:70px;display:flex;align-items:center;gap:14px;font-size:8px;font-weight:500;letter-spacing:.1em;color:#aab8cb}
.story-caption-line{width:32px;height:1px;background:#e2552c}
.story-notes{display:flex;flex-direction:column;gap:40px;position:relative;padding:35px 0}
.story-note{position:relative;display:grid;grid-template-columns:33px 1fr;gap:18px;max-width:410px;padding:0}
.story-note:nth-child(2){margin-left:36px}.story-note:nth-child(3){margin-left:10px}
.story-note-index{font-size:10px;font-weight:500;line-height:27px;color:#e2552c;position:relative}
.story-note-index::after{content:'';display:block;width:19px;height:1px;background:#e2552c88;margin-top:10px}
.story-note h3{font-size:clamp(17px,1.4vw,21px);font-weight:500;line-height:1.4;margin:0 0 12px;letter-spacing:-.02em}
.story-note p{font-size:13px;color:#b9c6d5;line-height:1.85;max-width:39ch}
.story-color-spectrum{display:flex;gap:5px;margin-top:18px}.story-color-spectrum i{display:block;width:25px;height:3px;background:#e2552c}.story-color-spectrum i:nth-child(2){background:#82aadd}.story-color-spectrum i:nth-child(3){background:#19275d}.story-color-spectrum i:nth-child(4){background:#ffffff88}
.story-note::before{content:'';position:absolute;left:-76px;top:13px;width:58px;height:1px;background:linear-gradient(90deg,#82aadd00,#82aadd66)}
.story-note::after{content:'';position:absolute;left:-81px;top:10px;width:5px;height:5px;border:1px solid #82aadd88;border-radius:50%;box-shadow:0 0 0 5px #82aadd08}
.story-note:nth-child(2){margin-left:55px}.story-note:nth-child(3){margin-left:-15px}
@media(min-width:1600px){.product-editorial{min-height:660px}.story-notes{gap:55px}.story-visual{margin-left:-110px}}
@media(max-width:1000px){.product-story .intro-grid{gap:36px}.product-editorial{grid-template-columns:1.2fr 1fr;gap:0;min-height:540px}.story-visual{margin-left:-45px;margin-right:-15px}.story-visual figcaption{left:45px;max-width:30ch;bottom:45px;font-size:7px}.story-notes{gap:30px}.story-note{gap:10px;grid-template-columns:24px 1fr}.story-note:nth-child(2),.story-note:nth-child(3){margin-left:0}.story-note h3{font-size:17px}.story-note p{font-size:12px}}
@media(max-width:640px){.product-story{padding:32px 0 55px}.story-topline{font-size:8px;margin-bottom:30px}.product-story .intro-grid{grid-template-columns:1fr;gap:22px;margin:0}.product-story .intro-grid h2{font-size:clamp(24px,6.4vw,30px)}.product-story .intro-grid .lead{font-size:13px;line-height:1.85}.product-editorial{display:block;min-height:0}.story-visual{margin:15px -25px 0;min-height:290px;padding-bottom:30px}.story-visual img{width:100%}.story-visual figcaption{left:25px;bottom:8px;font-size:7px;max-width:none}.story-notes{gap:30px;padding:28px 0 0}.story-note{max-width:none;grid-template-columns:28px 1fr;gap:14px}.story-note:nth-child(2){margin-left:18px}.story-note:nth-child(3){margin-left:0}.story-note h3{font-size:18px;margin-bottom:9px}.story-note p{font-size:13px;max-width:none}.story-color-spectrum{margin-top:14px}}
@media(prefers-reduced-motion:reduce){.story-visual img{transition:none}.story-visual:hover img{transform:none}}
@media(max-width:1000px){.story-note::before,.story-note::after{display:none}.story-note:nth-child(2),.story-note:nth-child(3){margin-left:0}}
@media(max-width:640px){.story-note:nth-child(2){margin-left:18px}.story-note:nth-child(3){margin-left:0}}

.story-visual figcaption{font-size:10px;letter-spacing:.06em}@media(max-width:640px){.story-visual figcaption{font-size:9px}}
