/* Ported verbatim from the approved mockup by tools/port_mockup.py. Edit the mockup, then re-run. */

  * { box-sizing: border-box; }
  body { background: var(--ground); color: var(--ink); font: 18px/1.6 var(--body); -webkit-font-smoothing: antialiased; }
  h1, h2, h3 { font-family: var(--display); font-weight: 900; line-height: 1.1; margin: 0; text-wrap: balance; letter-spacing: -0.01em; }
  p { margin: 0; }
  a { color: inherit; }
  img { display: block; max-width: 100%; height: auto; }
  .wrap { max-width: 1200px; margin-inline: auto; padding-inline: 28px; }
  @media (max-width: 520px) { .wrap { padding-inline: 16px; } }
  :focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; border-radius: 6px; }

  .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 800 16px/1 var(--display); padding: 16px 24px; border-radius: 12px; text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: background .15s ease, transform .15s ease; white-space: nowrap; }
  .btn:hover { transform: translateY(-1px); }
  .btn-orange { background: var(--orange); color: var(--navy); }
  .btn-orange:hover { background: var(--orange-hover); }
  .btn-line { border-color: var(--navy); color: var(--navy); background: transparent; }
  .btn-line:hover { background: var(--navy); color: var(--white); }
  .btn-sm { padding: 12px 18px; font-size: 15px; border-radius: 10px; }

  .kicker { font: 800 14px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; }

  /* Notice replaces the update popup */
  .notice { background: var(--navy); color: var(--white); font-size: 15px; }
  .notice .wrap { display: flex; justify-content: center; gap: 14px; padding-block: 10px; flex-wrap: wrap; text-align: center; }
  .notice a { color: var(--orange); font-weight: 700; text-underline-offset: 3px; }

  header.site { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: rgba(255,255,255,.94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
  header.site .wrap { display: flex; align-items: center; gap: 36px; padding-block: 14px; }
  header.site .logo img { height: 42px; width: auto; }
  nav.main { display: flex; gap: 26px; font: 700 16px/1 var(--body); }
  nav.main a { text-decoration: none; color: var(--ink); padding-block: 8px; border-bottom: 2px solid transparent; }
  nav.main a:hover { border-bottom-color: var(--orange); }
  .header-cta { margin-left: auto; display: flex; gap: 10px; }
  @media (max-width: 1000px) { nav.main { display: none; } }
  @media (max-width: 560px) { .header-cta .btn-line { display: none; } header.site .logo img { height: 34px; } }

  /* Hero */
  .hero { position: relative; overflow: hidden; background: linear-gradient(180deg, var(--fade-teal-1) 0%, var(--fade-teal-hero) 70%, var(--white) 100%); padding-block: 80px 104px; }
  .hero .wrap { position: relative; display: grid; grid-template-columns: 1fr 1.1fr; gap: 72px; align-items: center; }
  .hero h1 { font-size: clamp(50px, 7vw, 92px); line-height: 1.02; }
  .hero h1 .hl { color: var(--orange-deep); position: relative; white-space: nowrap; }
  .hero h1 .hl::after { content: ""; position: absolute; left: 2%; right: 4%; bottom: .06em; height: .14em; background: var(--orange); opacity: .35; border-radius: 99px; z-index: -1; }
  .hero h1 { position: relative; z-index: 0; }
  .hero .lede { font-size: 21px; color: var(--ink-lede); margin-top: 24px; max-width: 30em; }
  .hero .actions { display: flex; gap: 12px; margin-top: 36px; flex-wrap: wrap; }
  .hero .actions .btn { padding: 19px 28px; font-size: 17px; }
  .hero .btn-orange { box-shadow: 0 12px 24px -12px rgba(224,127,0,.7); }
  .badges { display: flex; gap: 10px; margin-top: 26px; align-items: center; flex-wrap: wrap; }
  .badges img { height: 44px; width: auto; }

  .hero-photo { position: relative; padding: 28px 28px 0 0; }
  .hero-photo .mark { position: absolute; right: -90px; top: -90px; width: 360px; opacity: .22; pointer-events: none; }
  .hero-photo .offset { position: absolute; inset: 0 0 28px 28px; background: var(--orange); border-radius: 32px; transform: rotate(3deg); }
  .hero-photo .frame { position: relative; border-radius: 32px; overflow: hidden; border: 6px solid var(--white); box-shadow: 0 40px 70px -30px rgba(32,32,48,.55); }
  .hero-photo .frame img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
  .chip { position: absolute; background: var(--white); border-radius: 16px; padding: 14px 18px; display: flex; gap: 12px; align-items: center; box-shadow: 0 18px 36px -16px rgba(32,32,48,.45); }
  .chip img { width: 44px; height: 44px; border-radius: 10px; }
  .chip b { font: 900 22px/1 var(--display); display: block; }
  .chip span { font-size: 14px; color: var(--muted); }
  .chip.one { left: -36px; bottom: 36px; }
  .chip.two { right: -8px; top: 0; }
  .chip .dot { width: 44px; height: 44px; border-radius: 12px; background: var(--plum); color: var(--white); display: grid; place-items: center; font: 900 17px/1 var(--display); }
  @media (max-width: 920px) {
    .hero .wrap { grid-template-columns: 1fr; gap: 48px; }
    .hero { padding-block: 48px 72px; }
    .chip.one { left: 12px; bottom: 16px; } .chip.two { right: 8px; top: 8px; }
    .hero-photo .mark { width: 240px; right: -40px; top: -60px; }
  }
  @media (max-width: 480px) { .chip { padding: 10px 12px; } .chip b { font-size: 18px; } .chip.two { display: none; } }

  /* Audience */
  .audience { padding-top: 8px; }
  .audience .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
  .aud { position: relative; border-radius: 28px; overflow: hidden; min-height: 440px; display: flex; align-items: flex-end; text-decoration: none; color: var(--white); }
  .aud > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
  .aud:hover > img { transform: scale(1.03); }
  .aud .scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(32,32,48,0) 30%, rgba(32,32,48,.88) 100%); }
  .aud .txt { position: relative; padding: 36px; display: grid; gap: 12px; max-width: 34em; }
  .aud h2 { font-size: clamp(28px, 3vw, 38px); }
  .aud p { color: rgba(255,255,255,.88); }
  .aud .tag { justify-self: start; border-radius: 8px; padding: 7px 12px; color: var(--navy); }
  .aud .go { font: 800 17px/1 var(--display); display: inline-flex; gap: 8px; margin-top: 4px; }
  @media (max-width: 800px) { .audience { padding-top: 8px; }
  .audience .wrap { grid-template-columns: 1fr; } .aud { min-height: 380px; } .aud .txt { padding: 26px; } }

  /* Feature rows */
  section.block { padding-block: 104px; }
  .sec-head { max-width: 760px; margin-bottom: 56px; }
  .sec-head h2 { font-size: clamp(34px, 4.4vw, 54px); margin-top: 14px; }
  .sec-head p { color: var(--muted); font-size: 20px; margin-top: 16px; }
  .feature { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: center; }
  .feature + .feature { margin-top: 96px; }
  .feature.flip .media { order: 2; }
  .feature .media { border-radius: 28px; overflow: hidden; }
  .feature .media img { width: 100%; aspect-ratio: 16 / 11; object-fit: cover; }
  .feature .media.screen { background: var(--orange-tint); padding: 36px 36px 0; }
  .feature .media.screen img { aspect-ratio: auto; border-radius: 16px 16px 0 0; box-shadow: 0 -8px 30px -12px rgba(32,32,48,.25); }
  .feature h3 { font-size: clamp(28px, 3vw, 40px); margin-top: 14px; }
  .feature p { color: var(--muted); margin-top: 16px; font-size: 19px; }
  .ticks { list-style: none; padding: 0; margin: 24px 0 0; display: grid; gap: 12px; }
  .ticks li { display: flex; gap: 12px; align-items: flex-start; }
  .ticks li::before { content: ""; flex: none; width: 22px; height: 22px; margin-top: 3px; border-radius: 50%; background: var(--c, var(--teal)) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat; }
  .link { font: 800 17px/1 var(--display); color: var(--teal-deep); text-decoration: none; display: inline-flex; gap: 8px; margin-top: 26px; }
  .link:hover { text-decoration: underline; text-underline-offset: 4px; }
  @media (max-width: 880px) { .feature { grid-template-columns: 1fr; gap: 28px; } .feature.flip .media { order: 0; } .feature + .feature { margin-top: 64px; } section.block { padding-block: 72px; } .feature .media.screen { padding: 20px 20px 0; } }

  /* Story */
  .story { background: var(--orange); }
  .story .wrap { display: grid; grid-template-columns: .85fr 1.15fr; gap: 64px; align-items: center; padding-block: 88px; }
  .story .photo { border-radius: 28px; overflow: hidden; border: 8px solid var(--white); transform: rotate(-2deg); box-shadow: 0 28px 50px -26px rgba(32,32,48,.5); }
  .story .photo img { width: 100%; aspect-ratio: 4 / 4.2; object-fit: cover; object-position: 58% 30%; }
  .story blockquote { margin: 18px 0 0; font: 800 clamp(26px, 3vw, 38px)/1.28 var(--display); color: var(--navy); }
  .story cite { display: block; margin-top: 22px; font-style: normal; font-weight: 700; color: rgba(32,32,48,.75); }
  .story .btn { margin-top: 30px; }
  .story .btn-line:hover { background: var(--navy); }
  @media (max-width: 880px) { .story .wrap { grid-template-columns: 1fr; gap: 36px; padding-block: 64px; } .story .photo { max-width: 420px; } }

  /* Proof */
  .proof { padding-block: 72px; border-bottom: 1px solid var(--line); }
  .proof .wrap { display: grid; grid-template-columns: repeat(3, 1fr) 1.4fr; gap: 24px; align-items: center; }
  .num b { display: block; font: 900 clamp(38px, 4.4vw, 56px)/1 var(--display); font-variant-numeric: tabular-nums; }
  .num span { color: var(--muted); font-weight: 600; }
  .num:nth-child(1) b { color: var(--teal-deep); } .num:nth-child(2) b { color: var(--orange-deep); } .num:nth-child(3) b { color: var(--plum); }
  .awards { border-left: 1px solid var(--line); padding-left: 32px; }
  .awards p { font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
  .awards .logos { display: flex; gap: 28px; align-items: center; margin-top: 16px; }
  .awards img { height: 46px; width: auto; filter: grayscale(1); opacity: .75; }
  @media (max-width: 900px) { .proof .wrap { grid-template-columns: repeat(3, 1fr); } .awards { grid-column: 1 / -1; border-left: 0; padding-left: 0; border-top: 1px solid var(--line); padding-top: 28px; } }
  @media (max-width: 520px) { .proof .wrap { grid-template-columns: 1fr; } }

  /* Resources */
  .row-head { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 36px; flex-wrap: wrap; }
  .row-head h2 { font-size: clamp(30px, 3.6vw, 44px); margin-top: 12px; }
  .posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .post { border-radius: 20px; padding: 30px; display: flex; flex-direction: column; gap: 12px; text-decoration: none; min-height: 250px; transition: transform .2s ease; }
  .post:hover { transform: translateY(-3px); }
  .post h3 { font-size: 25px; }
  .post p { color: var(--muted); }
  .post .more { margin-top: auto; font: 800 16px/1 var(--display); }
  @media (max-width: 860px) { .posts { grid-template-columns: 1fr; } .post { min-height: 0; } }

  /* Demo */
  .demo { background: var(--navy); color: var(--white); border-radius: 32px; padding: 64px; display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; position: relative; overflow: hidden; }
  .demo .mark { position: absolute; right: -60px; bottom: -80px; width: 300px; opacity: .1; }
  .demo h2 { font-size: clamp(30px, 3.6vw, 46px); }
  .demo p { color: var(--on-dark-soft); margin-top: 16px; }
  .demo .opts { display: grid; gap: 14px; position: relative; }
  .opt { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); border-radius: 16px; padding: 22px 24px; display: flex; justify-content: space-between; align-items: center; gap: 16px; text-decoration: none; transition: background .15s ease; }
  .opt:hover { background: rgba(255,255,255,.13); }
  .opt b { font: 800 19px/1.2 var(--display); display: block; }
  .opt span { color: var(--on-dark-soft); font-size: 15.5px; }
  .opt i { font-style: normal; font: 900 22px/1 var(--display); color: var(--orange); }
  @media (max-width: 880px) { .demo { grid-template-columns: 1fr; padding: 36px 24px; } }

  footer { padding-block: 72px 40px; margin-top: 104px; background: var(--soft); font-size: 16px; }
  footer .top { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 36px; }
  footer .logo img { height: 44px; width: auto; }
  footer h4 { font: 800 14px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; margin: 6px 0 16px; }
  footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; color: var(--muted); }
  footer a { text-decoration: none; }
  footer a:hover { color: var(--ink); }
  .news { display: flex; gap: 8px; margin-top: 14px; max-width: 400px; }
  .news input { flex: 1; min-width: 0; border: 1px solid var(--line); background: var(--white); border-radius: 10px; padding: 12px 14px; font: 16px var(--body); color: var(--ink); }
  footer .bottom { border-top: 1px solid var(--line); margin-top: 52px; padding-top: 24px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; color: var(--muted); font-size: 14px; }
  @media (max-width: 860px) { footer .top { grid-template-columns: 1fr 1fr; } footer .top > :first-child { grid-column: 1 / -1; } }

  .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  @media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

  /* ---------- Multi-page mockup ---------- */
  
  

  nav.main a.on { border-bottom-color: var(--orange); }

  /* Page heroes */
  .page-hero { background: linear-gradient(180deg, var(--fade-teal-1) 0%, var(--fade-teal-2) 75%, var(--white) 100%); padding-block: 72px 64px; }
  .page-hero.orange { background: linear-gradient(180deg, var(--fade-orange-1) 0%, var(--fade-orange-2) 75%, var(--white) 100%); }
  .page-hero.plum { background: linear-gradient(180deg, var(--fade-plum-1) 0%, var(--fade-plum-2) 75%, var(--white) 100%); }
  .page-hero h1 { font-size: clamp(42px, 5.6vw, 72px); line-height: 1.04; margin-top: 16px; max-width: 18ch; }
  .page-hero .lede { font-size: 21px; color: var(--ink-lede); margin-top: 20px; max-width: 34em; }
  .page-hero .actions { display: flex; gap: 12px; margin-top: 32px; flex-wrap: wrap; }
  .split { display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: center; }
  @media (max-width: 920px) { .split { grid-template-columns: 1fr; gap: 40px; } .page-hero { padding-block: 48px 40px; } }

  .tablet { border-radius: 26px; overflow: hidden; box-shadow: 0 40px 70px -30px rgba(32,32,48,.55); }
  .tablet img { width: 100%; }

  /* Product: feature explorer */
  .explorer { display: grid; grid-template-columns: .9fr 1.3fr; gap: 48px; align-items: start; }
  .ftabs { display: grid; gap: 10px; }
  .ftab { text-align: left; border: 2px solid var(--line); background: var(--white); border-radius: 16px; padding: 20px 22px; cursor: pointer; font: inherit; color: inherit; transition: border-color .15s ease, background .15s ease; }
  .ftab b { display: block; font: 900 20px/1.2 var(--display); }
  .ftab span { display: block; color: var(--muted); font-size: 16px; margin-top: 6px; }
  .ftab:hover { border-color: var(--line-strong); }
  .ftab[aria-selected="true"] { border-color: var(--teal); background: var(--teal-tint); }
  .fview { position: sticky; top: 100px; }
  .fview .tablet { background: var(--navy); }
  .fview p { color: var(--muted); font-size: 15px; margin-top: 12px; text-align: center; }
  @media (max-width: 900px) { .explorer { grid-template-columns: 1fr; } .fview { position: static; order: -1; } }

  /* Product: pricing */
  .pricing { background: var(--soft); padding-block: 96px; }
  .editions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .ed { background: var(--white); border: 1px solid var(--line); border-radius: 20px; padding: 26px; display: flex; flex-direction: column; gap: 10px; }
  .ed .flag { font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--teal-deep); }
  .ed h3 { font-size: 23px; }
  .ed p { color: var(--muted); font-size: 16px; }
  .ed .price { font: 900 30px/1 var(--display); margin-top: auto; padding-top: 14px; font-variant-numeric: tabular-nums; }
  .ed .price small { font: 600 14px var(--body); color: var(--muted); margin-left: 6px; }
  .ed .btn { margin-top: 8px; }
  .ed.featured { grid-column: span 3; display: grid; grid-template-columns: 1.3fr 1fr; gap: 32px; align-items: center; background: var(--navy); color: var(--white); border: 0; padding: 40px; }
  .ed.featured .flag { color: var(--orange); }
  .ed.featured h3 { font-size: clamp(28px, 3vw, 38px); }
  .ed.featured p { color: var(--on-dark-soft); font-size: 18px; }
  .ed.featured .buy { display: grid; gap: 12px; justify-items: start; }
  .ed.featured .price { font-size: 48px; padding: 0; }
  .ed.featured .price small { color: var(--on-dark-soft); }
  .region { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
  .region button { border: 1px solid var(--line); background: var(--white); border-radius: 999px; padding: 9px 16px; font: 700 15px var(--body); cursor: pointer; color: var(--ink); }
  .region button[aria-pressed="true"] { background: var(--navy); color: var(--white); border-color: var(--navy); }
  @media (max-width: 900px) { .editions { grid-template-columns: 1fr 1fr; } .ed.featured { grid-column: 1 / -1; grid-template-columns: 1fr; padding: 28px; } }
  @media (max-width: 560px) { .editions { grid-template-columns: 1fr; } }
  .bulk { margin-top: 28px; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; background: var(--orange-tint); border-radius: 20px; padding: 26px 30px; }
  .bulk b { font: 900 21px/1.2 var(--display); display: block; }
  .bulk span { color: var(--muted); }

  /* Stories */
  .stories { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .st { background: var(--white); border: 1px solid var(--line); border-radius: 22px; overflow: hidden; display: flex; flex-direction: column; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
  .st:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -24px rgba(32,32,48,.4); }
  .st img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
  .st .txt { padding: 24px; display: grid; gap: 8px; }
  .st q { font: 800 21px/1.3 var(--display); quotes: "\201C" "\201D"; }
  .st .who { color: var(--muted); font-size: 15.5px; }
  .st .who b { color: var(--ink); }
  .st.big { grid-column: span 2; grid-row: span 2; }
  .st.big img { aspect-ratio: 16 / 10; }
  .st.big q { font-size: clamp(26px, 2.8vw, 34px); }
  .stories .st:last-child { grid-column: span 2; }
  .stories .st:last-child img { aspect-ratio: 16 / 7; }
  @media (max-width: 900px) { .stories .st:last-child { grid-column: auto; } .stories .st:last-child img { aspect-ratio: 4 / 3; } .stories { grid-template-columns: 1fr 1fr; } .st.big { grid-column: 1 / -1; grid-row: auto; } }
  @media (max-width: 560px) { .stories { grid-template-columns: 1fr; } }
  .share { margin-top: 56px; background: var(--teal); color: var(--navy); border-radius: 28px; padding: 48px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
  .share h2 { font-size: clamp(28px, 3.2vw, 40px); }
  .share p { margin-top: 10px; max-width: 34em; }
  .share .btn { background: var(--navy); color: var(--white); }

  /* About */
  .timeline { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; position: relative; }
  .timeline::before { content: ""; position: absolute; left: 0; right: 0; top: 11px; height: 3px; background: var(--line); border-radius: 3px; }
  .timeline li { position: relative; padding-top: 40px; }
  .timeline li::before { content: ""; position: absolute; left: 0; top: 0; width: 25px; height: 25px; border-radius: 50%; background: var(--c); border: 5px solid var(--white); box-shadow: 0 0 0 2px var(--c); }
  .timeline .yr { font: 900 30px/1 var(--display); color: var(--c); font-variant-numeric: tabular-nums; }
  .timeline h3 { font-size: 19px; margin-top: 10px; }
  .timeline p { color: var(--muted); font-size: 15.5px; margin-top: 8px; }
  @media (max-width: 960px) { .timeline { grid-template-columns: 1fr; gap: 28px; } .timeline::before { left: 11px; right: auto; top: 0; bottom: 0; width: 3px; height: auto; } .timeline li { padding: 0 0 0 48px; } }
  .two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
  .panel { border-radius: 24px; padding: 36px; }
  .panel h3 { font-size: 26px; }
  .panel ul { margin: 18px 0 0; padding-left: 20px; display: grid; gap: 8px; }
  @media (max-width: 800px) { .two-col { grid-template-columns: 1fr; } .panel { padding: 26px; } }
  .family { display: grid; grid-template-columns: auto 1fr; gap: 40px; align-items: center; border: 1px solid var(--line); border-radius: 24px; padding: 36px; margin-top: 24px; }
  .family img { width: 220px; }
  .family p { color: var(--muted); }
  @media (max-width: 700px) { .family { grid-template-columns: 1fr; gap: 20px; padding: 26px; } }
  .team { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; }
  .person { display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: 14px; background: var(--soft); }
  .person .av { flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font: 900 17px/1 var(--display); color: var(--white); background: var(--c, var(--teal)); }
  .person b { display: block; font-size: 15.5px; line-height: 1.25; }
  .person span { display: block; font-size: 13.5px; color: var(--muted); line-height: 1.3; }

  /* Demo */
  .demo-page { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
  .cover { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 12px; }
  .cover li { display: flex; gap: 12px; align-items: center; font-weight: 700; font-size: 18px; }
  .cover li::before { content: ""; width: 26px; height: 26px; border-radius: 8px; flex: none; background: var(--teal-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A8F9C' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 16px no-repeat; }
  .contact { margin-top: 36px; display: grid; gap: 14px; }
  .contact div { display: flex; gap: 14px; align-items: baseline; }
  .contact dt, .contact .k { font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); width: 110px; flex: none; }
  .contact .v { font-weight: 700; user-select: all; }
  .form-card { background: var(--white); border: 1px solid var(--line); border-radius: 24px; padding: 36px; box-shadow: 0 30px 60px -40px rgba(32,32,48,.45); }
  .form-card h2 { font-size: 28px; }
  .form-card p.sub { color: var(--muted); margin-top: 6px; }
  .fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; }
  .field { display: grid; gap: 6px; }
  .field.full { grid-column: 1 / -1; }
  .field label { font-weight: 700; font-size: 15px; }
  .field input, .field select, .field textarea { font: 16px var(--body); color: var(--ink); border: 1.5px solid var(--line); border-radius: 12px; padding: 13px 14px; background: var(--white); width: 100%; }
  .field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--teal); box-shadow: 0 0 0 4px rgba(16,176,192,.18); }
  .form-card .btn { margin-top: 22px; width: 100%; }
  .form-note { margin-top: 14px; font-size: 15px; color: var(--teal-deep); font-weight: 700; }
  @media (max-width: 900px) { .demo-page { grid-template-columns: 1fr; gap: 40px; } .fields { grid-template-columns: 1fr; } .form-card { padding: 24px; } }

  /* Blog index */
  .chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 28px; }
  .chips button { border: 1px solid var(--line); background: var(--white); border-radius: 999px; padding: 9px 16px; font: 700 15px var(--body); cursor: pointer; color: var(--ink); }
  .chips button[aria-pressed="true"] { background: var(--navy); color: var(--white); border-color: var(--navy); }
  .featured-post { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; text-decoration: none; }
  .featured-post img { width: 100%; border-radius: 24px; aspect-ratio: 3 / 2; object-fit: cover; }
  .featured-post h2 { font-size: clamp(32px, 3.8vw, 48px); margin-top: 14px; }
  .featured-post p { color: var(--muted); margin-top: 14px; font-size: 19px; }
  .meta { color: var(--muted); font-size: 15px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
  .meta .cat { font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--teal-deep); }
  .bgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px 28px; margin-top: 64px; }
  .bcard { text-decoration: none; display: grid; gap: 12px; align-content: start; }
  .bcard img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 18px; transition: transform .3s ease; }
  .bcard:hover img { transform: scale(1.02); }
  .bcard h3 { font-size: 23px; }
  .bcard p { color: var(--muted); font-size: 16px; }
  .bcard .ph { aspect-ratio: 3 / 2; border-radius: 18px; display: grid; place-items: center; padding: 24px; text-align: center; font: 900 24px/1.2 var(--display); }
  @media (max-width: 900px) { .featured-post { grid-template-columns: 1fr; gap: 24px; } .bgrid { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 560px) { .bgrid { grid-template-columns: 1fr; } }

  /* Article */
  .art-head { padding-block: 64px 40px; background: linear-gradient(180deg, var(--fade-teal-1) 0%, var(--white) 100%); }
  .art-head .inner { max-width: 820px; }
  .crumb { font-size: 15px; color: var(--muted); }
  .crumb a { color: var(--teal-deep); font-weight: 700; text-decoration: none; }
  .art-head h1 { font-size: clamp(36px, 4.8vw, 58px); line-height: 1.08; margin-top: 18px; }
  .byline { display: flex; gap: 14px; align-items: center; margin-top: 26px; }
  .byline .av { width: 46px; height: 46px; border-radius: 50%; background: var(--plum); color: var(--white); display: grid; place-items: center; font: 900 18px/1 var(--display); }
  .byline b { display: block; }
  .byline span { color: var(--muted); font-size: 15px; }
  .art { display: grid; grid-template-columns: 220px minmax(0, 720px); gap: 64px; padding-block: 40px 40px; }
  .toc { position: sticky; top: 100px; align-self: start; font-size: 15px; }
  .toc p { font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
  .toc a { display: block; padding: 7px 0 7px 14px; border-left: 2px solid var(--line); color: var(--muted); text-decoration: none; }
  .toc a:hover { color: var(--ink); border-left-color: var(--orange); }
  .prose { font-size: 19px; line-height: 1.75; }
  .prose > * + * { margin-top: 1.1em; }
  .prose h2 { font-size: 32px; margin-top: 1.8em; scroll-margin-top: 100px; }
  .prose .intro { font-size: 22px; color: var(--ink-lede); line-height: 1.6; }
  .prose ol, .prose ul { padding-left: 1.2em; }
  .prose li + li { margin-top: .5em; }
  .prose a:not(:where(.btn)) { color: var(--teal-deep); font-weight: 700; }
  .callout { background: var(--orange-tint); border-radius: 20px; padding: 26px 28px; display: flex; gap: 20px; justify-content: space-between; align-items: center; flex-wrap: wrap; }
  .callout b { font: 900 21px/1.25 var(--display); display: block; }
  .callout span { color: var(--muted); font-size: 16.5px; }
  .benefits { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 1.2em; }
  .benefits div { background: var(--soft); border-radius: 16px; padding: 20px 22px; font-size: 16.5px; line-height: 1.55; }
  .benefits b { display: block; font: 900 19px/1.2 var(--display); margin-bottom: 6px; }
  .benefits div:last-child:nth-child(odd) { grid-column: 1 / -1; }
  @media (max-width: 640px) { .benefits { grid-template-columns: 1fr; } }
  .steps { background: var(--navy); border-radius: 24px; padding: 22px; color: var(--white); }
  .steps .frame { border-radius: 14px; overflow: hidden; background: var(--white); }
  .steps .frame img { width: 100%; }
  .steps .cap { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 14px; font-size: 15.5px; color: var(--on-dark-soft); line-height: 1.45; }
  .steps .cap b { color: var(--orange); display: block; font: 800 12.5px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 4px; }
  .steps .nav { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; }
  .steps .nav button { border: 0; background: rgba(255,255,255,.1); color: var(--white); font: 800 15px var(--display); padding: 11px 16px; border-radius: 10px; cursor: pointer; }
  .steps .nav button:disabled { opacity: .35; cursor: default; }
  .steps .dots { display: flex; gap: 6px; }
  .steps .dots span { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.3); }
  .steps .dots span.on { background: var(--orange); }
  .tags { display: flex; gap: 8px; flex-wrap: wrap; }
  .tags span { background: var(--soft); border-radius: 8px; padding: 6px 12px; font-size: 14.5px; font-weight: 700; color: var(--muted); }
  @media (max-width: 960px) { .art { grid-template-columns: 1fr; gap: 0; } .toc { display: none; } .prose { font-size: 18px; } }
  .bundles { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 1.4em; }
  .bundle { border: 1px solid var(--line); border-radius: 20px; overflow: hidden; display: grid; text-decoration: none; background: var(--white); }
  .bundle img { width: 100%; aspect-ratio: 1; object-fit: cover; }
  .bundle div { padding: 16px 18px; display: flex; justify-content: space-between; gap: 10px; align-items: center; }
  .bundle b { font: 900 17px/1.25 var(--display); }
  .bundle span { flex: none; font: 800 13px/1 var(--display); background: var(--teal-tint); color: var(--teal-deep); padding: 8px 10px; border-radius: 8px; }
  @media (max-width: 560px) { .bundles { grid-template-columns: 1fr; } }
  .related { border-top: 1px solid var(--line); padding-top: 56px; margin-top: 40px; }

  /* ---------- Header dropdowns ---------- */
  nav.main { gap: 4px; align-items: center; }
  .dd { position: relative; }
  .dd > button { font: 700 16px/1 var(--body); color: var(--ink); background: none; border: 0; padding: 12px 12px; border-radius: 10px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
  .dd > button::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: .6; }
  .dd > button:hover, .dd.open > button, .dd.on > button { background: var(--soft); }
  .dd.on > button { box-shadow: inset 0 -2px 0 var(--orange); }
  .dd::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px; }
  nav.main a.top { font: 700 16px/1 var(--body); color: var(--ink); text-decoration: none; padding: 12px 12px; border-radius: 10px; border: 0; }
  nav.main a.top:hover { background: var(--soft); }
  nav.main a.top.on { box-shadow: inset 0 -2px 0 var(--orange); }
  .menu { position: absolute; top: calc(100% + 8px); left: 0; min-width: 300px; background: var(--white); border: 1px solid var(--line); border-radius: 18px; padding: 10px; box-shadow: 0 30px 60px -24px rgba(32,32,48,.35); display: none; z-index: 40; }
  .dd.open .menu { display: grid; gap: 2px; }
  .dd:hover .menu { display: grid; gap: 2px; }
  nav.main:hover .dd.open:not(:hover) .menu { display: none; }
  .menu a { display: block; padding: 11px 14px; border-radius: 12px; text-decoration: none; color: var(--ink); border: 0; }
  .menu a:hover { background: var(--soft); }
  .menu a b { display: block; font: 800 16px/1.25 var(--display); }
  .menu a span { display: block; font-size: 14px; color: var(--muted); margin-top: 3px; line-height: 1.35; }
  .menu a[target="_blank"] b::after { content: " ↗"; color: var(--muted); font-weight: 700; }
  .menu .sep { height: 1px; background: var(--line); margin: 6px 8px; }
  /* Wide menu (Support): columns of links under small group names, then one link across the bottom */
  .menu.wide { min-width: 760px; grid-template-columns: repeat(3, 1fr); left: 50%; transform: translateX(-50%); }
  .dd:hover .menu.wide, .dd.open .menu.wide { grid-template-columns: repeat(3, 1fr); }
  .menu-col { display: grid; gap: 2px; align-content: start; }
  .menu-h { margin: 10px 14px 4px; font: 800 12.5px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
  .menu.wide > .sep, .menu.wide > a { grid-column: 1 / -1; }
  .burger { display: none; margin-left: auto; border: 1px solid var(--line); background: var(--white); border-radius: 10px; padding: 10px 12px; font: 800 15px var(--display); cursor: pointer; }
  .mnav { display: none; border-top: 1px solid var(--line); background: var(--white); }
  .mnav.open { display: block; }
  .mnav .wrap { padding-block: 12px 20px; display: grid; gap: 18px; }
  .mnav h4 { margin: 0 0 6px; font: 800 12.5px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
  .mnav a { display: block; padding: 8px 0; text-decoration: none; font-weight: 700; }
  @media (max-width: 1080px) { nav.main { display: none; } .burger { display: inline-block; } .header-cta { margin-left: 0; } }
  @media (max-width: 560px) { .header-cta .btn-orange { display: none; } }

  /* ---------- Shared product/service blocks ---------- */
  .pillars4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
  .pill4 { border-radius: 22px; padding: 26px; display: grid; gap: 10px; align-content: start; }
  .pill4 h3 { font-size: 22px; }
  .pill4 p { color: var(--ink-soft); font-size: 16.5px; }
  @media (max-width: 960px) { .pillars4 { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 520px) { .pillars4 { grid-template-columns: 1fr; } }
  .gallery { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(280px, 42%); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; }
  .gallery figure { margin: 0; scroll-snap-align: start; }
  .gallery img { width: 100%; border-radius: 18px; background: var(--soft); }
  .gallery figcaption { font-size: 15px; color: var(--muted); margin-top: 8px; }
  .gallery.tall { grid-auto-columns: minmax(200px, 23%); }
  .quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .qcard { background: var(--soft); border-radius: 20px; padding: 26px; display: grid; gap: 12px; align-content: start; }
  .qcard b { font: 900 20px/1.25 var(--display); }
  .qcard p { color: var(--ink-soft); font-size: 16.5px; }
  .qcard span { color: var(--muted); font-size: 14.5px; font-weight: 700; }
  .qcard.lead { grid-column: 1 / -1; background: var(--navy); color: var(--white); padding: 36px; }
  .qcard.lead p { color: var(--white); font: 800 clamp(22px, 2.4vw, 30px)/1.3 var(--display); }
  .qcard.lead span { color: var(--on-dark-soft); }
  @media (max-width: 860px) { .quotes { grid-template-columns: 1fr; } }
  .faq { display: grid; gap: 10px; max-width: 860px; }
  .faq details { border: 1px solid var(--line); border-radius: 16px; background: var(--white); }
  .faq summary { cursor: pointer; padding: 18px 22px; font: 800 18px/1.3 var(--display); list-style: none; display: flex; justify-content: space-between; gap: 16px; }
  .faq summary::-webkit-details-marker { display: none; }
  .faq summary::after { content: "+"; font: 900 22px/1 var(--display); color: var(--teal-deep); }
  .faq details[open] summary::after { content: "–"; }
  .faq details > div { padding: 0 22px 20px; color: var(--ink-soft); }
  .faq details > div ul { margin: 8px 0 0; padding-left: 20px; }
  .expert { display: flex; gap: 20px; align-items: center; background: var(--soft); border-radius: 20px; padding: 22px 24px; }
  .expert .av, .expert img { flex: none; width: 76px; height: 76px; border-radius: 50%; object-fit: cover; }
  .expert .av { display: grid; place-items: center; background: var(--teal); color: var(--white); font: 900 26px/1 var(--display); }
  .expert b { font: 900 19px/1.2 var(--display); display: block; }
  .expert span { display: block; color: var(--muted); font-size: 15px; }
  .expert p { margin-top: 8px; font-size: 16px; color: var(--ink-soft); }
  .buybox { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .buybox .ed { background: var(--white); }
  @media (max-width: 760px) { .buybox { grid-template-columns: 1fr; } }

  /* ---------- Course pages ---------- */
  .course-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 20px; overflow: hidden; margin-top: 40px; }
  .course-facts div { background: var(--white); padding: 20px 22px; }
  .course-facts b { display: block; font: 900 22px/1.2 var(--display); }
  .course-facts span { color: var(--muted); font-size: 14.5px; }
  @media (max-width: 800px) { .course-facts { grid-template-columns: 1fr 1fr; } }
  .course-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: start; }
  .fee { position: sticky; top: 100px; background: var(--navy); color: var(--white); border-radius: 24px; padding: 32px; display: grid; gap: 14px; }
  .fee .kicker { color: var(--orange); }
  .fee .amt { font: 900 44px/1 var(--display); font-variant-numeric: tabular-nums; }
  .fee .amt small { font: 600 15px var(--body); color: var(--on-dark-soft); margin-left: 6px; }
  .fee ul { margin: 0; padding-left: 20px; color: var(--on-dark); display: grid; gap: 6px; font-size: 16px; }
  .fee .early { background: rgba(248,152,24,.14); border: 1px solid rgba(248,152,24,.4); border-radius: 12px; padding: 12px 14px; font-size: 15.5px; }
  .fee .early b { color: var(--orange); }
  .fee .muted { color: var(--on-dark-muted); font-size: 14.5px; }
  @media (max-width: 900px) { .course-grid { grid-template-columns: 1fr; } .fee { position: static; } }
  .modules { display: grid; gap: 14px; }
  .module { border: 1px solid var(--line); border-radius: 18px; padding: 22px 24px; background: var(--white); }
  .module header { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
  .module h3 { font-size: 21px; }
  .module header span { color: var(--muted); font-size: 14.5px; font-weight: 700; flex: none; }
  .module .sess { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 14px; }
  .module .sess p { font-weight: 800; font-size: 15.5px; }
  .module .sess ul { margin: 6px 0 0; padding-left: 18px; color: var(--ink-soft); font-size: 15.5px; display: grid; gap: 4px; }
  @media (max-width: 640px) { .module .sess { grid-template-columns: 1fr; } }
  .checks { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 10px; }
  .checks li { display: flex; gap: 10px; }
  .checks li::before { content: ""; flex: none; width: 22px; height: 22px; margin-top: 3px; border-radius: 50%; background: var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat; }
  .schedule { width: 100%; border-collapse: collapse; margin-top: 14px; font-size: 16px; }
  .schedule th, .schedule td { text-align: left; padding: 12px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
  .schedule th { font: 800 13px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
  .tbl { overflow-x: auto; }
  .stamp { display: inline-block; background: var(--orange-tint); color: var(--orange-deep); font: 800 13px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; padding: 8px 12px; border-radius: 8px; }
  .h2 { font-size: clamp(28px, 3.2vw, 40px); }
  .stack > * + * { margin-top: 56px; }

  /* Teletherapy service */
  .impact { width: 100%; border-collapse: separate; border-spacing: 0 8px; }
  .impact th { font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; text-align: left; padding: 0 16px 6px; color: var(--muted); }
  .impact td { padding: 14px 16px; font-weight: 700; }
  .impact td:first-child { background: var(--before-bg); border-radius: 12px 0 0 12px; color: var(--before-ink); }
  .impact td:last-child { background: var(--after-bg); border-radius: 0 12px 12px 0; color: var(--after-ink); }
  .impact td.arrow { background: var(--white); width: 40px; text-align: center; color: var(--muted); }

  /* Hubs */
  .hub { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .hubcard { border: 1px solid var(--line); border-radius: 22px; padding: 28px; text-decoration: none; display: grid; gap: 10px; align-content: start; background: var(--white); transition: transform .2s ease, box-shadow .2s ease; }
  .hubcard:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -26px rgba(32,32,48,.45); }
  .hubcard .ic { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; font: 900 20px/1 var(--display); color: var(--navy); }
  .hubcard h3 { font-size: 22px; }
  .hubcard p { color: var(--muted); font-size: 16px; }
  .hubcard .go { font: 800 16px/1 var(--display); color: var(--teal-deep); margin-top: 4px; }
  .hubcard[target="_blank"] .go::after { content: " ↗"; }
  @media (max-width: 900px) { .hub { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 560px) { .hub { grid-template-columns: 1fr; } }
  .alert { display: flex; gap: 18px; align-items: center; justify-content: space-between; flex-wrap: wrap; background: var(--notice-bg); border: 1px solid var(--notice-line); border-radius: 18px; padding: 20px 24px; margin-bottom: 32px; }
  .alert b { font: 900 19px/1.25 var(--display); display: block; }
  .alert span { color: var(--notice-ink); }
  .people { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .pcard { border: 1px solid var(--line); border-radius: 22px; padding: 26px; display: grid; gap: 8px; align-content: start; background: var(--white); }
  .pcard .kicker { color: var(--teal-deep); }
  .pcard h3 { font-size: 22px; margin-top: 6px; }
  .pcard p { color: var(--muted); font-size: 16px; }
  .pcard .v { font-weight: 700; user-select: all; }
  @media (max-width: 900px) { .people { grid-template-columns: 1fr; } }
  .webinars { display: grid; gap: 16px; }
  .web { display: grid; grid-template-columns: 220px 1fr auto; gap: 24px; align-items: center; border: 1px solid var(--line); border-radius: 20px; padding: 18px; background: var(--white); }
  .web .thumb { aspect-ratio: 16 / 9; border-radius: 14px; display: grid; place-items: center; position: relative; overflow: hidden; }
  .web .thumb::after { content: ""; width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 7v10l8-5z' fill='%23202030'/%3E%3C/svg%3E") center / 26px no-repeat; box-shadow: 0 8px 20px -8px rgba(0,0,0,.4); }
  .web .thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .web h3 { font-size: 21px; }
  .web p { color: var(--muted); font-size: 16px; margin-top: 6px; }
  .web .len { font: 800 13px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--plum); }
  @media (max-width: 760px) { .web { grid-template-columns: 1fr; } }

  /* ---------- Pricing: pick your edition ---------- */
  .region button { padding: 11px 18px; }
  .plan { display: grid; grid-template-columns: 1.35fr 1fr; background: var(--white); border: 1px solid var(--line); border-radius: 28px; overflow: hidden; box-shadow: 0 40px 70px -50px rgba(32,32,48,.5); }
  .plan-main { padding: 40px; }
  .plan-main h3 { font-size: clamp(30px, 3.4vw, 42px); margin-top: 12px; }
  .plan-main > p#pl-desc, .plan-main > p.pl-desc { color: var(--ink-soft); font-size: 18.5px; margin-top: 14px; max-width: 36em; }
  .langs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
  .langs span { background: var(--teal-tint); color: var(--teal-deep); font-weight: 700; font-size: 15px; padding: 7px 12px; border-radius: 9px; }
  .inc-h { font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-top: 28px; }
  .plan-buy { background: var(--navy); color: var(--white); padding: 40px; display: grid; gap: 14px; align-content: start; }
  .plan-buy .amt { font: 900 52px/1 var(--display); font-variant-numeric: tabular-nums; }
  .plan-buy .muted { color: var(--on-dark-muted); font-size: 15px; margin-top: -6px; }
  .how { margin: 8px 0 6px; padding: 0; list-style: none; counter-reset: s; display: grid; gap: 12px; }
  .how li { counter-increment: s; display: flex; gap: 12px; align-items: baseline; color: var(--on-dark); font-size: 16px; }
  .how li::before { content: counter(s); flex: none; width: 26px; height: 26px; border-radius: 50%; background: rgba(255,255,255,.12); color: var(--white); display: grid; place-items: center; font: 900 14px/1 var(--display); transform: translateY(-2px); }
  .how b { color: var(--white); }
  .assure { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 28px; }
  .assure div { padding: 4px 0 4px 18px; border-left: 3px solid var(--teal); }
  .assure div:nth-child(2) { border-color: var(--orange); }
  .assure div:nth-child(3) { border-color: var(--plum); }
  .assure b { display: block; font: 900 18px/1.25 var(--display); }
  .assure span { color: var(--muted); font-size: 15.5px; }
  @media (max-width: 900px) { .plan { grid-template-columns: 1fr; } .plan-main, .plan-buy { padding: 28px; } .assure { grid-template-columns: 1fr; } }

  /* ---------- About ---------- */
  .ab-hero { background: var(--navy); color: var(--white); padding-block: 80px 0; overflow: hidden; }
  .ab-top { display: grid; grid-template-columns: 1.2fr 1fr; gap: 56px; align-items: end; }
  .ab-hero h1 { font-size: clamp(46px, 6.4vw, 88px); line-height: 1.02; margin-top: 16px; }
  .ab-hero h1 span { color: var(--orange); }
  .ab-lede { font-size: 20px; color: var(--on-dark-soft); }
  .mosaic { display: grid; grid-template-columns: 1.3fr 1fr 1fr; grid-template-rows: 250px 250px; gap: 14px; margin-top: 56px; transform: translateY(56px); }
  .mosaic img { width: 100%; height: 100%; object-fit: cover; border-radius: 22px; }
  .mosaic .m1 { grid-row: span 2; }
  .mosaic .m2 { grid-column: span 2; }
  @media (max-width: 860px) { .ab-top { grid-template-columns: 1fr; gap: 20px; } .mosaic { grid-template-columns: 1fr 1fr; grid-template-rows: 160px 160px 160px; } .mosaic .m1 { grid-row: auto; grid-column: span 2; } .mosaic .m2 { grid-column: auto; } }
  .ab-nums { padding-block: 120px 56px; border-bottom: 1px solid var(--line); }
  .ab-nums .wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
  .ab-nums b { display: block; font: 900 clamp(36px, 4.4vw, 56px)/1 var(--display); color: var(--navy); font-variant-numeric: tabular-nums; }
  .ab-nums span { color: var(--muted); font-weight: 600; }
  @media (max-width: 700px) { .ab-nums .wrap { grid-template-columns: 1fr 1fr; } }
  .ab-story { display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px; }
  .ab-prose { font-size: 19px; line-height: 1.75; color: var(--ink-lede); display: grid; gap: 18px; }
  @media (max-width: 860px) { .ab-story { grid-template-columns: 1fr; gap: 24px; } }
  .awards-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 18px; }
  .aw { display: flex; gap: 18px; align-items: center; border: 1px solid var(--line); border-radius: 20px; padding: 22px; }
  .aw img { flex: none; height: 46px; width: auto; }
  .aw-seal { flex: none; width: 64px; height: 64px; border-radius: 50%; background: var(--orange); color: var(--navy); display: grid; place-items: center; text-align: center; font: 900 13px/1.1 var(--display); }
  .aw b { display: block; font: 800 17px/1.3 var(--display); }
  .aw span { color: var(--muted); font-size: 14.5px; }
  @media (max-width: 900px) { .awards-row { grid-template-columns: 1fr; } }
  .ab-belief { background: var(--orange-tint); padding-block: 96px; }
  .ab-quote p { font: 900 clamp(28px, 3.6vw, 46px)/1.2 var(--display); max-width: 24ch; color: var(--navy); }
  .ab-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; margin-top: 48px; }
  .ab-cols h3 { font-size: 24px; }
  .ab-cols p { color: var(--ink-soft); margin-top: 10px; }
  @media (max-width: 800px) { .ab-cols { grid-template-columns: 1fr; gap: 28px; } }
  .family > div p { color: var(--muted); }
  .teamgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
  .teamgrid h4 { margin: 0 0 12px; font: 800 13px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--teal-deep); padding-bottom: 10px; border-bottom: 2px solid var(--line); }
  .teamgrid ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
  .teamgrid li b { display: block; font-size: 16.5px; }
  .teamgrid li span { color: var(--muted); font-size: 14.5px; }
  @media (max-width: 900px) { .teamgrid { grid-template-columns: 1fr 1fr; } }

  /* anchors land below the sticky header */
  main [id] { scroll-margin-top: 110px; }
  .pillars4.two { grid-template-columns: 1fr 1fr; margin-top: 22px; }
  @media (max-width: 520px) { .pillars4.two { grid-template-columns: 1fr; } }
  .sub2 { color: var(--muted); margin-top: 10px; }
  .sub2 a { color: var(--teal-deep); font-weight: 700; }
  .stack .modules, .stack .faq, .experts { margin-top: 20px; }
  .experts { display: grid; gap: 12px; }
  .expert .av { font-size: 18px; }
  .fee .stamp { justify-self: start; }
  .fee-link { color: var(--white); font-weight: 700; text-underline-offset: 3px; font-size: 15.5px; }
  /* team photo cards */
  .teamgrid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 28px 20px; }
  .tm img, .tm .ph { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 20px; background: var(--soft); }
  .tm .ph { display: grid; place-items: center; font: 900 44px/1 var(--display); color: var(--white); background: var(--plum); }
  .tm b { display: block; font: 800 17px/1.25 var(--display); margin-top: 12px; }
  .tm span { display: block; color: var(--muted); font-size: 14.5px; line-height: 1.35; margin-top: 2px; }
  /* stories: big card fills its space, faces stay in frame */
  .st img { object-position: 50% 25%; }
  .st.big img { flex: 1 1 auto; min-height: 320px; aspect-ratio: auto; }
  /* pricing buy panel */
  .how li { display: grid; grid-template-columns: 26px 1fr; gap: 12px; }
  .how li span { color: var(--on-dark); }
  .how li b { display: block; }
  .buy-links { display: grid; gap: 10px; margin-top: 6px; }
  .buy-links a { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: 14px; padding: 14px 16px; text-decoration: none; color: var(--white); font: 800 16px/1.2 var(--display); }
  .buy-links a:hover { background: rgba(255,255,255,.14); }
  .buy-links a small { display: block; font: 600 13.5px var(--body); color: var(--on-dark-muted); margin-top: 3px; }
  .buy-links a i { font-style: normal; color: var(--orange); font-size: 20px; }
  /* Buy Avaz block: the pricing card for the visitor's country, filled in by wp.js (avaz/inc/buy.php) */
  .avaz-buy [hidden] { display: none; }
  .avaz-buy > p.muted { margin-bottom: 14px; }
  .plan-buy .fine a { color: var(--white); }
  .plan-buy .fine { color: var(--on-dark-muted); font-size: 14px; border-top: 1px solid rgba(255,255,255,.12); padding-top: 14px; margin-top: 4px; }

  /* ---------- Webinars ---------- */
  .wb-hero { background: var(--navy); color: var(--white); padding-block: 72px 80px; }
  .wb-hero h1 { font-size: clamp(42px, 5.6vw, 72px); line-height: 1.04; margin-top: 16px; }
  .wb-lede { color: var(--on-dark-soft); font-size: 20px; margin-top: 18px; max-width: 40em; }
  .wb-feature { display: grid; grid-template-columns: 1.6fr 1fr; gap: 28px; margin-top: 44px; align-items: stretch; }
  .wb-player { position: relative; display: block; border-radius: 24px; overflow: hidden; text-decoration: none; color: var(--white); min-height: 300px; background: var(--player); }
  .wb-player img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .8; transition: transform .4s ease, opacity .2s ease; }
  .wb-player:hover img { transform: scale(1.03); opacity: .9; }
  .wb-player::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,20,32,0) 40%, rgba(20,20,32,.85) 100%); }
  .wb-play { position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%); width: 84px; height: 84px; border-radius: 50%; background: var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23202030'/%3E%3C/svg%3E") 55% 50% / 38px no-repeat; z-index: 2; box-shadow: 0 16px 36px -12px rgba(0,0,0,.6); transition: transform .2s ease; }
  .wb-player:hover .wb-play { transform: translate(-50%, -50%) scale(1.06); }
  .wb-tag { position: absolute; left: 20px; top: 20px; z-index: 2; background: var(--white); color: var(--navy); font: 800 13px/1 var(--display); letter-spacing: .06em; text-transform: uppercase; padding: 8px 12px; border-radius: 8px; }
  .wb-cap { position: absolute; left: 24px; right: 24px; bottom: 22px; z-index: 2; }
  .wb-cap b { display: block; font: 900 28px/1.15 var(--display); }
  .wb-cap span { color: var(--on-dark); }
  .wb-next { display: grid; gap: 12px; align-content: start; }
  .wb-next a { display: grid; grid-template-columns: 110px 1fr; gap: 14px; align-items: center; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 16px; padding: 10px; text-decoration: none; color: var(--white); transition: background .15s ease; }
  .wb-next a:hover { background: rgba(255,255,255,.12); }
  .wb-next img, .wb-yr { width: 110px; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 10px; }
  .wb-yr { display: grid; place-items: center; background: var(--teal); color: var(--navy); font: 900 22px/1 var(--display); }
  .wb-next b { display: block; font: 800 17px/1.25 var(--display); }
  .wb-next span { color: var(--on-dark-muted); font-size: 14.5px; }
  @media (max-width: 900px) { .wb-feature { grid-template-columns: 1fr; } .wb-player { min-height: 240px; } }
  .wb-bar { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 71px); z-index: 10; background: rgba(255,255,255,.95); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
  .wb-bar .wrap { padding-block: 14px; }
  .wb-sec { padding-block: 72px 0; }
  .wb-sec h2 { font-size: clamp(30px, 3.6vw, 44px); margin-top: 12px; }
  .years { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
  .yr { border-radius: 20px; padding: 22px 20px; text-decoration: none; background: var(--white); border: 1px solid var(--line); display: grid; gap: 8px; align-content: start; position: relative; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }
  .yr::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--c); }
  .yr:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -26px rgba(32,32,48,.45); }
  .yr b { font: 900 36px/1 var(--display); color: var(--navy); margin-top: 6px; font-variant-numeric: tabular-nums; }
  .yr span { color: var(--muted); font-size: 15px; }
  .yr i { font-style: normal; font: 800 14.5px/1 var(--display); color: var(--teal-deep); margin-top: 6px; }
  @media (max-width: 1000px) { .years { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 560px) { .years { grid-template-columns: 1fr 1fr; } }
  .wb-single { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: baseline; background: var(--plum-tint); border-radius: 18px; padding: 20px 24px; text-decoration: none; }
  .wb-single b { font: 900 20px/1.25 var(--display); }
  .wb-single > span:not(.kicker) { color: var(--muted); }
  .wb-single i { font-style: normal; font: 800 15px/1 var(--display); color: var(--plum); margin-left: auto; }
  .wb-series { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; background: var(--orange-tint); border-radius: 28px; padding: 44px; }
  .wb-player.small { min-height: 260px; }
  @media (max-width: 860px) { .wb-series { grid-template-columns: 1fr; padding: 28px; gap: 28px; } }
  .wb-card { display: grid; grid-template-columns: 160px 1fr; gap: 18px; align-items: center; border: 1px solid var(--line); border-radius: 20px; padding: 12px; text-decoration: none; background: var(--white); }
  .wb-card img { width: 160px; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 14px; object-position: 50% 30%; }
  .wb-card b { display: block; font: 800 19px/1.25 var(--display); }
  .wb-card span { color: var(--muted); font-size: 15.5px; }
  @media (max-width: 520px) { .wb-card { grid-template-columns: 1fr; } .wb-card img { width: 100%; } }
  .wb-live { display: grid; grid-template-columns: 1fr 1.3fr; gap: 32px; align-items: center; border-top: 1px solid var(--line); padding-top: 56px; }
  .wb-live-links { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .wb-live-links a { border: 1px solid var(--line); border-radius: 16px; padding: 16px 18px; text-decoration: none; background: var(--white); }
  .wb-live-links a:hover { border-color: var(--teal); background: var(--teal-tint); }
  .wb-live-links b { display: block; font: 800 17px/1.2 var(--display); }
  .wb-live-links span { color: var(--muted); font-size: 14.5px; }
  @media (max-width: 800px) { .wb-live { grid-template-columns: 1fr; } }

  .buy-now { width: 100%; padding: 20px 24px; font-size: 19px; margin-top: 6px; box-shadow: 0 14px 28px -14px rgba(248,152,24,.8); }
  .buy-now span { opacity: .75; font-weight: 800; }
  .secure { display: flex; gap: 8px; align-items: center; justify-content: center; color: var(--on-dark-muted); font-size: 14px; margin-top: -2px; }
  .lock { width: 14px; height: 14px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A9ABBA' stroke-width='2.4' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center / contain no-repeat; }
  .trial { border-top: 1px solid rgba(255,255,255,.12); padding-top: 18px; margin-top: 8px; }
  .trial p { color: var(--on-dark-soft); font-size: 15.5px; }
  .trial p b { color: var(--white); }
  .trial-links { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 10px; }
  .trial-links a { color: var(--white); font-weight: 700; font-size: 15px; text-underline-offset: 3px; }

  .seasons { border: 1px solid var(--line); border-radius: 24px; background: var(--white); overflow: hidden; }
  .season-tabs { display: flex; gap: 4px; padding: 10px; background: var(--soft); border-bottom: 1px solid var(--line); overflow-x: auto; }
  .season-tabs button { border: 0; background: transparent; border-radius: 12px; padding: 12px 20px; font: 900 18px/1 var(--display); color: var(--muted); cursor: pointer; font-variant-numeric: tabular-nums; }
  .season-tabs button:hover { color: var(--ink); background: rgba(255,255,255,.7); }
  .season-tabs button[aria-selected="true"] { background: var(--white); color: var(--navy); box-shadow: 0 2px 8px -4px rgba(32,32,48,.3); }
  .season { padding: 8px 10px 16px; }
  .talk { display: grid; grid-template-columns: 64px 1fr auto; gap: 20px; align-items: center; padding: 16px 14px; border-radius: 16px; text-decoration: none; }
  .talk + .talk { border-top: 1px solid var(--line); }
  .talk:hover { background: var(--soft); }
  .talk:hover + .talk { border-top-color: transparent; }
  .talk-date { display: grid; justify-items: center; font: 800 12.5px/1 var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); gap: 4px; }
  .talk-date b { font: 900 28px/1 var(--display); color: var(--navy); letter-spacing: 0; font-variant-numeric: tabular-nums; }
  .talk-main b { display: block; font: 800 18.5px/1.3 var(--display); }
  .talk-main span { display: block; color: var(--muted); font-size: 15.5px; margin-top: 3px; }
  .talk-go { display: inline-flex; align-items: center; gap: 8px; font: 800 15px/1 var(--display); color: var(--navy); padding: 10px 14px 10px 10px; border-radius: 999px; background: var(--orange-tint); }
  .talk-go::before { content: ""; width: 22px; height: 22px; border-radius: 50%; background: var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23202030'/%3E%3C/svg%3E") 60% 50% / 12px no-repeat; }
  .talk:hover .talk-go { background: var(--orange); }
  .season-post { display: inline-block; margin: 10px 14px 0; color: var(--teal-deep); font-weight: 700; font-size: 15.5px; text-underline-offset: 3px; }
  @media (max-width: 640px) { .talk { grid-template-columns: 48px 1fr; gap: 14px; } .talk-go { grid-column: 2; justify-self: start; } }

  /* WordPress: keep the admin bar from covering the sticky header */
  .admin-bar header.site { top: 32px; }
  @media (max-width: 782px) { .admin-bar header.site { top: 46px; } }