/* Phone-only composition. No rule in this file applies to desktop. */
@media (max-width:759px){
 body.mobile-cinematic #journey{position:relative}
 body.mobile-cinematic .chapter{padding:0!important;min-height:0!important;height:135svh;isolation:auto!important}
 body.mobile-cinematic .hero{height:140svh}
 body.mobile-cinematic .laptop-chapter{height:180svh}
 body.mobile-cinematic .chapter::before{display:none!important}
 body.mobile-cinematic .chapter .copy{position:fixed!important;left:5%!important;right:auto!important;top:21svh!important;width:42%!important;max-width:42%!important;margin:0!important;padding:0!important;opacity:0;visibility:hidden;pointer-events:none;z-index:3;transform:none!important;max-height:calc(79svh - 40px);overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin}
 body.mobile-cinematic .chapter.right .copy{left:auto!important;right:5%!important}
 body.mobile-cinematic.mobile-journey-active .chapter .copy.mobile-copy-visible{visibility:visible;pointer-events:auto}
 body.mobile-cinematic .hero .copy{top:max(170px,21svh)!important;max-height:calc(100svh - max(170px,21svh) - 40px)}
 body.mobile-cinematic .chapter h1,body.mobile-cinematic .chapter h2{font-size:clamp(21px,6.1vw,27px)!important;line-height:1.23!important;letter-spacing:-.025em!important;margin:0 0 20px!important;overflow-wrap:normal;word-break:normal;text-wrap:balance}
 body.mobile-cinematic .chapter h1 em,body.mobile-cinematic .chapter h2 em{font-size:1em;line-height:inherit!important;letter-spacing:-.02em!important}
 body.mobile-cinematic .chapter p{font-size:clamp(11px,3.05vw,13px)!important;line-height:1.75!important;max-width:100%!important;margin:0 0 18px!important;color:#d5dfd1}
 body.mobile-cinematic .chapter .eyebrow{font-size:7px!important;line-height:1.85!important;letter-spacing:1.1px!important;margin-bottom:20px!important}
 body.mobile-cinematic .chapter .eyebrow i{width:4px;height:4px;margin-right:5px}
 body.mobile-cinematic .chapter .tags{gap:6px;margin-top:17px;display:flex;flex-wrap:wrap;align-items:flex-start}
 body.mobile-cinematic .chapter .tags span{font-size:9px;padding:7px 9px;line-height:1.45;max-width:100%;background:#d3e0ba0c;border-color:#d3e0ba35;backdrop-filter:none;-webkit-backdrop-filter:none}
 body.mobile-cinematic .chapter .button{font-size:10px;line-height:1.5;gap:10px;padding:11px 12px;min-height:43px;max-width:100%;white-space:normal}
 body.mobile-cinematic .chapter .button span{font-size:16px}
 body.mobile-cinematic .chapter .sample-label{font-size:7px;line-height:1.7;letter-spacing:.3px;margin-top:17px;max-width:100%}
 body.mobile-cinematic .hero-caption{display:none}
 body.mobile-cinematic .hero .scroll{left:5%;width:42%;font-size:7px;letter-spacing:1px;gap:10px;bottom:8%}
 body.mobile-cinematic .scroll span{font-size:21px}
 body.mobile-cinematic #motion{font-size:9px;padding:9px 12px;z-index:12}
 .mobile-scene-mask{display:none}
 /* Transparent copy sits directly over the continuous scene, without a side panel. */
 body.mobile-cinematic .mobile-scene-mask{display:none}
 body.mobile-cinematic .chapter .copy{text-shadow:0 2px 8px #06120dcc,0 0 22px #06120d88;background:transparent!important;box-shadow:none!important}
 body.mobile-cinematic .grain{opacity:.018}
 body.mobile-cinematic .skip{top:125px;font-size:8px;right:5%}
 body.mobile-cinematic .chapter .copy a:focus-visible{outline-offset:3px}
}
@media(max-width:759px) and (max-height:650px){
 body.mobile-cinematic .chapter .copy{top:13svh!important;max-height:calc(87svh - 40px)}
 body.mobile-cinematic .hero .copy{top:170px!important;max-height:calc(100svh - 210px)}
 body.mobile-cinematic .chapter h1,body.mobile-cinematic .chapter h2{font-size:20px!important;line-height:1.2!important;margin-bottom:14px!important}
 body.mobile-cinematic .chapter p{font-size:11px!important;line-height:1.6!important;margin-bottom:13px!important}
 body.mobile-cinematic .chapter .eyebrow{font-size:6.5px!important;letter-spacing:.8px!important;margin-bottom:14px!important}
 body.mobile-cinematic .chapter .tags{margin-top:12px;gap:5px}
 body.mobile-cinematic .chapter .tags span{font-size:8px;padding:6px 8px}
 body.mobile-cinematic .chapter .sample-label{margin-top:12px}
}
@media(max-width:759px) and (orientation:landscape){
 body.mobile-cinematic .chapter .copy{top:25svh!important;width:40%!important;max-width:40%!important}
 body.mobile-cinematic .chapter h1,body.mobile-cinematic .chapter h2{font-size:21px!important}
 body.mobile-cinematic .chapter p{font-size:11px!important;line-height:1.55!important}
 body.mobile-cinematic .chapter .eyebrow{margin-bottom:10px!important}
 body.mobile-cinematic .chapter .tags{margin-top:10px}
 body.mobile-cinematic .chapter .copy,body.mobile-cinematic .hero .copy{position:fixed!important;top:100px!important;max-height:calc(100svh - 115px);overflow-y:auto}
}
/* Mobile-only content flow; these original article lists remain unchanged on desktop. */
@media(max-width:759px){
 .why-list.mobile-cards-ready,.workflow-cards.mobile-cards-ready{display:block;min-width:0;max-width:100%;margin-top:0}
 .workflow-cards.mobile-cards-ready{margin-top:28px;margin-bottom:27px}
 .mobile-card-window{overflow:hidden;min-width:0;width:100%;border-radius:12px;touch-action:pan-y}
 .why-list .mobile-card-window{background:linear-gradient(135deg,#fafbf4,#e1e8d5);border:1px solid #81957435;box-shadow:0 12px 35px #31472808}
 .workflow-cards .mobile-card-window{border:1px solid #dce7d326;background:#e8efde06}
 .mobile-card-track{display:flex;align-items:stretch;width:100%;transition:transform .4s cubic-bezier(.22,.7,.25,1);will-change:transform}
 .mobile-card-track>article{flex:0 0 100%;width:100%;max-width:100%;min-width:0;box-sizing:border-box;margin:0}
 .why-list.mobile-cards-ready article,.why-list.mobile-cards-ready article:first-child{padding:24px 21px;border:0;gap:15px;align-items:flex-start}
 .why-list.mobile-cards-ready .benefit-icon{width:28px;font-size:26px}
 .why-list.mobile-cards-ready article>div{min-width:0}
 .why-list.mobile-cards-ready h3{font-size:20px;line-height:1.4;margin:0 0 12px;letter-spacing:-.025em}
 .why-list.mobile-cards-ready p{font-size:13px;line-height:1.85;margin:0;overflow-wrap:break-word}
 .workflow-cards.mobile-cards-ready article{padding:23px;border:0;border-radius:0;background:transparent;display:flex;flex-direction:column}
 .workflow-cards.mobile-cards-ready h3{font-size:21px;line-height:1.4;margin-top:22px}
 .workflow-cards.mobile-cards-ready p{font-size:13px;line-height:1.85;margin:0 0 22px;overflow-wrap:break-word}
 .workflow-cards.mobile-cards-ready .workflow-tag{display:block;margin-top:auto;font-size:8px;line-height:1.8;letter-spacing:.8px;overflow-wrap:break-word}
 .workflow-cards.mobile-cards-ready .workflow-visual{width:100%;min-width:0;flex-shrink:0;gap:9px;padding:12px;height:80px}
 .workflow-cards.mobile-cards-ready .flow-node{font-size:10px;line-height:1.6;padding:10px 8px;min-width:0;white-space:normal;overflow-wrap:break-word}
 .mobile-card-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:15px;padding:4px 0}
 .mobile-card-dots{display:flex;align-items:center;gap:8px;padding:8px 0}
 .mobile-card-dot{position:relative;width:7px;height:7px;padding:0;border:0;border-radius:50%;background:#a4b29580;cursor:pointer}
 .mobile-card-dot::before{content:'';position:absolute;inset:-12px}
 .mobile-card-dot[aria-current=true]{background:#58744c}
 .mobile-card-buttons{display:flex;gap:6px;align-items:center}
 .mobile-card-buttons>button{font:11px 'DM Sans',sans-serif;border:1px solid #8a9e7870;border-radius:22px;min-height:36px;min-width:35px;padding:7px 11px;color:#4b6540;background:transparent;cursor:pointer}
 .mobile-card-buttons>button:nth-child(2){font-size:10px;min-width:54px}
 .automation-section .mobile-card-dot{background:#c2d0b24d}
 .automation-section .mobile-card-dot[aria-current=true]{background:#dce9ae}
 .automation-section .mobile-card-buttons>button{color:#dce8cb;border-color:#c4d4ad45}
 .mobile-cards-ready button:focus-visible{outline:2px solid #8caa69;outline-offset:5px}
 .automation-section .mobile-cards-ready button:focus-visible{outline-color:#dce9ae}
}
@media(max-width:360px){
 .why-list.mobile-cards-ready article,.why-list.mobile-cards-ready article:first-child{padding:22px 18px;gap:12px}
 .workflow-cards.mobile-cards-ready article{padding:21px 18px}
 .mobile-card-controls{gap:9px}.mobile-card-dots{gap:7px}.mobile-card-buttons{gap:4px}.mobile-card-buttons>button{padding:6px 9px;min-width:33px}
 .why-list.mobile-cards-ready h3{font-size:19px}
}
@media(prefers-reduced-motion:reduce){.mobile-card-track{transition:none}}
