/* ==========================================================================
   Course / Product page — WinQuest Online (Rose theme)
   v1.9.73: ultra-luxury repaint — bright pink+navy mix replaced with
   refined WQ rose palette (no navy anywhere). Soft pink surfaces, deeper
   raspberry for accents that need depth, dark mauve for text. The cascade
   from these vars propagates to every .ito-cp-* style below.
   ========================================================================== */
:root{
  --cp-purple:#ff3870;        /* primary rose (was #ff1f59 bright) */
  --cp-purple-d:#c8154b;      /* deep rose (was #d41448) */
  --cp-purple-soft:#fdf6f9;   /* pink-tinted surface (was #F3F6FC bluish) */
  --cp-ink:#5c1d35;           /* dark mauve heading */
  --cp-ink2:#b91d4e;          /* deep raspberry (was #0F1A2E DARK NAVY!) */
  --cp-text:#1f1f2e;          /* body text */
  --cp-mut:#6b556a;           /* pink-mauve muted (was #64748b slate) */
  --cp-line:#f1e1e7;          /* soft pink border (was #e7e7ef neutral) */
  --cp-fh:"Poppins","Montserrat",system-ui,sans-serif;
  --cp-fb:"Inter","Montserrat",system-ui,sans-serif;
}
.ito-coursepg *{box-sizing:border-box}
.ito-coursepg{font-family:var(--cp-fb);color:var(--cp-text);background:#fff;width:100%}

/* ── HERO ─────────────────────────────────────────────────────────────── */
.ito-cp-hero{
  position:relative;overflow:hidden;isolation:isolate;
  background-size:cover;background-position:center;
  padding:clamp(64px,10vw,140px) clamp(16px,4vw,64px);
  text-align:center;color:#fff;border-bottom:3px solid #d6a944;
}
/* premium glow + vignette so image-less heroes still look rich */
.ito-cp-hero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(212,175,55,.18) 0%, rgba(212,175,55,0) 55%),
    radial-gradient(80% 70% at 88% 110%, rgba(30,64,175,.45) 0%, rgba(30,64,175,0) 60%);
}
.ito-cp-hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg, rgba(11,18,32,0) 55%, rgba(11,18,32,.45) 100%);
}
.ito-cp-hero__inner{max-width:1180px;margin:0 auto;position:relative}
.ito-cp-crumb{font-size:13px;color:rgba(255,255,255,.78);margin-bottom:22px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px}
.ito-cp-crumb a{color:rgba(255,255,255,.78);text-decoration:none}
.ito-cp-crumb a:hover{color:#fff}
.ito-cp-crumb span{margin:0 6px;opacity:.5}
.ito-cp-crumb strong{color:#fff;font-weight:600}
.ito-cp-hero__eyebrow{
  font-family:var(--cp-fh);text-transform:uppercase;letter-spacing:.26em;
  font-size:12px;font-weight:800;color:#E9C75A;margin-bottom:14px;
}
.ito-cp-hero__title{
  font-family:var(--cp-fh);font-size:clamp(2.1rem,5.2vw,3.6rem);
  font-weight:800;line-height:1.12;margin:0;letter-spacing:-.02em;
  text-shadow:0 2px 18px rgba(11,18,32,.35);
}
.ito-cp-hero__inner::after{
  content:"";display:block;width:64px;height:4px;border-radius:999px;
  background:linear-gradient(90deg,#d6a944,#E9C75A);margin:20px auto 0;
}
.ito-cp-hero__sub,.ito-br-hero__sub{margin-top:14px;font-size:1.02rem;
  color:rgba(255,255,255,.85);line-height:1.65;max-width:760px;
  margin-left:auto;margin-right:auto}

/* ── BODY GRID ────────────────────────────────────────────────────────── */
.ito-cp-body{
  max-width:1240px;margin:0 auto;padding:clamp(32px,5vw,64px) 24px;
  display:grid;grid-template-columns:1fr 380px;gap:48px;align-items:start;
}
.ito-cp-name{font-family:var(--cp-fh);font-size:clamp(1.5rem,3vw,2rem);font-weight:800;margin:0 0 8px;line-height:1.2}
.ito-cp-sub{font-size:1.02rem;color:var(--cp-mut);margin:0 0 20px;line-height:1.6}

.ito-cp-meta{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}
.ito-cp-meta span{font-size:13px;font-weight:600;padding:6px 12px;border-radius:8px}
.ito-cp-badge{background:var(--cp-purple);color:#fff}
.ito-cp-rate{background:#fff7e6;color:#b7791f}
.ito-cp-enr{background:var(--cp-purple-soft);color:var(--cp-purple-d)}
.ito-cp-age{background:#f1f5f9;color:#475569}

.ito-cp-pills{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.ito-cp-pill{font-size:12px;font-weight:600;color:var(--cp-purple-d);background:var(--cp-purple-soft);
  border:1px solid rgba(30,64,175,.25);padding:5px 12px;border-radius:999px}

.ito-cp-desc{font-size:.98rem;line-height:1.75;color:#d41448;margin:0 0 32px}
.ito-cp-desc p{margin:0 0 14px}

.ito-cp-h3{font-family:var(--cp-fh);font-size:1.35rem;font-weight:800;margin:0 0 18px}

/* Curriculum */
.ito-cp-level{border:1px solid var(--cp-line);border-radius:14px;overflow:hidden;margin:0 0 16px}
.ito-cp-level__head{
  background:linear-gradient(135deg,var(--cp-purple) 0%,var(--cp-purple-d) 100%);
  color:#fff;padding:16px 20px;
}
.ito-cp-level__head h4{font-family:var(--cp-fh);font-size:1.12rem;font-weight:800;margin:0 0 6px;letter-spacing:-.01em}
.ito-cp-level__meta{display:flex;gap:10px;flex-wrap:wrap;font-size:12px;color:#fff}
.ito-cp-level__meta span{background:rgba(255,255,255,.16);padding:3px 10px;border-radius:999px}
.ito-cp-lessons{list-style:none;margin:0;padding:0}
.ito-cp-lessons li{border-top:1px solid var(--cp-line)}
.ito-cp-lesson{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#fff;border:0;padding:14px 20px;font:inherit;font-size:.92rem;
  font-weight:600;color:#334155;cursor:pointer;text-align:left;
}
.ito-cp-lesson:hover{background:var(--cp-purple-soft)}
.ito-cp-chev{transition:transform .2s;color:var(--cp-purple);font-style:normal}
.ito-cp-lessons li.is-open .ito-cp-chev{transform:rotate(180deg)}
.ito-cp-lessons li.is-open .ito-cp-lesson{background:var(--cp-purple-soft);color:var(--cp-purple-d)}

/* ── STICKY SIDEBAR CARD ──────────────────────────────────────────────── */
.ito-cp-side{position:sticky;top:96px}
.ito-cp-card{
  background:#fff;border:1px solid var(--cp-line);border-radius:20px;
  box-shadow:0 20px 50px rgba(30,64,175,.12);overflow:hidden;padding:0 0 22px;
}
.ito-cp-card__img{width:100%;height:190px;object-fit:cover;display:block}
.ito-cp-plan-tabs{display:flex;gap:6px;margin:18px 22px 14px;padding:5px;
  background:#F3F6FC;border-radius:12px}
.ito-cp-plan-tab{flex:1;border:0;background:transparent;font:inherit;font-weight:700;
  font-size:14px;color:var(--cp-mut);padding:10px;border-radius:9px;cursor:pointer;transition:.18s}
.ito-cp-plan-tab.is-active{background:var(--cp-purple);color:#fff;box-shadow:0 6px 16px rgba(30,64,175,.35)}
.ito-cp-plan-desc{margin:0 22px 14px;font-size:13px;color:var(--cp-mut);line-height:1.55}

.ito-cp-price{margin:0 22px 16px}
.ito-cp-price__row{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.ito-cp-price__now{font-family:var(--cp-fh);font-size:1.9rem;font-weight:800;color:var(--cp-purple)}
.ito-cp-price__now small{font-size:.9rem;font-weight:600;color:var(--cp-mut)}
.ito-cp-price__was{font-size:1rem;color:#94a3b8;text-decoration:line-through}
.ito-cp-price__off{font-size:12px;font-weight:700;color:#16a34a;background:#dcfce7;padding:3px 9px;border-radius:6px}

.ito-cp-sel{padding:0}
.ito-cp-sel-lbl{margin:16px 22px 8px;font-family:var(--cp-fh);font-weight:700;font-size:12px;
  text-transform:uppercase;letter-spacing:.07em;color:var(--cp-mut)}
.ito-cp-levels{display:flex;flex-wrap:wrap;gap:8px;margin:0 22px 14px}
.ito-cp-level{flex:1 1 auto;border:1.5px solid var(--cp-line);background:#fff;border-radius:9px;
  padding:9px 12px;font:inherit;font-size:13px;font-weight:600;color:#475569;cursor:pointer;transition:.15s}
.ito-cp-level:hover{border-color:var(--cp-purple);color:var(--cp-purple)}
.ito-cp-level.is-active{background:var(--cp-purple);border-color:var(--cp-purple);color:#fff}
.ito-cp-level.is-disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.ito-cp-price__per{font-size:13px;color:var(--cp-mut);margin-left:8px}

.ito-cp-feat{list-style:none;margin:0 22px 18px;padding:0}
.ito-cp-feat li{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;color:#d41448;padding:5px 0}
.ito-cp-feat li i{color:var(--cp-purple);font-style:normal;font-weight:800;flex-shrink:0}

.ito-cp-cart{margin:0 22px}
.ito-cp-btn{display:block;width:calc(100% - 44px);margin:10px 22px 0;text-align:center;
  font-family:var(--cp-fh);font-weight:700;font-size:15px;padding:14px 18px;border-radius:10px;
  cursor:pointer;border:0;text-decoration:none;transition:.18s}
.ito-cp-cart .ito-cp-btn{width:100%;margin:0}
.ito-cp-btn--solid{background:var(--cp-purple);color:#fff;box-shadow:0 8px 20px rgba(30,64,175,.35)}
.ito-cp-btn--solid:hover{background:var(--cp-purple-d);transform:translateY(-1px)}
.ito-cp-btn--ghost{background:var(--cp-purple-soft);color:var(--cp-purple-d)}
.ito-cp-btn--ghost:hover{background:#F3F6FC}
.ito-cp-btn--line{background:#fff;border:1.5px solid var(--cp-line);color:#475569}
.ito-cp-btn--line:hover{border-color:var(--cp-purple);color:var(--cp-purple)}
.ito-cp-btn--gold{background:linear-gradient(135deg,#d6a944,#B8901F);color:#5c1d35;
  box-shadow:0 8px 20px rgba(212,175,55,.35)}
.ito-cp-btn--gold:hover{filter:brightness(1.05);transform:translateY(-1px)}

.ito-cp-contact{margin:18px 22px 0;padding-top:16px;border-top:1px solid var(--cp-line)}
.ito-cp-contact__h{font-family:var(--cp-fh);font-weight:700;font-size:13px;text-transform:uppercase;
  letter-spacing:.08em;color:var(--cp-text);margin:0 0 8px}
.ito-cp-contact a{display:block;font-size:13.5px;color:var(--cp-mut);text-decoration:none;padding:3px 0}
.ito-cp-contact a:hover{color:var(--cp-purple)}

/* ── FAQ ──────────────────────────────────────────────────────────────── */
.ito-cp-sech{font-family:var(--cp-fh);font-size:clamp(1.5rem,3.2vw,2.15rem);font-weight:800;
  text-align:center;margin:0 0 38px;letter-spacing:-.02em;position:relative;padding-bottom:16px}
.ito-cp-sech::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:64px;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--cp-purple),var(--cp-purple-d))}
.ito-cp-faqs,.ito-cp-related{max-width:100%;margin:0;padding:clamp(24px,4vw,44px) clamp(16px,3vw,48px)}
.ito-cp-faqs{background:#FAFBFE;border-top:1px solid var(--cp-line)}
.ito-cp-faqs .ito-cp-faqlist{max-width:100%;margin:0}
.ito-cp-faqlist{display:flex;flex-direction:column;gap:12px}
.ito-cp-faq{border:1px solid var(--cp-line);border-radius:12px;overflow:hidden;background:#fff}
.ito-cp-faq>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding:16px 22px;font-family:var(--cp-fh);font-size:1rem;font-weight:700;
  color:var(--cp-text);cursor:pointer;background:#FAFBFE;transition:.15s}
.ito-cp-faq>summary::-webkit-details-marker{display:none}
.ito-cp-faq>summary:hover{color:var(--cp-purple)}
.ito-cp-faq>summary i{font-style:normal;flex-shrink:0;width:24px;height:24px;border-radius:50%;
  background:var(--cp-purple);color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:1.05rem;line-height:1;transition:transform .2s}
.ito-cp-faq[open]>summary{background:linear-gradient(135deg,#ff1f59,#152C49);color:#fff}
.ito-cp-faq[open]>summary i{transform:rotate(45deg);background:#fff;color:#ff1f59}
.ito-cp-faq__a p{margin:0;padding:16px 22px;font-size:.95rem;line-height:1.7;color:#475569;white-space:pre-line}

/* ── OTHER COURSES GRID ───────────────────────────────────────────────── */
.ito-cp-related{max-width:100%}
.ito-cp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media (min-width:1500px){.ito-cp-grid{grid-template-columns:repeat(5,1fr)}}
@media (min-width:1900px){.ito-cp-grid{grid-template-columns:repeat(6,1fr)}}
.ito-cp-prod{display:flex;flex-direction:column;border:1px solid var(--cp-line);
  border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;transition:.18s;background:#fff}
.ito-cp-prod:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(30,64,175,.15);border-color:rgba(30,64,175,.3)}
.ito-cp-prod__img{height:150px;background-size:cover;background-position:center;display:block}
.ito-cp-prod__name{font-family:var(--cp-fh);font-weight:700;font-size:.95rem;padding:14px 16px 4px;line-height:1.35}
.ito-cp-prod__price{padding:0 16px 16px;font-weight:700;color:var(--cp-purple)}
.ito-cp-prod__price del{color:#94a3b8;font-weight:400;margin-right:6px}

/* ── RESPONSIVE ───────────────────────────────────────────────────────── */
@media (max-width:960px){
  .ito-cp-body{grid-template-columns:1fr;gap:32px}
  .ito-cp-side{position:static;order:-1}
  .ito-cp-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:680px){
  .ito-cp-grid{grid-template-columns:repeat(2,1fr);gap:14px}
  .ito-cp-body{padding:28px 16px}
  .ito-cp-faqs,.ito-cp-related{padding:24px 16px}
}
@media (max-width:420px){
  .ito-cp-grid{grid-template-columns:1fr}
}

/* ==========================================================================
   PHASE 2 — Workshops · Testimonials · Teachers · Achievements · Blog
   ========================================================================== */
.ito-cs{max-width:100%;margin:0;padding:clamp(18px,3vw,32px) clamp(16px,3vw,48px)}
.ito-cs .ito-cp-sech{margin-bottom:8px}
.ito-cs-ach__sub{text-align:center;color:var(--cp-mut);margin:0 0 30px;font-size:.95rem}

/* Workshops */
.ito-cs-ws__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}
.ito-cs-wcard{border:1px solid var(--cp-line);border-radius:14px;overflow:hidden;background:#fff;
  display:flex;flex-direction:column;transition:.18s}
.ito-cs-wcard:hover{box-shadow:0 16px 36px rgba(30,64,175,.14);transform:translateY(-3px)}
.ito-cs-wcard__img{height:140px;background:linear-gradient(135deg,var(--cp-purple),var(--cp-purple-d));
  background-size:cover;background-position:center}
.ito-cs-wcard__body{padding:18px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.ito-cs-wcard__body h3{font-family:var(--cp-fh);font-size:1.05rem;font-weight:700;margin:0}
.ito-cs-wcard__body p{font-size:.88rem;color:var(--cp-mut);line-height:1.6;margin:0;flex:1}
.ito-cs-attend{align-self:flex-start;font-weight:700;font-size:.88rem;color:var(--cp-purple);text-decoration:none}
.ito-cs-attend:hover{color:var(--cp-purple-d)}

/* Testimonials — scroll-snap carousel (no JS) */
.ito-cs-testi__track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:8px 4px 18px;margin-top:24px;-webkit-overflow-scrolling:touch}
.ito-cs-testi__track::-webkit-scrollbar{height:6px}
.ito-cs-testi__track::-webkit-scrollbar-thumb{background:rgba(30,64,175,.3);border-radius:3px}
.ito-cs-tcard{flex:0 0 340px;max-width:85vw;scroll-snap-align:start;background:#fff;
  border:1px solid var(--cp-line);border-radius:16px;padding:24px;box-shadow:0 8px 24px rgba(15,23,42,.05)}
.ito-cs-stars{color:#f5a623;font-size:1rem;letter-spacing:2px;margin-bottom:12px}
.ito-cs-tcard blockquote{margin:0 0 18px;font-size:.96rem;line-height:1.7;color:#d41448}
.ito-cs-tcard figcaption{display:flex;align-items:center;gap:12px;font-size:.85rem;color:var(--cp-mut)}
.ito-cs-tcard figcaption strong{color:var(--cp-text);font-size:.92rem}
.ito-cs-av{width:42px;height:42px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;
  justify-content:center;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--cp-purple),var(--cp-purple-d))}

/* Teachers */
.ito-cs-team__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin-top:30px}
.ito-cs-tch{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;
  text-decoration:none;color:inherit;padding:20px 12px;border:1px solid var(--cp-line);border-radius:14px;
  background:#fff;transition:.18s}
.ito-cs-tch:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(30,64,175,.14);border-color:rgba(30,64,175,.3)}
.ito-cs-tch__img{width:74px;height:74px;border-radius:50%;background-size:cover;background-position:center;
  display:flex;align-items:center;justify-content:center;font-family:var(--cp-fh);font-weight:800;
  font-size:1.6rem;color:#fff;background-color:var(--cp-purple)}
.ito-cs-tch__name{font-family:var(--cp-fh);font-weight:700;font-size:.95rem}
.ito-cs-tch__role{font-size:.8rem;color:var(--cp-mut)}

/* Achievements */
.ito-cs-ach__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ito-cs-acard{border:1px solid var(--cp-line);border-radius:14px;padding:22px 18px;text-align:center;
  background:linear-gradient(180deg,#fff,#faf9ff)}
.ito-cs-acard__tag{display:inline-block;font-size:11px;font-weight:800;text-transform:uppercase;
  letter-spacing:.06em;color:#fff;background:var(--cp-purple);padding:4px 12px;border-radius:999px;margin-bottom:12px}
.ito-cs-acard__name{display:block;font-family:var(--cp-fh);font-weight:700;font-size:1rem}
.ito-cs-acard__detail{display:block;font-size:.82rem;color:var(--cp-mut);margin-top:4px}

/* Blog */
.ito-cs-blog__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}
.ito-cs-bcard{display:flex;flex-direction:column;border:1px solid var(--cp-line);border-radius:14px;
  overflow:hidden;text-decoration:none;color:inherit;background:#fff;transition:.18s}
.ito-cs-bcard:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(30,64,175,.14)}
.ito-cs-bcard__img{height:160px;background:linear-gradient(135deg,#c7bdf5,#ff1f59);background-size:cover;background-position:center}
.ito-cs-bcard__date{font-size:12px;color:var(--cp-purple);font-weight:600;padding:14px 18px 0}
.ito-cs-bcard__title{font-family:var(--cp-fh);font-weight:700;font-size:1.02rem;padding:6px 18px 0;line-height:1.35}
.ito-cs-bcard__ex{font-size:.86rem;color:var(--cp-mut);line-height:1.6;padding:8px 18px 18px}

@media (max-width:960px){
  .ito-cs-ws__grid,.ito-cs-blog__grid{grid-template-columns:repeat(2,1fr)}
  .ito-cs-team__grid{grid-template-columns:repeat(3,1fr)}
  .ito-cs-ach__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px){
  .ito-cs{padding:28px 16px}
  .ito-cs-ws__grid,.ito-cs-blog__grid,.ito-cs-team__grid,.ito-cs-ach__grid{grid-template-columns:1fr}
  .ito-cs-tcard{flex-basis:280px}
}

/* ==========================================================================
   COURSE BROWSER — tabbed (category → subcategory → cards)
   ========================================================================== */
.ito-cb{width:100%;padding:14px clamp(16px,3vw,40px) 28px;background:#fff}
.ito-cb__head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:6px}
.ito-cb__title{font-family:var(--cp-fh);font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;
  letter-spacing:-.02em;margin:0}
.ito-cb__sub{margin:8px 0 0;color:var(--cp-mut);font-size:.98rem}
.ito-cb__viewall{flex-shrink:0;display:inline-flex;align-items:center;gap:8px;background:var(--cp-purple);
  color:#fff;font-family:var(--cp-fh);font-weight:700;font-size:.9rem;padding:12px 22px;border-radius:8px;
  text-decoration:none;transition:.18s}
.ito-cb__viewall:hover{background:var(--cp-purple-d)}

/* Tab row: category tabs (left, scrollable) + section-level "View all" pinned right. */
.ito-cb__tabrow{display:flex;align-items:center;gap:14px;margin:12px 0 0}
.ito-cb__tabrow .ito-cb__tabs{flex:1 1 auto;min-width:0;margin:0}
.ito-cb__tabrow .ito-cb__viewall{flex:0 0 auto;white-space:nowrap}
@media (max-width:640px){
  .ito-cb__tabrow{flex-wrap:wrap;gap:10px}
  .ito-cb__tabrow .ito-cb__tabs{flex:1 1 100%}
  .ito-cb__tabrow .ito-cb__viewall{order:-1;margin-left:auto;padding:9px 16px;font-size:.82rem}
}

/* MAJOR category tabs — one line, compact pills (scroll if overflow) */
.ito-cb__tabs{display:flex;flex-wrap:nowrap;gap:6px;margin:12px 0 0;
  overflow-x:auto;scrollbar-width:thin;scrollbar-color:#c7c9d1 transparent;padding-bottom:4px}
.ito-cb__tabs::-webkit-scrollbar{height:7px}
.ito-cb__tabs::-webkit-scrollbar-thumb{background:#c7c9d1;border-radius:4px}
.ito-cb__tabs::-webkit-scrollbar-track{background:transparent}
.ito-cb__tab{flex:0 0 auto;background:#F3F6FC;border:1.5px solid #d7dae0;color:#ff1f59;
  font-family:var(--cp-fh);font-weight:700;font-size:.78rem;padding:7px 13px;border-radius:999px;
  cursor:pointer;transition:.15s;white-space:nowrap}
.ito-cb__tab:hover{color:#fff;background:var(--cp-purple-d);border-color:var(--cp-purple-d)}
.ito-cb__tab.is-active{background:var(--cp-purple);border-color:var(--cp-purple);color:#fff;
  box-shadow:0 4px 12px rgba(30,64,175,.32)}

.ito-cb__panel{display:none}
.ito-cb__panel.is-active{display:block}

/* SUB category tabs — clearly different: 2nd line, light chips */
.ito-cb__subtabs{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 12px;
  padding:8px 0;border-top:1px dashed var(--cp-line);border-bottom:1px solid var(--cp-line)}
.ito-cb__sub{background:#fff;border:1px solid var(--cp-line);color:#64748b;
  font-family:var(--cp-fb);font-weight:600;font-size:.76rem;padding:5px 12px;border-radius:6px;
  cursor:pointer;transition:.15s}
.ito-cb__sub:hover{color:var(--cp-purple);border-color:var(--cp-purple)}
.ito-cb__sub.is-active{color:#fff;background:#d41448;border-color:#d41448}

/* Carousel */
.ito-cb__carousel{position:relative;display:flex;align-items:center}
.ito-cb__viewport{overflow:hidden;width:100%}
.ito-cb__track{display:flex;gap:20px;overflow-x:auto;scroll-behavior:smooth;
  padding:6px 2px 12px;scrollbar-width:thin;scrollbar-color:#c7c9d1 #F3F6FC}
.ito-cb__track::-webkit-scrollbar{height:9px}
.ito-cb__track::-webkit-scrollbar-thumb{background:#c7c9d1;border-radius:5px}
.ito-cb__track::-webkit-scrollbar-thumb:hover{background:#aeb2bd}
.ito-cb__track::-webkit-scrollbar-track{background:#F3F6FC;border-radius:5px}
.ito-cb__nav{flex-shrink:0;width:42px;height:42px;border-radius:50%;border:0;
  background:var(--cp-purple);color:#fff;font-size:1.4rem;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:.15s;z-index:2}
.ito-cb__nav:hover{background:var(--cp-purple-d);transform:scale(1.08)}
.ito-cb__nav--prev{margin-right:10px}
.ito-cb__nav--next{margin-left:10px}

/* Exactly 4 cards across the full viewport width (3 × 20px gaps). */
.ito-cb__card{flex:0 0 calc((100% - 60px) / 4);width:calc((100% - 60px) / 4);
  display:flex;flex-direction:column;border:1px solid var(--cp-line);border-radius:12px;
  overflow:hidden;background:#fff;transition:transform .2s,box-shadow .2s,border-color .2s}
.ito-cb__card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(30,64,175,.14);
  border-color:rgba(30,64,175,.3)}
.ito-cb__card.is-feature{border-color:var(--cp-purple);
  box-shadow:0 16px 38px rgba(30,64,175,.26);transform:translateY(-3px) scale(1.015);z-index:1}
.ito-cb__card-img{display:block;height:138px;overflow:hidden}
.ito-cb__card-img .ito-br-card__img{display:block;width:100%;height:100%;background-size:cover;background-position:center}
.ito-cb__card-img .ito-br-card__img--ph{display:flex;align-items:center;justify-content:center;
  font-family:var(--cp-fh);font-size:2.4rem;font-weight:800;color:rgba(255,255,255,.9);
  background:linear-gradient(135deg,var(--cp-purple),var(--cp-purple-d))}
.ito-cb__card-body{display:flex;flex-direction:column;gap:6px;padding:13px 14px;flex:1}
.ito-cb__card-title{font-family:var(--cp-fh);font-size:.95rem;font-weight:800;
  letter-spacing:.01em;margin:0;line-height:1.25}
.ito-cb__card-title a{color:var(--cp-purple-d);text-decoration:none}
.ito-cb__card-title a:hover{color:var(--cp-purple)}
.ito-cb__card-rating{display:flex;align-items:center;gap:5px;margin:0;font-size:.78rem;color:var(--cp-mut)}
.ito-cb__card-rating .ito-cb__stars{color:#d6a944;letter-spacing:.5px;font-size:.9rem;line-height:1}
.ito-cb__card-rating strong{color:var(--cp-text);font-weight:800}
.ito-cb__card-desc{margin:0;font-size:.8rem;color:var(--cp-mut);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ito-cb__card-feat{list-style:none;margin:1px 0 0;padding:0;display:flex;flex-direction:column;gap:3px}
.ito-cb__card-feat li{font-size:.77rem;color:#475569;display:flex;align-items:flex-start;gap:6px}
.ito-cb__card-feat i{color:var(--cp-purple);font-style:normal;font-weight:800}
.ito-cb__card-price{margin:4px 0 0;font-size:.78rem;color:var(--cp-mut)}
.ito-cb__card-price strong{font-family:var(--cp-fh);font-size:1.05rem;color:var(--cp-purple)}
.ito-cb__card-btns{display:flex;gap:7px;margin-top:auto;padding-top:6px}
.ito-cb__btn{flex:1;text-align:center;text-decoration:none;font-family:var(--cp-fh);font-weight:700;
  font-size:.74rem;padding:6px 6px;border-radius:6px;transition:.15s}
.ito-cb__btn--line{border:1px solid var(--cp-purple);color:var(--cp-purple);background:#fff}
.ito-cb__btn--line:hover{background:var(--cp-purple);color:#fff}
.ito-cb__btn--dark{display:block;margin-top:7px;background:var(--cp-ink);color:#fff;border:0;
  font-size:.74rem;padding:7px 6px}
.ito-cb__btn--dark:hover{background:#7a2540;filter:brightness(.92)} /* WQ lighter */

@media (max-width:1100px){
  .ito-cb__card,.ito-cb__card.is-feature{flex-basis:calc((100% - 40px)/3);width:calc((100% - 40px)/3)}
}
@media (max-width:820px){
  .ito-cb__head{flex-direction:column;align-items:flex-start}
  .ito-cb__nav{width:34px;height:34px;font-size:1.15rem}
  .ito-cb__card,.ito-cb__card.is-feature{flex-basis:calc((100% - 20px)/2);width:calc((100% - 20px)/2)}
}
@media (max-width:520px){
  .ito-cb__card,.ito-cb__card.is-feature{flex-basis:80vw;width:80vw}
}
@media (max-width:520px){
  .ito-cb__card,.ito-cb__card.is-feature{flex-basis:78vw;width:78vw}
}

/* ==========================================================================
   CATALOG BROWSE — shop (categories) + category archive
   ========================================================================== */
.ito-br-hero{padding:clamp(48px,7vw,90px) 24px;text-align:center;color:#fff}
.ito-br-hero__sub{margin:14px auto 0;max-width:620px;color:rgba(255,255,255,.7);font-size:1rem;line-height:1.6}

.ito-br-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:30px}
.ito-br-cat{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;
  padding:30px 18px;border:1px solid var(--cp-line);border-radius:16px;background:#fff;
  text-decoration:none;color:inherit;transition:.18s}
.ito-br-cat:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(30,64,175,.16);
  border-color:rgba(30,64,175,.35)}
.ito-br-cat__ic{font-size:2.4rem;line-height:1}
.ito-br-cat__name{font-family:var(--cp-fh);font-weight:700;font-size:1rem;line-height:1.3}
.ito-br-cat__n{font-size:.8rem;color:var(--cp-mut)}

.ito-br-subs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 32px}
.ito-br-sub{font-size:13px;font-weight:600;color:var(--cp-purple-d);background:var(--cp-purple-soft);
  border:1px solid rgba(30,64,175,.25);padding:7px 16px;border-radius:999px;text-decoration:none;transition:.15s}
.ito-br-sub:hover{background:var(--cp-purple);color:#fff;border-color:var(--cp-purple)}

.ito-br-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ito-br-card{display:flex;flex-direction:column;border:1px solid var(--cp-line);border-radius:14px;
  overflow:hidden;background:#fff;text-decoration:none;color:inherit;transition:.18s}
.ito-br-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(30,64,175,.16);
  border-color:rgba(30,64,175,.3)}
.ito-br-card__img{height:150px;background-size:cover;background-position:center;display:block}
.ito-br-card__img--ph{display:flex;align-items:center;justify-content:center;
  font-family:var(--cp-fh);font-size:2.6rem;font-weight:800;color:rgba(255,255,255,.9);
  background:linear-gradient(135deg,var(--cp-purple),var(--cp-purple-d))}
.ito-br-card__body{padding:16px 18px;display:flex;flex-direction:column;gap:6px;flex:1}
.ito-br-card__name{font-family:var(--cp-fh);font-weight:700;font-size:1rem;line-height:1.35}
.ito-br-card__price{font-size:.86rem;color:var(--cp-mut)}
.ito-br-card__price strong{color:var(--cp-purple);font-size:1rem}
.ito-br-card__cta{margin-top:auto;font-size:.86rem;font-weight:700;color:var(--cp-purple)}
.ito-br-empty{text-align:center;color:var(--cp-mut);padding:40px 0}

@media (max-width:960px){
  .ito-br-cats,.ito-br-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:680px){
  .ito-br-cats,.ito-br-grid{grid-template-columns:repeat(2,1fr);gap:14px}
}
@media (max-width:420px){
  .ito-br-cats,.ito-br-grid{grid-template-columns:1fr}
}

/* Branded fallbacks (no ugly WC placeholder) */
.ito-cp-hero--plain{background:linear-gradient(135deg,#5c1d35 0%,#152C49 40%,#ff1f59 100%)}
.ito-cp-card__img--ph{height:190px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--cp-purple),var(--cp-purple-d))}
.ito-cp-card__img--ph span{font-family:var(--cp-fh);font-size:3.4rem;font-weight:800;color:rgba(255,255,255,.85)}

/* Sidebar — Our Profile */
.ito-cp-profile{margin:18px 22px 0;padding-top:16px;border-top:1px solid var(--cp-line)}
.ito-cp-profile__box{display:flex;flex-direction:column;gap:6px;background:var(--cp-ink);
  border-radius:12px;padding:18px;color:#fff;text-align:center;margin-top:8px}
.ito-cp-profile__box strong{font-family:var(--cp-fh);font-size:1.1rem}
.ito-cp-profile__box strong span{color:var(--cp-purple)}
.ito-cp-profile__box span{font-size:12px;color:rgba(255,255,255,.6);line-height:1.5}

/* Sidebar — Our Videos */
.ito-cp-videos{margin:18px 22px 0;padding-top:16px;border-top:1px solid var(--cp-line)}
.ito-cp-vid{display:flex;align-items:center;gap:12px;background:var(--cp-purple-soft);
  border:1px solid rgba(30,64,175,.2);border-radius:10px;padding:12px 14px;margin-top:8px;
  text-decoration:none;color:var(--cp-purple-d);font-size:13px;font-weight:600;transition:.18s}
.ito-cp-vid:hover{background:#F3F6FC}
.ito-cp-vid__play{width:30px;height:30px;border-radius:50%;background:var(--cp-purple);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0}

/* Responsive video embed (YouTube/Vimeo/MP4) */
.ito-embed{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;
  background:#5c1d35;margin:8px 0} /* WQ lighter */
.ito-embed iframe,.ito-embed video{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.ito-cp-videos .ito-embed{margin:8px 22px 14px;width:calc(100% - 44px)}
.ito-cp-playlist{margin:8px 22px 16px}
.ito-cp-playlist .ito-embed{margin:0;border-radius:14px;box-shadow:0 10px 30px rgba(30,64,175,.18)}
.ito-cp-playlist__h{font-family:var(--cp-fh);font-weight:700;font-size:13px;color:var(--cp-text);
  margin:0 0 8px;display:flex;align-items:center;gap:7px}
.ito-cp-playlist__h::before{content:"▶";color:#E0654A}
.ito-cp-vid{padding:14px 16px;font-size:.92rem}
.ito-cp-vid__play{width:34px;height:34px;font-size:13px}
.ito-cs-demo__panes .ito-embed{margin:0}
.ito-cs-demo__tab{cursor:pointer}

/* Demo of Our Classes */
.ito-cs-demo__wrap{display:grid;grid-template-columns:260px 1fr;gap:24px;margin-top:30px}
.ito-cs-demo__tabs{list-style:none;margin:0;padding:0;border:1px solid var(--cp-line);border-radius:14px;overflow:hidden}
.ito-cs-demo__tabs li{padding:15px 18px;font-size:.92rem;font-weight:600;color:#475569;
  border-bottom:1px solid var(--cp-line);cursor:pointer;transition:.15s}
.ito-cs-demo__tabs li:last-child{border-bottom:0}
.ito-cs-demo__tabs li:hover{background:var(--cp-purple-soft);color:var(--cp-purple-d)}
.ito-cs-demo__tabs li.is-active{background:var(--cp-purple);color:#fff}
.ito-cs-demo__stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  text-align:center;background:linear-gradient(135deg,#ff1f59,#d41448);border-radius:16px;
  padding:64px 28px;color:#fff;min-height:300px}
.ito-cs-demo__play{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.14);
  border:2px solid rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;font-size:1.4rem}
.ito-cs-demo__stage p{color:rgba(255,255,255,.7);font-size:.95rem;margin:0;max-width:420px}
.ito-cs-demo__stage .ito-cs-attend{color:#fff;background:var(--cp-purple);padding:11px 22px;border-radius:8px}
.ito-cs-demo__stage .ito-cs-attend:hover{background:var(--cp-purple-d)}
@media (max-width:760px){
  .ito-cs-demo__wrap{grid-template-columns:1fr}
  .ito-cs-demo__tabs{display:flex;flex-wrap:wrap}
  .ito-cs-demo__tabs li{border-bottom:0;border-right:1px solid var(--cp-line);flex:1 1 auto;text-align:center}
}

/* ==========================================================================
   COURSE DETAIL — full-width + 3-layer CSS-only tabs + vibrant accents
   ========================================================================== */
.ito-cp-body--full{
  max-width:100% !important;
  margin:0 !important;
  padding:clamp(24px,3vw,44px) clamp(16px,3vw,48px) !important;
  grid-template-columns:minmax(0,1fr) 480px !important;
  gap:44px !important;
}
@media (min-width:1500px){
  .ito-cp-body--full{grid-template-columns:minmax(0,1fr) 540px !important;}
}
@media (max-width:980px){
  .ito-cp-body--full{grid-template-columns:1fr !important;}
}

/* Vibrant pill accents */
.ito-cp-pill--0{color:#ff1f59;background:#EAF0FC;border-color:rgba(30,64,175,.22)}
.ito-cp-pill--1{color:#0E7C6B;background:#E6F6F3;border-color:rgba(14,124,107,.22)}
.ito-cp-pill--2{color:#B4561E;background:#FCEFE4;border-color:rgba(180,86,30,.22)}
.ito-cp-pill--3{color:#6D3FB0;background:#F1EBFA;border-color:rgba(109,63,176,.22)}
.ito-cp-pill--4{color:#2E7D46;background:#E9F6ED;border-color:rgba(46,125,70,.22)}

/* LAYER 1 — hidden radios + tab bar + panes */
.ito-cp-tabr{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.ito-cp-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;
  border-bottom:2px solid var(--cp-line);padding-bottom:0}
.ito-cp-tab{padding:11px 20px;font-family:var(--cp-fh);font-weight:700;font-size:.9rem;
  color:var(--cp-mut);cursor:pointer;border-radius:10px 10px 0 0;border-bottom:3px solid transparent;
  margin-bottom:-2px;transition:.15s;white-space:nowrap}
.ito-cp-tab:hover{color:var(--cp-purple)}
.ito-cp-panes{padding:24px 0 0}
.ito-cp-pane{display:none}
.ito-cp-tabr--ov:checked ~ .ito-cp-panes .ito-cp-pane--ov,
.ito-cp-tabr--cu:checked ~ .ito-cp-panes .ito-cp-pane--cu,
.ito-cp-tabr--lr:checked ~ .ito-cp-panes .ito-cp-pane--lr,
.ito-cp-tabr--rq:checked ~ .ito-cp-panes .ito-cp-pane--rq,
.ito-cp-tabr--rv:checked ~ .ito-cp-panes .ito-cp-pane--rv{display:block}
.ito-cp-tabr--ov:checked ~ .ito-cp-tabs .ito-cp-tab--ov{color:#ff1f59;border-bottom-color:#ff1f59}
.ito-cp-tabr--cu:checked ~ .ito-cp-tabs .ito-cp-tab--cu{color:#0E7C6B;border-bottom-color:#0E7C6B}
.ito-cp-tabr--lr:checked ~ .ito-cp-tabs .ito-cp-tab--lr{color:#B4561E;border-bottom-color:#B4561E}
.ito-cp-tabr--rq:checked ~ .ito-cp-tabs .ito-cp-tab--rq{color:#6D3FB0;border-bottom-color:#6D3FB0}
.ito-cp-tabr--rv:checked ~ .ito-cp-tabs .ito-cp-tab--rv{color:#C2A33A;border-bottom-color:#C2A33A}

/* LAYER 2 — level sub-tabs (scoped inside the curriculum pane) */
.ito-cp-lvlr{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.ito-cp-lvltabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.ito-cp-lvltab{padding:8px 16px;border:1.5px solid var(--cp-line);border-radius:999px;
  font-family:var(--cp-fh);font-weight:700;font-size:.8rem;color:#475569;cursor:pointer;transition:.15s}
.ito-cp-lvltab:hover{border-color:var(--cp-purple);color:var(--cp-purple)}
.ito-cp-lvlpane{display:none}
.ito-cp-lvlr-0:checked ~ .ito-cp-lvlpanes .ito-cp-lvlpane-0,
.ito-cp-lvlr-1:checked ~ .ito-cp-lvlpanes .ito-cp-lvlpane-1,
.ito-cp-lvlr-2:checked ~ .ito-cp-lvlpanes .ito-cp-lvlpane-2,
.ito-cp-lvlr-3:checked ~ .ito-cp-lvlpanes .ito-cp-lvlpane-3,
.ito-cp-lvlr-4:checked ~ .ito-cp-lvlpanes .ito-cp-lvlpane-4,
.ito-cp-lvlr-5:checked ~ .ito-cp-lvlpanes .ito-cp-lvlpane-5{display:block}
.ito-cp-lvlr-0:checked ~ .ito-cp-lvltabs .ito-cp-lvltab-0,
.ito-cp-lvlr-1:checked ~ .ito-cp-lvltabs .ito-cp-lvltab-1,
.ito-cp-lvlr-2:checked ~ .ito-cp-lvltabs .ito-cp-lvltab-2,
.ito-cp-lvlr-3:checked ~ .ito-cp-lvltabs .ito-cp-lvltab-3,
.ito-cp-lvlr-4:checked ~ .ito-cp-lvltabs .ito-cp-lvltab-4,
.ito-cp-lvlr-5:checked ~ .ito-cp-lvltabs .ito-cp-lvltab-5{
  background:var(--cp-purple);border-color:var(--cp-purple);color:#fff}

/* LAYER 3 — level head + lesson list (always visible, no broken accordion) */
.ito-cp-lvlpane .ito-cp-level__head{background:linear-gradient(135deg,#ff1f59,#152C49);
  color:#fff;padding:16px 20px;border-radius:12px 12px 0 0}
.ito-cp-lvlpane .ito-cp-level__head h4{font-family:var(--cp-fh);font-size:1.1rem;font-weight:800;margin:0 0 6px}
.ito-cp-lvlpane .ito-cp-level__meta{display:flex;gap:8px;flex-wrap:wrap;font-size:12px}
.ito-cp-lvlpane .ito-cp-level__meta span{background:rgba(255,255,255,.16);padding:3px 10px;border-radius:999px}
.ito-cp-lvlpane .ito-cp-lessons{list-style:none;margin:0;padding:0;
  border:1px solid var(--cp-line);border-top:0;border-radius:0 0 12px 12px;overflow:hidden;counter-reset:ls}
.ito-cp-lvlpane .ito-cp-lessons li{display:flex;align-items:flex-start;gap:10px;
  padding:13px 18px;font-size:.92rem;color:#334155;border-top:1px solid var(--cp-line)}
.ito-cp-lvlpane .ito-cp-lessons li:nth-child(odd){background:#FAFBFE}
.ito-cp-lesson__tick{color:#0E7C6B;font-weight:800;flex-shrink:0}

/* What you'll learn / Requirements */
.ito-cp-learn,.ito-cp-reqs{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:1fr 1fr;gap:12px 24px}
@media (max-width:680px){.ito-cp-learn,.ito-cp-reqs{grid-template-columns:1fr}}
.ito-cp-learn li,.ito-cp-reqs li{display:flex;align-items:flex-start;gap:10px;
  font-size:.94rem;color:#334155;line-height:1.55}
.ito-cp-learn i{color:#0E7C6B;font-style:normal;font-weight:800}
.ito-cp-reqs i{font-style:normal}

/* Reviews summary */
.ito-cp-revsum{border:1px solid var(--cp-line);border-radius:14px;padding:24px}
.ito-cp-revsum__score{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.ito-cp-revsum__score strong{font-family:var(--cp-fh);font-size:2.4rem;color:#ff1f59}
.ito-cp-revsum__stars{color:#C2A33A;font-size:1.2rem;letter-spacing:2px}
.ito-cp-revsum__n{color:var(--cp-mut);font-size:.9rem}
.ito-cp-revsum p{color:#475569;line-height:1.65;margin:0 0 16px}

/* Wishlist button */
.ito-cp-wish{width:calc(100% - 44px);margin:10px 22px 0;display:flex;align-items:center;
  justify-content:center;gap:8px;background:#fff;border:1.5px solid var(--cp-line);
  color:#475569;font-family:var(--cp-fh);font-weight:700;font-size:14px;padding:12px;
  border-radius:10px;cursor:pointer;transition:.15s}
.ito-cp-cart + .ito-cp-wish,.ito-cp-sel .ito-cp-wish{margin-top:10px}
.ito-cp-wish:hover{border-color:#E0654A;color:#E0654A}
.ito-cp-wish .ito-cp-wish__ic{font-size:1.1rem;line-height:1}
.ito-cp-wish.is-saved{border-color:#E0654A;color:#E0654A;background:#FCEEEA}

/* Sidebar video groups */
.ito-cp-vidgroup{margin:0 22px 12px}
.ito-cp-vidgroup__h{font-family:var(--cp-fb);font-weight:700;font-size:12px;
  color:var(--cp-mut);margin:0 0 6px;text-transform:uppercase;letter-spacing:.05em}

/* Curriculum modules — native <details> accordion (always opens) */
.ito-cp-mods{border:1px solid var(--cp-line);border-top:0;border-radius:0 0 12px 12px;overflow:hidden}
.ito-cp-mod{border-top:1px solid var(--cp-line);background:#fff}
.ito-cp-mod:first-child{border-top:0}
.ito-cp-mod>summary{list-style:none;cursor:pointer;display:flex;align-items:center;
  justify-content:space-between;gap:12px;padding:14px 18px;font-family:var(--cp-fh);
  font-weight:700;font-size:.95rem;color:#1f2b45;background:#FAFBFE;transition:.15s}
.ito-cp-mod>summary::-webkit-details-marker{display:none}
.ito-cp-mod>summary:hover{background:var(--cp-purple-soft);color:var(--cp-purple-d)}
.ito-cp-mod>summary i{flex-shrink:0;width:22px;height:22px;border-radius:50%;
  background:var(--cp-purple);color:#fff;display:flex;align-items:center;justify-content:center;
  font-style:normal;font-size:1rem;line-height:1;transition:transform .2s}
.ito-cp-mod[open]>summary{background:linear-gradient(135deg,#ff1f59,#152C49);color:#fff}
.ito-cp-mod[open]>summary i{transform:rotate(45deg);background:#fff;color:#ff1f59}
.ito-cp-mod>ul{list-style:none;margin:0;padding:10px 18px 16px}
.ito-cp-mod>ul li{position:relative;padding:5px 0 5px 20px;font-size:.9rem;color:#334155;line-height:1.55}
.ito-cp-mod>ul li::before{content:"▸";position:absolute;left:0;color:#0E7C6B;font-weight:800}

/* ==========================================================================
   4-LAYER NESTED TABS — musical instrument course pages (.ito-nt)
   Layer 1 underline tabs · Layer 2 solid pills · Layer 3 outline pills ·
   Layer 4 gold segmented chips. Panes hidden unless .is-active; <noscript>
   in the markup reveals everything stacked when JS is off.
   ========================================================================== */
.ito-nt{margin:22px 0 0;width:100%}
.ito-nt-pane:not(.is-active){display:none}
.ito-nt-panes{padding:18px 0 0}
.ito-nt .ito-nt-panes .ito-nt-panes{padding:14px 0 0}

.ito-nt-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ito-nt-tab{font-family:var(--cp-fh);font-weight:700;cursor:pointer;border:0;
  background:none;color:var(--cp-mut);transition:.18s;line-height:1.25}
.ito-nt-tab:hover{color:var(--cp-purple)}

/* Layer 1 — underline tabs */
.ito-nt-bar--l1{gap:6px;border-bottom:2px solid var(--cp-line);padding-bottom:0}
.ito-nt-bar--l1 .ito-nt-tab{padding:11px 18px;font-size:.95rem;
  border-bottom:3px solid transparent;margin-bottom:-2px}
.ito-nt-bar--l1 .ito-nt-tab.is-active{color:var(--cp-purple);
  border-bottom-color:var(--cp-purple)}

/* Layer 2 — solid pills */
.ito-nt-bar--l2{margin:4px 0 2px}
.ito-nt-bar--l2 .ito-nt-tab{padding:9px 18px;font-size:.88rem;border-radius:999px;
  background:var(--cp-purple-soft);color:var(--cp-purple-d)}
.ito-nt-bar--l2 .ito-nt-tab.is-active{background:linear-gradient(135deg,var(--cp-purple),var(--cp-ink2));
  color:#fff;box-shadow:0 6px 16px rgba(30,64,175,.28)}

/* Layer 3 — outline pills */
.ito-nt-bar--l3 .ito-nt-tab{padding:7px 15px;font-size:.84rem;border-radius:999px;
  border:1.5px solid var(--cp-line);color:var(--cp-text)}
.ito-nt-bar--l3 .ito-nt-tab:hover{border-color:var(--cp-purple);color:var(--cp-purple)}
.ito-nt-bar--l3 .ito-nt-tab.is-active{border-color:var(--cp-purple);
  background:var(--cp-purple);color:#fff}

/* Layer 4 — gold segmented chips (scrolls horizontally on overflow) */
.ito-nt-bar--l4{gap:6px;flex-wrap:wrap;margin:14px 0 0;padding:10px;
  background:#FAFBFE;border:1px solid var(--cp-line);border-radius:12px}
.ito-nt-bar--l4 .ito-nt-tab{padding:6px 13px;font-size:.8rem;border-radius:8px;
  background:#fff;border:1px solid var(--cp-line);color:var(--cp-text)}
.ito-nt-bar--l4 .ito-nt-tab:hover{border-color:#d6a944;color:#8a6d12}
.ito-nt-bar--l4 .ito-nt-tab.is-active{background:linear-gradient(135deg,#d6a944,#B8901F);
  border-color:#B8901F;color:#1a1a1a;box-shadow:0 4px 12px rgba(212,175,55,.32)}

/* Text blocks */
.ito-nt-h{font-family:var(--cp-fh);font-size:1.3rem;font-weight:800;margin:0 0 14px;color:var(--cp-ink)}
.ito-nt-h4{font-family:var(--cp-fh);font-size:1.02rem;font-weight:800;margin:0 0 6px;color:var(--cp-purple-d)}
.ito-nt-p{font-size:.94rem;line-height:1.7;color:#334155;margin:0 0 12px}
.ito-nt-block{padding:14px 16px;border:1px solid var(--cp-line);border-left:4px solid var(--cp-purple);
  border-radius:10px;background:#FAFBFE;margin:0 0 12px}
.ito-nt-block .ito-nt-p{margin:0}

/* Why-choose cards */
.ito-nt-why{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.ito-nt-why__card{padding:16px;border:1px solid var(--cp-line);border-radius:14px;background:#fff}
.ito-nt-why__card strong{display:block;font-family:var(--cp-fh);font-size:1rem;
  color:var(--cp-purple);margin-bottom:6px}
.ito-nt-why__card span{font-size:.9rem;line-height:1.6;color:#475569}

/* Level head + meta */
.ito-nt-lvlhead{background:linear-gradient(135deg,var(--cp-purple),var(--cp-ink2));
  color:#fff;border-radius:12px;padding:16px 20px;margin:14px 0 0}
.ito-nt-lvlhead h4{font-family:var(--cp-fh);font-size:1.12rem;font-weight:800;margin:0 0 8px}
.ito-nt-lvlmeta{display:flex;gap:8px;flex-wrap:wrap;font-size:12px}
.ito-nt-lvlmeta span{background:rgba(255,255,255,.16);padding:3px 11px;border-radius:999px}

/* Syllabus accordions (reuse module look) */
.ito-nt-mods{border:1px solid var(--cp-line);border-radius:12px;overflow:hidden;margin:14px 0 0}
.ito-nt-mod{border-top:1px solid var(--cp-line)}
.ito-nt-mod:first-child{border-top:0}
.ito-nt-mod>summary{list-style:none;cursor:pointer;display:flex;align-items:center;
  justify-content:space-between;gap:12px;padding:13px 18px;font-family:var(--cp-fh);
  font-weight:700;font-size:.92rem;color:var(--cp-ink);background:#fff}
.ito-nt-mod>summary::-webkit-details-marker{display:none}
.ito-nt-mod>summary:hover{background:var(--cp-purple-soft)}
.ito-nt-mod[open]>summary{background:linear-gradient(135deg,var(--cp-purple),var(--cp-ink2));color:#fff}
.ito-nt-mod>summary i{font-style:normal;flex-shrink:0;width:22px;height:22px;border-radius:50%;
  border:1.5px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:14px}
.ito-nt-mod[open]>summary i{transform:rotate(45deg)}
.ito-nt-mod>ul{list-style:none;margin:0;padding:10px 18px 16px}
.ito-nt-mod>ul li{position:relative;padding:5px 0 5px 20px;font-size:.9rem;color:#334155;line-height:1.55}
.ito-nt-mod>ul li::before{content:"▸";position:absolute;left:0;color:#0E7C6B;font-weight:800}

/* Repertoire / song panes */
.ito-nt-rh{font-family:var(--cp-fh);font-size:1rem;font-weight:800;color:var(--cp-purple-d);
  margin:16px 0 10px;padding-bottom:8px;border-bottom:2px solid #d6a944}
.ito-nt-rep{list-style:none;margin:0;padding:0;border:1px solid var(--cp-line);
  border-radius:12px;overflow:hidden}
.ito-nt-rep li{position:relative;padding:11px 16px 11px 38px;font-size:.9rem;
  color:#334155;line-height:1.6;border-top:1px solid var(--cp-line)}
.ito-nt-rep li:first-child{border-top:0}
.ito-nt-rep li:nth-child(odd){background:#FAFBFE}
.ito-nt-rep li::before{content:"♪";position:absolute;left:14px;top:11px;color:#d6a944;font-weight:800}

/* Sidebar — Key Highlights + FAQs */
.ito-cp-highlights{margin-top:18px;padding-top:18px;border-top:1px solid var(--cp-line)}
.ito-cp-hl{list-style:none;margin:8px 0 0;padding:0}
.ito-cp-hl li{position:relative;padding:7px 0 7px 26px;font-size:.86rem;
  color:#334155;line-height:1.5}
.ito-cp-hl li i{position:absolute;left:0;top:7px;font-style:normal;color:#0E7C6B;font-weight:800}
.ito-cp-sidefaq{margin-top:18px;padding-top:18px;border-top:1px solid var(--cp-line)}
.ito-cp-sidefaq .ito-cp-faqlist{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.ito-cp-sidefaq .ito-cp-faq>summary{padding:11px 14px;font-size:.85rem}

@media (max-width:760px){
  .ito-nt-bar{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:thin}
  .ito-nt-bar .ito-nt-tab{flex:0 0 auto;white-space:nowrap}
  .ito-nt-bar--l4{flex-wrap:nowrap}
}

/* ── Post-FAQ section additions (sub-taglines, Google/Instagram/WhatsApp) ── */
.ito-cs-sub{max-width:760px;margin:-6px auto 26px;text-align:center;color:#475569;font-size:1.02rem;line-height:1.6}
.ito-cs-google__wrap,.ito-cs-ig__wrap{max-width:1200px;margin:0 auto}
.ito-cs-wa__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;max-width:1200px;margin:0 auto}
.ito-cs-wa__shot{width:100%;height:auto;border-radius:14px;box-shadow:0 4px 18px rgba(6,30,67,.10)}
.ito-cs-google,.ito-cs-ig,.ito-cs-wa{padding:46px 16px}

/* ===== WinQuest product-page feedback pass ===== */
/* Bigger hero + course-name title */
.ito-cp-hero__title{font-size:clamp(2.2rem,5vw,4rem)!important;line-height:1.1}
.ito-cp-name{font-size:clamp(2rem,4vw,3.1rem)!important;line-height:1.12}
.ito-cp-sub{font-size:1.12rem;line-height:1.6;max-width:none}
/* Wider sticky sidebar, tighter gap, less wasted space */
.ito-cp-body--full{grid-template-columns:1fr 440px!important;gap:34px!important}
@media (max-width:1024px){.ito-cp-body--full{grid-template-columns:1fr!important}}
.ito-cp-main{min-height:0}
/* First-layer tabs: breathing room (were touching) */
.ito-cp-tabr{gap:10px!important;flex-wrap:wrap;margin-bottom:20px;row-gap:10px}
.ito-cp-tab{margin:0!important}
/* Highlights: black text + green check emoji (not red) */
.ito-cp-feat li{color:#16203a!important;font-size:14px!important;align-items:center}
.ito-cp-feat li i{display:none!important}
.ito-cp-feat li::before{content:"\2705";margin-right:7px;flex-shrink:0;font-size:15px}
/* Full-width Google reviews + Instagram sections */
.ito-cs-google,.ito-cs-ig{max-width:100%!important;padding-left:24px;padding-right:24px}
.ito-cs-google__wrap,.ito-cs-ig__wrap{max-width:100%!important;width:100%}

/* Homepage-style image galleries (Achievements / Parents / WhatsApp) */
.ito-cs-imgrid{display:grid;grid-template-columns:repeat(var(--cs-cols,4),1fr);gap:16px;max-width:1200px;margin:0 auto;padding:0 16px}
.ito-cs-imgrid__i{width:100%;height:auto;border-radius:14px;box-shadow:0 4px 18px rgba(6,30,67,.10);background:#fff}
@media (max-width:900px){.ito-cs-imgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.ito-cs-imgrid{grid-template-columns:1fr}}
/* Sidebar 4-video grid */
.ito-cp-vidgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ito-cp-vidgrid .ito-embed{margin:0}

/* ===== Post-FAQ full-width carousels (arrow nav) ===== */
.ito-cs-car{padding:46px 0;width:100%;max-width:100%}
.ito-cs-car .ito-cp-sech,.ito-cs-car .ito-cs-sub{padding-left:16px;padding-right:16px}
.ito-cs-carwrap{position:relative;max-width:1500px;margin:0 auto;padding:0 46px}
.ito-cs-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:8px 4px 16px;scrollbar-width:none;-ms-overflow-style:none}
.ito-cs-track::-webkit-scrollbar{display:none}
.ito-cs-cell{flex:0 0 auto;width:250px;scroll-snap-align:start}
.ito-cs-cimg{width:100%;height:auto;border-radius:14px;box-shadow:0 4px 18px rgba(6,30,67,.10);background:#fff;display:block}
.ito-cs-arw{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:44px;height:44px;border-radius:50%;border:none;background:var(--nuvio-primary,#FF1F59);color:#fff;font-size:24px;line-height:42px;text-align:center;cursor:pointer;box-shadow:0 6px 16px rgba(255,31,89,.35);padding:0}
.ito-cs-arw--prev{left:2px}.ito-cs-arw--next{right:2px}
.ito-cs-arw:hover{filter:brightness(1.06)}
.ito-cs-car .ito-cs-tch{width:250px;margin:0}
@media (max-width:600px){.ito-cs-cell,.ito-cs-car .ito-cs-tch{width:74vw}.ito-cs-carwrap{padding:0 30px}}

/* Sidebar video thumbnails */
.ito-cp-vidgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:6px 0 10px}
.ito-cp-vthumb{display:block;text-decoration:none;color:inherit}
.ito-cp-vthumb__img{display:block;position:relative;width:100%;aspect-ratio:16/9;background-size:cover;background-position:center;border-radius:10px;overflow:hidden;background-color:#5c1d35}
.ito-cp-vthumb__play{position:absolute;inset:0;margin:auto;width:38px;height:38px;line-height:38px;text-align:center;border-radius:50%;background:rgba(255,31,89,.92);color:#fff;font-size:14px}
.ito-cp-vthumb__t{display:block;font-size:12px;margin-top:5px;color:#16203a;line-height:1.3}
.ito-cp-vmore{display:inline-block;margin:4px 0 10px;font-size:13px;font-weight:600;color:var(--nuvio-primary,#FF1F59);text-decoration:none}

/* #2 breathing space above first-layer tabs */
.ito-cp-tabr{margin-top:18px!important}

/* ===== feedback pass 3: tab spacing + arrow polish ===== */
.ito-cp-tabr{margin-top:30px!important;padding-bottom:8px}
.ito-cs-arw{background:var(--nuvio-primary,#FF1F59)!important;color:#fff!important;border:0!important;width:46px;height:46px;line-height:44px;font-weight:700;box-shadow:0 6px 18px rgba(255,31,89,.42)!important;display:flex;align-items:center;justify-content:center}
.ito-cs-arw:hover{filter:brightness(1.06)}
.ito-cp-vthumb--wide .ito-cp-vthumb__img{aspect-ratio:16/9;margin-bottom:4px}

/* ===== feedback pass 4: full-width carousels + neat Google-style arrows ===== */
.ito-cs-car{width:100%;max-width:100%}
.ito-cs-carwrap{max-width:100%!important;margin:0!important;padding:0 64px!important;position:relative}
.ito-cs-track{padding:10px 6px 18px}
.ito-cs-arw{
  position:absolute!important;top:50%!important;bottom:auto!important;transform:translateY(-50%)!important;
  width:44px!important;height:44px!important;min-width:0!important;min-height:0!important;max-width:44px!important;max-height:44px!important;
  padding:0!important;margin:0!important;border:1px solid rgba(6,30,67,.08)!important;border-radius:50%!important;
  background:#fff!important;color:var(--nuvio-primary,#FF1F59)!important;
  font-size:22px!important;line-height:1!important;font-weight:700!important;box-sizing:border-box!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  box-shadow:0 4px 16px rgba(6,30,67,.16)!important;cursor:pointer;z-index:6}
.ito-cs-arw:hover{background:var(--nuvio-primary,#FF1F59)!important;color:#fff!important}
.ito-cs-arw--prev{left:12px!important;right:auto!important}
.ito-cs-arw--next{right:12px!important;left:auto!important}
@media (max-width:600px){.ito-cs-carwrap{padding:0 46px!important}.ito-cs-arw{width:38px!important;height:38px!important;max-width:38px!important;max-height:38px!important}}

/* Teacher cards with name */
.ito-cs-car .ito-cs-tcard2{width:230px;margin:0;background:#fff;border-radius:14px;box-shadow:0 4px 18px rgba(6,30,67,.10);overflow:hidden;text-align:center}
.ito-cs-tcard2__img{width:100%;height:240px;object-fit:cover;display:block}
.ito-cs-tcard2__name{padding:12px 8px;font-weight:700;color:var(--nuvio-navy,#061E43);font-size:15px}
@media (max-width:600px){.ito-cs-car .ito-cs-tcard2{width:74vw}}

/* ===== Enlarge image-card carousels so baked-in details are readable ===== */
.ito-cs-psay .ito-cs-cell{width:440px;max-width:90vw}
.ito-cs-ach  .ito-cs-cell{width:340px;max-width:88vw}
.ito-cs-wa   .ito-cs-cell{width:300px;max-width:84vw}
@media (max-width:600px){
  .ito-cs-psay .ito-cs-cell{width:88vw}
  .ito-cs-ach .ito-cs-cell,.ito-cs-wa .ito-cs-cell{width:82vw}
}

/* ==========================================================================
   HOMEPAGE COURSE BROWSER OVERRIDES
   The [winquest_courses] / [winquest_group_classes] shortcodes render on the
   homepage OUTSIDE .ito-coursepg and INSIDE Astra/Elementor's centered, gold-
   themed container — which was repainting tabs/arrows gold, hiding the dark
   button's white label, and boxing the carousel. These rules: (a) restore
   box-sizing, (b) make it full-bleed edge-to-edge, (c) hide the gray
   scrollbars (navigate via round arrows + wrapped tabs), and (d) hard-lock the
   pink/gold/navy palette so it matches indiatutorsonline.com.
   ========================================================================== */
.ito-cb, .ito-cb *{ box-sizing:border-box; }

/* Full width: the Elementor container is already e-con-full (Astra content
   width 1920px), so the earlier 100vw + negative-margin hack over-shifted and
   CLIPPED the left edge. Just fill the container 100% with gutters from
   padding — this matches indiatutorsonline.com's wide layout (which is itself a
   wide container with ~35px gutters, not literal edge-to-edge). */
body.home{ overflow-x:clip; }
/* Root cause of the boxing: the Elementor container wrapping each browser is
   set to --width:85% (centered), leaving big side gaps. Force it to full width
   so the carousel + its heading span the row; the parent container's ~40px
   padding then provides clean SYMMETRIC gutters — no viewport breakout, so the
   left/right margins are honoured and nothing clips. The :has() selector
   targets both the courses and group-classes containers. */
.e-con:has(> .elementor-widget-shortcode .ito-cb){
  --width:100% !important; width:100% !important; max-width:100% !important;
  overflow:visible !important;
}
.ito-cb{
  width:100% !important; max-width:100% !important;
  margin-left:0 !important; margin-right:0 !important;
  padding:4px 0 30px !important;
  background:#fff;
}

/* Single header: the homepage Elementor section already has its own heading +
   subtitle, so hide the browser's own duplicate head. NOTE: the section-level
   "View all" link was moved OUT of the head into .ito-cb__tabrow below, so it
   stays visible inline with the tabs — the old hand-placed Elementor "View all"
   button under the cards is now redundant and should be deleted in Elementor. */
.ito-cb .ito-cb__head{ display:none !important; }

/* v1.9.60: section-level "View all" sits inline at the right end of the tab row. */
.ito-cb .ito-cb__tabrow{ display:flex !important; align-items:center !important; gap:14px !important; margin:4px 0 0 !important; }
.ito-cb .ito-cb__tabrow .ito-cb__tabs{ flex:1 1 auto !important; min-width:0 !important; margin:0 !important; }
.ito-cb .ito-cb__tabrow .ito-cb__viewall{ flex:0 0 auto !important; display:inline-flex !important; white-space:nowrap !important; }
@media (max-width:640px){
  .ito-cb .ito-cb__tabrow{ flex-wrap:wrap !important; }
  .ito-cb .ito-cb__tabrow .ito-cb__viewall{ order:-1 !important; margin-left:auto !important; }
}

/* Category tabs: ONE compact row like ITO (thin scrollbar only if they
   overflow). The card-carousel scrollbar stays hidden — round arrows scroll. */
.ito-cb__tabs{ flex-wrap:nowrap !important; overflow-x:auto !important; overflow-y:hidden !important; scrollbar-width:thin; padding-bottom:4px !important; }
.ito-cb__tabs::-webkit-scrollbar{ height:6px !important; }
.ito-cb__tabs::-webkit-scrollbar-thumb{ background:#e3b8c6 !important; border-radius:4px; }
.ito-cb__tabs::-webkit-scrollbar-track{ background:transparent !important; }
.ito-cb__track{ scrollbar-width:none !important; }
.ito-cb__track::-webkit-scrollbar{ display:none !important; width:0 !important; height:0 !important; }

/* Hard-lock palette (Astra's global gold/blue was overriding these). */
.ito-cb .ito-cb__tab{ flex:0 0 auto !important; white-space:nowrap !important; font-size:.78rem !important; padding:7px 13px !important; background:#F3F6FC !important; color:var(--cp-purple) !important; border:1.5px solid #d7dae0 !important; }
.ito-cb .ito-cb__tab:hover{ background:var(--cp-purple-d) !important; color:#fff !important; border-color:var(--cp-purple-d) !important; }
.ito-cb .ito-cb__tab.is-active{ background:var(--cp-purple) !important; color:#fff !important; border-color:var(--cp-purple) !important; box-shadow:0 4px 12px rgba(255,31,89,.30) !important; }
.ito-cb .ito-cb__sub{ background:#fff !important; color:#64748b !important; border:1px solid var(--cp-line) !important; }
.ito-cb .ito-cb__sub:hover{ color:var(--cp-purple) !important; border-color:var(--cp-purple) !important; }
.ito-cb .ito-cb__sub.is-active{ background:var(--cp-purple) !important; color:#fff !important; border-color:var(--cp-purple) !important; }
.ito-cb button.ito-cb__nav{ width:38px !important; height:38px !important; min-width:0 !important; min-height:0 !important; padding:0 !important; flex:0 0 38px !important; font-size:1.1rem !important; line-height:1 !important; background:var(--cp-purple) !important; color:#fff !important; border:0 !important; border-radius:50% !important; box-shadow:0 6px 16px rgba(255,31,89,.32) !important; }
.ito-cb button.ito-cb__nav:hover{ background:var(--cp-purple-d) !important; }
.ito-cb a.ito-cb__viewall{ background:var(--cp-purple) !important; color:#fff !important; }
.ito-cb a.ito-cb__viewall:hover{ background:var(--cp-purple-d) !important; }
.ito-cb a.ito-cb__btn--line{ background:#fff !important; color:var(--cp-purple) !important; border:1px solid var(--cp-purple) !important; }
.ito-cb a.ito-cb__btn--line:hover{ background:var(--cp-purple) !important; color:#fff !important; }
.ito-cb a.ito-cb__btn--dark{ background:var(--cp-ink) !important; color:#fff !important; border:0 !important; }
.ito-cb a.ito-cb__btn--dark:hover{ background:#7a2540 !important; color:#fff !important; filter:brightness(.92); } /* WQ lighter */
.ito-cb .ito-cb__card-title a{ color:var(--cp-purple-d) !important; }
.ito-cb .ito-cb__card-title a:hover{ color:var(--cp-purple) !important; }
.ito-cb .ito-cb__card-price strong{ color:var(--cp-purple) !important; }
.ito-cb .ito-cb__card-feat i{ color:var(--cp-purple) !important; }
.ito-cb .ito-cb__stars{ color:#d6a944 !important; }
.ito-cb .ito-cb__card.is-feature{ border-color:var(--cp-purple) !important; box-shadow:0 16px 38px rgba(255,31,89,.24) !important; }

/* Price block — was never ported, so prices showed as plain text. Bold pink
   "now", struck-through "was", green "40% OFF" badge, muted "/ per class"
   (matches indiatutorsonline.com). Used by both the carousel and product page. */
.ito-price{ display:inline-flex; align-items:baseline; flex-wrap:wrap; gap:4px 7px; line-height:1.2; }
.ito-price__now{ font-family:var(--cp-fh); font-weight:800; color:var(--cp-purple); font-size:1.05rem; }
.ito-price__was{ color:#94a3b8; text-decoration:line-through; font-size:.9em; }
.ito-price__off{ font-size:11px; font-weight:700; color:#16a34a; background:#dcfce7; padding:2px 7px; border-radius:6px; white-space:nowrap; }
.ito-price__per{ color:var(--cp-mut); font-size:.8em; font-weight:600; }

/* Taller card images so photos read clearly and bleed to the card sides
   (matches indiatutorsonline.com). */
.ito-cb .ito-cb__card-img{ height:194px !important; }
.ito-cb .ito-cb__card-img .ito-br-card__img{ width:100% !important; height:100% !important; background-size:cover !important; background-position:center !important; }
.ito-cb .ito-cb__card-img .ito-br-card__img--ph{ font-size:3rem !important; }

/* WinQuest-style header spacing + underlined subcategory tabs (instead of pill
   chips), one tidy row beneath the category pills. */
.ito-cb .ito-cb__tabs{ margin-top:4px !important; }
.ito-cb .ito-cb__subtabs{ gap:4px 20px !important; border-top:0 !important; border-bottom:1px solid var(--cp-line) !important; padding:6px 0 10px !important; margin:8px 0 14px !important; }
.ito-cb .ito-cb__sub{ background:transparent !important; border:0 !important; border-bottom:2px solid transparent !important; border-radius:0 !important; color:#1a1a1a !important; padding:5px 7px !important; font-weight:600 !important; transition:color .15s, border-color .15s, background .15s !important; }
.ito-cb .ito-cb__sub:hover{ color:var(--cp-purple) !important; border-bottom-color:rgba(255,31,89,.5) !important; }
/* Selected 2nd-layer (subcategory) tab: red underline + bold + soft pink tab. */
.ito-cb .ito-cb__sub.is-active{ background:rgba(255,31,89,.08) !important; color:var(--cp-purple) !important; border-bottom:3px solid var(--cp-purple) !important; border-radius:6px 6px 0 0 !important; font-weight:800 !important; box-shadow:inset 0 -1px 0 rgba(255,31,89,.25) !important; }


/* =========================================================================
   v1.9.73 — Product page ULTRA-LUXURY polish (WQ Rose)
   Overrides the remaining hardcoded dark-navy gradients with refined WQ
   rose treatments. The :root variables above already cascaded the bulk
   of the recolour — this block fixes the explicit gradients that bypass
   the vars and adds the premium typographic + spacing touches the user
   asked for ("sleek and ultra luxury").
   ========================================================================= */

/* Hero — refined 3-stop WQ rose with text-shadow + radial highlight */
.ito-cp-hero--plain {
  background: linear-gradient(135deg, #d63265 0%, #b91d4e 50%, #ff7da0 100%) !important;
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18);
}
.ito-cp-hero--plain::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 88% 26%, rgba(255,255,255,.28) 0%, transparent 44%),
    radial-gradient(circle at 12% 90%, rgba(255,255,255,.12) 0%, transparent 40%);
  pointer-events: none;
  z-index: 0;
}
.ito-cp-hero__inner { position: relative; z-index: 1; }
.ito-cp-hero__title {
  text-shadow: 0 2px 12px rgba(166,30,72,.28);
  letter-spacing: -.02em;
}
.ito-cp-hero__eyebrow {
  background: rgba(255,255,255,.22) !important;
  border: 1px solid rgba(255,255,255,.40) !important;
  color: #fff !important;
  backdrop-filter: blur(2px);
}

/* FAQ + curriculum module open state — no more navy, pure pink-gradient */
.ito-cp-faq[open] > summary {
  background: linear-gradient(135deg, #ff5d8c 0%, #ff3870 100%) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(255,56,112,.28) !important;
}
.ito-cp-faq[open] > summary i {
  background: #fff !important;
  color: #ff3870 !important;
}
.ito-cp-mod[open] > summary {
  background: linear-gradient(135deg, #ff5d8c 0%, #ff3870 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(255,56,112,.22) !important;
}
.ito-cp-mod[open] > summary i {
  background: #fff !important;
  color: #ff3870 !important;
}

/* Level pane header (Electric Guitar / Acoustic Guitar — the big pink
   header bar with chips) — refined rose gradient with text-shadow */
.ito-cp-lvlpane .ito-cp-level__head {
  background: linear-gradient(135deg, #d63265 0%, #b91d4e 50%, #ff7da0 100%) !important;
  color: #fff !important;
  border-radius: 14px 14px 0 0 !important;
  padding: 18px 22px !important;
  position: relative;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(255,72,120,.18), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.ito-cp-lvlpane .ito-cp-level__head::before {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 140px;
  height: 140px;
  background: radial-gradient(circle, rgba(255,255,255,.22), transparent 65%);
  pointer-events: none;
}
.ito-cp-lvlpane .ito-cp-level__head > * { position: relative; z-index: 1; }
.ito-cp-lvlpane .ito-cp-level__head h4 {
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(166,30,72,.28);
  letter-spacing: -.01em;
}

/* Notebook-tab levels (l2 modules, l4 gold) — replace navy endpoints
   with rose. Gold accent preserved for premium feel. */
.ito-nt-bar--l2 .ito-nt-tab.is-active {
  background: linear-gradient(135deg, #ff5d8c 0%, #ff3870 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(255,56,112,.28) !important;
}
.ito-nt-lvlhead {
  background: linear-gradient(135deg, #d63265 0%, #b91d4e 50%, #ff7da0 100%) !important;
  color: #fff !important;
}
.ito-nt-mod[open] > summary {
  background: linear-gradient(135deg, #ff5d8c 0%, #ff3870 100%) !important;
  color: #fff !important;
}

/* CTA band — was bright #ff1f59 to #d41448 — refine to rose 3-stop */
.ito-cp-ctaband,
.ito-cp-ctaband__inner {
  background: linear-gradient(135deg, #d63265 0%, #b91d4e 50%, #ff7da0 100%) !important;
  color: #fff !important;
  border-radius: 18px !important;
  position: relative;
  overflow: hidden;
  box-shadow: 0 14px 40px rgba(255,72,120,.20), inset 0 1px 0 rgba(255,255,255,.18) !important;
}

/* Primary CTA (Add to Cart) — pink gradient pill with hover lift */
.ito-cp-btn--solid,
.ito-cp-btn--enrol,
.ito-coursepg .single_add_to_cart_button {
  background: linear-gradient(135deg, #ff5d8c 0%, #ff3870 100%) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 13px 24px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  box-shadow: 0 8px 22px rgba(255,56,112,.32), inset 0 1px 0 rgba(255,255,255,.25) !important;
  transition: filter .15s, transform .15s, box-shadow .15s !important;
}
.ito-cp-btn--solid:hover,
.ito-cp-btn--enrol:hover,
.ito-coursepg .single_add_to_cart_button:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(255,56,112,.42), inset 0 1px 0 rgba(255,255,255,.25) !important;
}

/* Outline button (Book a Free Demo / Wishlist) */
.ito-cp-btn--ghost,
.ito-cp-btn--line {
  background: #fff !important;
  color: #5c1d35 !important;
  border: 1.5px solid #f1e1e7 !important;
  border-radius: 12px !important;
  padding: 11px 22px !important;
  font-weight: 700 !important;
  transition: border-color .15s, color .15s !important;
}
.ito-cp-btn--ghost:hover,
.ito-cp-btn--line:hover {
  border-color: #ff5d8c !important;
  color: #c8154b !important;
}

/* Sidebar card refinement — premium white card with rose-tinted shadow */
.ito-cp-card {
  background: #fff !important;
  border: 1px solid #f1e1e7 !important;
  border-radius: 18px !important;
  box-shadow: 0 14px 40px rgba(255,72,120,.10), 0 2px 6px rgba(92,29,53,.05) !important;
  overflow: hidden;
}
.ito-cp-card__img {
  border-radius: 18px 18px 0 0 !important;
}

/* Feature list — premium rows */
.ito-cp-feat li,
.ito-cp-feat__item {
  color: #1f1f2e !important;
  font-size: 14px !important;
  line-height: 1.5;
  padding: 6px 0 !important;
}

/* Price block — refined dark mauve */
.ito-cp-price {
  color: #5c1d35 !important;
  font-family: "Poppins", system-ui, sans-serif !important;
  letter-spacing: -.02em;
}

/* Top-tier tabs (About / Why Choose / Curriculum / Buying Guide) —
   refined underline indicator instead of solid bg */
.ito-nt-bar--l1 .ito-nt-tab.is-active {
  background: transparent !important;
  color: #c8154b !important;
  border-bottom: 3px solid #ff3870 !important;
  border-radius: 0 !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}
.ito-nt-bar--l1 .ito-nt-tab {
  color: #6b556a !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  padding: 10px 14px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  transition: color .15s, border-color .15s !important;
}
.ito-nt-bar--l1 .ito-nt-tab:hover {
  color: #c8154b !important;
  border-bottom-color: rgba(255,56,112,.4) !important;
}

/* Level chooser buttons in sidebar (Up to Grade 2 / 3-5 / 6-8) */
.ito-cp-level,
.ito-cp-level-btn {
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 13.5px !important;
  padding: 9px 14px !important;
  border: 1.5px solid #f5dbe5 !important;
  background: #fff !important;
  color: #5c1d35 !important;
  transition: all .15s !important;
}
.ito-cp-level.is-active,
.ito-cp-level-btn.is-active {
  background: linear-gradient(135deg, #ff5d8c 0%, #ff3870 100%) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 5px 14px rgba(255,56,112,.28) !important;
}

/* Page background — soft pink-tinted off-white */
.ito-coursepg {
  background: #fdf8fa;
}

/* === /v1.9.73 ULTRA-LUXURY product page polish === */


/* =========================================================================
   v1.9.75 — Product page MOBILE / iPad order + polish
   User: "the right side upto add to cart should be first, then left side
   and then the rest of the right side and then below section. mostly mac
   and iphone users will be there".

   Strategy: split the right column into .ito-cp-card (buy box) and
   .ito-cp-aside-extras (Save Wishlist, Book Demo, Contact, Videos)
   in HTML. On screens ≤980px flatten the aside via display:contents so
   both blocks become direct children of .ito-cp-body, then use flex order
   to put .ito-cp-card → .ito-cp-main → .ito-cp-aside-extras.
   ========================================================================= */

@media (max-width: 980px) {
  /* Body becomes a flex column on tablet/mobile */
  .ito-cp-body,
  .ito-cp-body--full {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    padding-left: clamp(14px, 4vw, 24px) !important;
    padding-right: clamp(14px, 4vw, 24px) !important;
  }

  /* Flatten the aside so its two children join the body flex flow */
  .ito-cp-side {
    display: contents !important;
    position: static !important;
  }

  /* Reorder: buy box → main content → extras */
  .ito-cp-card { order: 1 !important; }
  .ito-cp-main { order: 2 !important; }
  .ito-cp-aside-extras { order: 3 !important; }

  /* Buy box mobile polish */
  .ito-cp-card {
    margin: 0 !important;
    border-radius: 14px !important;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(255,72,120,.12), 0 2px 6px rgba(92,29,53,.05) !important;
  }
  .ito-cp-card__img {
    height: 200px !important;
    object-fit: cover;
  }

  /* Add to Cart button — full-width, larger tap target */
  .ito-cp-cart .ito-cp-btn--solid {
    width: 100% !important;
    padding: 14px 22px !important;
    font-size: 15px !important;
    min-height: 48px;
  }

  /* Hero — tighter on mobile so the buy box doesn't get pushed too far */
  .ito-cp-hero,
  .ito-cp-hero--plain {
    padding: 28px 16px 24px !important;
    border-radius: 14px !important;
    margin: 12px 16px 18px !important;
  }
  .ito-cp-hero__title {
    font-size: clamp(1.4rem, 5vw, 1.9rem) !important;
    line-height: 1.15 !important;
  }
  .ito-cp-hero__eyebrow {
    font-size: .68rem !important;
    padding: 4px 10px !important;
  }

  /* Main column polish */
  .ito-cp-main {
    width: 100% !important;
    min-width: 0 !important;
  }
  .ito-cp-name {
    font-size: clamp(1.4rem, 4.5vw, 1.8rem) !important;
    margin: 0 0 6px !important;
  }
  .ito-cp-sub {
    font-size: .95rem !important;
    margin: 0 0 12px !important;
  }
  .ito-cp-meta {
    gap: 6px !important;
    flex-wrap: wrap !important;
  }

  /* Extras section — visually grouped (cards stack with spacing) */
  .ito-cp-aside-extras {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
  }
  .ito-cp-aside-extras .ito-cp-btn {
    width: 100% !important;
    padding: 12px 18px !important;
    text-align: center !important;
    min-height: 44px;
  }
  .ito-cp-aside-extras .ito-cp-contact,
  .ito-cp-aside-extras .ito-cp-profile,
  .ito-cp-aside-extras .ito-cp-videos {
    background: #fff;
    border: 1px solid #f1e1e7;
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 4px 12px rgba(255,72,120,.06);
  }

  /* Tab strip — horizontal scroll on narrow widths */
  .ito-nt-bar--l1 {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }
  .ito-nt-bar--l1::-webkit-scrollbar { height: 4px; }
  .ito-nt-bar--l1::-webkit-scrollbar-thumb { background: #f5dbe5; border-radius: 2px; }
  .ito-nt-bar--l1 .ito-nt-tab {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    padding: 10px 12px !important;
    font-size: 13px !important;
  }
}

/* iPhone-specific tightening (≤430px = iPhone 15 Pro Max and below) */
@media (max-width: 430px) {
  .ito-cp-body,
  .ito-cp-body--full {
    gap: 16px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .ito-cp-hero,
  .ito-cp-hero--plain {
    padding: 22px 14px 20px !important;
    margin: 10px 12px 14px !important;
  }
  .ito-cp-card__img {
    height: 170px !important;
  }
  .ito-cp-card {
    padding: 0 !important;
  }
  .ito-cp-aside-extras .ito-cp-contact a,
  .ito-cp-aside-extras .ito-cp-profile span {
    font-size: 12.5px !important;
  }
}

/* MacBook 13–14" and iPad in landscape (~1024–1366px) — refine 2-col ratio */
@media (min-width: 981px) and (max-width: 1366px) {
  .ito-cp-body--full {
    grid-template-columns: minmax(0, 1fr) 380px !important;
    gap: 28px !important;
  }
}

/* === /v1.9.75 mobile order + Mac/iPhone polish === */