/* IPTV category page. Shared tokens and components live in style.css. */
.breadcrumb { padding-top:28px; }
.breadcrumb nav { display:flex; gap:12px; font-size:12px; color:var(--muted); }
.breadcrumb a { color:var(--blue-dark); }
.subscription-hero { display:grid; grid-template-columns:1.2fr 1fr; gap:90px; align-items:center; padding-block:62px 80px; }
.subscription-hero h1 { font-size:clamp(52px,5.8vw,82px); line-height:1.03; margin:22px 0; }
.subscription-hero h1 em { color:var(--blue-dark); }
.subscription-hero > div > p:not(.eyebrow) { max-width:510px; color:var(--muted); font-size:16px; }
.subscription-intro { position:relative; overflow:hidden; background:var(--ink); color:white; padding:38px; border-radius:24px; }
.subscription-intro h2 { font-size:37px; margin:27px 0 18px; }
.subscription-intro > p:not(.eyebrow) { color:var(--line); font-size:14px; max-width:330px; position:relative; }
.subscription-intro > div { display:flex; flex-wrap:wrap; gap:9px; margin-top:29px; }
.subscription-intro > div span { border:1px solid #ffffff45; padding:7px 11px; font-size:11px; border-radius:30px; }
.intro-orbit { position:absolute; right:-40px; top:-55px; font-size:240px; color:#ffffff09; pointer-events:none; }
.subscription-catalog { border-top:1px solid var(--line); padding-top:42px; }
.catalog-heading { display:flex; align-items:end; justify-content:space-between; gap:25px; margin-bottom:30px; }
.catalog-heading h2 { font-size:35px; margin-top:12px; }
.catalog-heading > span { font-size:12px; color:var(--muted); white-space:nowrap; }
.subscription-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.subscription-card { background:var(--white); border:1px solid var(--line); border-radius:20px; padding:25px; display:flex; flex-direction:column; min-width:0; }
.subscription-card:first-child { border-top:4px solid var(--blue); padding-top:22px; }
.subscription-top { display:flex; justify-content:space-between; align-items:start; margin-bottom:25px; gap:12px; }
.subscription-top img { width:85px; height:85px; object-fit:contain; border-radius:10px; }
.subscription-number { font-size:10px; color:var(--muted); padding-top:8px; }
.subscription-card .eyebrow { font-size:9px; color:var(--blue-dark); }
.subscription-card h2 { font-size:27px; letter-spacing:-.04em; margin:12px 0 16px; min-height:60px; }
.subscription-description { font-size:13px; color:var(--muted); }
.subscription-card ul { list-style:none; padding:22px 0 0; margin:22px 0 28px; border-top:1px solid var(--line); font-size:12px; line-height:1.6; }
.subscription-card li { position:relative; padding-left:19px; margin-bottom:12px; }
.subscription-card li:before { content:'✓'; position:absolute; left:0; color:var(--blue-dark); }
.subscription-card .button { margin-top:auto; padding:13px 12px; gap:10px; font-size:12px; }
.table-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:16px; background:var(--white); }
.comparison table { border-collapse:collapse; width:100%; min-width:750px; font-size:13px; text-align:left; }
.comparison caption { text-align:left; padding:20px 24px; font-size:11px; color:var(--muted); }
.comparison th,.comparison td { padding:23px 24px; border-top:1px solid var(--line); }
.comparison thead { background:var(--ink); color:white; }
.comparison td a { color:var(--blue-dark); font-weight:700; white-space:nowrap; }
.subscription-steps { border-block:1px solid var(--line); display:grid; grid-template-columns:1fr 1.3fr; gap:90px; }
.subscription-steps h2 { margin-top:20px; }
.subscription-steps ol { list-style:none; padding:0; margin:0; }
.subscription-steps li { display:flex; gap:25px; padding:24px 0; border-bottom:1px solid var(--line); }
.subscription-steps li:first-child { padding-top:0; }
.subscription-steps li:last-child { border:0; padding-bottom:0; }
.subscription-steps li > span { font-size:13px; color:var(--blue-dark); margin-top:5px; }
.subscription-steps h3 { font-size:23px; margin-bottom:8px; }
.subscription-steps li p { font-size:14px; color:var(--muted); }
@media(max-width:1100px) {
  .subscription-hero { gap:40px; }
  .subscription-grid { grid-template-columns:repeat(2,1fr); }
  .subscription-card h2 { min-height:0; }
}
@media(max-width:760px) {
  .subscription-hero { grid-template-columns:1fr; padding-block:40px 50px; gap:30px; }
  .subscription-hero h1 { font-size:55px; }
  .subscription-intro { padding:28px; }
  .catalog-heading { display:block; }
  .catalog-heading > span { display:block; margin-top:15px; }
  .catalog-heading h2 { font-size:30px; }
  .subscription-grid { grid-template-columns:1fr; }
  .subscription-card { padding:28px; }
  .subscription-card:first-child { padding-top:25px; }
  .subscription-top img { width:96px; height:96px; }
  .subscription-steps { grid-template-columns:1fr; gap:30px; }
}

/* The card itself is the native link; no overlay or nested links. */
.subscription-card { color:var(--ink); text-decoration:none; cursor:pointer; }
.subscription-card .button { transform:none; }
.subscription-card:hover .button { background:var(--ink); }
.subscription-card:focus-visible { outline:3px solid var(--blue); outline-offset:4px; }
