/* Shared app-site layout. Product imagery retains its original colours. */
.actual-logo { width: 112px; height: 62px; object-fit: contain; mix-blend-mode: multiply; }
.product-nav { border-bottom: 1px solid var(--line); background: #fff; }
.product-nav > .container { display: flex; justify-content: space-between; gap: 25px; align-items: center; min-height: 72px; padding-block: 10px; }
.product-nav-name { display: flex; align-items: center; gap: 12px; font-weight: 600; font-size: 14px; }
.nav-app-icon { width: 32px; height: 32px; object-fit: contain; border-radius: 8px; }
.product-nav nav { display: flex; flex-wrap: wrap; align-items: center; gap: 25px; font-size: 12px; }
.product-nav [aria-current="page"] { color: #171719; font-weight: 700; }
.app-hero { display: grid; grid-template-columns: 1fr 1.08fr; gap: 65px; align-items: center; padding-block: 80px; }
.app-hero h1, .support-hero h1 { font-size: clamp(40px,4.7vw,67px); line-height: 1.1; letter-spacing: -3px; }
.app-hero .eyebrow { margin-bottom: 22px; }
.hero-app-icon { width: 62px; height: 62px; object-fit: contain; border-radius: 15px; margin-bottom: 20px; display: block; }
.app-intro { font-size: 16px; line-height: 1.8; color: var(--muted); max-width: 465px; }
.page-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 28px; }
.text-link { font-size: 13px; font-weight: 550; border-bottom: 1px solid #c7c7cc; padding-block: 8px; }
.app-note { max-width: 430px; font-size: 11px; color: var(--muted); line-height: 1.65; margin: 20px 0 0; }
figure { margin: 0; }
figcaption { color: var(--muted); font-size: 10px; line-height: 1.6; margin-top: 14px; }
.app-stage { min-width: 0; overflow: hidden; border-radius: 22px; background: #eeeef0; }
.comparison-stage { padding: 0; background: #e5e5e7; }
.comparison-image { width: 100%; height: auto; display: block; }
.phone-stage { min-height: 565px; display: flex; align-items: center; justify-content: center; gap: 23px; padding: 36px; background: radial-gradient(ellipse at 50% 20%,#f7f7f8,#e3e3e7); }
.actual-screen { width: min(46%,210px); height: auto; border-radius: 25px; box-shadow: 0 18px 38px #0002; border: 5px solid #2b2b2e; }
.secondary-screen { transform: translateY(25px); }
.icon-stage { min-height: 510px; display: grid; place-items: center; background: radial-gradient(ellipse at 50% 20%,#f7f7f8,#e3e3e7); }
.showcase-icon { width: 60%; max-width: 290px; height: auto; filter: drop-shadow(0 25px 20px #0002); }
.dark-stage { background: radial-gradient(ellipse at 50% 30%,#353538,#101012); }
.wide-hero { display: block; text-align: center; padding-bottom: 30px; }
.wide-hero .eyebrow, .wide-hero .page-actions { justify-content: center; }
.wide-hero .app-intro, .wide-hero .app-note { margin-inline: auto; max-width: 590px; }
.wide-hero .app-hero-figure { margin-top: 50px; }
.dashboard-stage { border: 1px solid #dedee3; padding: 8px; background: #fff; }
.dashboard-image { display: block; width: 100%; border-radius: 16px; }
.page-section { padding-block: 80px; }
.page-section .principles { margin-top: 35px; }
.gallery-section { background: #eeeef0; padding-block: 80px; }
.screenshot-gallery { display: grid; grid-template-columns: repeat(3,1fr); gap: 35px; max-width: 870px; margin: 50px auto 0; }
.screenshot-gallery figure { text-align: center; min-width: 0; }
.gallery-screen { display: block; width: 100%; height: auto; border-radius: 20px; border: 1px solid #d1d1d6; box-shadow: 0 12px 25px #0001; }
.page-close { border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 40px; margin-bottom: 30px; }
.page-close h2 { font-size: 34px; }
.page-close .page-actions { margin: 0; }
.legal-links { display: flex; flex-wrap: wrap; gap: 22px; }
.comparison-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.comparison-grid img { border-radius: 18px; }
.business-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 36px 65px; margin-top: 42px; }
.business-grid article { border-top: 1px solid #d2d2d7; padding-top: 20px; }
.business-grid p { font-size: 14px; color: var(--muted); }
.support-hero { padding-block: 75px 50px; }
.support-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 90px; padding-bottom: 100px; align-items: start; }
.support-grid h2 { font-size: 31px; }
.support-grid .policy-list { margin-top: 25px; }
.support-grid details p { margin: 0; }
.support-contact { background: #ededf0; border-radius: 20px; padding: 35px; }
.support-contact > p:not(.eyebrow) { color: var(--muted); font-size: 13px; margin-block: 20px; }
.support-contact .button { margin-top: 12px; }
.support-contact a { overflow-wrap: anywhere; }
.legal-layout { display: grid; grid-template-columns: 250px minmax(0,1fr); gap: 75px; padding-block: 65px 90px; align-items: start; }
.legal-sidebar { position: sticky; top: 130px; }
.legal-sidebar h2 { font-size: 23px; letter-spacing: -.7px; }
.legal-sidebar nav { display: grid; gap: 14px; margin-top: 28px; font-size: 12px; color: var(--muted); }
.legal-sidebar [aria-current="page"] { font-weight: 700; color: var(--ink); }
.legal-original { min-width: 0; max-width: 790px; }
.legal-original .container { width: 100%; max-width: none; margin: 0; padding: 0; }
.legal-original .header, .legal-original .legal-heading { position: static; background: none; border: 0; backdrop-filter: none; padding: 0; }
.legal-original h1 { font-size: 44px; letter-spacing: -2px; line-height: 1.15; margin: 0 0 25px; }
.legal-original h2 { font-size: 23px; letter-spacing: -.6px; line-height: 1.4; margin: 36px 0 15px; }
.legal-original h3 { font-size: 17px; letter-spacing: -.3px; line-height: 1.4; margin: 25px 0 12px; }
.legal-original p, .legal-original li { font-size: 14px; line-height: 1.8; color: #55555c; }
.legal-original li { margin-block: 7px; }
.legal-original a { color: #0066cc; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal-original .meta, .legal-original .date, .legal-original .effective-date { font-size: 12px; color: var(--muted); padding-block: 10px; }
.legal-original .highlight-box, .legal-original .callout { background: #eeeef0; border-left: 2px solid #b9b9c2; padding: 20px; border-radius: 0 10px 10px 0; margin-block: 25px; font-size: 14px; }
.legal-original .content-card { border-top: 1px solid var(--line); padding-top: 10px; margin-top: 28px; }
.legal-original .section-number { color: #86868b; display: inline-block; margin-right: 12px; }
.legal-original .card { background: none; border: none; box-shadow: none; padding: 0; }
.home-real-hero { min-width: 0; }
.home-screen-stage { background: radial-gradient(ellipse at 50% 25%,#fff,#e2e2e7); border-radius: 24px; min-height: 565px; padding: 35px; display: flex; align-items: center; justify-content: center; gap: 24px; overflow: hidden; }
.home-screen { display: block; width: min(46%,220px); height: auto; box-shadow: 0 16px 30px #0002; border-radius: 20px; }
.screen-one { transform: translateY(-20px); border: 5px solid #29292e; }
.screen-two { transform: translateY(20px); }
.home-real-hero figcaption { padding-left: 3px; }
.real-art { display: flex; align-items: center; justify-content: center; flex-direction: row; padding: 25px; background: #e9e9ed; }
.real-phone-art { gap: 24px; }
.card-screen { width: auto; height: 100%; border-radius: 15px; border: 3px solid #333338; box-shadow: 0 10px 22px #0002; }
.real-comparison-art, .real-dashboard-art { padding: 0; }
.card-comparison, .card-dashboard { width: 100%; height: 100%; object-fit: contain; display: block; }
.real-comparison-art { background: #535355; }
.real-dashboard-art { background: #e4e4e9; padding: 12px; }
.card-dashboard { border-radius: 10px; }
.real-icon-art { background: radial-gradient(ellipse at center,#333336,#161618); }
.card-app-icon { width: 195px; height: 195px; object-fit: contain; }
.card-heading-icon { width: 39px; height: 39px; object-fit: contain; float: left; margin: 0 13px 10px 0; border-radius: 9px; }
.product-body .product-meta { min-height: 39px; }
.product-body h3 { clear: both; }
.snapshot-icon { width: 120px; height: 120px; object-fit: contain; margin: 20px; }
.filter-row button { white-space: nowrap; }
@media(max-width:1050px) {
  .app-hero { gap: 35px; padding-block: 55px; }
  .phone-stage { padding: 25px; gap: 15px; min-height: 430px; }
  .home-screen-stage { padding: 25px; gap: 16px; min-height: 475px; }
  .icon-stage { min-height: 430px; }
  .legal-layout { gap: 40px; grid-template-columns: 210px minmax(0,1fr); }
  .support-grid { gap: 40px; }
}
@media(max-width:720px) {
  .actual-logo { width: 92px; height: 38px; }
  .product-nav > .container { flex-direction: column; align-items: flex-start; gap: 8px; padding-block: 15px; }
  .product-nav-name { font-size: 13px; }
  .product-nav nav { gap: 20px; font-size: 11px; }
  .nav-app-icon { width: 26px; height: 26px; }
  .app-hero { grid-template-columns: 1fr; gap: 34px; padding-block: 42px; }
  .app-hero h1, .support-hero h1 { font-size: 44px; letter-spacing: -2px; }
  .app-intro { font-size: 14px; }
  .hero-app-icon { width: 51px; height: 51px; margin-bottom: 18px; }
  .app-note { font-size: 10px; }
  .page-actions { gap: 18px; }
  .page-actions .button { padding: 13px 19px; gap: 28px; }
  .phone-stage { min-height: 415px; padding: 22px; }
  .actual-screen { border-radius: 18px; border-width: 3px; }
  .icon-stage { min-height: 350px; }
  .wide-hero { text-align: left; }
  .wide-hero .eyebrow, .wide-hero .page-actions { justify-content: flex-start; }
  .dashboard-stage { padding: 4px; border-radius: 10px; }
  .dashboard-image { border-radius: 7px; }
  .wide-hero .app-hero-figure { margin-top: 35px; }
  .page-section, .gallery-section { padding-block: 50px; }
  .screenshot-gallery { gap: 18px; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding: 5px 0 20px; margin-top: 30px; }
  .screenshot-gallery figure { flex: 0 0 64%; scroll-snap-align: start; }
  .gallery-screen { border-radius: 15px; }
  .page-close { flex-direction: column; align-items: flex-start; gap: 20px; }
  .page-close h2 { font-size: 29px; }
  .comparison-grid, .business-grid { grid-template-columns: 1fr; gap: 30px; }
  .support-hero { padding-block: 42px 35px; }
  .support-grid { grid-template-columns: 1fr; gap: 40px; padding-bottom: 50px; }
  .support-contact { padding: 26px; }
  .support-grid h2 { font-size: 29px; }
  .legal-layout { grid-template-columns: 1fr; gap: 35px; padding-block: 40px 55px; }
  .legal-sidebar { position: static; border-bottom: 1px solid var(--line); padding-bottom: 25px; }
  .legal-sidebar .hero-app-icon { float: left; margin: 0 15px 0 0; }
  .legal-sidebar h2 { font-size: 22px; min-height: 51px; }
  .legal-sidebar nav { display: flex; flex-wrap: wrap; gap: 13px 22px; clear: both; }
  .legal-original h1 { font-size: 34px; letter-spacing: -1px; }
  .legal-original h2 { font-size: 21px; }
  .legal-original p, .legal-original li { font-size: 14px; }
  .legal-original ul { padding-left: 22px; }
  .home-screen-stage { min-height: 420px; padding: 22px; gap: 16px; }
  .home-screen { border-radius: 13px; }
  .screen-one { border-width: 3px; }
  .home-real-hero figcaption { font-size: 9px; }
  .snapshot-icon { width: 55px; height: 55px; margin: 10px 6px 0 0; }
  .product-wide .product-body { flex-basis: 0; }
  .product-wide .product-meta { align-items: flex-start; }
  .product-links { gap: 14px 18px; }
  .real-phone-art { gap: 18px; }
}
@media(max-width:380px) {
  .filter-row button { padding: 8px 10px; font-size: 10px; }
  .home-screen-stage, .phone-stage { min-height: 360px; padding: 18px; gap: 12px; }
  .app-hero h1, .support-hero h1 { font-size: 39px; }
  .snapshot-icon { display: none; }
  .product-nav nav { gap: 15px; }
}