/* Shared product presentation. Data, prices and identity stay in the existing controllers. */
html.ox-redesign body.product-pages {
  --ox-sans:-apple-system,"Segoe UI Variable","Segoe UI",Inter,system-ui,sans-serif;
  --ox-bg:#0a0b0a;--ox-surface:#171817;--ox-surface-2:#232423;
  --ox-line:#30322f;--ox-line-2:#4b5046;--ox-text:#f6f7f5;--ox-muted:#b4b7b0;
  --ox-accent:#b4ef29;--product-ink:#142000;
  --rd-button:var(--ox-accent);--rd-button-text:var(--product-ink);
  --mini-accent:var(--ox-accent);--mini-ink:var(--product-ink);
  --accent:var(--ox-accent);--brand:var(--ox-accent);--ink:var(--product-ink);
  --bg:var(--ox-bg);--page:var(--ox-bg);--surface:var(--ox-surface);
  --surface-2:var(--ox-surface-2);--border:var(--ox-line);--border-strong:var(--ox-line-2);
  --text:var(--ox-text);--text-muted:var(--ox-muted);--muted:var(--ox-muted);
  --rd-header:var(--bg);--rd-button-hover:color-mix(in srgb,var(--accent) 86%,white);
  font-family:var(--ox-sans);background:var(--bg);color:var(--text);
}
html.ox-redesign body.product-pages.product-cry {--ox-accent:#ff992e;--product-ink:#2d1700}
html.ox-redesign[data-theme="dark"] body.product-pages[data-page] {
  --bg:#0a0b0a;--surface:#171817;--surface-2:#232423;--rd-header:var(--bg);
  --text:#f6f7f5;--text-muted:#b4b7b0;--brand:var(--ox-accent);
  --border:#30322f;--border-strong:#4b5046;background:var(--bg);
  --mini-accent:var(--ox-accent);--mini-ink:var(--product-ink);
}
html.ox-redesign[data-theme="light"] body.product-pages[data-page] {
  --bg:#f6f7f4;--surface:#fff;--surface-2:#e8ebe4;--rd-header:var(--bg);
  --text:#171b14;--text-muted:#56604f;--border:#d8ddd1;--border-strong:#a6af9a;
  --brand:#4d730b;--mini-accent:var(--ox-accent);--mini-ink:var(--product-ink);
  background:var(--bg);
}
html.ox-redesign[data-theme="light"] body.product-pages.product-cry {--brand:#99500a}
body.product-pages :is(h1,h2,h3,button,input,select,summary,output,.btn,#total) {font-family:var(--ox-sans)}
body.product-pages :is(h1,h2,h3) {letter-spacing:-.045em;font-weight:800;text-wrap:balance}
body.product-pages p {line-height:1.6}
body.product-pages :is(.product-main .container,.header-inner,.product-footer-inner) {max-width:1160px;margin-inline:auto}
body.product-pages :is(.btn,button) {box-shadow:none!important}
body.product-pages :is(.btn,input,select,button,summary):focus-visible {outline:2px solid var(--brand);outline-offset:4px}
body.product-pages .site-header {background:var(--bg);border:0;box-shadow:none}
body.product-pages .site-header .header-inner {min-height:78px;gap:20px}
body.product-pages .product-brand-mark {width:32px;height:32px;border-radius:9px}
body.product-pages .brand-logo {font-weight:850;font-size:19px;letter-spacing:-.04em}
body.product-pages .site-header .main-nav {gap:8px;font-size:13px}
body.product-pages[data-page="home"] .site-header .main-nav {display:none}
body.product-pages .header-actions {gap:8px}
body.product-pages .theme-toggle {display:none}
body.product-pages .product-bot-link {border-radius:99px;background:#167eaf;color:white;padding:12px 20px;font-size:13px}
html.ox-redesign body.product-pages .product-cabinet-link.btn-primary {
  border:0;border-radius:99px;background:var(--surface-2);color:var(--text);min-height:44px;padding:11px 21px;font-size:13px;
}
html.ox-redesign body.product-pages .product-main .btn {border-radius:99px;font-size:14px;min-height:48px;padding:12px 23px;text-decoration:none}
html.ox-redesign body.product-pages .product-main .btn-primary {background:var(--accent);color:var(--ink);border:0}
html.ox-redesign body.product-pages .product-main .btn-secondary {background:var(--surface-2);color:var(--text);border:0}
body.product-pages .product-main {padding-bottom:60px}
body.product-pages .product-hero {
  position:relative;isolation:isolate;display:flex;align-items:center;min-height:580px;padding-block:70px 100px;overflow:hidden;
}
.product-hero-art {position:absolute;z-index:-1;right:-8%;top:0;width:76%;height:100%;object-fit:cover;object-position:58% 40%;
  mask-image:linear-gradient(90deg,transparent 0%,#000 46%),linear-gradient(0deg,transparent 0%,#000 25%,#000 85%,transparent 100%);
  mask-composite:intersect;
}
.product-cry .product-hero-art {object-position:78% 42%}
body.product-pages .product-hero-copy {max-width:590px}
body.product-pages .product-hero h1 {font-size:clamp(44px,5.4vw,70px);line-height:1.03;margin:0 0 22px;letter-spacing:-.065em}
body.product-pages .product-hero p {max-width:430px;font-size:18px;margin:0 0 26px}
body.product-pages .product-hero-actions {gap:10px}
body.product-pages .product-hero .product-web-purchase-note {font-size:12px;margin:14px 0 0;color:var(--text-muted)}
body.product-pages .product-marquee {position:relative;margin:0 auto 24px;padding-block:10px 32px;max-width:100%;overflow:hidden}
.product-marquee-window {overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.product-marquee-track {display:flex;width:max-content;transform:translateX(0)}
.product-marquee-copy {display:flex;align-items:center;flex:none;gap:40px;padding-right:40px}
.product-marquee-copy span {white-space:nowrap;font-size:clamp(35px,5.5vw,76px);line-height:1.2;font-weight:850;letter-spacing:-.035em;color:transparent;-webkit-text-stroke:1px var(--border-strong)}
.product-marquee-copy span:nth-child(even) {color:var(--border);-webkit-text-stroke:0}
.product-marquee[data-ready=true] .product-marquee-track {animation:product-marquee-scroll 42s linear infinite}
.product-marquee:is([data-paused=true],:hover,:focus-within) .product-marquee-track {animation-play-state:paused}
body.product-pages #product-marquee-toggle {position:absolute;right:max(18px,calc((100% - 1124px)/2));bottom:0;min-height:28px;padding:4px 10px;border-radius:99px;background:var(--surface);color:var(--text-muted);font-size:11px;font-weight:500}
@keyframes product-marquee-scroll {to {transform:translateX(-50%)}}
body.product-pages .product-locations {display:flex;flex-wrap:wrap;gap:8px}
.product-location {display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid var(--border);border-radius:99px;color:var(--text-muted);font-size:12px;transition:transform .2s ease,border-color .2s ease,color .2s ease}
.product-location b {display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--surface-2);color:var(--text);font-size:10px}
@media(hover:hover) and (pointer:fine) {
  .product-location:hover {transform:scale(1.08);border-color:var(--brand);color:var(--text)}
  .product-benefit-grid article:hover .product-feature-symbol {transform:scale(1.1)}
}
.product-feature-symbol {transform-origin:left center;transition:transform .25s ease}
.product-benefit-grid article,.product-home-plans,.product-home-faq details {transition:opacity .55s ease,transform .55s cubic-bezier(.2,.6,.2,1)}
.product-reveal-pending:not(:focus-within) {opacity:0;transform:translateY(22px)}
html.ox-redesign body.product-pages #terms.product-wheel,
body.product-pages .product-device-wheel.product-wheel {
  --wheel-item:96px;display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y;
  padding:8px max(0px,calc((100% - var(--wheel-item))/2)) 12px;
  mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);
}
.product-wheel::-webkit-scrollbar {display:none}
body.product-pages #terms.product-wheel label,
body.product-pages .product-device-wheel button {
  flex:0 0 var(--wheel-item);width:var(--wheel-item);scroll-snap-align:center;scroll-snap-stop:always;
}
body.product-pages #terms.product-wheel span {height:112px}
body.product-pages .product-device-wheel button {display:grid;place-content:center;gap:4px;min-height:88px;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:16px}
body.product-pages .product-device-wheel button.product-wheel-selected {background:var(--accent);border-color:var(--accent);color:var(--ink)}
body.product-pages .product-device-wheel strong {font-size:28px;line-height:1.1;font-weight:850}
body.product-pages .product-device-wheel small {color:inherit;font-size:10px}
body.product-pages .purchase .product-device-range {position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;opacity:0;pointer-events:none;overflow:hidden;clip-path:inset(50%)}
body.product-pages .purchase:has(.product-device-range) .range-legend {display:none}
body.product-pages .product-wheel-hint {font-size:11px;color:var(--text-muted)}
body.product-pages .product-quiet-link {display:inline-block;color:var(--text-muted);margin-top:18px;font-size:13px}
body.product-pages .product-benefits {padding-block:44px 70px}
body.product-pages :is(.product-benefits,.product-plan-intro,.product-home-faq) h2 {font-size:clamp(30px,4vw,44px);line-height:1.12;margin:0 0 32px}
.product-benefit-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.product-benefit-grid article {padding:27px 30px;background:var(--surface);border-radius:22px;min-width:0}
.product-feature-symbol {display:flex;align-items:center;min-height:38px;color:var(--brand);font-size:28px;font-weight:800}
.product-benefit-grid h3 {font-size:23px;margin:18px 0 8px}
.product-benefit-grid p {font-size:14px;max-width:400px;margin:0 0 19px}
.product-benefit-grid a {font-size:13px}
.product-feature-tags {display:flex;gap:7px;flex-wrap:wrap}
.product-feature-tags span {font-size:11px;border:1px solid var(--border);padding:6px 10px;border-radius:99px;color:var(--text-muted)}
.product-client-icons {display:flex;gap:10px;min-height:38px;align-items:center}
.product-client-icons img {object-fit:contain;background:#e7edf7;border-radius:8px;padding:3px}
body.product-pages .product-home-plans {display:grid;grid-template-columns:.8fr 1.2fr;gap:65px;padding-block:30px 80px;align-items:center;scroll-margin-top:95px}
body.product-pages .product-plan-intro p {font-size:16px;margin:0}
body.product-pages :is(.product-home-plans,.product-pricing-layout)>div {min-width:0}
body.product-pages .product-home-plans .purchase h2 {display:none}
body.product-pages .purchase {background:var(--surface);border:0;border-radius:24px;padding:28px;box-shadow:none}
body.product-pages .purchase h2 {font-size:25px;margin:0 0 26px}
body.product-pages .purchase .option {margin-top:22px;font-size:14px}
body.product-pages .key-target {font-size:13px}
body.product-pages :is(input:not([type=checkbox],[type=radio],[type=range]),select) {background:var(--surface-2);border:1px solid var(--border);border-radius:12px;color:var(--text)}
body.product-pages #terms {gap:8px;grid-auto-rows:112px}
body.product-pages #terms label>span {height:100%}
body.product-pages #terms span {min-height:100px;border-radius:16px;box-shadow:none;position:relative;padding-top:18px}
body.product-pages #terms input:checked+span {transform:none;box-shadow:none;background:var(--accent);color:var(--ink);border-color:var(--accent)}
body.product-pages #terms input:checked+span small {color:var(--ink)}
body.product-pages #terms strong {font-size:29px;font-weight:850}
body.product-pages #terms small {font-size:11px}
body.product-pages #terms em {font-size:10px;font-style:normal}
body.product-pages #devices {padding:0;min-height:28px;height:28px;accent-color:var(--accent);background:transparent;border:0}
body.product-pages .whitelist-option {background:var(--surface-2);padding:16px;border:0;border-radius:16px}
body.product-pages .whitelist-option:has(:checked) {box-shadow:inset 0 0 0 1px var(--brand)}
body.product-pages .whitelist-option small {font-size:12px}
body.product-pages .promo-window {border-top:1px solid var(--border);padding-top:10px;margin-top:8px}
body.product-pages .promo-window summary {font-size:13px;color:var(--text-muted);background:none;padding:10px 0;border:0}
body.product-pages .total {padding-top:20px}
body.product-pages #total {font-size:42px;font-weight:850;letter-spacing:-.05em}
body.product-pages #buy {border:0;border-radius:99px;background:var(--accent);color:var(--ink);min-height:50px}
body.product-pages .product-payment-note {font-size:11px}
body.product-pages .product-home-faq {max-width:850px;padding-block:28px 10px}
body.product-pages .product-faq {gap:0}
body.product-pages .product-faq details {background:none;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:9px 0}
body.product-pages .product-faq summary {font-size:16px;padding:17px 26px 17px 0}
body.product-pages .product-faq details p {max-width:650px}
body.product-pages .product-page-heading {padding-block:45px 30px}
body.product-pages .product-page-heading h1 {font-size:clamp(32px,4vw,48px)}
body.product-pages .product-pricing-layout {grid-template-columns:.8fr 1.2fr;gap:65px}
body.product-pages .product-postcard {border:0;border-radius:22px;box-shadow:none;background:var(--bg)}
body.product-pages .product-postcard>img {aspect-ratio:1.1;mask-image:linear-gradient(0deg,transparent,#000 32%);opacity:.85}
body.product-pages .product-postcard>div {position:relative;background:none;padding:0 16px 20px;margin-top:-20px}
body.product-pages .product-postcard span {display:none}
body.product-pages .product-postcard strong {font-size:30px;color:var(--text)}
body.product-pages .product-start-intro {padding-block:24px 16px}
body.product-pages .product-start-hero {min-height:210px;border-radius:20px;background:var(--bg)}
body.product-pages .product-start-hero-art {animation:none}
body.product-pages .product-start-title {padding:28px;animation:none}
body.product-pages .product-start-title h1 {font-size:clamp(32px,4vw,48px)}
body.product-pages .product-start-title span {font-size:12px;color:#c5c7c1}
body.product-pages .product-start-steps {gap:18px}
body.product-pages .product-start-steps a {font-size:12px;padding-block:12px}
body.product-pages .product-start-steps a::before {height:2px}
body.product-pages .product-start-layout :target {animation:none}
body.product-pages .product-start-layout {gap:34px}
body.product-pages .product-key-option-buy {background:var(--surface);padding:22px;border-radius:20px;gap:20px}
body.product-pages .product-key-option-buy h2 {font-size:25px}
body.product-pages .product-key-option-trial {background:none;border-radius:0;padding:20px 4px}
body.product-pages .product-start-layout .existing-key {padding:22px;border-radius:20px;background:var(--surface)}
body.product-pages .product-start-layout .connect-line button {border-radius:99px}
body.product-pages .product-start-layout .connect-line input {background:var(--bg)!important}
body.product-pages .product-install {padding:0;min-width:0}
body.product-pages .product-install-heading {min-height:112px;background:var(--bg);border-radius:18px}
body.product-pages .product-connect-copy h2 {font-size:25px}
body.product-pages .product-platforms {background:var(--surface);border-radius:99px;padding:5px}
body.product-pages .product-platforms button {border-radius:99px}
body.product-pages .product-platforms [aria-pressed=true] {background:var(--surface-2);color:var(--text);box-shadow:none}
body.product-pages .product-clients>button {background:var(--surface);border:1px solid transparent;border-radius:17px;padding:14px}
body.product-pages .product-clients [aria-pressed=true] {background:var(--surface);border-color:var(--brand)}
body.product-pages .product-clients small {color:var(--text-muted)}
html.ox-redesign body.product-pages #product-download {border-radius:99px;min-height:48px}
body.product-pages .product-start-account {padding:20px;border:1px solid var(--border);border-radius:20px;background:var(--surface)}
body.product-pages .cabinet-workspace {background:none;padding-top:35px}
body.product-pages .cabinet-workspace .cabinet-wrap {max-width:1100px}
body.product-pages .cab-account-heading h1 {font-size:clamp(30px,4vw,44px)}
body.product-pages .cab-account-label {font-size:12px;color:var(--text-muted)}
body.product-pages .cab-wallet-shortcut {background:var(--surface)!important;border:0;border-radius:99px!important;padding:14px 21px}
body.product-pages .cabinet-workspace .cab-section-nav {background:var(--surface);border:0;border-radius:99px;padding:6px;box-shadow:none}
html.ox-redesign body.product-pages .cabinet-workspace .cab-section-nav .btn {border-radius:99px!important;background:none;color:var(--text);font-size:13px}
html.ox-redesign body.product-pages .cabinet-workspace .cab-section-nav a[aria-current=page] {background:var(--surface-2)!important}
body.product-pages #key-list>.key {border:0;background:var(--surface);border-radius:22px;padding:24px}
body.product-pages .product-key-art {display:none}
body.product-pages .key h3 {font-size:22px}
body.product-pages .product-key-link {background:var(--bg);border:0;border-radius:12px}
body.product-pages .product-key-link input {background:transparent}
body.product-pages .product-key-link button {background:var(--surface-2);color:var(--text);border-radius:9px}
body.product-pages .key-actions>button {border-radius:99px}
body.product-pages .product-account-connect {border:1px solid var(--border);border-radius:20px}
body.product-pages :is(.wallet-panel,.friends-panel) {border:0;background:var(--surface);border-radius:24px}
body.product-pages .amount-field {background:var(--surface-2);border:0;border-radius:18px;color:var(--text)}
body.product-pages .amount-field input {background:transparent!important;border:0;color:var(--text);font-size:42px}
body.product-pages .topup-presets button {border-radius:99px;background:var(--surface-2);color:var(--text)}
body.product-pages .topup-presets button[aria-pressed=true] {background:var(--accent);color:var(--ink)}
body.product-pages .wallet-panel button[type=submit] {border-radius:99px}
body.product-pages .product-auth-dialog {border:1px solid var(--border);border-radius:24px;background:var(--surface)}
body.product-pages .product-auth-dialog button {border-radius:99px}
body.product-pages .product-auth-dialog h2 {font-size:26px}
body.product-pages .product-auth-dialog input {background:var(--bg)}
body.product-pages .site-footer {margin-top:30px;padding-block:40px;border-top:1px solid var(--border);background:var(--bg)}
body.product-pages .product-footer-inner nav {font-size:12px}
@media(max-width:900px) {
  body.product-pages .site-header .main-nav {display:none}
  body.product-pages .product-home-plans,body.product-pages .product-pricing-layout {gap:30px;grid-template-columns:.7fr 1fr}
  body.product-pages .product-hero {min-height:520px}
  body.product-pages .product-hero h1 {font-size:54px}
  body.product-pages .product-hero p {font-size:16px;max-width:360px}
}
@media(max-width:670px) {
  body.product-pages:not([data-page=home]) .header-actions .product-bot-link {display:none}
  body.product-pages .site-header .header-inner {min-height:66px;padding-inline:18px;gap:12px}
  body.product-pages .brand-logo {font-size:17px;gap:8px}
  body.product-pages .product-brand-mark {width:28px;height:28px}
  body.product-pages .product-bot-link {padding:10px 14px;font-size:12px}
  html.ox-redesign body.product-pages .product-cabinet-link.btn-primary {padding:10px 13px;font-size:12px;min-height:40px}
  body.product-pages[data-page=home] .product-menu-toggle {display:none}
  body.product-pages .product-hero {display:block;min-height:0;padding-top:230px;padding-bottom:40px}
  .product-hero-art {width:110%;height:350px;top:-20px;right:-15%;object-position:65% 32%;
    mask-image:linear-gradient(90deg,transparent,#000 18%,#000 88%,transparent),
      linear-gradient(0deg,transparent 0%,#000 45%,#000 80%,transparent 100%);
    mask-composite:intersect;}
  .product-cry .product-hero-art {object-position:75% 38%}
  body.product-pages .product-hero h1 {font-size:clamp(38px,10vw,52px);margin-bottom:17px}
  body.product-pages .product-hero p {font-size:15px;max-width:360px;margin-bottom:22px}
  body.product-pages .product-hero-actions .btn {flex:none;font-size:13px;min-height:50px;padding-inline:20px}
  body.product-pages .product-hero-actions {display:grid;grid-template-columns:minmax(0,1fr);max-width:360px}
  body.product-pages .product-hero-actions .btn {width:100%}
  body.product-pages .product-hero .product-web-purchase-note {font-size:11px;margin-top:12px}
  .product-marquee-copy {gap:24px;padding-right:24px}
  .product-location {font-size:10px;padding:5px 7px;gap:5px}
  .product-location b {width:20px;height:20px;font-size:9px}
  body.product-pages .product-benefits {padding-block:24px 40px}
  body.product-pages :is(.product-benefits,.product-plan-intro,.product-home-faq) h2 {font-size:31px;margin-bottom:24px}
  .product-benefit-grid {gap:10px}
  .product-benefit-grid article {padding:18px 15px;border-radius:18px}
  .product-benefit-grid h3 {font-size:18px;margin-top:14px}
  .product-benefit-grid p {font-size:12px;margin-bottom:15px}
  .product-benefit-grid a {font-size:11px}
  .product-feature-tags {gap:4px}
  .product-feature-tags span {font-size:9px;padding:4px 7px}
  .product-client-icons {gap:5px}
  .product-client-icons img {width:25px;height:25px}
  body.product-pages .product-home-plans {grid-template-columns:1fr;gap:24px;padding-block:14px 40px}
  body.product-pages .product-plan-intro .product-quiet-link {display:none}
  body.product-pages .product-plan-intro p br {display:none}
  body.product-pages .product-plan-intro p {font-size:14px}
  body.product-pages .purchase {padding:21px 17px;border-radius:20px}
  body.product-pages #terms {grid-auto-rows:104px}
  body.product-pages #terms span {min-height:90px;border-radius:13px}
  body.product-pages #terms strong {font-size:26px}
  body.product-pages .product-home-faq {padding-top:22px}
  body.product-pages .product-faq summary {font-size:15px}
  body.product-pages .product-start-hero {min-height:165px}
  body.product-pages .product-start-title {padding:18px}
  body.product-pages .product-start-title h1 {font-size:32px}
  body.product-pages .product-start-layout {grid-template-columns:1fr;gap:28px}
  body.product-pages .product-start-steps {gap:10px}
  body.product-pages .product-key-option-buy,body.product-pages .product-start-layout .existing-key {padding:18px}
  body.product-pages .product-key-option-trial {padding:15px 2px}
  body.product-pages .product-pricing-layout,body.product-pages .product-wallet-layout,body.product-pages .product-referrals-layout {grid-template-columns:1fr;gap:20px}
  body.product-pages .product-postcard>img {max-height:180px;object-fit:cover}
  body.product-pages .product-postcard strong {font-size:25px}
  body.product-pages .cabinet-workspace .cab-section-nav {border-radius:18px}
  html.ox-redesign body.product-pages .cabinet-workspace .cab-section-nav .btn {font-size:10px;padding:9px 3px;min-height:42px}
  body.product-pages .cab-wallet-shortcut {width:auto;border-radius:99px!important;gap:10px}
  body.product-pages .cab-wallet-shortcut small {margin-left:0}
  body.product-pages #key-list>.key {padding:20px}
}
@media(prefers-reduced-motion:reduce) {body.product-pages * {animation:none!important;transition:none!important;scroll-behavior:auto!important}}
