/* Roga vs. Others for phones — copied from the landing page (start.rogalife.com/calm/f/top, section#compare).
   The landing's own rules for this section, scoped to #compare-m. Shown only up to 860px; desktop keeps .compare. */
#compare-m{--text:#ae88c8;--border-soft:rgba(26, 59, 60, .06);--accent-soft:#3D6E6F;--bg-2:#f0f0f0;--bg:#f0f0f0;--stage-fg:#ae88c8;--dur-sm:200ms;--ease-out:cubic-bezier(0.23, 1, 0.32, 1);--dur-xs:120ms;--muted:#ae88c8;--text-strong:#ae88c8;--accent:#ae88c8;font-family:-apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", Arial, sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
:where(#compare-m), :where(#compare-m) *{--tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / .5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ;}
:where(#compare-m)::before, :where(#compare-m) *::before{--tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / .5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ;}
:where(#compare-m)::after, :where(#compare-m) *::after{--tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / .5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: ;}
:where(#compare-m), :where(#compare-m) *{box-sizing: border-box; border-width: 0px; border-style: solid; border-color: rgb(229, 231, 235);}
:where(#compare-m)::before, :where(#compare-m) *::before{box-sizing: border-box; border-width: 0px; border-style: solid; border-color: rgb(229, 231, 235);}
:where(#compare-m)::after, :where(#compare-m) *::after{box-sizing: border-box; border-width: 0px; border-style: solid; border-color: rgb(229, 231, 235);}
:where(#compare-m)::before, :where(#compare-m) *::before{--tw-content: "";}
:where(#compare-m)::after, :where(#compare-m) *::after{--tw-content: "";}
:where(#compare-m) h2{font-size: inherit; font-weight: inherit;}
:where(#compare-m) a{color: inherit; text-decoration: inherit;}
:where(#compare-m) table{text-indent: 0px; border-color: inherit; border-collapse: collapse;}
:where(#compare-m) h2{margin: 0px;}
:where(#compare-m) p{margin: 0px;}
:where(#compare-m) img{display: block; vertical-align: middle;}
:where(#compare-m) img{max-width: 100%; height: auto;}
:where(#compare-m) .mx-auto{margin-left: auto; margin-right: auto;}
:where(#compare-m) .mb-16{margin-bottom: 4rem;}
:where(#compare-m) .mb-4{margin-bottom: 1rem;}
:where(#compare-m) .mb-5{margin-bottom: 1.25rem;}
:where(#compare-m) .text-center{text-align: center;}
:where(#compare-m), :where(#compare-m) *{box-sizing: border-box;}
:where(#compare-m)::before, :where(#compare-m) *::before{box-sizing: border-box;}
:where(#compare-m)::after, :where(#compare-m) *::after{box-sizing: border-box;}
@media (prefers-reduced-motion: reduce){:where(#compare-m), :where(#compare-m) *{animation-duration: 0.01ms !important; transition-duration: 0.01ms !important;}}
@media (prefers-reduced-motion: reduce){:where(#compare-m)::before, :where(#compare-m) *::before{animation-duration: 0.01ms !important; transition-duration: 0.01ms !important;}}
@media (prefers-reduced-motion: reduce){:where(#compare-m)::after, :where(#compare-m) *::after{animation-duration: 0.01ms !important; transition-duration: 0.01ms !important;}}
:where(#compare-m) .apple-container{margin-left: auto; margin-right: auto; padding-left: 1.5rem; padding-right: 1.5rem;}
@media (min-width: 768px){:where(#compare-m) .apple-container{padding-left: 3rem; padding-right: 3rem;}}
:where(#compare-m) .apple-container{max-width: 1024px;}
:where(#compare-m) .apple-container-sm{margin-left: auto; margin-right: auto; padding-left: 1.5rem; padding-right: 1.5rem; max-width: 692px;}
#compare-m{padding-top: 7rem; padding-bottom: 7rem;}
@media (min-width: 768px){#compare-m{padding-top: 10rem; padding-bottom: 10rem;}}
#compare-m{background: var(--bg-2);}
:where(#compare-m) .apple-headline{font-size: clamp(2.2rem, 5.5vw, 4.5rem); font-weight: 600; letter-spacing: -0.02em; line-height: 1.06; color: var(--text-strong);}
:where(#compare-m) .apple-eyebrow-blue{font-size: 12px; font-weight: 600; color: var(--accent-soft); letter-spacing: 0.14em; text-transform: uppercase; display: block;}
:where(#compare-m) .apple-body{font-size: 19px; line-height: 1.7; color: var(--muted); font-weight: 400;}
:where(#compare-m) .cmp-wrap[data-astro-cid-blu2ev5g]{background: var(--bg); border-radius: 22px; border: 1px solid var(--border-soft); padding: 12px 4px 16px; overflow-x: auto;}
:where(#compare-m) .cmp-table[data-astro-cid-blu2ev5g]{width: 100%; border-collapse: collapse; min-width: 720px;}
:where(#compare-m) .cmp-table[data-astro-cid-blu2ev5g] th[data-astro-cid-blu2ev5g]{padding: 18px 16px; text-align: center; border-bottom: 1px solid var(--border-soft);}
:where(#compare-m) .cmp-table[data-astro-cid-blu2ev5g] td[data-astro-cid-blu2ev5g]{padding: 18px 16px; text-align: center; border-bottom: 1px solid var(--border-soft);}
:where(#compare-m) .cmp-table[data-astro-cid-blu2ev5g] tr[data-astro-cid-blu2ev5g]:last-child td[data-astro-cid-blu2ev5g]{border-bottom: 0px;}
:where(#compare-m) .cmp-table[data-astro-cid-blu2ev5g] th[data-astro-cid-blu2ev5g]{font-size: 13px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em;}
:where(#compare-m) .cmp-feat[data-astro-cid-blu2ev5g]{text-align: left; font-size: 15px; color: var(--text); font-weight: 500; min-width: 260px;}
:where(#compare-m) .cmp-col-roga[data-astro-cid-blu2ev5g]{background: linear-gradient(rgba(215, 230, 241, 0.45), rgba(215, 230, 241, 0.15));}
:where(#compare-m) .cmp-cell[data-astro-cid-blu2ev5g]{font-size: 22px; font-weight: 600; color: var(--muted); line-height: 1;}
:where(#compare-m) .cmp-cell[data-astro-cid-blu2ev5g].yes{color: rgb(46, 122, 79);}
:where(#compare-m) .cmp-cell[data-astro-cid-blu2ev5g].no{color: rgba(26, 59, 60, 0.35);}
:where(#compare-m) .cmp-col-roga[data-astro-cid-blu2ev5g].cmp-cell.yes{color: rgb(26, 107, 62);}
#compare-m{background: transparent !important;}
#compare-m{background: transparent !important;}
:where(#compare-m) :is(h1, h2, h3, h4, h5, h6){color: var(--stage-fg) !important;}
:where(#compare-m) :is(p, li, dt, dd, label, span){color: var(--stage-fg) !important;}
:where(#compare-m) .apple-headline{color: var(--stage-fg) !important;}
:where(#compare-m) .apple-body{color: var(--stage-fg) !important;}
:where(#compare-m) .apple-eyebrow-blue{color: var(--stage-fg) !important;}
:where(#compare-m) .cmp-wrap{background: rgba(255, 255, 255, 0.08) !important; border-color: rgba(255, 255, 255, 0.25) !important;}
:where(#compare-m) .cmp-table th{border-color: rgba(255, 255, 255, 0.18) !important; color: var(--stage-fg) !important;}
:where(#compare-m) .cmp-table td{border-color: rgba(255, 255, 255, 0.18) !important; color: var(--stage-fg) !important;}
:where(#compare-m) .cmp-feat{border-color: rgba(255, 255, 255, 0.18) !important; color: var(--stage-fg) !important;}
:where(#compare-m) .cmp-table-2col{table-layout: fixed; width: 100%; border-collapse: collapse; min-width: 0px !important;}
:where(#compare-m) .cmp-table-2col th{word-break: normal; overflow-wrap: anywhere;}
:where(#compare-m) .cmp-table-2col td{word-break: normal; overflow-wrap: anywhere;}
:where(#compare-m) .cmp-table-2col th{padding: 14px 12px; font-size: 14px;}
:where(#compare-m) .cmp-table-2col td.cmp-cell{text-align: left; vertical-align: middle; padding: 14px 12px;}
:where(#compare-m) .cmp-table-2col .cmp-feat{width: 34%; font-size: 14px; font-weight: 500; padding: 14px 12px;}
:where(#compare-m) .cmp-table-2col .cmp-col-roga{width: 33%; font-weight: 500;}
:where(#compare-m) .cmp-table-2col th + th + th{width: 33%;}
:where(#compare-m) .cmp-table-2col .cmp-mark{display: inline-flex; align-items: center; margin-right: 8px; vertical-align: middle; line-height: 0;}
:where(#compare-m) .cmp-table-2col .cmp-mark-yes{color: rgb(174, 136, 200);}
:where(#compare-m) .cmp-table-2col .cmp-mark-no{color: rgb(151, 162, 166);}
:where(#compare-m) .cmp-table-2col .cmp-detail{font-size: 13px; color: inherit; line-height: 1.4; display: inline-block; vertical-align: middle;}
:where(#compare-m) .cmp-wrap{box-shadow: rgba(26, 59, 60, 0.1) 0px 18px 48px; background: rgba(255, 255, 255, 0.92) !important; border-color: rgba(255, 255, 255, 0.65) !important; overflow: visible !important;}
:where(#compare-m) .cmp-wrap{color: rgb(26, 59, 60) !important;}
:where(#compare-m) .cmp-wrap .cmp-feat{color: rgb(26, 59, 60) !important;}
:where(#compare-m) .cmp-wrap .cmp-detail{color: rgb(26, 59, 60) !important;}
:where(#compare-m) .cmp-wrap th{color: rgb(26, 59, 60) !important;}
:where(#compare-m) .cmp-wrap td{color: rgb(26, 59, 60) !important;}
:where(#compare-m) .cmp-wrap th{text-transform: uppercase; letter-spacing: 0.06em; font-size: 12px; border-bottom: 1px solid rgba(26, 59, 60, 0.1); color: rgb(74, 92, 93) !important;}
:where(#compare-m) .cmp-wrap td{border-bottom: 1px solid rgba(26, 59, 60, 0.06);}
:where(#compare-m) .cmp-wrap tbody tr:last-child td{border-bottom: 0px;}
:where(#compare-m) .cmp-wrap .cmp-feat{color: rgb(26, 59, 60) !important; font-weight: 600;}
:where(#compare-m) .cmp-wrap .cmp-detail{color: rgb(74, 92, 93) !important;}
:where(#compare-m) .cmp-wrap .cmp-col-roga{background: rgba(174, 136, 200, 0.05);}
:where(#compare-m) .cmp-wrap .cmp-col-roga.cmp-cell.yes .cmp-detail{color: rgb(26, 59, 60) !important; font-weight: 500;}
@media (max-width: 720px){:where(#compare-m) .cmp-table-2col .cmp-feat{width: 38%; font-size: 13px; padding: 10px 8px;}}
@media (max-width: 720px){:where(#compare-m) .cmp-table-2col td.cmp-cell{padding: 10px 8px;}}
@media (max-width: 720px){:where(#compare-m) .cmp-table-2col .cmp-detail{font-size: 12px;}}
@media (max-width: 720px){:where(#compare-m) .cmp-table-2col th{font-size: 13px; padding: 10px 8px;}}
@media (max-width: 480px){:where(#compare-m) .cmp-table-2col .cmp-mark{margin-right: 4px;}}
@media (max-width: 480px){:where(#compare-m) .cmp-table-2col .cmp-detail{display: block; margin-top: 4px;}}
#compare-m{position: relative; z-index: 1;}
#compare-m{position: relative; z-index: 1;}
:where(#compare-m) .apple-container{position: relative; z-index: 1;}
:where(#compare-m) .apple-container-sm{position: relative; z-index: 1;}
@media (min-width: 769px){:where(#compare-m) .apple-container-sm{margin-left: auto !important; margin-right: clamp(24px, 5vw, 80px) !important; max-width: clamp(420px, 42vw, 620px) !important; text-align: left !important;}}
:where(#compare-m) .cmp-table-2col .cmp-col-roga{text-align: center; padding: 12px 8px !important;}
#compare-m .cmp-table-2col td{vertical-align: top !important; padding-top: 20px !important; padding-bottom: 20px !important;}
#compare-m .cmp-table-2col td.cmp-cell{text-align: center !important;}
#compare-m .cmp-table-2col td.cmp-cell .cmp-mark{display: inline-flex !important; margin: 0px auto 10px !important; line-height: 0 !important; height: 22px !important;}
#compare-m .cmp-table-2col td.cmp-cell .cmp-detail{font-size: 13px; line-height: 1.35; display: block !important; margin: 0px auto !important; text-align: center !important;}
#compare-m .cmp-table-2col td.cmp-feat{padding-top: 52px !important;}
#compare-m{padding-top: 0.5rem !important;}
@media (min-width: 1025px){#compare-m{padding-top: 1rem !important;}}
:where(#compare-m) .section-cta-wrap{display: flex; justify-content: center; margin: clamp(38px, 5vh, 64px) 0px clamp(10px, 2vh, 24px); position: relative; z-index: 3;}
:where(#compare-m) .section-cta{display: inline-flex; align-items: center; gap: 10px; font-family: Calibri, Carlito, "Segoe UI", sans-serif; font-size: 17px; font-weight: 600; line-height: 1; color: rgb(255, 255, 255); background: rgba(140, 151, 174, 0.92); border-radius: 999px; padding: 16px 34px; text-decoration: none; box-shadow: rgba(26, 59, 60, 0.18) 0px 8px 24px; transition: background 0.25s, transform 0.2s, box-shadow 0.25s;}
:where(#compare-m) .section-cta:hover{background: rgb(140, 151, 174); transform: translateY(-2px); box-shadow: rgba(26, 59, 60, 0.24) 0px 12px 30px;}
@media (prefers-reduced-motion: reduce){:where(#compare-m) .section-cta{transition: none;}}
#compare-m.section-apple-gray{position: relative; overflow: hidden; background: linear-gradient(to right, rgb(111, 122, 130), rgb(180, 188, 207)) !important;}
#compare-m.section-apple-gray::before{content: ""; position: absolute; inset: 0px; background: url("../img/compare/inner-halo-competitors.webp") right center / 100% no-repeat; z-index: 0; pointer-events: none;}
#compare-m.section-apple-gray > :not(.cmp-halo){position: relative; z-index: 1;}
@media (max-width: 1024px){#compare-m.section-apple-gray::before{background-position: center center !important; background-size: cover !important;}}
@media (max-width: 1024px){#compare-m .cmp-roga-highlight{left: 31% !important; width: 42% !important; top: -10px !important; bottom: -10px !important;}}
#compare-m .cmp-wrap{position: relative;}
#compare-m .cmp-roga-highlight{position: absolute; top: -18px; bottom: -18px; left: 31.5%; width: 38%; background: url("../img/compare/competitors-highlight.webp") center center / 100% 100% no-repeat; z-index: 0; pointer-events: none;}
#compare-m .cmp-wrap .cmp-table{position: relative; z-index: 1;}
#compare-m .cmp-table-2col td{vertical-align: middle !important; padding-top: 18px !important; padding-bottom: 18px !important;}
#compare-m .cmp-table-2col td.cmp-feat{vertical-align: middle !important; padding-top: 18px !important; padding-bottom: 18px !important;}
#compare-m .cmp-table-2col td.cmp-cell{vertical-align: middle !important; padding-top: 18px !important; padding-bottom: 18px !important;}
@media (max-width: 1024px){#compare-m .cmp-table-2col td{vertical-align: middle !important;}}
@media (max-width: 1024px){#compare-m .cmp-table-2col td.cmp-feat{vertical-align: middle !important;}}
@media (max-width: 1024px){#compare-m .cmp-table-2col td.cmp-cell{vertical-align: middle !important;}}
@media (max-width: 1024px){#compare-m .cmp-table-2col td.cmp-cell{text-align: center !important;}}
@media (max-width: 1024px){#compare-m .cmp-table-2col td.cmp-cell .cmp-mark{display: flex !important; justify-content: center !important; margin: 0px auto 6px !important;}}
@media (max-width: 1024px){#compare-m .cmp-table-2col td.cmp-cell .cmp-detail{display: block !important; text-align: center !important; margin: 0px auto !important;}}
@media (max-width: 720px){#compare-m > .apple-container{padding-left: 8px !important; padding-right: 8px !important;}}
@media (max-width: 720px){#compare-m .cmp-wrap{padding-left: 0px !important; padding-right: 0px !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col th{padding-left: 5px !important; padding-right: 5px !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td{padding-left: 5px !important; padding-right: 5px !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-feat{padding-left: 5px !important; padding-right: 5px !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-cell{padding-left: 5px !important; padding-right: 5px !important;}}
@media (max-width: 720px){#compare-m .apple-container-sm{padding-left: 1.5rem !important; padding-right: 1.5rem !important;}}
@media (min-width: 1025px){#compare-m .cmp-table-2col td.cmp-cell{text-align: left !important; padding-left: 60px !important;}}
@media (min-width: 1025px){#compare-m .cmp-table-2col td.cmp-col-roga{padding-left: 34px !important;}}
@media (min-width: 1025px){#compare-m .cmp-table-2col td.cmp-cell .cmp-detail{white-space: nowrap;}}
@media (min-width: 1025px){#compare-m .cmp-table-2col td.cmp-cell .cmp-mark{display: inline-flex !important; align-items: center !important; margin: 0px 10px 0px 0px !important; height: auto !important; vertical-align: middle !important;}}
@media (min-width: 1025px){#compare-m .cmp-table-2col td.cmp-cell .cmp-detail{display: inline-block !important; margin: 0px !important; vertical-align: middle !important; text-align: left !important;}}
#compare-m .cmp-mark-img{width: 24px; height: 24px; display: block;}
#compare-m .cmp-mark{background: none !important; border: 0px !important; box-shadow: none !important;}
#compare-m .cmp-wrap{background: transparent !important; border: 0px !important; box-shadow: none !important; backdrop-filter: none !important;}
#compare-m .cmp-wrap{background: transparent !important; border: 0px !important; box-shadow: none !important; backdrop-filter: none !important;}
#compare-m .cmp-wrap .cmp-col-roga{background: transparent !important;}
#compare-m .cmp-wrap .cmp-col-roga{background: transparent !important;}
#compare-m .cmp-wrap{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap th{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap td{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap .cmp-feat{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap .cmp-detail{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap th{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap td{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap .cmp-feat{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap .cmp-detail{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap .cmp-col-roga.cmp-cell.yes .cmp-detail{color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important;}
#compare-m .cmp-wrap th{border-color: rgba(255, 255, 255, 0.18) !important;}
#compare-m .cmp-wrap td{border-color: rgba(255, 255, 255, 0.18) !important;}
#compare-m .cmp-table thead th{font-family: Hero, sans-serif !important; font-weight: 300 !important; font-size: clamp(15px, 1.3vw, 19px) !important;}
#compare-m .apple-headline{font-family: "Saral Devanagari", "Noto Sans Devanagari", sans-serif !important; font-size: clamp(2.3rem, 5.2vw, 3.6rem) !important; letter-spacing: -0.02em !important; line-height: 1.1 !important; color: rgb(255, 255, 255) !important; -webkit-text-fill-color: rgb(255, 255, 255) !important; margin-top: clamp(80px, 12vh, 140px) !important; margin-bottom: clamp(60px, 9vh, 100px) !important;}
:where(#compare-m) .section-cta{transition: transform var(--dur-xs) var(--ease-out),
                background-color var(--dur-sm) ease,
                opacity var(--dur-sm) ease;}
:where(#compare-m) .section-cta:active{transform: scale(0.97);}
@media (hover: none), (pointer: coarse){:where(#compare-m) .section-cta:hover{transform: none !important;}}
@media (prefers-reduced-motion: reduce){:where(#compare-m) .section-cta:active{transform: none !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-cell{position: relative; vertical-align: top !important; padding-top: 48px !important; padding-bottom: 18px !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-feat{position: relative; vertical-align: top !important; padding-top: 48px !important; padding-bottom: 18px !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-cell .cmp-mark{top: 14px; left: 50%; transform: translateX(-50%); align-items: center; justify-content: center; position: absolute !important; margin: 0px !important; height: 22px !important; line-height: 0 !important; display: flex !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-cell .cmp-mark-img{height: 22px; width: auto; display: block;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-cell .cmp-detail{line-height: 1.35; display: block !important; margin: 0px auto !important; text-align: center !important;}}
@media (max-width: 720px){#compare-m .cmp-table-2col td.cmp-feat{line-height: 1.35; display: table-cell !important; text-align: center !important;}}
#compare-m .cmp-halo{position: absolute; left: 56%; transform: translate(-50%, -50%); width: min(1500px, 120vw); aspect-ratio: 1 / 1; background: url("../brand/inner-halo-dark.webp") center center / contain no-repeat; opacity: 0.5; z-index: 0; pointer-events: none;}
#compare-m .cmp-halo-1{top: 34%;}
#compare-m .cmp-halo-2{top: 74%; left: 54%;}
@media (max-width: 720px){#compare-m .cmp-halo{width: min(1500px, 190vw); opacity: 0.55;}}
@media (max-width: 720px){#compare-m .cmp-halo-1{top: 30%;}}
@media (max-width: 720px){#compare-m .cmp-halo-2{top: 78%;}}
