/* A: product-led consumer page. Preserve Roamora's established palette. */
[data-variant="benefits"] .landing-hero{grid-template-areas:"copy product" "start product";grid-template-columns:1.12fr 1fr;column-gap:80px;row-gap:28px;padding-block:48px 56px;min-height:690px}
[data-variant="benefits"] .hero-writing{grid-area:copy;align-self:end}
[data-variant="benefits"] .hero-writing h1{font-size:clamp(3rem,5.1vw,4.5rem);letter-spacing:-.055em}
[data-variant="benefits"] .hero-writing .intro{max-width:440px;font-size:1.08rem;line-height:1.75;margin-top:26px}
.benefits-start{grid-area:start;align-self:start}
.benefits-start .actions{margin:0;gap:24px}
.benefits-start .requirement{max-width:410px;font-size:.8rem;line-height:1.7;margin-top:18px}
.product-proof{grid-area:product;width:310px;max-width:100%;justify-self:center}
.product-heading{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:.72rem;margin-bottom:13px;padding-inline:8px}
.product-count{font-size:.64rem;letter-spacing:.09em;color:var(--aqua)}
.product-device{border:1px solid #40485c;border-radius:33px;background:#202738;padding:6px;box-shadow:0 20px 45px #0003}
.product-device img{width:100%;aspect-ratio:720 / 1236;object-fit:contain;background:#f3f4f8;border-radius:27px;border:0}
.product-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;border:1px solid var(--line);border-radius:12px;padding:4px;margin-top:18px;background:var(--panel)}
.product-switch button{min-height:40px;border:1px solid transparent;padding:9px 8px;background:transparent;color:var(--muted);font-size:.72rem;border-radius:8px;line-height:1.3;cursor:pointer}
.product-switch button[aria-pressed="true"]{background:#303849;color:var(--ink);border-color:#4b5364}
.product-switch button:hover{color:var(--ink)}
.product-proof figcaption{font-size:.63rem;line-height:1.6;margin-top:12px}
.product-mobile-action{display:none}
.benefits-features{display:grid;grid-template-columns:1fr 1.1fr;gap:100px;padding-block:72px;border-top:1px solid var(--line)}
.benefits-feature-heading>p:last-child{margin-top:22px;font-size:.94rem;max-width:270px}
.benefits-feature-list{display:grid;gap:30px}
.benefits-feature-list article{display:grid;grid-template-columns:30px 1fr;gap:20px;align-items:start}
.benefits-feature-list article>img{filter:invert(1);opacity:.9;margin-top:3px}
.benefits-feature-list h3{font-size:1.16rem}
.benefits-feature-list p{margin-top:9px;font-size:.9rem;max-width:460px}
.travel-modes{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}
.travel-modes span{font-size:.7rem;color:var(--muted);border:1px solid var(--line);padding:3px 11px;border-radius:20px}
.product-showcase{padding-block:56px 76px;border-top:1px solid var(--line)}
.showcase-intro{max-width:540px;margin-bottom:44px}
.showcase-intro>p:last-child{margin-top:20px;font-size:.95rem}
.showcase-phones{display:grid;grid-template-columns:repeat(3,1fr);gap:70px;align-items:start;padding-inline:20px}
.showcase-phone{min-width:0;width:100%;max-width:280px;justify-self:center}
.showcase-phone figcaption{margin-top:25px;text-align:center}
.showcase-phone h3{font-size:1rem}.showcase-phone figcaption p{font-size:.78rem;margin-top:10px}
@media(max-width:1000px){.showcase-phones{gap:35px;padding-inline:10px}}
@media(max-width:700px){.product-showcase{padding-block:40px}.showcase-intro{margin-bottom:30px}.showcase-phones{display:flex;gap:25px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;padding:20px 8px 25px;scroll-padding-inline:8px}.showcase-phone{flex:0 0 min(82%,255px);width:255px;scroll-snap-align:start}.showcase-phone figcaption{margin-top:20px}.showcase-phones::after{content:"";flex:0 0 1px}}
[data-variant="benefits"] .setup-section .section-top h2{font-size:clamp(1.7rem,2.7vw,2.3rem)}
[data-variant="benefits"] .closing-panel h2{font-size:clamp(2rem,3vw,2.6rem)}
@media(max-width:1000px) and (min-width:701px){[data-variant="benefits"] .landing-hero{column-gap:35px}.product-proof{width:280px}.benefits-features{gap:55px}}
@media(max-width:700px){[data-variant="benefits"] .landing-hero{grid-template-columns:1fr;grid-template-areas:"copy" "product" "start";gap:28px;padding-block:34px 42px;min-height:0}[data-variant="benefits"] .hero-writing{text-align:center;align-self:auto}[data-variant="benefits"] .hero-writing .eyebrow{font-size:.62rem;margin-bottom:16px}[data-variant="benefits"] .hero-writing h1{font-size:clamp(2.15rem,8.8vw,3.25rem)}[data-variant="benefits"] .hero-writing .intro{font-size:.94rem;line-height:1.7;margin:19px auto 0;max-width:360px}.product-proof{width:255px}.product-heading{font-size:.66rem;margin-bottom:10px}.product-device{padding:5px;border-radius:29px}.product-device img{border-radius:24px}.product-switch{margin-top:14px}.benefits-start{text-align:center}.benefits-start .actions{justify-content:center;gap:19px}.benefits-start .primary{width:min(100%,310px)}.benefits-start .requirement{margin:17px auto 0;max-width:310px}.benefits-features{grid-template-columns:1fr;gap:32px;padding-block:44px}.benefits-feature-heading>p:last-child{max-width:none;margin-top:18px}.benefits-feature-list{gap:28px}.benefits-feature-list article{gap:16px}.benefits-feature-list h3{font-size:1.1rem}}
@media(prefers-reduced-motion:reduce){.product-device{scroll-behavior:auto}}
@media(max-width:700px){[data-variant="benefits"]{padding-bottom:85px}.product-mobile-action{position:fixed;bottom:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px calc(13px + env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--line)}.product-mobile-action>div{display:flex;flex-direction:column;min-width:0}.product-mobile-action strong{font-size:.73rem;line-height:1.5}.product-mobile-action>div>span{font-size:.6rem;color:var(--muted);line-height:1.6}.product-mobile-action .primary{min-height:46px;padding:11px 15px;gap:12px;font-size:.75rem;flex:none}[data-variant="benefits"] .measurement{bottom:95px}}

/* Phone layouts share one gutter and a calmer, consistent vertical rhythm. */
@media(max-width:700px){
 [data-variant="benefits"] .wrap{width:calc(100% - 40px)}
 [data-variant="benefits"] .landing-header{height:76px}
 [data-variant="benefits"] .landing-header nav a:last-child{min-height:44px;display:inline-flex;align-items:center;padding:8px 16px}
 [data-variant="benefits"] .landing-hero{padding-block:32px 48px;row-gap:30px}
 [data-variant="benefits"] .hero-writing .intro{max-width:330px;line-height:1.65}
 .product-proof{width:min(76vw,280px)}
 .product-switch button{min-height:44px;font-size:.78rem}
 .product-proof figcaption{font-size:.7rem}
 .benefits-start .actions{display:grid;justify-items:center;gap:18px}
 .benefits-start .primary{width:100%;max-width:350px}
 .benefits-start .requirement{font-size:.8rem;max-width:320px}
 .benefits-features,.product-showcase{padding-block:48px}
 .benefits-feature-heading,.showcase-intro{text-align:center}
 .benefits-feature-heading h2,.showcase-intro h2{font-size:clamp(1.8rem,7.2vw,2.3rem);line-height:1.15}
 .benefits-feature-heading>p:last-child,.showcase-intro>p:last-child{margin:16px auto 0;max-width:310px;line-height:1.65}
 .benefits-feature-list{gap:0}
 .benefits-feature-list article{padding-block:24px;border-bottom:1px solid var(--line);gap:16px}
 .benefits-feature-list article:first-child{padding-top:0}
 .benefits-feature-list article:last-child{border-bottom:0;padding-bottom:0}
 .benefits-feature-list p{font-size:.88rem;line-height:1.65}
 .showcase-phones{gap:24px;padding:12px 6px 22px;scroll-padding-inline:6px}
 .showcase-phone{flex-basis:min(84%,280px);max-width:280px}
 .showcase-phone figcaption p{font-size:.82rem;line-height:1.6}
 .product-showcase::after{content:"Swipe to explore the app →";display:block;text-align:center;color:var(--muted);font-size:.75rem;margin-top:8px}
 [data-variant="benefits"] .setup-section{padding-block:48px}
 [data-variant="benefits"] .section-top{text-align:center}
 [data-variant="benefits"] .section-top>p{font-size:.88rem;line-height:1.65;max-width:330px;margin:18px auto 0}
 [data-variant="benefits"] .journey-list{gap:26px;margin-top:32px}
 [data-variant="benefits"] .journey-list p{font-size:.87rem;line-height:1.65}
 [data-variant="benefits"] .setup-note{padding:20px;margin-top:28px}
 [data-variant="benefits"] .questions{padding-block:48px;gap:26px}
 [data-variant="benefits"] .questions>div:first-child{text-align:center}
 [data-variant="benefits"] .answers summary{font-size:.9rem;padding-block:20px}
 [data-variant="benefits"] .closing-panel{text-align:center;padding:28px 22px}
 [data-variant="benefits"] .closing-panel .primary{width:100%}
 .product-mobile-action{padding:12px 20px calc(12px + env(safe-area-inset-bottom));background:#0d1220f5;box-shadow:0 -8px 24px #0002}
 .product-mobile-action strong{font-size:.8rem}
 .product-mobile-action>div>span{font-size:.65rem}
 .product-mobile-action .primary{min-height:46px;font-size:.8rem;padding-inline:18px}
}
@media(max-width:360px){.product-mobile-action{gap:8px;padding-inline:16px}.product-mobile-action .primary{padding-inline:13px}.product-mobile-action>div>span{font-size:.6rem}}

/* Welcome screen: one clear action and a complete device, above browser chrome. */
@media(max-width:700px){
 [data-variant="benefits"] .landing-header{height:64px}
 [data-variant="benefits"] .landing-hero{grid-template-areas:"copy" "start" "product";row-gap:20px;padding-block:24px 36px}
 [data-variant="benefits"] .hero-writing .eyebrow{margin-bottom:12px;font-size:.6rem}
 [data-variant="benefits"] .hero-writing h1{font-size:clamp(1.95rem,8.2vw,2.5rem);line-height:1.08}
 [data-variant="benefits"] .hero-writing .intro{font-size:.88rem;line-height:1.55;margin-top:14px;max-width:330px;text-wrap:pretty}
 .benefits-start .actions{gap:0}
 .benefits-start .primary{max-width:280px;min-height:48px;padding:12px 22px}
 .benefits-start .quiet-link{display:none}
 .benefits-start .requirement{font-size:.7rem;margin-top:10px;max-width:280px;line-height:1.5}
 .product-proof{width:clamp(120px,calc((100svh - 390px)/2.25),200px)}
 .product-heading,.product-proof figcaption{display:none}
 .product-proof .iphone-outline{border-radius:28px;padding:4px}
 .product-proof .iphone-screen{border-radius:22px}
 .product-proof .product-switch{width:280px;max-width:calc(100vw - 40px);position:relative;left:50%;transform:translateX(-50%);margin-top:18px}
 .product-mobile-action{display:none}
 .hero-passed .product-mobile-action{display:flex}
 .pricing-visible .product-mobile-action{display:none}
}


/* Mobile feature details replace the repeated phone carousel. */
.showcase-details{display:none}
@media(max-width:700px){
 .product-showcase{padding-block:40px}
 .showcase-intro{margin-bottom:26px}
 .showcase-intro h2{font-size:clamp(1.7rem,6.8vw,2.1rem)}
 .showcase-intro>p:last-child{font-size:.85rem;margin-top:14px}
 .showcase-phones,.product-showcase::after{display:none}
 .showcase-details{display:grid;gap:0}
 .showcase-detail{display:grid;grid-template-columns:44% 1fr;align-items:center;gap:20px;padding:22px 0;border-top:1px solid var(--line)}
 .showcase-detail:first-child{border-top:0;padding-top:0}
 .showcase-detail:last-child{padding-bottom:0}
 .app-detail{position:relative;overflow:hidden;aspect-ratio:1/1.12;border:1px solid #3c455c;border-radius:18px;background:var(--panel)}
 .app-detail img{position:absolute;width:100%;height:100%;object-fit:cover;max-width:none}
 .detail-teleport img{object-position:50% 96%}
 .detail-travel img{object-position:50% 78%}
 .detail-explore img{object-position:50% 48%}
 .showcase-detail .detail-label{font-size:.6rem;font-weight:700;letter-spacing:.12em;color:var(--aqua);margin-bottom:9px}
 .showcase-detail h3{font-size:1.03rem;line-height:1.2;letter-spacing:-.025em}
 .showcase-detail h3+p{font-size:.8rem;line-height:1.55;margin-top:9px;text-wrap:pretty}
 .showcase-visible .product-mobile-action{display:none}
}
@media(max-width:360px){.showcase-detail{gap:15px;grid-template-columns:42% 1fr}.showcase-detail h3{font-size:.95rem}.showcase-detail h3+p{font-size:.76rem}}

@media(max-width:700px){
 .showcase-detail{grid-template-columns:46% 1fr;gap:20px;padding-block:26px}
 .app-detail{aspect-ratio:auto;overflow:visible;border:0;border-radius:0;background:transparent}
 .app-detail .iphone-outline{width:100%;border-radius:26px;padding:4px;box-shadow:inset 0 0 0 2px #080a0e,0 12px 24px #0003}
 .app-detail .iphone-screen{border-radius:20px}
 .app-detail .iphone-screen>img{position:static;object-fit:contain!important}
 .app-detail .iphone-home{height:2px}
}
@media(max-width:360px){.showcase-detail{grid-template-columns:45% 1fr;gap:16px}.app-detail .iphone-outline{border-radius:22px}.app-detail .iphone-screen{border-radius:16px}}

@media(max-width:700px){
 body[data-variant="benefits"] .product-mobile-action{display:flex;visibility:hidden;transform:translateY(110%);opacity:0;pointer-events:none;transition:transform .22s ease,opacity .22s ease,visibility .22s}
 body[data-variant="benefits"].mobile-action-visible .product-mobile-action{visibility:visible;transform:translateY(0);opacity:1;pointer-events:auto}
}
@media(prefers-reduced-motion:reduce){body[data-variant="benefits"] .product-mobile-action{transition:none}}

@media(max-width:700px){.product-mobile-action .primary{font-size:.72rem;padding-inline:12px;gap:7px}.product-mobile-action>div>span{max-width:130px;font-size:.6rem;line-height:1.4}.product-mobile-action strong{font-size:.76rem}}