/* Case-specific compositions using original client artwork. */
.story-hero .hero-third{position:relative;inset:auto;width:92%;height:auto;aspect-ratio:var(--screen-ratio);margin:24px 4% 0;overflow:hidden;border-radius:3px;box-shadow:0 24px 55px #18242e60}
.hero-third img{width:100%;height:auto}
.access-hero .hero-desktop{height:auto;aspect-ratio:var(--screen-ratio)}
.access-hero .hero-mobile{max-width:210px;width:20%;height:auto;aspect-ratio:var(--screen-ratio);top:90px;right:4%}
.campaign-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:24px;background:linear-gradient(130deg,#8999a4,#576d7b);border-radius:6px;align-items:start}
.campaign-pair .story-screen{padding:0;background:none;min-width:0}
.phone-crop img{aspect-ratio:.46;object-fit:cover;object-position:top;background:#000}
.campaign-path{list-style:none;margin:0;padding:24px;display:grid;grid-template-columns:1fr 1fr;gap:18px;background:linear-gradient(130deg,#8999a4,#576d7b);border-radius:6px;color:#edf2f3}
.campaign-path li{padding:20px;border:1px solid #edf2f344;border-radius:5px;background:#17283230}
.campaign-path span{font-size:10px;display:block;margin-bottom:15px;color:#d7e6e8}.campaign-path strong{font-weight:400;font-size:21px}.campaign-path p{font-size:12px;line-height:1.6;margin:10px 0 0;color:#e3ebee}
.banner-variants{padding:24px;background:linear-gradient(130deg,#8999a4,#576d7b);border-radius:6px;display:grid;gap:24px}.banner-variants .story-screen{padding:0;background:none}
@media(max-width:750px){.campaign-pair{gap:14px;padding:16px}.campaign-path{padding:16px;gap:12px}.campaign-path li{padding:14px}.banner-variants{padding:16px;gap:20px}.access-hero .hero-mobile{top:65px;width:23%}.campaign-path strong{font-size:19px}}

/* Reusable mobile presentation: original screen artwork inside a consistent handset. */
.campaign-device-pair{background:linear-gradient(130deg,#c5d0d4,#aebfc6);gap:28px;padding:24px;align-items:start}
.campaign-device-pair figcaption{color:#354d57;min-height:30px}
.device-phone{position:relative;max-width:290px;margin:auto;padding:27px 8px 24px;border:2px solid #525b59;border-radius:30px;background:linear-gradient(115deg,#363d3b,#171b1a);box-shadow:0 9px 20px #263b4530}
.device-phone::after{content:"";position:absolute;right:-4px;top:24%;height:44px;width:3px;border-radius:0 2px 2px 0;background:#272d2b}
.device-phone-speaker{position:absolute;top:12px;left:42%;width:16%;height:5px;border-radius:5px;background:#090c0b;box-shadow:-23px 0 0 -1px #0b100e}
.device-phone-screen{aspect-ratio:9/19.5;overflow:auto;scrollbar-width:none;background:#000;border:1px solid #060807}
.device-phone-screen:focus-visible{outline:2px solid #579fa5;outline-offset:3px}
.device-phone-screen::-webkit-scrollbar{display:none}
.golden-ticket-art{position:relative;overflow:hidden;width:100%}
.golden-ticket-art img{position:absolute;max-width:none!important;height:auto!important;object-fit:initial!important;border-radius:0!important}
.golden-ticket-discovery{aspect-ratio:214/714}
.golden-ticket-discovery img{width:371.9626%!important;left:-15.8879%;top:-2.521%}
.golden-ticket-details{aspect-ratio:272/661}
.golden-ticket-details img{width:292.6471%!important;left:-164.3382%;top:-10.7413%}
@media(max-width:750px){.campaign-device-pair{gap:18px;padding:20px 16px}.device-phone{padding:23px 6px 20px;border-radius:23px}.device-phone-speaker{top:10px}.campaign-device-pair figcaption{min-height:32px;font-size:9px}}

.golden-ticket-entry{width:100%;overflow:hidden;background:#000}
.golden-ticket-entry img{width:104.0892%;max-width:none;height:auto;border-radius:0}

.phone-artwork{position:relative;overflow:hidden;width:100%}
.phone-artwork img{position:absolute;width:100%;max-width:none;height:auto;border-radius:0}
.motorola-phone-detail{aspect-ratio:540/3477}
.motorola-phone-detail img{top:-3.882657%}
.motorola-phone-confirmation{aspect-ratio:720/1444}
.motorola-phone-confirmation img{top:-12.32687%}

/* Full confirmation content sits within the same tall handset as the other screens. */
.device-phone-screen:has(.motorola-phone-confirmation){aspect-ratio:9/19.5;background:#000}

.fifa-final-art{position:relative;width:100%;overflow:hidden;background:#000}
.fifa-final-art img{display:block;width:100%;max-width:none;height:auto;border-radius:0}
.fifa-final-discovery{aspect-ratio:360/2093}
.fifa-final-discovery img{position:absolute;top:-8.8389871%;left:0;width:100%}
.fifa-final-details{aspect-ratio:525/3843}
.fifa-final-details img{position:absolute;top:-3.4088%;left:0;width:100%}

.device-phone-screen:has(.fifa-final-discovery){scrollbar-width:thin;scrollbar-color:#869695 #171b1a}
.device-phone-screen:has(.fifa-final-discovery)::-webkit-scrollbar{display:block;width:4px}
.device-phone-screen:has(.fifa-final-discovery)::-webkit-scrollbar-thumb{background:#869695;border-radius:3px}

.phone-scroll-note{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:8px;margin:0;color:#3b5861;font-size:12px;line-height:1.4;letter-spacing:.01em}
.phone-scroll-note svg{width:20px;height:20px;flex:none;color:#347d83;filter:drop-shadow(0 0 3px #579fa530)}
@media(max-width:750px){.phone-scroll-note{font-size:11px;gap:6px}.phone-scroll-note svg{width:18px;height:18px}}

.campaign-device-pair .phone-scroll-note{margin:0 0 14px;font-size:11px;gap:6px}
.campaign-device-pair .phone-scroll-note svg{width:18px;height:18px}
@media(max-width:750px){.campaign-device-pair .phone-scroll-note{font-size:9px;gap:4px;margin-bottom:11px}.campaign-device-pair .phone-scroll-note svg{width:16px;height:16px}}
/* Selected scroll cue: glass capsule. It never blocks scrolling or artwork input. */
.phone-hover-cue{position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%) translateY(5px);display:flex;align-items:center;gap:9px;padding:9px 13px 9px 9px;white-space:nowrap;border:1px solid #b5d1cf55;border-radius:40px;background:#26454dcc;box-shadow:0 5px 18px #0004;backdrop-filter:blur(5px);color:#f0f4ef;font:12px/1.3 Arial,sans-serif;text-shadow:0 1px 4px #0008;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s}
.phone-cue-circle{display:grid;place-items:center;flex:none;width:36px;height:36px;border:1px solid #e8f4ec66;border-radius:50%;background:#567d8055}
.phone-cue-circle svg{width:25px;height:25px}
@media(hover:none),(pointer:coarse){.phone-hover-cue{font-size:10px;gap:5px;padding:7px 9px 7px 7px}.phone-cue-circle{width:29px;height:29px}.phone-cue-circle svg{width:21px;height:21px}}
@media(prefers-reduced-motion:reduce){.phone-hover-cue{transition:none}}

/* Mobile previews stay static so swiping continues to scroll the case study. */
@media(max-width:750px),(hover:none),(pointer:coarse){.device-phone-screen{overflow:hidden!important}.device-phone .phone-hover-cue{display:none!important}}

.myaccess-case .access-scope-example{display:block}
.access-scope-example .feature-copy{max-width:780px;margin-bottom:25px}
.access-scope-example .access-scope-image{margin:0;padding:22px;background:linear-gradient(130deg,#c5d0d4,#aebfc6)}
.access-scope-image img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;border-radius:5px}
.access-scope-image figcaption{color:#354d57}
@media(max-width:750px){.access-scope-example .access-scope-image{padding:14px}}
/* Keep the closing measurement block's bottom gap equal to its section padding. */
.myaccess-case .validation-grid > div > :last-child{margin-bottom:0}

.golden-phone-detail{aspect-ratio:540/2528}
.golden-phone-detail img{top:-5.300633%}
.golden-phone-confirmation{aspect-ratio:360/692}
.golden-phone-confirmation img{top:-13.00578%}

/* Campaign outcome figures follow the account dashboard's metric typography. */
.campaign-results-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7%}
.campaign-results-grid article{border-top:1px solid #76899455;padding-top:22px}
.campaign-results-grid h3{font-size:23px;margin-bottom:7px}
.campaign-results-grid .campaign-result-date{font-size:11px;color:var(--muted);margin-bottom:0}
.campaign-results-grid .shortcut-metrics{margin-top:20px}
@media(max-width:750px){.campaign-results-grid{grid-template-columns:1fr;gap:28px}.campaign-results-grid article{padding-top:18px}}
