/* Xodus: premium editorial case study built from supplied 2024 campaign outputs. */
.x-page{--x-black:#09090a;--x-gold:#dcb45d;--x-purple:#4c276e;--accent:#ef8b4d}
.x-page main{overflow:hidden}
.x-opening{padding-bottom:38px}
.x-opening h1{font-size:clamp(48px,7.2vw,98px);line-height:.92;letter-spacing:-.065em}
.x-opening .g-opening-note{max-width:310px}

.x-hero{margin:0 0 72px}
.x-hero-stage{display:grid;grid-template-columns:.72fr 1.28fr;align-items:center;min-height:560px;overflow:hidden;border-radius:8px;background:#08080a}
.x-motion-copy{padding:9%;color:#fff;align-self:end}
.x-motion-copy p{color:var(--x-gold);font-size:12px;letter-spacing:.06em;margin:0 0 18px}
.x-motion-copy strong{display:block;font-size:clamp(34px,4vw,58px);font-weight:400;line-height:1.02;letter-spacing:-.05em}
.x-motion-copy span{display:block;margin-top:24px;color:#aaa;font-size:12px}
.x-motion-frame{height:100%;display:grid;place-items:center;background:#000}
.x-motion-image{width:100%;height:100%;max-height:560px;object-fit:contain;background:#000}

.x-hero-note{display:flex;justify-content:space-between;gap:20px;margin:12px 0 0!important;color:var(--muted);font-size:12px!important;line-height:1.45!important}
.x-hero-note span:last-child{text-align:right}

.x-overview{padding-bottom:82px}
.x-overview .g-summary article{grid-template-columns:110px 1fr}
.x-overview .g-summary p{grid-column:2}
.x-section-heading{padding-top:75px}
.x-section-heading h2{font-size:clamp(40px,5.3vw,72px);max-width:920px;line-height:1.02}

.x-feature{display:grid;grid-template-columns:.78fr 1.22fr;gap:9%;align-items:center;padding:34px 0 100px}
.x-feature-copy{align-self:center}
.x-feature-copy p{font-size:17px;margin:0;max-width:390px}
.x-feature figure{max-width:660px;justify-self:end}
.x-feature img{width:100%;height:auto}
.x-feature figcaption,.x-magazine-sequence figcaption,.x-surface-stage figcaption{padding-top:11px}

.x-editorial{padding:90px 0;border-top:1px solid #ddd}
.x-editorial-intro,.x-surfaces-intro{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:start;margin-bottom:48px}
.x-editorial-intro h3,.x-surfaces-intro h3{margin:0}
.x-editorial-intro>p,.x-surfaces-intro>p{padding-top:30px;margin:0}
.x-magazine-sequence{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4%;align-items:start;max-width:1050px;margin:auto}
.x-magazine-sequence figure:nth-child(2){margin-top:78px}
.x-magazine-sequence figure:nth-child(3){margin-top:156px}
.x-magazine-sequence img{width:100%;height:auto;box-shadow:0 15px 36px rgba(18,9,26,.1)}
.x-magazine-mockup{margin:0 0 56px!important}
.x-magazine-mockup img{width:100%;height:auto;border-radius:7px}
.x-magazine-mockup figcaption{padding-top:11px}

.x-surfaces{padding:90px 0 22px;border-top:1px solid #ddd}
.x-surface-stage{display:grid;grid-template-columns:.52fr 1.48fr;gap:7%;align-items:center;padding:5%;border-radius:8px;background:#f3f1ef}
.x-surface-stage img{width:100%;height:auto}
.x-towel{max-width:300px;justify-self:center}
.x-truck{width:100%}
.x-production-note{font-size:13px!important;margin:16px 0 0!important;color:var(--muted)}
.x-road{padding:90px 0 20px;border-top:1px solid #ddd}
.x-road-intro{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:start;margin-bottom:44px}
.x-road-intro h3{margin:0}.x-road-intro>p{padding-top:30px;margin:0}
.x-road-sequence{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:18px;align-items:center}
.x-road-sequence img{width:100%;height:auto;border-radius:5px}
.x-road-sequence figcaption{padding-top:10px}
.x-credit{font-size:12px!important;line-height:1.65!important;max-width:930px!important;color:#666;margin:50px 0 68px!important}

.x-outcome{background:var(--accent);border:0;border-radius:10px;padding:42px;margin:0 0 42px;grid-template-columns:1.2fr 1fr;gap:5%}
.x-outcome p,.x-outcome .g-kicker{color:var(--ink)}
.x-outcome h2{font-size:clamp(34px,4.2vw,56px)}
.x-outcome .button{background:#fff;color:var(--ink);line-height:1.4}
.x-outcome .button:hover{background:var(--ink);color:#fff}
.x-outcome .g-sprint-link{text-decoration-color:var(--ink)}
.x-outcome .button:focus-visible,.x-outcome .g-sprint-link:focus-visible{outline-color:var(--ink)}

@media(max-width:950px){
  .x-hero-stage{min-height:500px}
  .x-feature{gap:6%}
  .x-magazine-sequence{gap:3%}
  .x-outcome{padding:32px;grid-template-columns:1.15fr 1fr;gap:30px}
}

@media(max-width:650px){
  .x-opening{padding-bottom:27px}.x-opening h1{font-size:52px}
  .x-hero{margin-bottom:42px}
  .x-hero-stage{grid-template-columns:1fr;min-height:0}.x-motion-copy{display:none}.x-motion-copy strong{font-size:36px}.x-motion-copy span{margin-top:14px}.x-motion-frame{aspect-ratio:1}.x-motion-image{max-height:none}
  .x-hero-note{display:block}.x-hero-note span{display:block}.x-hero-note span:last-child{text-align:left;margin-top:4px}
  .x-overview{padding-bottom:44px}.x-overview .g-summary article{grid-template-columns:92px 1fr}.x-overview .g-summary p{grid-column:2}
  .x-section-heading{padding-top:46px}.x-section-heading h2{font-size:38px}
  .x-feature{grid-template-columns:1fr;gap:28px;padding:18px 0 56px}.x-feature figure{justify-self:auto}.x-feature-copy p{font-size:16px}
  .x-editorial,.x-surfaces,.x-road{padding:55px 0}
  .x-editorial-intro,.x-surfaces-intro,.x-road-intro{grid-template-columns:1fr;gap:18px;margin-bottom:28px}
  .x-editorial-intro>p,.x-surfaces-intro>p,.x-road-intro>p{padding-top:0}
  .x-magazine-mockup{margin-bottom:36px!important}
  .x-magazine-sequence{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px;margin-right:-5vw}
  .x-magazine-sequence figure,.x-magazine-sequence figure:nth-child(2),.x-magazine-sequence figure:nth-child(3){flex:0 0 70vw;margin:0;scroll-snap-align:start}
  .x-surface-stage{grid-template-columns:.58fr 1.42fr;gap:18px;padding:18px}.x-surface-stage figcaption{font-size:11px}
  .x-road-sequence{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:14px;margin-right:-5vw}.x-road-sequence figure{flex:0 0 76vw;scroll-snap-align:start}.x-road-sequence figcaption{font-size:11px}
  .x-credit{margin:32px 0 42px!important}
  .x-outcome{padding:27px 23px;grid-template-columns:1fr;gap:26px;margin-bottom:28px}.x-outcome h2{font-size:36px}.x-outcome .g-outcome-actions{gap:18px}.x-outcome .button{white-space:normal;gap:16px}
}


/* A clean identity opening; applications carry the supporting story. */
.x-logo-hero figure{margin:0;background:#f5f4f0;border-radius:6px;overflow:hidden}.x-logo-hero img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}.x-registration{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center;border-top:1px solid #ddd;padding:60px 0}.x-registration figure{max-width:430px}.x-registration img{width:100%;height:auto;border-radius:5px}.x-registration figcaption{padding-top:10px}.x-registration h3{font-size:clamp(28px,3.8vw,47px);font-weight:400;letter-spacing:-.045em;line-height:1.08}.x-registration p{max-width:480px}.x-registration .g-kicker{font-size:11px}.x-magazine-sequence{max-width:none;gap:25px;align-items:center}.x-magazine-sequence figure:nth-child(2),.x-magazine-sequence figure:nth-child(3){margin-top:0}.x-magazine-sequence img{max-height:360px;object-fit:contain;background:#f4f2ef;box-shadow:none;padding:12px}.x-editorial,.x-surfaces,.x-road{padding-top:65px;padding-bottom:60px}
@media(max-width:650px){.x-registration{grid-template-columns:1fr;gap:25px;padding:40px 0}.x-registration figure{width:80%;justify-self:center}.x-registration h3{font-size:32px}.x-logo-hero figure{margin:0}.x-magazine-sequence{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0;overflow:visible;padding:0}.x-magazine-sequence figure,.x-magazine-sequence figure:nth-child(2),.x-magazine-sequence figure:nth-child(3){margin:0;min-width:0}.x-magazine-sequence img{padding:5px;max-height:none}.x-magazine-sequence figcaption{font-size:10px}.x-magazine-sequence .g-artwork-zoom{display:none}.x-editorial,.x-surfaces,.x-road{padding-top:40px;padding-bottom:40px}}
.x-feature{grid-template-columns:.7fr 1.3fr;gap:6%;padding-bottom:65px}.x-feature figure{max-width:none}.x-feature img{border-radius:5px}.x-surface-stage{grid-template-columns:1.3fr .7fr;padding:0;gap:38px 7%;background:none;align-items:center}.x-truck{grid-column:1/-1}.x-towel{max-width:none;justify-self:stretch;width:100%}.x-surface-stage img{border-radius:6px}.x-surface-note h3{font-size:clamp(28px,3.7vw,47px);line-height:1.06;letter-spacing:-.045em;font-weight:400}.x-surface-note p{font-size:15px}.x-surface-note .g-kicker{font-size:11px}.x-feature .g-artwork-link{overflow:visible}.x-surface-stage .g-artwork-zoom,.x-feature .g-artwork-zoom{opacity:0;transition:opacity .2s}.x-surface-stage a:hover .g-artwork-zoom,.x-surface-stage a:focus-visible .g-artwork-zoom,.x-feature a:hover .g-artwork-zoom,.x-feature a:focus-visible .g-artwork-zoom{opacity:1}
@media(max-width:900px){.x-feature{grid-template-columns:1fr;gap:27px}.x-feature-copy p{max-width:620px}.x-feature figure{width:100%}.x-surface-stage{grid-template-columns:1.2fr .8fr;gap:24px 5%}.x-surface-note h3{font-size:29px}}
@media(max-width:650px){.x-surface-stage{grid-template-columns:1fr;gap:25px}.x-surface-note{padding-top:2px}.x-surface-note h3{font-size:32px}.x-surface-stage .g-artwork-zoom,.x-feature .g-artwork-zoom{opacity:1}.x-feature{padding-bottom:40px}}