/* DarkFlash: scoped graphite/orange editorial system. Store fonts, no new requests. */
.df-story{--df-ink:#15171a;--df-paper:#f5f4f0;--df-accent:#ff9f57;--df-muted:#bac0c6;--df-line:#ffffff24;container-type:inline-size;isolation:isolate;max-width:1160px;margin:0 auto;background:#000;color:var(--df-paper);border-radius:24px;overflow:hidden;font-family:'Albert Sans',Arial,sans-serif;font-size:16px;line-height:1.65;text-align:left}
.df-story *{box-sizing:border-box;min-width:0}
.df-story :is(h2,h3,h4,p,figure){margin:0}
.df-story :is(h2,h3,h4){font-family:Urbanist,'Albert Sans',Arial,sans-serif;font-style:normal;font-weight:700;text-transform:none;color:inherit;letter-spacing:-.035em;text-wrap:balance}
.df-story h2{font-size:clamp(34px,5.7cqw,65px);line-height:1.04}
.df-story h3{font-size:clamp(30px,4.6cqw,48px);line-height:1.1}
.df-story h4{font-size:clamp(25px,3.4cqw,36px);line-height:1.15}
.df-story p{font-size:16px;line-height:1.7;color:var(--df-muted);text-wrap:pretty}
.df-story a{color:inherit;text-decoration:none}
.df-story button{font-family:inherit;cursor:pointer}
.df-story :is(a,button,summary):focus-visible{outline:3px solid var(--df-accent);outline-offset:4px}
.df-story img{display:block;width:100%;height:auto;max-width:100%;border:0;margin:0;border-radius:0}
.df-story .df-kicker{font-size:11px;line-height:1.5;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--df-accent)}
.df-story .df-hero{background:#f7f7f5;color:var(--df-ink);padding:44px 40px 30px}
.df-story .df-hero-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:26px;border-bottom:1px solid #15171a1b}
.df-story .df-hero-top .df-kicker{color:#905020}
.df-story .df-variant{font-size:12px;line-height:1.5;color:#62666b;text-align:right}
.df-story .df-hero-layout{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:16px;padding:36px 0 22px}
.df-story .df-hero h2{margin:12px 0 22px}
.df-story .df-hero h2 span{color:#a44916}
.df-story .df-model{font-family:Urbanist,'Albert Sans',Arial,sans-serif;font-size:17px;font-weight:700;line-height:1.3;color:#17191c}
.df-story .df-hero .df-intro{max-width:44ch;color:#595f64;font-size:16px;line-height:1.7}
.df-story .df-cutout{mix-blend-mode:multiply;align-self:center}
.df-story .df-cutout img{aspect-ratio:1;max-height:470px;object-fit:contain}
.df-story .df-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-top:27px;border-top:1px solid #15171a1b;gap:20px}
.df-story .df-metrics>div+div{padding-left:20px;border-left:1px solid #15171a1b}
.df-story .df-metrics strong{display:block;font-family:Urbanist,'Albert Sans',sans-serif;font-size:clamp(23px,3.5cqw,37px);line-height:1.12;font-weight:700;letter-spacing:-.03em;overflow-wrap:break-word}
.df-story .df-metrics span{display:block;font-size:12px;line-height:1.45;color:#60656a;margin-top:8px}
.df-story .df-chapter{padding:52px 40px}
.df-story .df-feature-chapter+.df-feature-chapter{border-top:1px solid var(--df-line)}
.df-story .df-feature-chapter[data-df-section="2"] .df-photo{order:2}
.df-story .df-heading{max-width:650px;margin:0 auto 30px;text-align:center}
.df-story .df-heading h3{margin-top:14px}
.df-story .df-tabs{position:relative;display:flex;align-items:center;width:max-content;max-width:100%;margin:0 auto 32px;padding:5px;gap:2px;border:1px solid var(--df-line);border-radius:100px;background:#ffffff07;overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.df-story .df-tabs::-webkit-scrollbar{display:none}
.df-story [hidden]{display:none!important}
.df-story .df-tabs button{position:relative;z-index:1;flex:0 0 auto;min-height:44px;padding:11px 20px;border:0;border-radius:100px;background:transparent;box-shadow:none;color:#c3c6c9;font-size:14px;line-height:1.35;font-weight:600;letter-spacing:0;text-transform:none;transition:color .25s}
.df-story .df-tabs button.is-active{background:var(--df-accent);color:#20160e}
.df-story .df-tabs.has-indicator button{background:transparent}
.df-story .bp-tab-indicator{position:absolute;inset:0 auto auto 0;border-radius:100px;background:var(--df-accent);pointer-events:none;transition:transform 440ms cubic-bezier(.22,1,.36,1),width 440ms cubic-bezier(.22,1,.36,1),height 440ms cubic-bezier(.22,1,.36,1)}
.df-story .df-stage{position:relative;touch-action:pan-y}
.df-story .df-stage.is-switching{overflow:hidden}
.df-story .df-panel{display:grid;grid-template-columns:1.08fr 1fr;gap:30px;align-items:center;padding:8px 0 10px}
.df-story .df-panel.is-leaving{position:absolute;inset:0 0 auto;pointer-events:none}
.df-story .df-panel:not([hidden])+.df-panel:not([hidden]){margin-top:34px}
.df-story .is-enhanced .df-panel{margin-top:0!important}
.df-story .df-panel-copy h4{margin:14px 0 20px}
.df-story .df-panel-copy>p:last-child{max-width:42ch}
.df-story .df-photo{overflow:hidden;border-radius:16px;background:#000}
.df-story .df-photo a{display:block}
.df-story .df-photo img{object-fit:contain;max-height:570px}
.df-story .df-photo.df-product-photo img{aspect-ratio:1;object-fit:contain}
.df-story .df-photo figcaption{padding:12px 15px;background:#25282d;color:#c6c9cc;font-size:13px;line-height:1.6}
.df-story .df-controls{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:28px}
/* wpautop may wrap the second arrow and counter in a paragraph on the live PDP. */
.df-story .df-controls>p{display:contents}
.df-story .df-controls>p:empty{display:none}
.df-story .df-controls>.df-arrow,.df-story .df-controls>p>.df-arrow{flex:0 0 44px}
.df-story .df-arrow{display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:1px solid #ffffff35;border-radius:50%;background:transparent;box-shadow:none;color:#f5f4f0}
.df-story .df-arrow:hover{background:#ffffff12}
.df-story .df-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2}
.df-story .df-dots{display:flex;gap:0}
.df-story .df-dots button{display:grid;place-items:center;width:32px;height:44px;min-height:44px;padding:0;border:0;box-shadow:none;background:transparent;border-radius:7px}
.df-story .df-dots button:before{content:'';width:6px;height:6px;border-radius:20px;background:#ffffff65;transition:width .3s,background .3s}
.df-story .df-dots button[aria-current=true]:before{width:20px;background:var(--df-accent)}
.df-story .df-counter{font-size:12px;line-height:1.5;color:var(--df-muted);font-variant-numeric:tabular-nums;min-width:36px}
.df-story .df-build{background:#eae9e5;color:var(--df-ink);display:grid;grid-template-columns:1fr 1fr;gap:32px}
.df-story .df-build .df-kicker{color:#905020}
.df-story .df-build h4{font-size:26px;margin:15px 0}
.df-story .df-build p{color:#545b60}
.df-story .df-info{padding:28px 40px 38px}
.df-story details{border:0;border-top:1px solid var(--df-line);padding:0;margin:0}
.df-story summary{display:flex;justify-content:space-between;align-items:center;gap:16px;list-style:none;cursor:pointer;padding:23px 0;color:#f5f4f0;font-size:17px;line-height:1.4;font-weight:600}
.df-story summary::-webkit-details-marker{display:none}
.df-story summary:after{content:'+';font-size:25px;font-weight:400;line-height:1;color:var(--df-accent)}
.df-story details[open]>summary:after{content:'-'}
.df-story .df-disclosure{padding-bottom:25px}
.df-story table{width:100%;table-layout:fixed;border-collapse:collapse;border:0;margin:0;font-size:15px}
.df-story :is(th,td){padding:13px 0;border:0;border-bottom:1px solid #ffffff18;vertical-align:top;line-height:1.55;overflow-wrap:anywhere;text-align:left}
.df-story th{width:43%;color:var(--df-muted);font-weight:400}
.df-story td{padding-left:16px;color:var(--df-paper)}
.df-story .df-more-grid{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:18px}
.df-story .df-more-grid .df-photo img{max-height:none}
.df-story .df-notice{padding:20px 22px;border:1px solid #ff9f573d;border-radius:14px;background:#ff9f5708;margin:4px 0 27px}
.df-story .df-notice p{font-size:13px;line-height:1.65;color:#cdd0d3}
.df-story .df-notice p+p{margin-top:12px}
.df-story .df-notice .df-kicker{margin-bottom:9px;color:var(--df-accent);font-size:11px}
.df-story .df-footnote{font-size:12px;line-height:1.6;color:#b4b9bf;margin-top:24px}
@container(max-width:650px){
 .df-story .df-hero{padding:26px 22px}
 .df-story .df-hero-top{gap:12px;padding-bottom:20px}
 .df-story .df-hero-top .df-kicker{font-size:10px;max-width:22ch}
 .df-story .df-variant{font-size:11px;max-width:19ch}
 .df-story .df-hero-layout{grid-template-columns:1fr;gap:12px;padding:26px 0 18px}
 .df-story .df-model{font-size:15px}
 .df-story .df-hero h2{font-size:clamp(35px,9cqw,52px);margin:14px 0 20px;max-width:15ch}
 .df-story .df-hero .df-intro{font-size:16px;max-width:42ch}
 .df-story .df-cutout{max-width:350px;width:100%;margin:auto}
 .df-story .df-cutout img{max-height:320px}
 .df-story .df-metrics{gap:10px;padding-top:22px}
 .df-story .df-metrics>div+div{padding-left:10px}
 .df-story .df-metrics strong{font-size:clamp(19px,5.5cqw,27px)}
 .df-story .df-metrics span{font-size:11px}
 .df-story .df-chapter{padding:38px 22px}
 .df-story .df-heading{margin-bottom:24px}
 .df-story .df-tabs{margin-bottom:24px;max-width:100%}
 .df-story .df-tabs button{font-size:13px;padding:11px 9px}
 .df-story .df-tabs[data-count="4"] button{font-size:12px;padding-inline:8px}
 .df-story .df-panel{grid-template-columns:1fr;gap:25px}
 .df-story .df-panel-copy{order:-1}
 .df-story .df-panel-copy h4{font-size:28px;margin:12px 0 16px}
 .df-story .df-panel-copy>p:last-child{max-width:48ch}
 .df-story .df-photo{max-width:480px;width:100%;margin:auto}
 .df-story .df-photo img{max-height:600px}
 .df-story .df-controls{gap:10px;margin-top:20px}
 .df-story .df-build{grid-template-columns:1fr;gap:30px}
 .df-story .df-build>div+div{padding-top:26px;border-top:1px solid #15171a25}
 .df-story .df-info{padding:25px 22px 32px}
 .df-story .df-notice{padding:18px}
 .df-story .df-more-grid{grid-template-columns:1fr}
 .df-story th{width:42%}
 .df-story td{padding-left:12px}
}
/* The live PDP adds an inner gutter: adapt to the component, not just the viewport. */
@container(max-width:340px){
 .df-story .df-controls{gap:6px}
 .df-story .df-controls .df-counter{display:none}
 .df-story .df-tabs:not([data-count="2"]){display:grid;grid-template-columns:repeat(3,auto);width:100%;border-radius:20px;overflow:visible}
 .df-story .df-tabs[data-count="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
 .df-story .df-tabs button,.df-story .df-tabs[data-count="4"] button{padding:10px 4px;font-size:12px;white-space:normal;line-height:1.25;min-height:44px;height:100%}
 .df-story .df-tabs[data-count="2"] button{padding:11px 15px;font-size:14px;white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){.df-story *,.df-story *:before{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
