/* Native story panels share the existing Lusion motion track. */
.project-item-main{padding-top:56.25%}
.drg-story-motion-item{visibility:visible!important;color:#f8fafc;white-space:normal;pointer-events:auto}
.drg-story-panel{position:relative;width:100%;height:100%;margin:0;color:#f8fafc;font:400 16px/1.5 Aeonik,Arial,sans-serif}
.drg-story-panel button{font:inherit;color:inherit;cursor:pointer}
.drg-story-photo-button,.drg-story-hero-button{position:relative;display:block;width:100%;height:100%;padding:0;overflow:hidden;border-radius:20px;background:#091b2c;border:1px solid #8daec128}
.drg-story-panel img{display:block;width:100%;height:100%;object-fit:contain;background:#091b2c}
.drg-story-caption{position:absolute;left:0;right:0;top:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:28px;margin:14px 0 0;font-size:13px;line-height:1.4;color:#c3d3e1;white-space:normal}
.drg-story-caption>span:last-child{flex-shrink:0;letter-spacing:.06em}
.drg-story-caption>span:first-child{flex-shrink:1;max-width:85%;letter-spacing:0}
.drg-story-social-caption>span{display:flex;flex-direction:column;gap:4px}
.drg-story-social-caption strong{font-weight:500;color:#edf6ff;font-size:15px}
.drg-story-social-caption a{flex-shrink:0;color:#8fc4f4;text-decoration:underline;text-underline-offset:4px}
.drg-story-comparison-caption{align-items:center}
.drg-story-comparison-caption .drg-story-originals-button{flex-shrink:0;margin-top:0;font-size:12px!important;padding:9px 13px}
.drg-story-play{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:82px;height:82px;transform:translate(-50%,-50%);border:1px solid #ffffff5c;border-radius:50%;background:#102a43a8;backdrop-filter:blur(12px);transition:background .25s,scale .3s}
.drg-story-play svg{width:27px;height:27px;margin-left:3px}
.drg-story-hero-button:hover .drg-story-play{background:#609edb;scale:1.08}
.drg-story-hero-label{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:70px 30px 25px;font-size:16px;background:linear-gradient(transparent,#071b2ee8);text-align:left}
.drg-story-hero-label>span{font-size:13px;letter-spacing:.02em}
.drg-story-expand{position:absolute;right:18px;top:18px;display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff59;border-radius:50%;background:#102a4373;font-size:21px;transition:background .2s,transform .2s}
.drg-story-editorial-label{position:absolute;left:18px;top:18px;max-width:calc(100% - 88px);padding:7px 10px;border:1px solid #ffffff26;border-radius:16px;background:#102a43d9;color:#edf6ff;font-size:11px;line-height:1.3;text-align:left}
.drg-story-photo-button:hover .drg-story-expand{background:#609edb;transform:translate(2px,-2px)}
.drg-story-panel button:focus-visible,.drg-story-panel a:focus-visible,.drg-story-panel summary:focus-visible{outline:3px solid #609edb;outline-offset:5px}
.drg-story-narrative{border-left:1px solid #91b5d24d;padding-left:36px}
.drg-story-copy{height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#609edb #102a43;padding:0 18px 8px 0;user-select:text;-webkit-user-select:text}
.drg-story-kicker{font-size:11px;letter-spacing:.15em;color:#79b3e9;margin:0 0 20px}
.drg-story-copy h2{font-size:clamp(30px,3.4vw,52px);line-height:1.02;letter-spacing:-.035em;margin:0 0 28px}
.drg-story-copy-section{margin-top:23px}
.drg-story-copy-section h3{font:500 13px/1.25 Aeonik,Arial,sans-serif;letter-spacing:.04em;color:#8fc4f4;margin:0 0 9px}
.drg-story-copy-section p{font-size:15px;line-height:1.55;color:#e2eaf1;margin:0;max-width:42em}
.drg-story-sources{margin-top:28px;font-size:12px;color:#b1c8dc}
.drg-story-sources summary{cursor:pointer;width:fit-content}
.drg-story-sources ul{padding:0 0 0 17px;line-height:1.5}
.drg-story-sources a{text-decoration:underline;text-underline-offset:3px}
.drg-story-socials{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}
.drg-story-socials a{display:inline-flex;align-items:center;gap:16px;padding:9px 14px;border:1px solid #a7c8e554;border-radius:25px;color:#dfeefa;font-size:12px;text-decoration:none;transition:background .2s}
.drg-story-socials a:hover{background:#609edb26}
.drg-story-originals-button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;margin-top:28px;padding:12px 17px;border:1px solid #a7c8e554;border-radius:26px;background:#609edb14;font-size:13px!important;text-align:left;transition:background .2s}
.drg-story-originals-button:hover{background:#609edb33}
.drg-story-comparison{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-content:center}
.drg-story-comparison-source{grid-column:1/-1;margin:0;color:#a8c8e3;font-size:12px;line-height:1.4}
.drg-story-comparison figure{position:relative;margin:0;padding-top:35px}
.drg-story-comparison .drg-story-photo-button{aspect-ratio:16/9;height:auto}
.drg-story-compare-label{position:absolute;top:0;left:0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#bbd5e9}
.drg-story-detail #project-details-title{font-size:clamp(32px,4.1vw,66px);line-height:1.02;text-wrap:balance}
.drg-story-detail #project-details-desc{font-size:clamp(14px,1vw,17px);line-height:1.55;margin:2em 0;max-width:28em}
.drg-story-detail #project-details-side-list{font-size:12px}
.drg-story-detail #project-details-header-info{font-size:10px;letter-spacing:.035em}

/* Reels remain native content inside the existing horizontal motion track. */
.drg-story-reels{display:flex;flex-direction:column;justify-content:center;gap:24px;padding:12px 0}
.drg-reels-header{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;flex-shrink:0}
.drg-reels-header .drg-story-kicker{margin:0 0 9px}
.drg-reels-header h2{font:500 clamp(22px,2.5vw,36px)/1.12 Aeonik,Arial,sans-serif;letter-spacing:-.025em;margin:0}
.drg-reels-header>a{color:#9acaf4;font-size:13px;white-space:nowrap;text-decoration:underline;text-underline-offset:4px}
.drg-reels-grid{display:grid;grid-template-columns:repeat(var(--reel-count),minmax(0,1fr));gap:16px;list-style:none;margin:0;padding:0;align-items:start}
.drg-reel-card{min-width:0;margin:0}
.drg-reel-cover{position:relative;display:block;aspect-ratio:9/16;width:100%;padding:0;border:1px solid #93b5d23d;border-radius:15px;overflow:hidden;background:#102a43;color:#fff;text-decoration:none;isolation:isolate}
.drg-reel-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.drg-reel-cover:hover img{transform:scale(1.035)}
.drg-reel-action{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;gap:8px;align-items:center;padding:48px 12px 14px;background:linear-gradient(transparent,#06182eef);font-size:12px;line-height:1.25;text-align:left}
.drg-reel-action>span{display:grid;place-items:center;width:27px;height:27px;flex-shrink:0;border:1px solid #c7dff373;border-radius:50%;font-size:13px}
.drg-reel-caption{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:12px 0 5px;min-height:2.7em;color:#e4eef6;font-size:13px;line-height:1.35}
.drg-reel-source{display:inline-flex;align-items:center;gap:8px;color:#8fc4f4;font-size:11px;text-decoration:none}
.drg-reel-source:hover{text-decoration:underline;text-underline-offset:3px}
.drg-reel-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;background:radial-gradient(ellipse at 30% 20%,#3971a8,#102a43 70%);font-size:16px;letter-spacing:-.02em}
.drg-reel-placeholder>span{font-size:11px;letter-spacing:.12em;color:#c1d7e9}
.drg-reel-viewer{position:fixed;inset:0;box-sizing:border-box;width:min(1040px,calc(100vw - 40px));height:min(920px,94dvh);max-width:none;max-height:none;margin:auto;padding:22px;border:1px solid #bedaf033;border-radius:20px;background:#081c2e;color:#fff;overflow:hidden;font:400 14px/1.4 Aeonik,Arial,sans-serif}
.drg-reel-viewer::backdrop{background:#04101def;backdrop-filter:blur(12px)}
.drg-reel-viewer[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:18px}
.drg-reel-viewer>header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.drg-reel-viewer-kicker{font-size:10px;letter-spacing:.12em;color:#8fc4f4}
.drg-reel-viewer-title{font:500 clamp(16px,2vw,23px)/1.2 Aeonik,Arial,sans-serif;margin:5px 0 0;max-width:35em}
.drg-reel-viewer-close{flex-shrink:0;padding:8px 12px;border:1px solid #a7c8e554;border-radius:24px;background:transparent;color:#fff;font:inherit;font-size:12px;cursor:pointer;pointer-events:auto}
.drg-reel-viewer-media{display:flex;justify-content:center;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;background:#061420;border-radius:12px;scrollbar-width:thin;scrollbar-color:#609edb #102a43}
.drg-reel-viewer-media video{display:block;width:100%;height:100%;object-fit:contain;background:#061420}
.drg-reel-viewer-media iframe{display:block;width:min(100%,460px);height:100%;min-height:680px;flex-shrink:0;border:0;background:#fff}
.drg-reel-viewer>footer{display:flex;align-items:center;justify-content:space-between;gap:18px}
.drg-reel-viewer-status{max-width:38em;margin:0;font-size:12px;line-height:1.4;color:#a8c3d9}
.drg-reel-viewer-source{display:inline-flex;justify-content:space-between;gap:22px;align-items:center;flex-shrink:0;border:1px solid #a7c8e554;border-radius:24px;padding:10px 15px;color:#e7f4ff;font-size:12px;text-decoration:none;background:#609edb14}
.drg-reel-viewer-source:hover,.drg-reel-viewer-close:hover{background:#609edb33}
.drg-reel-viewer a:focus-visible,.drg-reel-viewer button:focus-visible{outline:3px solid #609edb;outline-offset:3px}

/* The dialog keeps full frames visible, including vertical originals. */
.drg-story-viewer{position:fixed;inset:0;width:min(1440px,calc(100vw - 48px));height:min(92vh,1100px);max-width:none;max-height:none;margin:auto;padding:70px 76px 80px;border:1px solid #d0e6fb24;border-radius:20px;background:#081c2e;color:#fff;overflow:hidden;font:400 15px/1.45 Aeonik,Arial,sans-serif}
.drg-story-viewer::backdrop{background:#04101dee;backdrop-filter:blur(12px)}
.drg-story-viewer[open]{display:flex;flex-direction:column}
.drg-story-viewer figure{display:flex;flex:1;min-height:0;flex-direction:column;gap:20px;margin:0}
.drg-story-viewer img{display:block;width:100%;height:100%;min-height:0;flex:1;object-fit:contain}
.drg-story-viewer figcaption{display:flex;justify-content:space-between;gap:30px;align-items:flex-start;min-height:28px;color:#c7d9e8;font-size:14px}
.drg-story-viewer-count{white-space:nowrap;color:#83b6e4;font-size:12px}
.drg-story-viewer button{color:#fff;cursor:pointer;pointer-events:auto;font:inherit}
.drg-story-viewer-close{position:absolute;top:20px;right:25px;padding:8px 10px;font-size:13px!important}
.drg-story-viewer-label{position:absolute;left:27px;top:28px;max-width:calc(100% - 160px);color:#a5c9eb;font-size:11px;line-height:1.3;letter-spacing:.03em}
.drg-story-viewer-prev,.drg-story-viewer-next{position:absolute;top:50%;width:44px;height:44px;border:1px solid #c5dceb55;border-radius:50%;display:grid;place-items:center;transform:translateY(-50%);font-size:22px!important}
.drg-story-viewer-prev{left:15px}.drg-story-viewer-next{right:15px}
.drg-story-viewer button:hover{background:#609edb33}
.drg-story-viewer button:focus-visible{outline:2px solid #609edb;outline-offset:3px}
.drg-story-viewer button:disabled{opacity:.3;cursor:default}
.drg-story-viewer-documentation,.drg-story-viewer-profile{align-self:flex-start;flex-shrink:0;display:inline-flex;align-items:center;gap:22px;padding:10px 15px;border:1px solid #a7c8e554;border-radius:24px;background:#609edb14;color:#dfeefa;font-size:12px!important;text-align:left;text-decoration:none}
.drg-story-viewer-profile:focus-visible{outline:2px solid #609edb;outline-offset:3px}
.drg-story-viewer-documentation[hidden],.drg-story-viewer-profile[hidden]{display:none!important}
@media(max-width:812px){
 .drg-story-detail #project-details-meta{padding-top:max(125px,calc(var(--vh,1vh) * 14))}
 .drg-story-motion-item{margin-bottom:52px}
 .drg-story-motion-item[data-story-variant="comparison-editorial"],.drg-story-motion-item[data-story-variant="social"]{margin-bottom:112px}
 .drg-story-social-caption,.drg-story-comparison-caption{flex-wrap:wrap;gap:10px}
 .drg-story-social-caption>span:first-child,.drg-story-comparison-caption>span:first-child{max-width:100%}
 .drg-story-motion-item[data-story-variant="narrative"],.drg-story-motion-item[data-story-variant="comparison"],.drg-story-motion-item[data-story-variant="reels"]{height:auto!important}
 .drg-story-reels{height:auto;gap:22px;padding:12px 0}
 .drg-reels-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}
 .drg-reels-header{flex-wrap:wrap;align-items:center;gap:12px}
 .drg-reels-header h2{font-size:29px}
 .drg-reel-caption{font-size:14px}
 .drg-story-narrative{padding:10px 0 10px 23px}
 .drg-story-copy{height:auto;overflow:visible;padding-right:0}
 .drg-story-copy h2{font-size:38px;margin-bottom:28px}
 .drg-story-copy-section p{font-size:16px}
 .drg-story-comparison{grid-template-columns:1fr;gap:28px}
 .drg-story-hero-label{font-size:13px;padding:50px 18px 17px}
 .drg-story-play{width:64px;height:64px}
 .drg-story-caption{font-size:12px;gap:16px}
 .drg-story-detail #project-details-desc{font-size:16px;max-width:35em}
 .drg-story-detail #project-details-side-list{font-size:13px}
}
@media(max-width:640px){
 .drg-reel-viewer{width:calc(100vw - 16px);height:94dvh;padding:15px 12px;border-radius:15px}
 .drg-reel-viewer[open]{gap:13px}
 .drg-reel-viewer>header{gap:12px}
 .drg-reel-viewer>footer{flex-direction:column;align-items:stretch;gap:10px}
 .drg-reel-viewer-source{justify-content:center;gap:18px}
 .drg-reel-viewer-status{font-size:11px}
 .drg-reel-cover{border-radius:12px}
 .drg-story-photo-button,.drg-story-hero-button{border-radius:13px}
 .drg-story-hero-label>span{font-size:11px}
 .drg-story-viewer{width:calc(100vw - 16px);height:90dvh;padding:60px 12px 88px;border-radius:15px}
 .drg-story-viewer figcaption{font-size:13px;gap:16px}
 .drg-story-viewer-prev,.drg-story-viewer-next{top:auto;bottom:16px;transform:none}
 .drg-story-viewer-prev{left:calc(50% - 55px)}.drg-story-viewer-next{right:calc(50% - 55px)}
}
@media(prefers-reduced-motion:reduce){.drg-story-play,.drg-story-expand,.drg-reel-cover img{transition:none}}

/* Comfortable touch controls, including iPad without changing desktop motion. */
@media(max-width:1024px),(pointer:coarse){
 .drg-story-panel button,.drg-story-panel a,.drg-story-panel summary,
 .drg-story-viewer button,.drg-story-viewer a,.drg-reel-viewer button,.drg-reel-viewer a{touch-action:manipulation}
 .drg-story-originals-button,.drg-story-socials a,.drg-story-social-caption a,
 .drg-reels-header>a,.drg-reel-source,.drg-story-viewer-documentation,.drg-story-viewer-profile,
 .drg-reel-viewer-source{box-sizing:border-box;min-height:48px;max-width:100%;font-size:14px;line-height:1.4;overflow-wrap:anywhere}
 .drg-story-originals-button,.drg-story-comparison-caption .drg-story-originals-button,
 .drg-story-viewer-documentation,.drg-story-viewer-profile{font-size:14px!important;gap:16px;padding:12px 16px}
 .drg-story-social-caption a,.drg-reels-header>a{display:inline-flex;align-items:center;white-space:normal}
 .drg-reel-source{gap:8px}
 .drg-story-socials a{padding:12px 16px}
 .drg-story-sources summary{box-sizing:border-box;min-height:48px;padding:14px 0;font-size:14px;line-height:20px}
 .drg-story-sources a{display:inline-flex;align-items:center;min-height:44px;max-width:100%;padding:6px 0;box-sizing:border-box;font-size:14px;overflow-wrap:anywhere}
 .drg-story-sources li+li{margin-top:6px}
 .drg-story-expand{width:44px;height:44px;right:12px;top:12px}
 .drg-story-editorial-label{left:12px;top:12px;max-width:calc(100% - 80px)}
 .drg-story-caption>span:first-child,.drg-reels-header>div,.drg-reel-viewer>header>div{min-width:0;overflow-wrap:anywhere}
 .drg-story-comparison-caption{flex-wrap:wrap;gap:12px}
 .drg-story-comparison-caption>span:first-child{max-width:100%}
 .drg-reel-action{font-size:14px}
 .drg-reel-action>span{width:36px;height:36px}
 .drg-story-viewer,.drg-reel-viewer{box-sizing:border-box}
 .drg-story-viewer-close,.drg-reel-viewer-close{box-sizing:border-box;min-width:48px;min-height:48px;padding:12px 16px;font-size:14px!important;line-height:1.4}
 .drg-story-viewer-prev,.drg-story-viewer-next{width:48px;height:48px}
 .drg-story-viewer figcaption{overflow-wrap:anywhere}
 .drg-story-viewer-caption{min-width:0}
 .drg-story-viewer-documentation,.drg-story-viewer-profile{flex-shrink:0}
 .drg-reel-viewer-source{flex-shrink:1;padding:12px 16px;gap:12px}
 .drg-reel-viewer-status{min-width:0;overflow-wrap:anywhere}
 .drg-reel-viewer>footer{gap:16px}
}
@media(max-width:640px){
 .drg-story-viewer{padding:72px 12px 84px}
 .drg-story-viewer-close{top:12px;right:12px}
 .drg-story-viewer-label{left:16px;top:23px;max-width:calc(100% - 128px)}
 .drg-story-viewer figure{overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;gap:14px}
 .drg-story-viewer img{min-height:min(180px,28dvh)}
 .drg-story-viewer figcaption{flex-shrink:0;gap:12px}
 .drg-story-viewer-prev{left:calc(50% - 60px)}
 .drg-story-viewer-next{right:calc(50% - 60px)}
 .drg-story-viewer-documentation,.drg-story-viewer-profile{width:100%;justify-content:space-between}
 .drg-reel-viewer>header{align-items:center;gap:10px}
 .drg-reel-viewer-close{padding:12px}
 .drg-reel-viewer-status{font-size:12px}
 .drg-story-hero-label{flex-wrap:wrap;gap:4px 14px}
}
@media(max-width:380px){
 .drg-story-reels{gap:18px}
 .drg-reels-grid{gap:22px 10px}
 .drg-reel-action{padding:40px 9px 10px;gap:5px;font-size:13px}
 .drg-reel-action>span{width:30px;height:30px}
 .drg-reel-source{font-size:13px;gap:5px}
 .drg-story-copy h2{font-size:32px}
}
@media(max-height:480px) and (max-width:1024px){
 .drg-reel-viewer{overflow-y:auto}
 .drg-reel-viewer[open]{grid-template-rows:auto minmax(140px,1fr) auto}
 .drg-story-viewer{padding-top:64px;padding-bottom:76px}
}
/* Leave room below the shared header and its Back control, including notches. */
@media(max-width:812px){
 .drg-story-detail #project-details-meta{padding-top:max(calc(140px + env(safe-area-inset-top)),calc(var(--vh,1vh) * 14))}
}
@media(min-width:600px) and (max-width:812px){
 .drg-story-detail #project-details-meta{padding-top:max(calc(156px + env(safe-area-inset-top)),calc(var(--vh,1vh) * 14))}
}