/* IPTV Streaming Services design system, prefix iss- */
:root{
  --iss-bg:#fffafb;--iss-ink:#1f1016;--iss-rose:#f43f5e;--iss-rose-d:#f10f36;--iss-rose-2:#f88397;
  --iss-rose-t:#c8102e;--iss-blush:#fff0f3;--iss-card:#fff;--iss-line:#f3d6dd;--iss-muted:#6b4e58;--iss-soft:#4a3038;
  --iss-ink-2:#2b121c;--iss-on-ink:#fbeef1;--iss-on-ink-m:#d9c3ca;--iss-paper:#fffafb;
  --iss-fd:"Kanit","Avenir Next","Segoe UI",system-ui,sans-serif;--iss-fb:"Sarabun","Segoe UI",system-ui,sans-serif;
  --iss-gut:16px;--iss-max:1200px;--iss-sp:clamp(56px,8vw,104px);--iss-r:18px;--iss-hh:80px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--iss-bg);color:var(--iss-ink);font:400 17px/1.65 var(--iss-fb)}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:var(--iss-rose-t);text-underline-offset:3px}
h1,h2,h3,h4{font-family:var(--iss-fd);font-weight:600;line-height:1.08;letter-spacing:-.01em;margin:0 0 .5em;color:inherit}
h2{font-size:clamp(30px,4.2vw,48px)}
h3{font-size:clamp(19px,1.8vw,22px);line-height:1.2}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em}
strong,b{font-weight:600}
s{text-decoration-color:var(--iss-rose);text-decoration-thickness:.12em}
[id]{scroll-margin-top:var(--iss-hh)}
:focus-visible{outline:3px solid var(--iss-rose-t);outline-offset:3px}
.iss-skip{position:absolute;left:-9999px;top:8px;z-index:60;background:var(--iss-ink);color:#fff;padding:10px 16px;border-radius:10px;font:600 15px var(--iss-fd)}
.iss-skip:focus{left:16px}
.iss-wrap{width:100%;max-width:var(--iss-max);margin-inline:auto;padding-inline:var(--iss-gut)}
.iss-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* buttons and links */
.iss-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:999px;border:2px solid transparent;font:600 16px/1.2 var(--iss-fd);text-decoration:none;text-align:center;cursor:pointer}
.iss-btn svg,.iss-link svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.iss-btn--primary{background:var(--iss-rose);border-color:var(--iss-rose);color:var(--iss-ink)}
.iss-btn--ghost{background:transparent;border-color:var(--iss-ink);color:var(--iss-ink)}
.iss-btn--ink{background:var(--iss-ink);border-color:var(--iss-ink);color:#fff}
.iss-btn--sm{min-height:40px;padding:8px 16px;font-size:14px}
.iss-btn--lg{min-height:56px;padding:14px 26px;font-size:17px}
.iss-btn--block{width:100%}
.iss-link{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--iss-rose-t);font:600 16px/1.2 var(--iss-fd);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.iss-band--ink .iss-link,.iss-final .iss-link,.iss-plan--pick .iss-link{color:var(--iss-rose-2)}
.iss-band--ink .iss-btn--ghost,.iss-final .iss-btn--ghost{border-color:var(--iss-on-ink);color:#fff}

/* header */
.iss-header{position:relative;z-index:40;background:var(--iss-bg);border-bottom:1px solid var(--iss-line)}
.iss-header-in{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;min-height:64px;padding-block:10px}
.iss-brand{display:flex;align-items:center;gap:10px;margin-right:auto;color:var(--iss-ink);text-decoration:none;font:600 17px/1.05 var(--iss-fd);letter-spacing:-.01em}
.iss-brand svg{width:34px;height:34px;flex:none}
.iss-brand-t{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.iss-brand-x{display:inline-block;padding:2px 7px 3px;border-radius:6px;background:var(--iss-rose);color:var(--iss-ink);font-size:.78em;letter-spacing:.08em;text-transform:uppercase;line-height:1.1}
.iss-nav{order:3;width:100%}
.iss-nav ul{display:flex;justify-content:space-between;list-style:none;margin:0;padding:0}
.iss-nav a{display:block;padding:7px 3px;color:var(--iss-ink);font:500 14px/1.2 var(--iss-fd);text-decoration:none;white-space:nowrap;border-radius:8px}
.iss-nav a[aria-current="page"]{color:var(--iss-rose-t);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.iss-header-cta{display:flex;align-items:center;gap:8px}
.iss-hide-sm{display:none}
@media (min-width:600px){
  :root{--iss-gut:24px}
  .iss-brand-t{flex-direction:row;align-items:center;gap:7px}
  .iss-hide-sm{display:inline-flex}
}
@media (min-width:960px){
  .iss-header{position:sticky;top:0}
  .iss-header-in{flex-wrap:nowrap;min-height:76px}
  .iss-nav{order:0;width:auto}
  .iss-nav ul{gap:2px}
  .iss-nav a{padding:9px 12px;font-size:15px}
}
@media (min-width:1024px){:root{--iss-gut:32px}}

/* section scaffolding */
.iss-section{padding-block:var(--iss-sp)}
.iss-band{background:var(--iss-blush);--iss-paper:#fff0f3}
.iss-band--ink{background:var(--iss-ink);color:var(--iss-on-ink);--iss-paper:#1f1016}
.iss-band--ink h2,.iss-band--ink h3{color:#fff}
.iss-band--ink p{color:var(--iss-on-ink-m)}
.iss-band--ink a:not(.iss-btn){color:var(--iss-rose-2)}
.iss-head{max-width:780px;margin-bottom:clamp(26px,4vw,44px)}
.iss-head--center{margin-inline:auto;text-align:center}
.iss-head--center .iss-ch{justify-content:center}
.iss-head p:last-child{margin-bottom:0}
.iss-ch{display:inline-flex;align-items:center;gap:10px;margin:0 0 14px;color:var(--iss-muted);font:500 14px/1.2 var(--iss-fd);letter-spacing:.08em;text-transform:uppercase}
.iss-ch-n{display:inline-block;padding:4px 9px;border-radius:7px;background:var(--iss-ink);color:#fff;font-variant-numeric:tabular-nums;letter-spacing:.06em}
.iss-band--ink .iss-ch{color:var(--iss-on-ink-m)}
.iss-band--ink .iss-ch-n{background:var(--iss-rose);color:var(--iss-ink)}
.iss-lede{font-size:clamp(17px,1.5vw,19px);color:var(--iss-soft)}
.iss-band--ink .iss-lede{color:var(--iss-on-ink-m)}
.iss-note{font-size:15px;color:var(--iss-muted)}
.iss-grid{display:grid;gap:18px}
.iss-split{display:grid;gap:28px;align-items:center}
@media (min-width:600px){.iss-grid--2,.iss-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){
  .iss-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .iss-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}
  .iss-split--flip>:first-child{order:2}
}
@media (min-width:1024px){.iss-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.iss-card{background:var(--iss-card);border:1px solid var(--iss-line);border-radius:var(--iss-r);padding:22px}
.iss-card h3{margin-bottom:.4em}
.iss-card p{font-size:16px;color:var(--iss-soft)}
.iss-card p:last-child{margin-bottom:0}
.iss-card--tab{position:relative;border-top:4px solid var(--iss-rose)}
.iss-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;margin-top:26px}
.iss-media img{width:100%;border-radius:var(--iss-r);border:1px solid var(--iss-line)}
.iss-media figcaption{margin-top:10px;font-size:14px;color:var(--iss-muted)}
.iss-media{margin:0}

/* hero */
.iss-hero{position:relative;overflow-x:clip;padding-block:clamp(28px,5vw,60px) clamp(44px,6vw,84px)}
.iss-hero::before{content:"";position:absolute;z-index:-1;right:-18vw;top:4%;width:min(820px,90vw);aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,#ffe1e8,rgba(255,240,243,0) 72%);pointer-events:none}
.iss-hero-grid{display:grid;gap:30px;grid-template-areas:"copy" "tv" "meter"}
.iss-hero-copy{grid-area:copy}
.iss-eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 16px;color:var(--iss-muted);font:500 14px/1.3 var(--iss-fd);letter-spacing:.08em;text-transform:uppercase}
.iss-dot{width:9px;height:9px;flex:none;border-radius:50%;background:var(--iss-rose)}
.iss-h1{font-size:clamp(36px,5vw,60px);line-height:1.02;letter-spacing:-.02em;margin:0 0 20px}
.iss-h1-s{color:var(--iss-soft);font-weight:500}
.iss-hero-sub{max-width:36em;font-size:clamp(17px,1.5vw,19px);color:var(--iss-soft)}
.iss-hero-note{margin:14px 0 0;font-size:15px;color:var(--iss-muted)}
@media (min-width:1024px){
  .iss-hero-grid{grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);grid-template-areas:"copy tv" "meter meter";column-gap:56px;row-gap:34px;align-items:center}
  .iss-meter{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,.9fr);align-items:center;gap:36px;padding:24px 30px 22px}
  .iss-meter-ctl .iss-range{margin-bottom:0}
  .iss-meter-sum .iss-meter-keep{margin-top:0}
  .iss-meter-sum{padding-left:30px;border-left:2px dashed var(--iss-line)}
}

/* the zapping set */
.iss-tv{grid-area:tv;position:relative;width:100%;max-width:640px;justify-self:center;margin:30px 0 0}
.iss-tv-ears{position:absolute;left:50%;top:-34px;width:120px;height:40px;margin-left:-60px;fill:none;stroke:var(--iss-ink);stroke-width:4;stroke-linecap:round}
.iss-tv-set{position:relative;padding:10px 10px 8px;border-radius:24px;background:var(--iss-ink);box-shadow:0 34px 60px -34px rgba(31,16,22,.6),0 0 0 1px rgba(31,16,22,.1)}
.iss-tv-set::after{content:"";position:absolute;left:33%;right:33%;bottom:-10px;height:10px;border-radius:0 0 12px 12px;background:var(--iss-ink)}
.iss-tv-screen{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:15px;background:var(--iss-ink);isolation:isolate}
.iss-tv-screen::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 1px,transparent 1px 3px)}
.iss-tv-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;padding:8px 6px 0;color:var(--iss-on-ink-m);font:500 13px/1.3 var(--iss-fd)}
.iss-tv-label{display:inline-flex;align-items:center;gap:6px;color:#fff;letter-spacing:.08em;text-transform:uppercase}
.iss-tv-label::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--iss-rose)}
.iss-frame{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;gap:6px;padding:clamp(12px,3.2%,22px) clamp(12px,3.2%,22px) 0;color:#fff;background:linear-gradient(115deg,#1f1016 0%,#2b121c 52%,#5a1729 100%)}
.iss-frame+.iss-frame{display:none}
.iss-frame>*{position:relative;z-index:1}
.iss-frame-img{position:absolute!important;z-index:0!important;top:0;right:0;width:52%;height:100%;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%)}
.iss-osd{display:flex;align-items:baseline;gap:8px;transform-origin:0 0}
.iss-osd-c{color:var(--iss-rose-2);font:600 clamp(13px,1.6vw,16px)/1 var(--iss-fd);letter-spacing:.08em}
.iss-osd-n{color:var(--iss-rose-2);font:600 clamp(30px,6.4vw,52px)/1 var(--iss-fd);font-variant-numeric:tabular-nums}
.iss-osd-t{margin-left:4px;color:#fff;font:600 clamp(12px,1.4vw,14px)/1.2 var(--iss-fd);letter-spacing:.1em;text-transform:uppercase}
.iss-frame-h{max-width:56%;margin:0 0 auto;padding-top:clamp(4px,1.6%,12px);font:600 clamp(16px,2.5vw,26px)/1.15 var(--iss-fd);color:#fff}
.iss-frame-bar{margin:0 calc(-1*clamp(12px,3.2%,22px));padding:7px clamp(12px,3.2%,22px) 8px;background:rgba(31,16,22,.86);border-top:2px solid var(--iss-rose);color:var(--iss-on-ink);font:500 clamp(12px,1.4vw,14px)/1.3 var(--iss-fd)}
.iss-frame-nets{position:absolute!important;right:clamp(12px,3.2%,22px);top:36%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:36%;margin:0;padding:0;list-style:none}
.iss-frame-nets li{padding:6px 4px;border:1px solid rgba(248,131,151,.55);border-radius:10px;background:rgba(255,255,255,.07);color:#fff;text-align:center;font:600 clamp(14px,2.3vw,22px)/1.1 var(--iss-fd);letter-spacing:.04em}
.iss-frame-big{position:absolute!important;right:clamp(12px,3.2%,22px);top:20%;margin:0;text-align:right;color:var(--iss-on-ink);font:500 clamp(13px,1.5vw,15px)/1.25 var(--iss-fd)}
.iss-frame-big b{display:block;color:var(--iss-rose-2);font-size:clamp(28px,5.4vw,50px);line-height:1}
.iss-static{position:absolute;inset:-14%;z-index:3;opacity:0;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E"),#3a262e}
.is-zapping .iss-frame{display:flex;opacity:0;transition:opacity .16s linear}
.is-zapping .iss-frame.is-on{opacity:1;transition-delay:.14s}
.iss-guide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:22px 0 0;padding:0;list-style:none}
.iss-guide li{position:relative;display:flex;align-items:baseline;gap:7px;padding:7px 10px 8px;border:1px solid var(--iss-line);border-radius:10px;background:var(--iss-card);overflow:hidden;font:500 14px/1.2 var(--iss-fd)}
.iss-guide b{color:var(--iss-rose-t);font-variant-numeric:tabular-nums}
.iss-guide li::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--iss-rose);transform:scaleX(0);transform-origin:left}
.iss-guide li.is-on::after{transform:none}
@media (min-width:600px){.iss-frame-nets{top:16%;gap:8px;width:38%}.iss-frame-nets li{padding:8px 4px}}
@media (min-width:768px){.iss-guide{grid-template-columns:repeat(6,minmax(0,1fr))}.iss-guide li{flex-direction:column;gap:2px;padding:7px 8px 9px}}
@media (min-width:1024px){.iss-guide{grid-template-columns:repeat(3,minmax(0,1fr))}.iss-guide li{flex-direction:row;gap:7px}}

/* cost slider (the meter) */
.iss-meter{grid-area:meter;position:relative;display:grid;gap:18px;padding:22px 20px 18px;border:1px solid var(--iss-line);border-radius:22px;background:var(--iss-card);box-shadow:0 22px 44px -32px rgba(31,16,22,.4)}
.iss-meter::before{content:"";position:absolute;left:22px;right:22px;top:-1px;height:4px;border-radius:0 0 4px 4px;background:repeating-linear-gradient(90deg,var(--iss-rose) 0 14px,transparent 14px 22px)}
.iss-meter-k{margin:0 0 10px;color:var(--iss-rose-t);font:600 13px/1.2 var(--iss-fd);letter-spacing:.1em;text-transform:uppercase}
.iss-meter-in{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px}
.iss-meter-label{font:500 16px/1.3 var(--iss-fd)}
.iss-meter-out-wrap{margin:0}
.iss-meter-out{font:600 32px/1 var(--iss-fd);font-variant-numeric:tabular-nums}
.iss-meter-per{color:var(--iss-muted);font:500 15px var(--iss-fd)}
.iss-range{display:block;width:100%;height:34px;margin:8px 0 0;padding:0;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none;--p:28.57%}
.iss-range::-webkit-slider-runnable-track{height:10px;border-radius:99px;background:linear-gradient(90deg,var(--iss-rose) var(--p),#f3d6dd var(--p))}
.iss-range::-webkit-slider-thumb{width:28px;height:28px;margin-top:-9px;border:3px solid var(--iss-ink);border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(31,16,22,.3);-webkit-appearance:none;appearance:none}
.iss-range::-moz-range-track{height:10px;border-radius:99px;background:#f3d6dd}
.iss-range::-moz-range-progress{height:10px;border-radius:99px;background:var(--iss-rose)}
.iss-range::-moz-range-thumb{width:22px;height:22px;border:3px solid var(--iss-ink);border-radius:50%;background:#fff}
.iss-range:focus-visible{outline:3px solid var(--iss-rose-t);outline-offset:4px;border-radius:10px}
.iss-scale{display:flex;justify-content:space-between;margin:-8px 0 14px;color:var(--iss-muted);font:500 13px var(--iss-fd)}
.iss-bars{display:grid;gap:12px}
.iss-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:4px 12px}
.iss-bar-l{font-size:15px;line-height:1.35;color:var(--iss-soft)}
.iss-bar-v{font:600 19px/1.2 var(--iss-fd);font-variant-numeric:tabular-nums}
.iss-bar-track{grid-column:1/-1;display:block;height:14px;border-radius:99px;background:#fbe3e8;overflow:hidden}
.iss-bar-fill{display:block;width:100%;height:100%;border-radius:99px;background:var(--iss-ink);transform:scaleX(var(--s,1));transform-origin:left}
.iss-bar--us .iss-bar-fill{background:var(--iss-rose)}
.iss-bar--us .iss-bar-v{color:var(--iss-rose-t)}
.iss-meter-keep{margin:0 0 6px;font:500 18px/1.3 var(--iss-fd)}
.iss-meter-keep strong{color:var(--iss-rose-t);font-size:1.4em;font-variant-numeric:tabular-nums}
.iss-meter-note{margin:0;font-size:14px;line-height:1.5;color:var(--iss-muted)}

/* trust / stats */
.iss-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.iss-stat{padding:18px 16px;border:1px solid var(--iss-line);border-radius:16px;background:var(--iss-card)}
.iss-stat-n{display:block;font:600 clamp(28px,3.4vw,40px)/1 var(--iss-fd);font-variant-numeric:tabular-nums;color:var(--iss-ink)}
.iss-stat-l{display:block;margin-top:6px;font-size:15px;line-height:1.35;color:var(--iss-soft)}
.iss-band--ink .iss-stat{border-color:rgba(251,238,241,.16);background:var(--iss-ink-2)}
.iss-band--ink .iss-stat-n{color:var(--iss-rose-2)}
.iss-band--ink .iss-stat-l{color:var(--iss-on-ink-m)}
@media (min-width:768px){.iss-stats{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* sports tiles */
.iss-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.iss-tile{position:relative;overflow:hidden;border:1px solid var(--iss-line);border-radius:16px;background:var(--iss-card)}
.iss-tile img{width:100%;aspect-ratio:4/3;object-fit:cover}
.iss-tile-ch{position:absolute;left:10px;top:10px;padding:3px 8px;border-radius:7px;background:var(--iss-ink);color:#fff;font:600 13px/1.3 var(--iss-fd);letter-spacing:.06em}
.iss-tile-b{padding:12px 14px 14px}
.iss-tile-b h3{margin:0 0 4px;font-size:18px}
.iss-tile-b p{margin:0;font-size:15px;line-height:1.45;color:var(--iss-soft)}
@media (min-width:768px){.iss-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}

/* worldwide */
.iss-regions{display:grid;gap:14px;margin:0;padding:0;list-style:none}
.iss-region{padding:18px 20px;border:1px solid var(--iss-line);border-left:4px solid var(--iss-rose);border-radius:14px;background:var(--iss-card)}
.iss-region h3{margin:0 0 4px;font-size:19px}
.iss-region p{margin:0;font-size:15px;line-height:1.5;color:var(--iss-soft)}
@media (min-width:600px){.iss-regions{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.iss-regions--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.iss-strip{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:28px;padding:18px 22px;border:1px dashed var(--iss-rose-2);border-radius:18px;background:var(--iss-card)}
.iss-strip img{width:72px;height:auto;flex:none}
.iss-strip p{flex:1 1 240px;margin:0;font-size:16px;color:var(--iss-soft)}

/* marquee: posters, covers or logos, one kind per row */
.iss-marquee{position:relative;overflow-x:auto;margin-block:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.iss-marquee.is-on{overflow:hidden}
.iss-marquee-track{display:flex;width:max-content;margin:0;padding:6px 0 10px;list-style:none}
.iss-marquee-track>li{flex:none;margin-right:16px}
.iss-poster{width:clamp(132px,15vw,176px)}
.iss-poster img{width:100%;aspect-ratio:342/513;object-fit:cover;border-radius:12px;box-shadow:0 12px 24px -16px rgba(31,16,22,.5)}
.iss-cover{width:clamp(124px,13vw,156px)}
.iss-cover img{width:100%;aspect-ratio:313/512;object-fit:cover;border-radius:12px}
.iss-logo{display:flex;align-items:center;height:72px;padding:14px 22px;border:1px solid var(--iss-line);border-radius:14px;background:var(--iss-card)}
.iss-logo img{width:auto;height:36px;max-width:none}
.iss-marquee:hover .iss-marquee-track,.iss-marquee:focus-within .iss-marquee-track{animation-play-state:paused}

/* pricing: bill-shaped plan cards */
.iss-plans{display:grid;gap:22px;margin:0;padding:0;list-style:none}
.iss-plan{position:relative;display:flex;flex-direction:column;padding:26px 22px 22px;border:1px solid var(--iss-line);border-radius:20px;background:var(--iss-card)}
.iss-plan-name{margin:0 0 12px;font:600 18px/1.2 var(--iss-fd)}
.iss-plan-price{margin:0;font:600 clamp(38px,4vw,46px)/1 var(--iss-fd);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.iss-plan-per{margin:6px 0 0;font-size:15px;color:var(--iss-muted)}
.iss-plan-tear{position:relative;height:0;margin:20px -22px;border-top:2px dashed var(--iss-line)}
.iss-plan-tear::before,.iss-plan-tear::after{content:"";position:absolute;top:-11px;width:20px;height:20px;border-radius:50%;background:var(--iss-paper);border:1px solid var(--iss-line)}
.iss-plan-tear::before{left:-11px}
.iss-plan-tear::after{right:-11px}
.iss-badge{display:inline-block;padding:4px 11px;border-radius:999px;background:var(--iss-rose);color:var(--iss-ink);font:600 13px/1.3 var(--iss-fd);letter-spacing:.06em;text-transform:uppercase}
.iss-plan .iss-badge{position:absolute;top:-13px;right:18px}
.iss-ticks{display:grid;gap:9px;margin:0 0 22px;padding:0;list-style:none}
.iss-ticks li{display:flex;gap:10px;font-size:15px;line-height:1.4}
.iss-ticks svg{width:18px;height:18px;flex:none;margin-top:2px;fill:none;stroke:var(--iss-rose-t);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.iss-plan .iss-btn{width:100%;margin-top:auto}
.iss-plan--pick{border-color:var(--iss-ink);background:var(--iss-ink);color:var(--iss-on-ink)}
.iss-plan--pick .iss-plan-name,.iss-plan--pick .iss-plan-price{color:#fff}
.iss-plan--pick .iss-plan-per,.iss-plan--pick .iss-ticks li{color:var(--iss-on-ink-m)}
.iss-plan--pick .iss-ticks svg{stroke:var(--iss-rose-2)}
.iss-plan--pick .iss-plan-tear{border-color:rgba(251,238,241,.25)}
.iss-plans-foot{margin:26px 0 0;text-align:center;font-size:16px;color:var(--iss-soft)}
@media (min-width:600px){.iss-plans{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.iss-plans{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}}

/* free-trial teaser and final call */
.iss-trial{display:grid;gap:20px;align-items:center;padding:clamp(24px,4vw,44px);border:1px solid var(--iss-line);border-radius:26px;background:var(--iss-blush)}
.iss-trial h2{margin-bottom:.35em}
.iss-trial p:last-child{margin-bottom:0}
@media (min-width:860px){.iss-trial{grid-template-columns:minmax(0,1.5fr) auto;gap:40px}}
.iss-final{padding:clamp(32px,6vw,76px) clamp(20px,5vw,64px);border-radius:28px;background:var(--iss-ink);color:var(--iss-on-ink);text-align:center}
.iss-final h2{color:#fff;max-width:18em;margin-inline:auto}
.iss-final p{max-width:40em;margin-inline:auto;color:var(--iss-on-ink-m)}
.iss-final .iss-actions{justify-content:center}
.iss-final .iss-ch{color:var(--iss-on-ink-m)}
.iss-final .iss-ch-n{background:var(--iss-rose);color:var(--iss-ink)}

/* devices */
.iss-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;padding:0;list-style:none}
.iss-chips li{padding:8px 14px;border:1px solid var(--iss-line);border-radius:999px;background:var(--iss-card);font:500 15px/1.2 var(--iss-fd)}
.iss-band .iss-chips li{border-color:#efc7d0}

/* how it works */
.iss-steps{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.iss-step{position:relative;padding:22px;border:1px solid var(--iss-line);border-radius:var(--iss-r);background:var(--iss-card)}
.iss-step-n{display:inline-flex;align-items:center;gap:6px;margin:0 0 14px;padding:4px 10px;border-radius:8px;background:var(--iss-ink);color:#fff;font:600 14px/1.3 var(--iss-fd);letter-spacing:.06em}
.iss-step h3{margin:0 0 6px}
.iss-step p{margin:0;font-size:16px;color:var(--iss-soft)}
@media (min-width:900px){.iss-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.iss-step:not(:last-child)::after{content:"";position:absolute;top:36px;right:-20px;width:20px;border-top:2px dashed var(--iss-rose-2)}}

/* reviews */
.iss-reviews{display:grid;gap:18px}
@media (min-width:900px){.iss-reviews{grid-template-columns:repeat(3,minmax(0,1fr))}}
.iss-review{display:flex;flex-direction:column;gap:14px;margin:0;padding:24px 22px;border:1px solid var(--iss-line);border-radius:var(--iss-r);background:var(--iss-card)}
.iss-review blockquote{margin:0}
.iss-review blockquote p{margin:0;font-size:17px;line-height:1.6}
.iss-review figcaption,.iss-review-by{margin-top:auto;font:600 15px/1.3 var(--iss-fd)}
.iss-review-by span{display:block;color:var(--iss-muted);font-weight:500}
.iss-stars{display:flex;gap:3px}
.iss-stars svg{width:18px;height:18px;fill:var(--iss-rose-t)}

/* FAQ */
.iss-faq{display:grid;gap:10px;max-width:880px}
.iss-head--center+.iss-faq{margin-inline:auto}
.iss-q{border:1px solid var(--iss-line);border-radius:14px;background:var(--iss-card)}
.iss-q summary{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;min-height:52px;padding:15px 18px;cursor:pointer;list-style:none;font:500 17px/1.35 var(--iss-fd)}
.iss-q summary::-webkit-details-marker{display:none}
.iss-q summary::after{content:"";flex:none;width:11px;height:11px;margin:5px 4px 0 0;border-right:2.5px solid var(--iss-rose-t);border-bottom:2.5px solid var(--iss-rose-t);transform:rotate(45deg)}
.iss-q[open] summary::after{transform:translateY(4px) rotate(-135deg)}
.iss-q[open]{border-color:var(--iss-rose-2)}
.iss-a{padding:0 18px 16px}
.iss-a p{font-size:16px;color:var(--iss-soft)}
.iss-a p:last-child{margin-bottom:0}

/* SEO block and long text */
.iss-prose{max-width:760px}
.iss-prose h2{font-size:clamp(26px,3.2vw,36px);margin-top:1.4em}
.iss-prose h2:first-child{margin-top:0}
.iss-prose h3{margin-top:1.3em}
.iss-prose p,.iss-prose li{color:var(--iss-soft)}
.iss-prose li{margin-bottom:.4em}
.iss-seo{display:grid;gap:8px 48px}
@media (min-width:1024px){.iss-seo--2{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* inner pages */
.iss-page-hero{padding-block:clamp(36px,6vw,72px) clamp(28px,4vw,44px);border-bottom:1px solid var(--iss-line);background:linear-gradient(180deg,var(--iss-bg),var(--iss-blush))}
.iss-page-hero h1{max-width:18em;font-size:clamp(34px,4.6vw,56px);line-height:1.04;letter-spacing:-.02em}
.iss-page-hero p{max-width:42em;font-size:clamp(17px,1.5vw,19px);color:var(--iss-soft)}
.iss-page{padding-block:clamp(40px,6vw,72px) clamp(56px,8vw,96px)}
.iss-toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 32px;padding:0;list-style:none}
.iss-toc a{display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;border:1px solid var(--iss-line);border-radius:999px;background:var(--iss-card);color:var(--iss-ink);font:500 15px/1.2 var(--iss-fd);text-decoration:none}
.iss-device{margin:0 0 22px;padding:clamp(20px,3vw,32px);border:1px solid var(--iss-line);border-radius:22px;background:var(--iss-card)}
.iss-device h2{font-size:clamp(24px,3vw,34px)}
.iss-device ol,.iss-device ul{padding-left:22px}
.iss-device li{margin-bottom:.55em;color:var(--iss-soft)}
.iss-device li::marker{color:var(--iss-rose-t);font-family:var(--iss-fd);font-weight:600}
.iss-device-tag{display:inline-block;margin:0 0 12px;padding:3px 9px;border-radius:7px;background:var(--iss-blush);color:var(--iss-rose-t);font:600 13px/1.3 var(--iss-fd);letter-spacing:.08em;text-transform:uppercase}
.iss-callout{margin:22px 0;padding:18px 20px;border-left:4px solid var(--iss-rose);border-radius:0 14px 14px 0;background:var(--iss-blush)}
.iss-callout p:last-child{margin-bottom:0}
.iss-mail{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:12px 20px;border:2px solid var(--iss-ink);border-radius:16px;color:var(--iss-ink);font:600 clamp(16px,2.2vw,22px)/1.2 var(--iss-fd);text-decoration:none;overflow-wrap:anywhere}
.iss-mail svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--iss-rose-t);stroke-width:2}
.iss-plan-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0 0;padding:0;list-style:none}
.iss-plan-links a{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:64px;padding:10px;border:1px solid var(--iss-line);border-radius:14px;background:var(--iss-card);color:var(--iss-ink);font:600 16px/1.25 var(--iss-fd);text-align:center;text-decoration:none}
.iss-plan-links a span{color:var(--iss-muted);font-weight:500;font-size:14px}
@media (min-width:768px){.iss-plan-links{grid-template-columns:repeat(4,minmax(0,1fr))}}
.iss-updated{color:var(--iss-muted);font-size:15px}

/* footer */
.iss-footer{padding-block:52px 30px;background:var(--iss-ink);color:var(--iss-on-ink-m)}
.iss-footer a{color:var(--iss-on-ink)}
.iss-footer .iss-brand{color:#fff;margin:0 0 14px}
.iss-footer-grid{display:grid;gap:28px}
.iss-footer-about p{max-width:30em;margin:0;font-size:15px}
.iss-footer-h{margin:0 0 8px;color:#fff;font:600 14px/1.2 var(--iss-fd);letter-spacing:.1em;text-transform:uppercase}
.iss-footer-nav ul{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.iss-footer-nav a{display:inline-block;padding:6px 0;font:500 16px/1.3 var(--iss-fd);text-decoration:none}
.iss-footer-mail a{display:inline-block;padding:6px 0;color:var(--iss-rose-2);font:500 16px/1.3 var(--iss-fd);overflow-wrap:anywhere}
.iss-footer-mail p{margin:0 0 6px;font-size:15px}
.iss-footer-base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;margin-top:34px;padding-top:20px;border-top:1px solid rgba(251,238,241,.14);font-size:14px}
.iss-footer-base p{margin:0}
.iss-motion{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 16px;border:1.5px solid rgba(251,238,241,.55);border-radius:999px;background:transparent;color:var(--iss-on-ink);font:500 14px/1.2 var(--iss-fd);cursor:pointer}
.iss-motion svg{width:14px;height:14px;fill:currentColor}
@media (min-width:600px){.iss-footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.iss-footer-about{grid-column:1/-1}}
@media (min-width:1024px){.iss-footer-grid{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)}.iss-footer-about{grid-column:auto}}

/* pointer-only effects */
@media (hover:hover){
  .iss-btn,.iss-nav a,.iss-plan,.iss-tile,.iss-toc a,.iss-plan-links a{transition:transform .2s ease,opacity .2s ease}
  .iss-btn--primary:hover{background:var(--iss-ink);border-color:var(--iss-ink);color:#fff}
  .iss-btn--ghost:hover{background:var(--iss-ink);color:#fff}
  .iss-band--ink .iss-btn--ghost:hover,.iss-final .iss-btn--ghost:hover{background:#fff;color:var(--iss-ink)}
  .iss-btn--ink:hover{background:var(--iss-rose);border-color:var(--iss-rose);color:var(--iss-ink)}
  .iss-btn:hover{transform:translateY(-2px)}
  .iss-nav a:hover{background:var(--iss-blush)}
  .iss-plan:hover,.iss-tile:hover{transform:translateY(-4px)}
  .iss-toc a:hover,.iss-plan-links a:hover{border-color:var(--iss-ink)}
  .iss-footer a:hover{color:#fff}
  .iss-motion:hover{border-color:#fff;color:#fff}
}

/* motion: everything below only runs when motion is allowed */
@media (prefers-reduced-motion:no-preference){
  html:not(.motion-off) .iss-dot{animation:iss-blink 1.6s ease-in-out infinite}
  html:not(.motion-off) .iss-tv.is-cut .iss-static{animation:iss-snow .46s steps(6,end)}
  html:not(.motion-off) .iss-tv.is-cut .iss-frame.is-on{animation:iss-roll .5s steps(5,end)}
  html:not(.motion-off) .iss-tv.is-cut .iss-frame.is-on .iss-osd{animation:iss-osd .7s cubic-bezier(.2,.9,.3,1.25)}
  html:not(.motion-off) .iss-guide li::after{transition:transform .35s ease}
  html:not(.motion-off) .iss-bar-fill{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  html:not(.motion-off) .iss-marquee.is-on .iss-marquee-track{animation:iss-slide var(--iss-dur,40s) linear infinite}
  html.iss-js:not(.motion-off) .iss-reveal{opacity:0;transform:translate3d(0,18px,0);transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i,0)*80ms)}
  html.iss-js:not(.motion-off) .iss-reveal.is-in{opacity:1;transform:none}
  html.iss-js:not(.motion-off) .iss-reveal.is-in .iss-ch-n{animation:iss-tune .6s steps(6,end)}
}
@keyframes iss-blink{50%{opacity:.25}}
@keyframes iss-snow{0%{opacity:0;transform:translate3d(0,0,0)}14%{opacity:.95;transform:translate3d(-4%,3%,0)}36%{opacity:.85;transform:translate3d(3%,-2%,0)}62%{opacity:.55;transform:translate3d(-2%,-4%,0)}100%{opacity:0;transform:translate3d(0,0,0)}}
@keyframes iss-roll{0%{transform:translate3d(0,-7%,0)}60%{transform:translate3d(0,2%,0)}100%{transform:translate3d(0,0,0)}}
@keyframes iss-osd{0%,28%{opacity:0;transform:scale(1.5)}70%{opacity:1;transform:scale(.97)}100%{opacity:1;transform:scale(1)}}
@keyframes iss-slide{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes iss-tune{0%{opacity:0}20%{opacity:1}36%{opacity:.2}55%{opacity:1}72%{opacity:.5}100%{opacity:1}}

/* reduced motion and the pause-motion toggle: no motion, all content visible */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .iss-reveal{opacity:1!important;transform:none!important}
  .iss-marquee{overflow-x:auto}
}
.motion-off *,.motion-off *::before,.motion-off *::after{animation:none!important;transition:none!important}
.motion-off .iss-reveal{opacity:1;transform:none}
.motion-off .iss-marquee{overflow-x:auto}

/* === home additions === */
.iss-vs{display:grid;gap:18px;margin-top:clamp(28px,4vw,44px)}
@media (min-width:768px){.iss-vs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.iss-vs-col{padding:24px 22px;border:1px solid rgba(251,238,241,.18);border-radius:var(--iss-r);background:var(--iss-ink-2)}
.iss-vs-col--us{border-color:var(--iss-rose-2)}
.iss-vs-col h3{margin-bottom:14px}
.iss-vs-col ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.iss-vs-col li{position:relative;padding-left:26px;font-size:16px;line-height:1.45;color:var(--iss-on-ink-m)}
.iss-vs-col li::before{content:"";position:absolute;left:0;top:.7em;width:12px;border-top:3px solid var(--iss-on-ink-m);border-radius:2px}
.iss-vs-col--us li::before{border-color:var(--iss-rose-2)}
.iss-sub{margin-top:clamp(32px,5vw,56px)}
.iss-sub h3{font-size:clamp(22px,2.4vw,28px)}
.iss-split h3{margin-bottom:.4em}
.iss-split p{color:var(--iss-soft)}
.iss-band .iss-split .iss-actions{margin-top:6px}
.iss-step p.iss-step-n{margin:0 0 14px;font-size:14px;color:#fff}
/* === end home additions === */

/* === pages additions === */
.iss-pg{margin-top:clamp(40px,6vw,72px)}
.iss-page .iss-wrap>.iss-pg:first-child,.iss-page .iss-wrap>.iss-toc+.iss-pg{margin-top:0}
.iss-page-hero p.iss-ch{max-width:none;margin:0 0 14px;color:var(--iss-muted);font-size:14px}
.iss-page-hero .iss-actions{margin-top:24px}
.iss-page-hero .iss-mail{margin-top:8px}
.iss-olist{margin:0;padding-left:22px}
.iss-olist li{margin-bottom:.6em;font-size:16px;color:var(--iss-soft)}
.iss-olist li::marker{color:var(--iss-rose-t);font-family:var(--iss-fd);font-weight:600}
.iss-card .iss-ticks{margin-bottom:0}
.iss-card .iss-ticks+.iss-note{margin:16px 0 0}
.iss-device .iss-note{margin:14px 0 0}
.iss-prose .iss-link,.iss-a .iss-link,.iss-card .iss-link,.iss-callout .iss-link{display:inline}
.iss-a a,.iss-device li a,.iss-note a{color:var(--iss-rose-t);text-underline-offset:3px}
.iss-media.iss-pg{margin-bottom:clamp(40px,6vw,72px)}
.iss-page .iss-device{scroll-margin-top:88px}
/* === end pages additions === */
