/* Dr. Praveen — Karimnagar */
      /* latin-ext */
      /* latin */
      /* latin-ext */
      /* latin */
      /* latin-ext */
      /* latin */
      /* cyrillic-ext */
      /* vietnamese */
      /* latin-ext */
      /* latin */
      /* cyrillic-ext */
      /* vietnamese */
      /* latin-ext */
      /* latin */
      /* cyrillic-ext */
      /* vietnamese */
      /* latin-ext */
      /* latin */
      /* cyrillic-ext */
      /* vietnamese */
      /* latin-ext */
      /* latin */
      /* cyrillic-ext */
      /* vietnamese */
      /* latin-ext */
      /* latin */
      /* cyrillic-ext */
      /* vietnamese */
      /* latin-ext */
      /* latin */
      /* fallback */
      .material-icons-round {
        font-family: "Material Icons Round";
        font-weight: normal;
        font-style: normal;
        font-size: 24px;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-feature-settings: "liga";
        -webkit-font-smoothing: antialiased;
      }

      :root {
        /* Brand */
        --blue: #3b82f6;
        --blue-600: #2563eb;
        --blue-700: #1d4ed8;
        --blue-50: #eff6ff;
        --blue-100: #dbeafe;
        --blue-200: #bfdbfe;

        --green: #10b981;
        --green-600: #059669;
        --green-700: #047857;
        --green-50: #ecfdf5;
        --green-100: #d1fae5;

        /* Ink */
        --ink: #0b1220;
        --ink-2: #1b2436;
        --ink-soft: #4b5668;
        --ink-muted: #8894a6;

        /* Surface */
        --bg: #fafbff;
        --bg-2: #f2f6ff;
        --surface: #ffffff;
        --line: #e4e9f2;
        --line-soft: #eef2f9;

        /* Gradients */
        --grad-br: linear-gradient(135deg, #3b82f6 0%, #10b981 100%);
        --grad-br-soft: linear-gradient(135deg, #eff6ff 0%, #ecfdf5 100%);

        /* Shape */
        --r-sm: 10px;
        --r: 16px;
        --r-lg: 24px;
        --r-xl: 32px;

        /* Shadow */
        --sh-1: 0 1px 2px rgba(11, 18, 32, 0.05);
        --sh-2:
          0 6px 18px -8px rgba(11, 18, 32, 0.14),
          0 2px 4px rgba(11, 18, 32, 0.04);
        --sh-3:
          0 16px 40px -12px rgba(11, 18, 32, 0.18),
          0 4px 8px rgba(11, 18, 32, 0.05);
        --sh-blue: 0 12px 28px -10px rgba(59, 130, 246, 0.45);
        --sh-green: 0 12px 28px -10px rgba(16, 185, 129, 0.45);

        /* Fonts */
        --head: "Lato", -apple-system, BlinkMacSystemFont, sans-serif;
        --body:
          "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;
      }

      * {
        box-sizing: border-box;
      }
      html,
      body {
        margin: 0;
        padding: 0;
      }
      body {
        font-family: var(--body);
        background: var(--bg);
        color: var(--ink);
        font-size: 16px;
        line-height: 1.55;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
      }
      a {
        color: inherit;
        text-decoration: none;
      }
      button {
        font-family: inherit;
        cursor: pointer;
        border: none;
        background: none;
        color: inherit;
      }
      img {
        max-width: 100%;
        display: block;
      }
      input,
      textarea,
      select {
        font-family: inherit;
      }

      /* Headings — Lato 900 */
      h1,
      h2,
      h3,
      h4,
      h5 {
        font-family: var(--head);
        font-weight: 900;
        letter-spacing: -0.02em;
        line-height: 1.05;
        margin: 0;
      }

      .mi {
        font-family: "Material Icons Round";
        font-weight: normal;
        font-style: normal;
        font-size: 20px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        white-space: nowrap;
        direction: ltr;
        -webkit-font-smoothing: antialiased;
        text-rendering: optimizeLegibility;
        font-feature-settings: "liga";
      }

      /* ========== LAYOUT ========== */
      .app {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
      }
      .container {
        width: 100%;
        max-width: 1240px;
        margin: 0 auto;
        padding: 0 16px;
      }
      .container-narrow {
        max-width: 920px;
        margin: 0 auto;
        padding: 0 16px;
      }

      /* ========== NAV ========== */
      .nav {
        position: sticky;
        top: 0;
        z-index: 50;
        background: rgba(255, 255, 255, 0.78);
        backdrop-filter: saturate(160%) blur(16px);
        -webkit-backdrop-filter: saturate(160%) blur(16px);
        border-bottom: 1px solid var(--line-soft);
      }
      .nav-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 76px;
      }
      .nav-brand {
        display: flex;
        align-items: center;
        gap: 12px;
      }
      .nav-brand-logo {
        width: 42px;
        height: 42px;
        border-radius: 12px;
        background: var(--grad-br);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        box-shadow: var(--sh-blue);
        font-family: var(--head);
        font-weight: 900;
        font-size: 18px;
      }
      .nav-brand-text {
        line-height: 1.1;
      }
      .nav-brand-name {
        font-family: var(--head);
        font-weight: 900;
        font-size: 18px;
        color: var(--ink);
        letter-spacing: -0.01em;
      }
      .nav-brand-sub {
        font-size: 11px;
        color: var(--ink-muted);
        letter-spacing: 0.1em;
        text-transform: uppercase;
        font-weight: 600;
        margin-top: 2px;
      }
      .nav-links {
        display: flex;
        align-items: center;
        gap: 4px;
      }
      .nav-link {
        padding: 10px 16px;
        border-radius: 999px;
        font-size: 14px;
        font-weight: 600;
        color: var(--ink-soft);
        transition: all 0.18s ease;
        position: relative;
      }
      .nav-link:hover {
        color: var(--blue);
        background: var(--blue-50);
      }
      .nav-link.active {
        color: #fff;
        background: var(--ink);
      }
      .nav-cta {
        margin-left: 12px;
        padding: 11px 20px;
        font-size: 14px;
        font-weight: 700;
        background: var(--grad-br);
        color: #fff;
        border-radius: 999px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        transition: all 0.2s;
        box-shadow: var(--sh-blue);
      }
      .nav-cta:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 36px -10px rgba(59, 130, 246, 0.55);
      }

      /* ========== BUTTONS ========== */
      .btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 14px 24px;
        border-radius: 999px;
        font-weight: 700;
        font-size: 15px;
        transition: all 0.2s ease;
        border: 1px solid transparent;
        font-family: var(--body);
      }
      .btn .mi {
        font-size: 18px;
      }
      .btn-primary {
        background: var(--ink);
        color: #fff;
      }
      .btn-primary:hover {
        background: var(--blue);
        transform: translateY(-2px);
        box-shadow: var(--sh-blue);
      }
      .btn-grad {
        background: var(--grad-br);
        color: #fff;
        box-shadow: var(--sh-blue);
      }
      .btn-grad:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 36px -10px rgba(59, 130, 246, 0.55);
      }
      .btn-secondary {
        background: #fff;
        color: var(--ink);
        border-color: var(--line);
      }
      .btn-secondary:hover {
        border-color: var(--ink);
        transform: translateY(-2px);
        box-shadow: var(--sh-2);
      }
      .btn-ghost {
        background: transparent;
        color: var(--ink);
      }
      .btn-ghost:hover {
        background: var(--bg-2);
      }
      .btn-whatsapp {
        background: #fff;
        color: #1aa34a;
        border-color: rgba(37, 211, 102, 0.35);
      }
      .btn-whatsapp:hover {
        background: rgba(37, 211, 102, 0.08);
        border-color: rgba(37, 211, 102, 0.6);
        transform: translateY(-2px);
        box-shadow: var(--sh-2);
      }

      /* ========== HERO ========== */
      .hero {
        padding: 88px 0 96px;
        position: relative;
        overflow: hidden;
        background:
          radial-gradient(
            ellipse 900px 500px at 10% 0%,
            rgba(59, 130, 246, 0.18) 0%,
            transparent 55%
          ),
          radial-gradient(
            ellipse 800px 500px at 95% 10%,
            rgba(16, 185, 129, 0.18) 0%,
            transparent 55%
          ),
          var(--bg);
      }
      .hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image:
          linear-gradient(rgba(11, 18, 32, 0.035) 1px, transparent 1px),
          linear-gradient(90deg, rgba(11, 18, 32, 0.035) 1px, transparent 1px);
        background-size: 48px 48px;
        mask-image: radial-gradient(
          ellipse 800px 400px at 50% 40%,
          black 40%,
          transparent 75%
        );
        pointer-events: none;
      }
      .hero-inner {
        display: grid;
        grid-template-columns: 1.15fr 1fr;
        gap: 64px;
        align-items: center;
        position: relative;
      }

      .eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 8px 16px;
        border-radius: 999px;
        background: #fff;
        border: 1px solid var(--line);
        font-size: 12px;
        color: var(--ink-soft);
        letter-spacing: 0.02em;
        font-weight: 600;
        box-shadow: var(--sh-1);
      }
      .eyebrow .dot {
        width: 8px;
        height: 8px;
        background: var(--green);
        border-radius: 50%;
        box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.2);
        animation: pulse 2s ease-in-out infinite;
      }
      @keyframes pulse {
        0%,
        100% {
          box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.2);
        }
        50% {
          box-shadow: 0 0 0 8px rgba(16, 185, 129, 0.05);
        }
      }

      .hero h1 {
        font-family: var(--head);
        font-weight: 900;
        font-size: clamp(34px, 4.6vw, 58px);
        line-height: 0.98;
        letter-spacing: -0.03em;
        margin: 24px 0 22px;
        color: var(--ink);
      }
      .grad {
        background: var(--grad-br);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: 800;
      }
      .hero h1 .grad {
        background: var(--grad-br);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
      }
      .hero h1 .hl {
        position: relative;
        white-space: nowrap;
        color: var(--blue-700);
      }
      .hero h1 .hl::after {
        content: "";
        position: absolute;
        left: -4px;
        right: -4px;
        bottom: 4px;
        height: 14px;
        background: rgba(16, 185, 129, 0.28);
        z-index: -1;
        border-radius: 4px;
      }
      .hero-sub {
        font-size: 20px;
        color: var(--ink);
        max-width: 560px;
        line-height: 1.3;
        font-weight: 700;
        margin: 30px 0 0;
        letter-spacing: -0.01em;
      }
      /* Spacing for the English hero: room below the eyebrow, then a clear gap
   before the big headline. Telugu has no .hero-sub, so its h1 keeps the
   original 24px top margin. */
      .hero-sub + h1 {
        margin-top: 26px;
      }
      .hero-lede {
        font-size: 19px;
        color: var(--ink-soft);
        max-width: 540px;
        line-height: 1.55;
        font-weight: 400;
      }
      .hero-ctas {
        display: flex;
        gap: 12px;
        margin-top: 32px;
        flex-wrap: wrap;
      }

      .hero-stats {
        margin-top: 48px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
        border-top: 1px solid var(--line);
        padding-top: 28px;
      }
      .hero-stat {
      }
      .hero-stat-num {
        font-family: var(--head);
        font-weight: 900;
        font-size: 38px;
        color: var(--ink);
        letter-spacing: -0.03em;
      }
      .hero-stat-num .unit {
        font-size: 18px;
        color: var(--blue);
        margin-left: 2px;
      }
      .hero-stat-lbl {
        font-size: 12px;
        color: var(--ink-muted);
        text-transform: uppercase;
        letter-spacing: 0.08em;
        font-weight: 600;
        margin-top: 4px;
      }

      /* Hero card */
      .hero-card {
        position: relative;
        aspect-ratio: 4/5;
        border-radius: var(--r-xl);
        overflow: hidden;
        background: #fff;
        border: 1px solid var(--line);
        box-shadow: var(--sh-3);
        transform: perspective(1000px) rotateY(-4deg) rotateX(2deg);
        transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
      }
      .hero-card:hover {
        transform: perspective(1000px) rotateY(0) rotateX(0);
      }
      .hero-card-portrait {
        position: absolute;
        inset: 0;
        background: var(--grad-br-soft);
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
      }
      .hero-card-portrait::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image:
          radial-gradient(
            circle at 20% 30%,
            rgba(59, 130, 246, 0.2) 0%,
            transparent 40%
          ),
          radial-gradient(
            circle at 80% 70%,
            rgba(16, 185, 129, 0.2) 0%,
            transparent 40%
          );
      }
      .hero-card-portrait .mi {
        font-size: 120px;
        color: rgba(11, 18, 32, 0.25);
      }

      .hero-chip {
        position: absolute;
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.8);
        padding: 10px 14px;
        border-radius: 14px;
        box-shadow: var(--sh-2);
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 13px;
        font-weight: 600;
      }
      .hero-chip .mi {
        font-size: 18px;
      }
      .hero-chip.top {
        top: 24px;
        right: 24px;
        color: var(--blue-700);
      }
      .hero-chip.mid {
        top: 45%;
        left: -16px;
        color: var(--green-700);
      }
      .hero-chip.bot {
        bottom: 24px;
        left: 24px;
        right: 24px;
        background: rgba(255, 255, 255, 0.96);
        border-radius: 18px;
        padding: 14px 18px;
        display: flex;
        align-items: center;
        gap: 14px;
      }
      .hero-chip.bot .avatar {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: var(--grad-br);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: var(--head);
        font-weight: 900;
        font-size: 15px;
      }
      .hero-chip.bot .text {
        flex: 1;
        font-size: 13px;
        line-height: 1.4;
        color: var(--ink-soft);
        font-weight: 500;
      }
      .hero-chip.bot .text strong {
        color: var(--ink);
        font-weight: 800;
        display: block;
      }

      .float {
        animation: float 6s ease-in-out infinite;
      }
      .float-2 {
        animation: float 7s ease-in-out -2s infinite;
      }
      @keyframes float {
        0%,
        100% {
          transform: translateY(0);
        }
        50% {
          transform: translateY(-8px);
        }
      }

      /* ========== SECTIONS ========== */
      .section {
        padding: 112px 0;
        position: relative;
      }
      .section-tight {
        padding: 72px 0;
      }
      .section-tint {
        background: var(--bg-2);
      }
      .section-dark {
        background: var(--ink);
        color: #fff;
      }
      .section-head {
        max-width: 760px;
        margin-bottom: 56px;
      }
      .section-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--blue);
        padding: 6px 12px;
        background: var(--blue-50);
        border-radius: 999px;
        margin-bottom: 18px;
      }
      .section-eyebrow .mi {
        font-size: 14px;
      }
      .section-eyebrow.green {
        color: var(--green-700);
        background: var(--green-50);
      }
      .section-title {
        font-family: var(--head);
        font-weight: 900;
        font-size: clamp(36px, 4.8vw, 58px);
        line-height: 1.02;
        letter-spacing: -0.03em;
        margin: 0 0 18px;
      }
      .section-title .grad {
        background: var(--grad-br);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
      }
      /* Bento heading only: smaller than other section titles so the <br/>-forced
   plain line and gradient line each fit on one line (2 lines total). */
      .section-title.bento-title {
        font-size: clamp(26px, 3.4vw, 40px);
      }
      .section-lede {
        font-size: 18px;
        color: var(--ink-soft);
        max-width: 640px;
        line-height: 1.6;
      }

      /* ========== TRUST / STATS ========== */
      .stat-row {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        background: var(--ink);
        color: #fff;
        border-radius: var(--r-lg);
        padding: 8px;
        gap: 8px;
      }
      .stat-cell {
        padding: 32px 28px;
        border-radius: var(--r);
        transition: all 0.3s;
        position: relative;
        overflow: hidden;
      }
      .stat-cell:hover {
        background: rgba(255, 255, 255, 0.05);
      }
      .stat-cell .mi {
        color: var(--green);
        font-size: 28px;
        margin-bottom: 16px;
      }
      .stat-num {
        font-family: var(--head);
        font-weight: 900;
        font-size: 52px;
        letter-spacing: -0.04em;
        line-height: 1;
      }
      .stat-num .unit {
        font-size: 22px;
        color: var(--green);
        margin-left: 4px;
      }
      .stat-lbl {
        font-size: 13px;
        color: rgba(255, 255, 255, 0.6);
        margin-top: 10px;
        font-weight: 500;
      }

      /* ========== CONDITION CARDS — interactive ========== */
      .cond-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
      }
      .cond-card {
        position: relative;
        padding: 28px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        cursor: pointer;
        transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
        overflow: hidden;
        min-height: 220px;
        display: flex;
        flex-direction: column;
      }
      .cond-card::before {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--grad-br);
        opacity: 0;
        transition: opacity 0.3s;
        z-index: 0;
      }
      .cond-card:hover {
        transform: translateY(-4px);
        border-color: transparent;
        box-shadow: var(--sh-3);
      }
      .cond-card:hover::before {
        opacity: 1;
      }
      .cond-card:hover * {
        color: #fff !important;
      }
      .cond-card:hover .cond-icon {
        background: rgba(255, 255, 255, 0.2);
        color: #fff !important;
      }
      .cond-card:hover .cond-arrow {
        transform: translateX(4px);
      }
      .cond-card > * {
        position: relative;
        z-index: 1;
      }
      .cond-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        background: var(--blue-50);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.3s;
        margin-bottom: 16px;
      }
      .cond-icon .mi {
        font-size: 24px;
      }
      .cond-name {
        font-family: var(--head);
        font-weight: 900;
        font-size: 24px;
        letter-spacing: -0.01em;
        margin-bottom: 8px;
      }
      .cond-desc {
        font-size: 14px;
        color: var(--ink-soft);
        flex: 1;
        margin-bottom: 18px;
        line-height: 1.55;
      }
      .cond-cta {
        font-size: 13px;
        font-weight: 700;
        color: var(--blue);
        display: flex;
        align-items: center;
        gap: 6px;
      }
      .cond-arrow {
        transition: transform 0.2s;
      }

      /* ========== FEATURE GRID — bento ========== */
      .bento {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        gap: 20px;
        grid-auto-rows: minmax(180px, auto);
      }
      .bento-card {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        padding: 28px;
        position: relative;
        overflow: hidden;
        transition: all 0.3s;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        gap: 12px;
      }
      .bento-card:hover {
        transform: translateY(-4px);
        box-shadow: var(--sh-3);
        border-color: transparent;
      }
      .bento-card .mi-badge {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--blue-50);
        color: var(--blue);
      }
      .bento-card .mi-badge .mi {
        font-size: 22px;
      }
      .bento-card h3 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 22px;
        letter-spacing: -0.01em;
      }
      .bento-card p {
        font-size: 14px;
        color: var(--ink-soft);
        line-height: 1.55;
        margin: 0;
      }

      .bento-card.wide {
        grid-column: span 3;
      }
      .bento-card.narrow {
        grid-column: span 2;
      }
      .bento-card.tall {
        grid-row: span 2;
      }
      .bento-card.square {
        grid-column: span 2;
      }

      .bento-card.feature-blue {
        background: var(--grad-br);
        color: #fff;
        border-color: transparent;
      }
      .bento-card.feature-blue .mi-badge {
        background: rgba(255, 255, 255, 0.2);
        color: #fff;
      }
      .bento-card.feature-blue p {
        color: rgba(255, 255, 255, 0.85);
      }

      .bento-card.feature-ink {
        background: var(--ink);
        color: #fff;
        border-color: transparent;
      }
      .bento-card.feature-ink .mi-badge {
        background: rgba(255, 255, 255, 0.1);
        color: var(--green);
      }
      .bento-card.feature-ink p {
        color: rgba(255, 255, 255, 0.75);
      }

      .bento-card .big-num {
        font-family: var(--head);
        font-weight: 900;
        font-size: 68px;
        letter-spacing: -0.04em;
        line-height: 1;
        margin-top: auto;
      }
      .bento-card .big-num .unit {
        font-size: 28px;
        color: #fff;
        letter-spacing: 2px;
      }

      /* ========== APPROACH ========== */
      .approach {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        align-items: center;
      }
      .approach-words {
        display: flex;
        flex-direction: column;
        gap: 10px;
      }
      .approach-word {
        padding: 18px 24px;
        border-radius: var(--r-lg);
        background: #fff;
        border: 1px solid var(--line);
        display: flex;
        align-items: center;
        gap: 20px;
        cursor: pointer;
        transition: all 0.3s;
      }
      .approach-word:hover {
        border-color: var(--blue);
        background: var(--blue-50);
        transform: translateX(6px);
      }
      .approach-word.active {
        background: var(--ink);
        border-color: var(--ink);
        color: #fff;
      }
      .approach-word .num {
        font-family: var(--head);
        font-weight: 900;
        font-size: 14px;
        padding: 4px 10px;
        background: var(--bg-2);
        border-radius: 6px;
        color: var(--ink-muted);
        min-width: 48px;
        text-align: center;
      }
      .approach-word.active .num {
        background: var(--green);
        color: #fff;
      }
      .approach-word .title {
        font-family: var(--head);
        font-weight: 900;
        font-size: 36px;
        letter-spacing: -0.02em;
        flex: 1;
      }
      .approach-word .mi {
        font-size: 24px;
        color: var(--blue);
      }
      .approach-word.active .mi {
        color: var(--green);
      }
      .approach-word:hover .mi {
        transform: rotate(15deg);
      }

      .approach-detail {
        background: #fff;
        border-radius: var(--r-xl);
        padding: 40px;
        border: 1px solid var(--line);
        box-shadow: var(--sh-2);
        min-height: 340px;
      }
      .approach-detail .tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 6px 12px;
        background: var(--green-50);
        color: var(--green-700);
        border-radius: 999px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        margin-bottom: 20px;
      }
      .approach-detail h4 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 36px;
        margin: 0 0 16px;
        letter-spacing: -0.02em;
      }
      .approach-detail p {
        color: var(--ink-soft);
        font-size: 16px;
        line-height: 1.65;
      }
      .approach-detail p + p {
        margin-top: 14px;
      }
      .approach-detail .quote {
        margin-top: 28px;
        padding-top: 28px;
        border-top: 1px solid var(--line);
        font-family: var(--head);
        font-weight: 400;
        font-style: italic;
        font-size: 22px;
        color: var(--blue-700);
        line-height: 1.35;
      }

      /* ========== TESTIMONIAL / CTA ========== */
      .cta-banner {
        position: relative;
        border-radius: var(--r-xl);
        overflow: hidden;
        background: var(--ink);
        color: #fff;
        padding: 64px;
        display: grid;
        grid-template-columns: 1.4fr 1fr;
        gap: 48px;
        align-items: center;
      }
      .cta-banner::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(
          ellipse 600px 400px at 100% 0%,
          rgba(16, 185, 129, 0.3) 0%,
          transparent 60%
        );
      }
      .cta-banner > * {
        position: relative;
      }
      .cta-banner h3 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 44px;
        letter-spacing: -0.02em;
        line-height: 1.05;
      }
      .cta-banner .eyebrow {
        background: rgba(255, 255, 255, 0.1);
        color: rgba(255, 255, 255, 0.9);
        border-color: rgba(255, 255, 255, 0.15);
      }
      .cta-banner p {
        color: rgba(255, 255, 255, 0.75);
        font-size: 16px;
        margin: 16px 0 0;
      }
      .cta-banner .actions {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
        justify-content: flex-end;
      }
      .cta-banner .btn-primary {
        background: #fff;
        color: var(--ink);
      }
      .cta-banner .btn-primary:hover {
        background: var(--green);
        color: #fff;
      }

      /* ========== FOOTER ========== */
      .footer {
        background: var(--ink);
        color: #c9d4df;
        padding: 56px 0 24px;
        margin-top: auto;
        position: relative;
        overflow: hidden;
      }
      .footer::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(
          ellipse 900px 600px at 90% 0%,
          rgba(59, 130, 246, 0.12) 0%,
          transparent 55%
        );
      }
      .footer > * {
        position: relative;
      }
      .footer a {
        color: #c9d4df;
        transition: color 0.15s;
      }
      .footer-top {
        display: grid;
        grid-template-columns: 1.8fr 1fr 1fr 1fr;
        gap: 48px;
        padding-bottom: 32px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      }
      .footer h5 {
        font-size: 12px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--green);
        margin: 0 0 20px;
        font-weight: 700;
        font-family: var(--body);
      }
      .footer-brand {
        display: flex;
        align-items: center;
        gap: 14px;
        margin-bottom: 20px;
      }
      .footer-brand-logo {
        width: 24px;
        height: 24px;
        border-radius: 6px;
        background: var(--grad-br);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        font-family: var(--head);
        font-weight: 900;
        font-size: 20px;
      }
      .footer-brand-name {
        font-family: var(--head);
        font-weight: 900;
        font-size: 22px;
        color: #fff;
        letter-spacing: -0.01em;
      }
      .footer-brand-sub {
        font-size: 14px;
        color: #8a9bac;
        max-width: 380px;
        line-height: 1.6;
      }
      .footer ul {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: 12px;
      }
      .footer ul a {
        font-size: 14px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
      }
      .footer ul a .mi {
        font-size: 16px;
        opacity: 0.6;
      }
      .footer ul a:hover {
        color: #fff;
      }
      .footer ul a:hover .mi {
        opacity: 1;
        color: var(--green);
      }
      .footer-bottom {
        padding-top: 20px;
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 16px;
        font-size: 12px;
        color: #6b7d90;
      }

      /* ========== PAGE HEAD ========== */
      .page-head {
        padding: 72px 0 56px;
        background:
          radial-gradient(
            ellipse 700px 300px at 15% 100%,
            rgba(16, 185, 129, 0.15) 0%,
            transparent 60%
          ),
          radial-gradient(
            ellipse 700px 300px at 85% 0%,
            rgba(59, 130, 246, 0.15) 0%,
            transparent 60%
          ),
          var(--bg);
        border-bottom: 1px solid var(--line-soft);
      }
      .page-head-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--blue);
        padding: 6px 12px;
        background: var(--blue-50);
        border-radius: 999px;
        margin-bottom: 24px;
      }
      .page-head-title {
        font-family: var(--head);
        font-weight: 900;
        font-size: clamp(48px, 6.8vw, 90px);
        line-height: 0.98;
        letter-spacing: -0.035em;
        margin: 0;
        max-width: 14ch;
      }
      .page-head-title .grad {
        background: var(--grad-br);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
      }
      .page-head-title.contact-title {
        max-width: none;
        white-space: nowrap;
        font-size: clamp(18px, 5vw, 58px);
      }
      /* About-page title only: smaller than the shared page-head size */
      .page-head-title.about-title {
        font-size: clamp(34px, 5vw, 56px);
      }
      .page-head-lede {
        font-size: 19px;
        color: var(--ink-soft);
        max-width: 640px;
        margin-top: 28px;
        line-height: 1.55;
      }

      /* ========== ABOUT ========== */
      .about-intro {
        display: grid;
        grid-template-columns: 1fr 1.3fr;
        gap: 64px;
        padding: 32px 0 80px;
        align-items: start;
      }
      .about-portrait {
        aspect-ratio: 3/4.2;
        border-radius: var(--r-xl);
        overflow: hidden;
        background: var(--grad-br-soft);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--line);
      }
      .about-portrait .mi {
        font-size: 120px;
        color: rgba(11, 18, 32, 0.2);
      }
      .about-portrait .tag {
        position: absolute;
        top: 20px;
        left: 20px;
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(10px);
        padding: 8px 14px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 8px;
      }
      .about-portrait .tag .mi {
        font-size: 14px;
        color: var(--green);
      }

      .about-lede p {
        font-family: var(--head);
        font-weight: 400;
        font-size: 26px;
        line-height: 1.35;
        letter-spacing: -0.01em;
        color: var(--ink);
      }
      .about-lede p + p {
        margin-top: 20px;
        font-family: var(--body);
        font-size: 17px;
        color: var(--ink-soft);
        line-height: 1.65;
        font-weight: 400;
      }

      .info-section {
        display: grid;
        grid-template-columns: 260px 1fr;
        gap: 48px;
        padding: 48px 0;
        border-top: 1px solid var(--line);
      }
      .info-section > *:last-child {
        min-width: 0;
      }
      .info-section-label {
        font-size: 11px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--ink-muted);
        font-weight: 700;
        padding-top: 6px;
        display: flex;
        align-items: center;
        gap: 8px;
      }
      .info-section-label .mi {
        font-size: 18px;
        color: var(--blue);
      }

      /* Timeline */
      .tl {
        display: flex;
        flex-direction: column;
        gap: 4px;
        position: relative;
      }
      .tl::before {
        content: "";
        position: absolute;
        left: 7px;
        top: 6px;
        bottom: 6px;
        width: 2px;
        background: linear-gradient(var(--blue), var(--green));
      }
      .tl-item {
        display: grid;
        grid-template-columns: 120px 1fr;
        gap: 28px;
        padding: 14px 0;
        position: relative;
        padding-left: 30px;
      }
      .tl-item::before {
        content: "";
        position: absolute;
        left: 2px;
        top: 22px;
        width: 12px;
        height: 12px;
        border-radius: 50%;
        background: #fff;
        border: 2px solid var(--blue);
      }
      .tl-year {
        font-weight: 800;
        color: var(--blue);
        font-size: 14px;
        padding-top: 4px;
        font-family: var(--head);
        letter-spacing: 0.02em;
      }
      .tl-what {
        font-family: var(--head);
        font-weight: 900;
        font-size: 22px;
        line-height: 1.2;
        letter-spacing: -0.01em;
      }
      .tl-what small {
        display: block;
        font-family: var(--body);
        font-size: 14px;
        color: var(--ink-muted);
        margin-top: 4px;
        font-weight: 500;
        letter-spacing: 0;
      }

      /* Membership badges */
      .badges {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
      }
      .badge {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 16px 18px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r);
        transition: all 0.2s;
      }
      .badge:hover {
        border-color: var(--blue);
        transform: translateY(-2px);
        box-shadow: var(--sh-2);
      }
      .badge-icon {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: var(--blue-50);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: var(--head);
        font-weight: 900;
        font-size: 13px;
      }
      .badge-text strong {
        font-weight: 700;
        display: block;
      }
      .badge-text small {
        font-size: 12px;
        color: var(--ink-muted);
      }

      /* ========== PILLARS ========== */
      .pillars {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
      }
      .pillar {
        padding: 36px 28px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        transition: all 0.3s;
        position: relative;
        overflow: hidden;
      }
      .pillar::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: var(--grad-br);
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.3s;
      }
      .pillar:hover {
        transform: translateY(-4px);
        box-shadow: var(--sh-3);
      }
      .pillar:hover::before {
        transform: scaleX(1);
      }
      .pillar-icon {
        width: 52px;
        height: 52px;
        border-radius: 14px;
        background: var(--grad-br-soft);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
      }
      .pillar-icon .mi {
        font-size: 26px;
      }
      .pillar-title {
        font-family: var(--head);
        font-weight: 900;
        font-size: 26px;
        margin: 0 0 10px;
        letter-spacing: -0.01em;
      }
      .pillar-title .grad {
        background: var(--grad-br);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
      }
      .pillar p {
        color: var(--ink-soft);
        font-size: 15px;
        margin: 0;
        line-height: 1.6;
      }

      /* ========== SERVICES ========== */
      .services-tabs {
        display: inline-flex;
        gap: 4px;
        padding: 6px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: 999px;
        margin-bottom: 48px;
        box-shadow: var(--sh-1);
      }
      .services-tab {
        padding: 10px 20px;
        border-radius: 999px;
        font-size: 14px;
        font-weight: 700;
        color: var(--ink-soft);
        transition: all 0.2s;
        display: inline-flex;
        align-items: center;
        gap: 8px;
      }
      .services-tab .mi {
        font-size: 18px;
      }
      .services-tab:hover {
        color: var(--ink);
      }
      .services-tab.active {
        background: var(--ink);
        color: #fff;
        box-shadow: var(--sh-2);
      }

      .service-group {
        margin-bottom: 48px;
      }
      .service-group-head {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        flex-wrap: wrap;
        gap: 16px;
        margin-bottom: 28px;
        padding-bottom: 16px;
        border-bottom: 2px solid var(--ink);
      }
      .service-group-title {
        font-family: var(--head);
        font-weight: 900;
        font-size: 44px;
        letter-spacing: -0.02em;
      }
      .service-group-title .grad {
        background: var(--grad-br);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
      }
      .service-group-count {
        font-size: 13px;
        color: var(--ink-muted);
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
      }

      .service-list {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
      }
      .service-item {
        background: #fff;
        padding: 24px;
        cursor: pointer;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        transition: all 0.25s;
        display: flex;
        flex-direction: column;
        gap: 14px;
        position: relative;
        overflow: hidden;
      }
      .service-item::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 3px;
        background: var(--grad-br);
        transform: scaleY(0);
        transform-origin: top;
        transition: transform 0.25s;
      }
      .service-item:hover {
        border-color: transparent;
        transform: translateY(-3px);
        box-shadow: var(--sh-2);
      }
      .service-item:hover::before {
        transform: scaleY(1);
      }
      .service-item.active {
        border-color: var(--blue);
        background: var(--blue-50);
      }
      .service-item.active::before {
        transform: scaleY(1);
      }
      .service-item-head {
        display: flex;
        align-items: start;
        justify-content: space-between;
        gap: 12px;
      }
      .service-item-ico {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        background: var(--blue-50);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }
      .service-item-ico .mi {
        font-size: 22px;
      }
      .service-item.active .service-item-ico {
        background: var(--blue);
        color: #fff;
      }
      .service-item-name {
        font-family: var(--head);
        font-weight: 900;
        font-size: 20px;
        letter-spacing: -0.01em;
        line-height: 1.2;
      }
      .service-item-tag {
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        padding: 3px 8px;
        background: var(--green-50);
        color: var(--green-700);
        border-radius: 6px;
        white-space: nowrap;
      }
      .service-item-desc {
        font-size: 14px;
        color: var(--ink-soft);
        margin: 0;
        line-height: 1.55;
        flex: 1;
      }
      .service-item-more {
        font-size: 12px;
        color: var(--blue);
        font-weight: 700;
        display: flex;
        align-items: center;
        gap: 6px;
      }
      .service-item-more .mi {
        transition: transform 0.25s;
        font-size: 16px;
      }
      .service-item.active .service-item-more .mi {
        transform: rotate(90deg);
      }

      .service-detail {
        margin-top: 24px;
        padding: 40px;
        background: #fff;
        border: 1px solid var(--blue);
        border-radius: var(--r-xl);
        display: grid;
        grid-template-columns: 1fr 1.6fr;
        gap: 48px;
        box-shadow: var(--sh-2);
        animation: fadeUp 0.3s ease-out;
      }
      @keyframes fadeUp {
        from {
          opacity: 0;
          transform: translateY(10px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
      .service-detail-visual {
        aspect-ratio: 4/5;
        border-radius: var(--r-lg);
        background: var(--grad-br-soft);
        border: 1px solid var(--line);
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        overflow: hidden;
      }
      .service-detail-visual .mi {
        font-size: 120px;
        color: rgba(59, 130, 246, 0.5);
      }
      .service-detail-visual::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: repeating-linear-gradient(
          45deg,
          transparent 0 20px,
          rgba(59, 130, 246, 0.04) 20px 21px
        );
      }
      .service-detail-tag {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 6px 12px;
        background: var(--blue-50);
        color: var(--blue-700);
        border-radius: 999px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        margin-bottom: 16px;
      }
      .service-detail h3 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 40px;
        margin: 0 0 16px;
        letter-spacing: -0.02em;
        line-height: 1.05;
      }
      .service-detail p {
        color: var(--ink-soft);
        font-size: 16px;
        line-height: 1.65;
        margin: 0;
      }
      .service-detail-bullets {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px 24px;
        margin-top: 24px;
      }
      .bullet {
        display: flex;
        gap: 10px;
        font-size: 14px;
        color: var(--ink);
        font-weight: 500;
        padding: 8px 0;
        align-items: flex-start;
      }
      .bullet .mi {
        color: var(--green);
        font-size: 18px;
        flex-shrink: 0;
        margin-top: 1px;
      }

      /* ========== BLOG ========== */
      .blog-filter {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 48px;
        align-items: center;
      }
      .blog-filter-btn {
        padding: 8px 16px;
        border-radius: 999px;
        font-size: 13px;
        font-weight: 700;
        border: 1px solid var(--line);
        color: var(--ink-soft);
        background: #fff;
        transition: all 0.2s;
      }
      .blog-filter-btn:hover {
        border-color: var(--ink);
        color: var(--ink);
      }
      .blog-filter-btn.active {
        background: var(--ink);
        color: #fff;
        border-color: var(--ink);
      }

      .blog-featured {
        display: grid;
        grid-template-columns: 1.1fr 1fr;
        gap: 48px;
        margin-bottom: 72px;
        padding: 32px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-xl);
        box-shadow: var(--sh-2);
      }
      .blog-featured-image {
        aspect-ratio: 4/3;
        border-radius: var(--r-lg);
        overflow: hidden;
        background: var(--grad-br-soft);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .blog-featured-image .mi {
        font-size: 100px;
        color: rgba(59, 130, 246, 0.45);
      }
      .blog-featured-image .tag {
        position: absolute;
        top: 16px;
        left: 16px;
        background: var(--grad-br);
        color: #fff;
        padding: 6px 12px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
      }
      .blog-featured-body {
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .blog-featured h2 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 44px;
        line-height: 1.05;
        margin: 16px 0 16px;
        letter-spacing: -0.02em;
      }
      .blog-featured p {
        font-size: 17px;
        color: var(--ink-soft);
        line-height: 1.55;
      }

      .blog-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 28px;
      }
      .blog-card {
        display: flex;
        flex-direction: column;
        gap: 16px;
        background: #fff;
        padding: 20px;
        border-radius: var(--r-lg);
        border: 1px solid var(--line);
        cursor: pointer;
        transition: all 0.3s;
      }
      .blog-card:hover {
        transform: translateY(-6px);
        box-shadow: var(--sh-3);
        border-color: transparent;
      }
      .blog-card-image {
        aspect-ratio: 4/3;
        border-radius: var(--r);
        overflow: hidden;
        background: var(--grad-br-soft);
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .blog-card-image .mi {
        font-size: 72px;
        color: rgba(59, 130, 246, 0.45);
        transition: transform 0.3s;
      }
      .blog-card:hover .blog-card-image .mi {
        transform: scale(1.15) rotate(-8deg);
      }
      .blog-card-image .cat {
        position: absolute;
        top: 12px;
        left: 12px;
        background: #fff;
        padding: 4px 10px;
        border-radius: 999px;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--blue-700);
      }
      .blog-card-meta {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 12px;
        color: var(--ink-muted);
        font-weight: 600;
      }
      .blog-card-meta .mi {
        font-size: 14px;
      }
      .blog-card-title {
        font-family: var(--head);
        font-weight: 900;
        font-size: 22px;
        line-height: 1.2;
        margin: 0;
        letter-spacing: -0.01em;
      }
      .blog-card-excerpt {
        font-size: 14px;
        color: var(--ink-soft);
        margin: 0;
        line-height: 1.55;
      }
      .blog-card-read {
        margin-top: auto;
        padding-top: 12px;
        display: flex;
        align-items: center;
        gap: 6px;
        font-weight: 700;
        font-size: 13px;
        color: var(--blue);
      }

      /* ========== VIDEOS ========== */
      .video-cats {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin: 32px 0 48px;
      }
      .video-cat {
        padding: 10px 18px;
        border-radius: 999px;
        font-size: 13px;
        font-weight: 700;
        border: 1px solid var(--line);
        background: #fff;
        color: var(--ink-soft);
        transition: all 0.2s;
        display: inline-flex;
        align-items: center;
        gap: 10px;
      }
      .video-cat:hover {
        border-color: var(--ink);
        color: var(--ink);
      }
      .video-cat.active {
        background: var(--grad-br);
        color: #fff;
        border-color: transparent;
        box-shadow: var(--sh-blue);
      }
      .video-cat .count {
        font-size: 11px;
        padding: 2px 7px;
        border-radius: 999px;
        background: var(--bg-2);
        color: var(--ink);
        font-weight: 700;
      }
      .video-cat.active .count {
        background: rgba(255, 255, 255, 0.25);
        color: #fff;
      }

      .video-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 24px;
      }
      .video-card {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        overflow: hidden;
        cursor: pointer;
        transition: all 0.3s;
      }
      .video-card:hover {
        transform: translateY(-4px);
        box-shadow: var(--sh-3);
        border-color: transparent;
      }
      .video-thumb {
        aspect-ratio: 16/9;
        position: relative;
        background: var(--grad-br-soft);
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
      }
      .video-thumb::before {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--grad-br);
        opacity: 0;
        transition: opacity 0.3s;
      }
      .video-card:hover .video-thumb::before {
        opacity: 0.15;
      }
      .video-thumb .play {
        width: 64px;
        height: 64px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.96);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        backdrop-filter: blur(8px);
        transition: all 0.3s;
        position: relative;
        z-index: 1;
        box-shadow: 0 12px 24px -8px rgba(11, 18, 32, 0.3);
      }
      .video-thumb .play .mi {
        font-size: 32px;
      }
      .video-card:hover .play {
        transform: scale(1.12);
        background: var(--grad-br);
        color: #fff;
      }
      .video-thumb .duration {
        position: absolute;
        bottom: 12px;
        right: 12px;
        background: rgba(11, 18, 32, 0.92);
        color: #fff;
        font-size: 11px;
        font-weight: 700;
        padding: 4px 10px;
        border-radius: 6px;
        display: flex;
        align-items: center;
        gap: 4px;
        z-index: 1;
      }
      .video-thumb .duration .mi {
        font-size: 12px;
      }
      .video-thumb .lang {
        position: absolute;
        top: 12px;
        left: 12px;
        background: rgba(255, 255, 255, 0.96);
        color: var(--ink);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.08em;
        padding: 4px 10px;
        border-radius: 6px;
        text-transform: uppercase;
        z-index: 1;
      }
      .video-body {
        padding: 20px;
      }
      .video-body .cat-tag {
        font-size: 11px;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--blue);
        font-weight: 700;
      }
      .video-body h4 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 18px;
        margin: 8px 0;
        line-height: 1.25;
        letter-spacing: -0.01em;
      }
      .video-body p {
        font-size: 13px;
        color: var(--ink-muted);
        margin: 0;
        line-height: 1.55;
      }

      /* ========== CONTACT ========== */
      .contact-grid {
        display: grid;
        grid-template-columns: 1fr 1.2fr;
        gap: 48px;
        padding: 72px 0 96px;
      }
      .contact-card {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        padding: 28px;
        margin-bottom: 16px;
        transition: all 0.25s;
      }
      .contact-card:hover {
        border-color: var(--blue);
        box-shadow: var(--sh-2);
      }
      .contact-card .mi-lg {
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: var(--grad-br-soft);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 14px;
      }
      .contact-card .mi-lg .mi {
        font-size: 24px;
      }
      .contact-label {
        font-size: 11px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--ink-muted);
        font-weight: 700;
      }
      .contact-value {
        font-family: var(--head);
        font-weight: 900;
        font-size: 26px;
        margin-top: 6px;
        line-height: 1.2;
        letter-spacing: -0.01em;
      }
      .contact-sub {
        font-size: 14px;
        color: var(--ink-soft);
        margin-top: 10px;
        line-height: 1.55;
      }
      .contact-action {
        margin-top: 18px;
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
      }

      .map-frame {
        aspect-ratio: 4/3;
        border-radius: var(--r-lg);
        overflow: hidden;
        border: 1px solid var(--line);
        position: relative;
      }
      .map-placeholder {
        width: 100%;
        height: 100%;
        background:
          repeating-linear-gradient(
            0deg,
            transparent 0 32px,
            rgba(59, 130, 246, 0.06) 32px 33px
          ),
          repeating-linear-gradient(
            90deg,
            transparent 0 32px,
            rgba(16, 185, 129, 0.06) 32px 33px
          ),
          var(--grad-br-soft);
        position: relative;
      }
      .map-pin {
        position: absolute;
        top: 48%;
        left: 50%;
        transform: translate(-50%, -100%);
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
      }
      .map-pin-dot {
        width: 24px;
        height: 24px;
        border-radius: 50%;
        background: var(--blue);
        border: 4px solid #fff;
        box-shadow:
          0 0 0 6px rgba(59, 130, 246, 0.18),
          0 6px 16px rgba(59, 130, 246, 0.4);
        animation: pulse-blue 2s ease-in-out infinite;
      }
      @keyframes pulse-blue {
        0%,
        100% {
          box-shadow:
            0 0 0 6px rgba(59, 130, 246, 0.18),
            0 6px 16px rgba(59, 130, 246, 0.4);
        }
        50% {
          box-shadow:
            0 0 0 16px rgba(59, 130, 246, 0),
            0 6px 16px rgba(59, 130, 246, 0.4);
        }
      }
      .map-pin-label {
        background: #fff;
        padding: 8px 14px;
        border-radius: 10px;
        font-size: 12px;
        font-weight: 700;
        box-shadow: var(--sh-2);
        display: flex;
        align-items: center;
        gap: 8px;
      }
      .map-pin-label .mi {
        font-size: 14px;
        color: var(--green);
      }

      .hours-list {
        list-style: none;
        padding: 0;
        margin: 12px 0 0;
      }
      .hours-list li {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 0;
        border-bottom: 1px solid var(--line-soft);
        font-size: 14px;
      }
      .hours-list li:last-child {
        border-bottom: none;
      }
      .hours-list .day {
        color: var(--ink);
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 10px;
      }
      .hours-list .day .mi {
        font-size: 16px;
        color: var(--blue);
      }
      .hours-list .time {
        color: var(--ink-soft);
        font-weight: 600;
        font-size: 13px;
      }

      .form-row {
        display: grid;
        gap: 16px;
        margin-bottom: 16px;
      }
      .form-row.two {
        grid-template-columns: 1fr 1fr;
      }
      .field label {
        font-size: 12px;
        color: var(--ink-muted);
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
      }
      .field input,
      .field textarea,
      .field select {
        width: 100%;
        margin-top: 6px;
        padding: 14px 16px;
        background: var(--bg);
        border: 1px solid var(--line);
        border-radius: var(--r-sm);
        font-family: var(--body);
        font-size: 15px;
        color: var(--ink);
        transition: all 0.2s;
      }
      .field input:focus,
      .field textarea:focus,
      .field select:focus {
        outline: none;
        border-color: var(--blue);
        background: #fff;
        box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.12);
      }
      .field textarea {
        min-height: 120px;
        resize: vertical;
      }

      /* ========== RESPONSIVE ========== */
      @media (max-width: 1100px) {
        .hero-inner {
          grid-template-columns: 1fr;
          gap: 48px;
        }
        .approach {
          grid-template-columns: 1fr;
        }
        .about-intro {
          grid-template-columns: 1fr;
        }
        .info-section {
          grid-template-columns: 1fr;
          gap: 20px;
        }
        .service-list {
          grid-template-columns: repeat(2, 1fr);
        }
        .service-detail {
          grid-template-columns: 1fr;
          gap: 28px;
        }
        .bento {
          grid-template-columns: repeat(2, 1fr);
        }
        .bento-card.wide,
        .bento-card.narrow,
        .bento-card.square {
          grid-column: span 1;
        }
        .bento-card.tall {
          grid-row: span 1;
        }
        .cond-grid {
          grid-template-columns: repeat(2, 1fr);
        }
        .pillars {
          grid-template-columns: 1fr;
        }
        .blog-grid {
          grid-template-columns: repeat(2, 1fr);
        }
        .video-grid {
          grid-template-columns: repeat(2, 1fr);
        }
        .contact-grid {
          grid-template-columns: 1fr;
        }
        .blog-featured {
          grid-template-columns: 1fr;
        }
        .footer-top {
          grid-template-columns: 1fr 1fr;
        }
        .stat-row {
          grid-template-columns: repeat(2, 1fr);
        }
        .cta-banner {
          grid-template-columns: 1fr;
          padding: 48px 36px;
        }
        .cta-banner .actions {
          justify-content: flex-start;
        }
      }

      /* Mobile/tablet language toggle — hidden by default, shown <=1024px (the
   tablet nav media query lives at the end of the stylesheet so it cascades
   correctly over the .nav-hamburger base rule defined later). */
      .lang-toggle-mobile {
        display: none;
      }

      @media (max-width: 640px) {
        .container,
        .container-narrow {
          padding: 0 12px;
        }
        .nav-inner {
          height: 64px;
        }
        .nav-links {
          display: none;
        }
        .nav-cta {
          padding: 10px 16px;
        }
        .section {
          padding: 72px 0;
        }
        .cond-grid {
          grid-template-columns: 1fr;
        }
        .blog-grid {
          grid-template-columns: 1fr;
        }
        .video-grid {
          grid-template-columns: 1fr;
        }
        .service-list {
          grid-template-columns: 1fr;
        }
        .bento {
          grid-template-columns: 1fr;
        }
        .footer-top {
          grid-template-columns: 1fr;
        }
        .form-row.two {
          grid-template-columns: 1fr;
        }
        .stat-row {
          grid-template-columns: 1fr;
        }
        .hero-stats {
          grid-template-columns: 1fr 1fr;
          gap: 20px;
        }
        .hero-stats .hero-stat:nth-child(3) {
          grid-column: span 2;
        }
      }

      /* ========== IMAGES / GALLERIES / LIGHTBOX ========== */

      /* Hero portrait — real image */
      .hero-card-portrait img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: saturate(1.05);
      }
      .hero-card-portrait::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
          180deg,
          transparent 55%,
          rgba(11, 18, 32, 0.18) 100%
        );
        pointer-events: none;
      }

      /* About portrait */
      .about-portrait img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 10%;
      }

      /* Condition cards — add imagery overlay option */
      .cond-card-img {
        position: absolute;
        inset: 0;
        opacity: 0;
        transition: opacity 0.3s;
        background-size: cover;
        background-position: center;
        z-index: 0;
      }
      .cond-card:hover .cond-card-img {
        opacity: 0.25;
        mix-blend-mode: luminosity;
      }

      /* Blog card with background image */
      .blog-card-image img,
      .blog-featured-image img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
      }
      .blog-card:hover .blog-card-image img {
        transform: scale(1.06);
      }

      /* Hospital tour — tabbed gallery */
      .tour-wrap {
        display: grid;
        grid-template-columns: 280px 1fr;
        gap: 32px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-xl);
        padding: 24px;
        box-shadow: var(--sh-2);
      }
      .tour-tabs {
        display: flex;
        flex-direction: column;
        gap: 4px;
      }
      .tour-tab {
        text-align: left;
        padding: 14px 18px;
        border-radius: var(--r);
        display: flex;
        align-items: center;
        gap: 14px;
        font-weight: 700;
        color: var(--ink-soft);
        transition: all 0.2s;
        border: 1px solid transparent;
      }
      .tour-tab:hover {
        background: var(--bg-2);
        color: var(--ink);
      }
      .tour-tab.active {
        background: var(--ink);
        color: #fff;
        box-shadow: var(--sh-2);
      }
      .tour-tab .ico {
        width: 36px;
        height: 36px;
        border-radius: 10px;
        background: var(--blue-50);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }
      .tour-tab.active .ico {
        background: var(--green);
        color: #fff;
      }
      .tour-tab .mi {
        font-size: 20px;
      }
      .tour-tab .txt {
        display: flex;
        flex-direction: column;
        gap: 2px;
        line-height: 1.2;
      }
      .tour-tab .txt small {
        font-size: 11px;
        color: var(--ink-muted);
        font-weight: 500;
        letter-spacing: 0.04em;
      }
      .tour-tab.active .txt small {
        color: rgba(255, 255, 255, 0.7);
      }
      .tour-view {
        position: relative;
        border-radius: var(--r-lg);
        overflow: hidden;
        background: var(--bg-2);
        aspect-ratio: 16/10;
      }
      .tour-view img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        animation: tourFade 0.45s ease-out;
      }
      @keyframes tourFade {
        from {
          opacity: 0;
          transform: scale(1.02);
        }
        to {
          opacity: 1;
          transform: scale(1);
        }
      }
      .tour-view .caption {
        position: absolute;
        left: 20px;
        bottom: 20px;
        background: rgba(11, 18, 32, 0.88);
        color: #fff;
        padding: 12px 20px;
        border-radius: 999px;
        font-size: 13px;
        font-weight: 700;
        letter-spacing: 0.04em;
        backdrop-filter: blur(12px);
        display: flex;
        align-items: center;
        gap: 10px;
        animation: tourFade 0.5s ease-out 0.05s both;
      }
      .tour-view .caption .mi {
        color: var(--green);
        font-size: 16px;
      }
      .tour-view .zoom-hint {
        position: absolute;
        top: 16px;
        right: 16px;
        background: rgba(255, 255, 255, 0.92);
        padding: 8px 12px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--ink-soft);
        display: flex;
        align-items: center;
        gap: 6px;
        cursor: pointer;
        transition: all 0.2s;
      }
      .tour-view .zoom-hint:hover {
        background: #fff;
        color: var(--ink);
        transform: scale(1.03);
      }
      .tour-view .zoom-hint .mi {
        font-size: 14px;
        color: var(--blue);
      }
      .tour-view .nav-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.96);
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: var(--sh-2);
        cursor: pointer;
        transition: all 0.2s;
        color: var(--ink);
      }
      .tour-view .nav-arrow:hover {
        background: var(--ink);
        color: #fff;
        transform: translateY(-50%) scale(1.08);
      }
      .tour-view .nav-arrow.prev {
        left: 16px;
      }
      .tour-view .nav-arrow.next {
        right: 16px;
      }

      /* Lightbox */
      .lightbox {
        position: fixed;
        inset: 0;
        z-index: 100;
        background: rgba(11, 18, 32, 0.92);
        backdrop-filter: blur(16px);
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 40px;
        animation: lbFade 0.25s ease-out;
      }
      @keyframes lbFade {
        from {
          opacity: 0;
        }
        to {
          opacity: 1;
        }
      }
      .lightbox img {
        max-width: 90vw;
        max-height: 82vh;
        border-radius: var(--r-lg);
        box-shadow: 0 40px 80px -20px rgba(0, 0, 0, 0.5);
        animation: lbScale 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
      }
      @keyframes lbScale {
        from {
          opacity: 0;
          transform: scale(0.95);
        }
        to {
          opacity: 1;
          transform: scale(1);
        }
      }
      .lightbox .lb-close {
        position: absolute;
        top: 24px;
        right: 24px;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.1);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.2s;
        border: 1px solid rgba(255, 255, 255, 0.15);
      }
      .lightbox .lb-close:hover {
        background: rgba(255, 255, 255, 0.2);
        transform: rotate(90deg);
      }
      .lightbox .lb-caption {
        position: absolute;
        bottom: 32px;
        left: 50%;
        transform: translateX(-50%);
        color: #fff;
        font-weight: 600;
        font-size: 14px;
        background: rgba(255, 255, 255, 0.1);
        padding: 10px 20px;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, 0.15);
        backdrop-filter: blur(10px);
      }
      .lightbox .lb-nav {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 56px;
        height: 56px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.1);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: all 0.2s;
        border: 1px solid rgba(255, 255, 255, 0.15);
      }
      .lightbox .lb-nav:hover {
        background: rgba(255, 255, 255, 0.25);
      }
      .lightbox .lb-nav.prev {
        left: 32px;
      }
      .lightbox .lb-nav.next {
        right: 32px;
      }
      .lightbox .lb-nav .mi {
        font-size: 28px;
      }

      /* ========== AWARDS / RECOGNITION ========== */
      .awards-scroll {
        position: relative;
        margin: 0 -16px;
        padding: 8px 16px 32px;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        transform: translateZ(0);
      }
      .info-section .awards-scroll {
        margin: 0;
        padding: 8px 0 32px;
      }
      .awards-scroll::-webkit-scrollbar {
        height: 8px;
      }
      .awards-scroll::-webkit-scrollbar-track {
        background: var(--bg-2);
        border-radius: 999px;
      }
      .awards-scroll::-webkit-scrollbar-thumb {
        background: var(--blue);
        border-radius: 999px;
      }
      .awards-track {
        display: flex;
        gap: 20px;
        padding-bottom: 8px;
      }
      .award-card {
        flex: 0 0 340px;
        scroll-snap-align: start;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-xl);
        overflow: hidden;
        transition:
          transform 0.3s,
          box-shadow 0.3s,
          border-color 0.3s;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        will-change: transform;
      }
      .award-card:hover {
        transform: translateY(-6px);
        box-shadow: var(--sh-3);
        border-color: transparent;
      }
      .award-card-image {
        aspect-ratio: 3/4;
        position: relative;
        overflow: hidden;
        background: var(--bg-2);
      }
      .award-card-image img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.5s;
        will-change: transform;
      }
      .award-card:hover .award-card-image img {
        transform: scale(1.04);
      }
      .award-card-image .tag {
        position: absolute;
        top: 14px;
        left: 14px;
        background: rgba(11, 18, 32, 0.9);
        color: #fff;
        font-size: 10px;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        padding: 5px 10px;
        border-radius: 6px;
        font-weight: 700;
        backdrop-filter: blur(10px);
      }
      .award-card-image .tag.gold {
        background: linear-gradient(135deg, #f59e0b, #ea580c);
      }
      .award-card-body {
        padding: 20px;
      }
      .award-card-body h4 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 17px;
        letter-spacing: -0.01em;
        line-height: 1.2;
      }
      .award-card-body p {
        font-size: 13px;
        color: var(--ink-soft);
        margin: 8px 0 0;
        line-height: 1.5;
      }
      .award-card-meta {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-top: 12px;
        font-size: 11px;
        font-weight: 700;
        color: var(--blue);
        letter-spacing: 0.06em;
        text-transform: uppercase;
      }
      .award-card-meta .mi {
        font-size: 14px;
      }

      /* ========== ANIMATED COUNTER ========== */
      .counter-num {
        display: inline-block;
        font-variant-numeric: tabular-nums;
      }

      /* ========== VIDEO thumb with background image ========== */
      .video-thumb.with-bg::before {
        content: "";
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        opacity: 0.88;
        transition:
          opacity 0.3s,
          transform 0.5s;
      }
      .video-thumb.with-bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
          180deg,
          rgba(11, 18, 32, 0.1),
          rgba(11, 18, 32, 0.55)
        );
      }
      .video-card:hover .video-thumb.with-bg::before {
        opacity: 1;
        transform: scale(1.06);
      }

      /* ========== FACILITIES BANNER ========== */
      .facility-strip {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
        margin-top: 32px;
      }
      .facility-pill {
        aspect-ratio: 4/3;
        position: relative;
        border-radius: var(--r-lg);
        overflow: hidden;
        cursor: pointer;
        transition: transform 0.3s;
      }
      .facility-pill:hover {
        transform: translateY(-3px);
      }
      .facility-pill img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.4s;
      }
      .facility-pill:hover img {
        transform: scale(1.06);
      }
      .facility-pill::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
          180deg,
          transparent 40%,
          rgba(11, 18, 32, 0.78) 100%
        );
      }
      .facility-pill .label {
        position: absolute;
        bottom: 14px;
        left: 14px;
        color: #fff;
        font-weight: 800;
        font-size: 14px;
        letter-spacing: 0.02em;
        display: flex;
        align-items: center;
        gap: 6px;
        z-index: 1;
      }
      .facility-pill .label .mi {
        font-size: 16px;
        color: var(--green);
      }

      /* ========== PRESS / MEDIA ========== */
      .press-card {
        display: grid;
        grid-template-columns: 280px 1fr;
        gap: 28px;
        padding: 24px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-xl);
        transition: all 0.3s;
      }
      .press-card:hover {
        transform: translateY(-4px);
        box-shadow: var(--sh-3);
        border-color: transparent;
      }
      .press-card-image {
        aspect-ratio: 3/4;
        border-radius: var(--r-lg);
        overflow: hidden;
        position: relative;
        cursor: pointer;
        background: var(--bg-2);
      }
      .press-card-image img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
      .press-card-image .badge {
        position: absolute;
        top: 12px;
        left: 12px;
        background: #fff;
        color: var(--ink);
        padding: 6px 12px;
        border-radius: 6px;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        box-shadow: var(--sh-2);
      }
      .press-card-body {
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .press-card-meta {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 11px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--blue);
        font-weight: 700;
        margin-bottom: 12px;
      }
      .press-card-meta .mi {
        font-size: 14px;
      }
      .press-card h3 {
        font-family: var(--head);
        font-weight: 900;
        font-size: 26px;
        line-height: 1.15;
        letter-spacing: -0.02em;
      }
      .press-card p {
        font-size: 15px;
        color: var(--ink-soft);
        margin: 14px 0 0;
        line-height: 1.55;
      }
      .press-card .stats {
        display: flex;
        gap: 28px;
        margin-top: 20px;
        padding-top: 18px;
        border-top: 1px solid var(--line);
      }
      .press-card .stat {
      }
      .press-card .stat .num {
        font-family: var(--head);
        font-weight: 900;
        font-size: 28px;
        color: var(--ink);
        letter-spacing: -0.02em;
        line-height: 1;
      }
      .press-card .stat .num .unit {
        font-size: 14px;
        color: var(--blue);
        margin-left: 2px;
      }
      .press-card .stat .lbl {
        font-size: 11px;
        color: var(--ink-muted);
        margin-top: 4px;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        font-weight: 700;
      }

      /* ========== BREATH VIZ ========== */
      .breath-viz {
        position: relative;
        aspect-ratio: 1;
        max-width: 360px;
        margin: 0 auto;
      }
      .breath-circle {
        position: absolute;
        inset: 0;
        border-radius: 50%;
        background: radial-gradient(
          circle,
          rgba(59, 130, 246, 0.25) 0%,
          rgba(59, 130, 246, 0) 70%
        );
        animation: breathe 5s ease-in-out infinite;
      }
      .breath-circle.c2 {
        animation-delay: 0.7s;
        background: radial-gradient(
          circle,
          rgba(16, 185, 129, 0.2) 0%,
          rgba(16, 185, 129, 0) 70%
        );
      }
      .breath-circle.c3 {
        animation-delay: 1.4s;
        background: radial-gradient(
          circle,
          rgba(59, 130, 246, 0.15) 0%,
          rgba(59, 130, 246, 0) 70%
        );
      }
      @keyframes breathe {
        0%,
        100% {
          transform: scale(0.7);
          opacity: 0.5;
        }
        50% {
          transform: scale(1);
          opacity: 1;
        }
      }
      .breath-core {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 120px;
        height: 120px;
        border-radius: 50%;
        background: var(--grad-br);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: var(--sh-blue);
        font-family: var(--head);
        font-weight: 900;
        font-size: 14px;
        letter-spacing: 0.02em;
        text-transform: uppercase;
        z-index: 2;
        animation: breatheCore 5s ease-in-out infinite;
      }
      @keyframes breatheCore {
        0%,
        100% {
          transform: translate(-50%, -50%) scale(0.92);
        }
        50% {
          transform: translate(-50%, -50%) scale(1);
        }
      }

      /* ========== PATIENT VOICES / TESTIMONIALS ========== */
      .testi-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
      }
      .testi-card {
        padding: 28px;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        display: flex;
        flex-direction: column;
        gap: 18px;
        transition: all 0.3s;
        position: relative;
        overflow: hidden;
      }
      .testi-card:hover {
        transform: translateY(-4px);
        box-shadow: var(--sh-3);
        border-color: transparent;
      }
      .testi-card .stars {
        display: flex;
        gap: 2px;
        color: #f59e0b;
      }
      .testi-card .stars .mi {
        font-size: 18px;
      }
      .testi-card blockquote {
        margin: 0;
        font-family: var(--head);
        font-weight: 400;
        font-size: 18px;
        color: var(--ink);
        line-height: 1.45;
        letter-spacing: -0.01em;
        flex: 1;
      }
      .testi-card .author {
        display: flex;
        align-items: center;
        gap: 12px;
        padding-top: 18px;
        border-top: 1px solid var(--line-soft);
      }
      .testi-card .author .av {
        width: 44px;
        height: 44px;
        border-radius: 50%;
        background: var(--grad-br);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: var(--head);
        font-weight: 900;
        font-size: 15px;
      }
      .testi-card .author .info {
        flex: 1;
        line-height: 1.2;
      }
      .testi-card .author .info strong {
        font-weight: 700;
        font-size: 14px;
        display: block;
      }
      .testi-card .author .info small {
        font-size: 12px;
        color: var(--ink-muted);
      }

      /* ========== FAQ ========== */
      .faq-list {
        display: flex;
        flex-direction: column;
        gap: 12px;
        max-width: 800px;
        margin: 0 auto;
      }
      .faq-item {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--r-lg);
        overflow: hidden;
        transition: all 0.25s;
      }
      .faq-item.open {
        border-color: var(--blue);
        box-shadow: var(--sh-2);
      }
      .faq-q {
        width: 100%;
        padding: 22px 26px;
        display: flex;
        align-items: center;
        gap: 16px;
        text-align: left;
        font-family: var(--head);
        font-weight: 900;
        font-size: 19px;
        letter-spacing: -0.01em;
        color: var(--ink);
      }
      .faq-q .chev {
        margin-left: auto;
        color: var(--blue);
        transition: transform 0.25s;
        flex-shrink: 0;
      }
      .faq-item.open .faq-q .chev {
        transform: rotate(180deg);
      }
      .faq-q .ico {
        width: 36px;
        height: 36px;
        border-radius: 10px;
        background: var(--blue-50);
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }
      .faq-q .ico .mi {
        font-size: 18px;
      }
      .faq-item.open .faq-q .ico {
        background: var(--blue);
        color: #fff;
      }
      .faq-a {
        max-height: 0;
        overflow: hidden;
        transition:
          max-height 0.35s ease,
          padding 0.35s ease;
        padding: 0 26px;
        color: var(--ink-soft);
        font-size: 15px;
        line-height: 1.65;
      }
      .faq-item.open .faq-a {
        max-height: 400px;
        padding: 0 26px 22px 78px;
      }

      /* Responsive for new elements */
      @media (max-width: 1100px) {
        .tour-wrap {
          grid-template-columns: 1fr;
        }
        .tour-tabs {
          flex-direction: row;
          overflow-x: auto;
          padding-bottom: 8px;
        }
        .tour-tab {
          flex: 0 0 auto;
        }
        .facility-strip {
          grid-template-columns: repeat(2, 1fr);
        }
        .press-card {
          grid-template-columns: 1fr;
        }
        .press-card-image {
          aspect-ratio: 16/10;
          max-width: 400px;
        }
        .testi-grid {
          grid-template-columns: 1fr;
        }
      }
      @media (max-width: 640px) {
        .facility-strip {
          grid-template-columns: 1fr 1fr;
        }
        .award-card {
          flex-basis: 248px;
        }
      }

      /* ========== MOBILE NAV ========== */
      .nav-hamburger {
        display: none;
        width: 44px;
        height: 44px;
        border-radius: 12px;
        background: var(--bg-2);
        color: var(--ink);
        align-items: center;
        justify-content: center;
        border: 1px solid var(--line);
        flex-shrink: 0;
        cursor: pointer;
      }
      .nav-mobile {
        background: rgba(255, 255, 255, 0.98);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        border-top: 1px solid var(--line-soft);
        padding: 12px 16px 20px;
        /* The drawer can be taller than the screen — let it scroll on its own
     instead of the page behind it. overscroll-behavior stops scroll chaining
     to the body when the drawer hits its top/bottom. */
        max-height: calc(100vh - 64px);
        max-height: calc(100dvh - 64px);
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
      }
      .nav-mobile-link {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 14px 16px;
        border-radius: 12px;
        font-weight: 700;
        font-size: 15px;
        color: var(--ink-soft);
        transition: all 0.15s;
      }
      .nav-mobile-link:hover {
        background: var(--bg-2);
        color: var(--ink);
      }
      .nav-mobile-link.active {
        background: var(--ink);
        color: #fff;
      }
      .nav-mobile-link .mi {
        font-size: 20px;
      }
      .nav-mobile-ctas {
        display: flex;
        gap: 10px;
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid var(--line-soft);
      }

      /* ========== HOME TEASERS GRID ========== */
      .home-teasers-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px;
      }

      /* ========== EXTENDED MOBILE ========== */
      @media (max-width: 640px) {
        .nav-links {
          display: none;
        }
        .nav-hamburger {
          display: flex;
        }

        .hero {
          padding: 48px 0 56px;
        }
        .hero-sub {
          font-size: 17px;
        }
        .hero-lede {
          font-size: 16px;
        }
        .hero-ctas {
          gap: 8px;
        }
        .hero-ctas .btn {
          padding: 12px 18px;
          font-size: 14px;
        }

        .stat-row {
          grid-template-columns: 1fr 1fr;
        }
        .stat-num {
          font-size: 36px;
        }
        .stat-num .unit {
          font-size: 18px;
        }
        .stat-cell {
          padding: 20px 14px;
        }
        .stat-lbl {
          font-size: 12px;
        }

        .section {
          padding: 56px 0;
        }
        .section-tight {
          padding: 40px 0;
        }
        .section-head {
          margin-bottom: 36px;
        }

        .page-head {
          padding: 48px 0 36px;
        }
        .page-head-lede {
          font-size: 16px;
          margin-top: 18px;
        }

        .cond-name {
          font-size: 20px;
        }
        .cond-card {
          min-height: 160px;
          padding: 20px;
        }

        .bento-card h3 {
          font-size: 18px;
        }
        .bento-card .big-num {
          font-size: 48px;
        }

        .approach-word {
          padding: 12px 16px;
          gap: 12px;
        }
        .approach-word .title {
          font-size: 26px;
        }
        .approach-detail {
          padding: 24px 20px;
          min-height: unset;
        }
        .approach-detail h4 {
          font-size: 26px;
        }
        .approach-detail .quote {
          font-size: 17px;
        }

        .cta-banner {
          padding: 36px 24px;
          gap: 28px;
        }
        .cta-banner h3 {
          font-size: 28px;
        }
        .cta-banner .actions {
          flex-direction: column;
        }
        .cta-banner .actions .btn {
          justify-content: center;
        }

        .services-tabs {
          overflow-x: auto;
          justify-content: flex-start;
        }
        .services-tab {
          flex-shrink: 0;
        }
        .service-detail {
          padding: 24px 20px;
        }
        .service-detail h3 {
          font-size: 28px;
        }
        .service-detail-bullets {
          grid-template-columns: 1fr;
        }
        .service-group-title {
          font-size: 32px;
        }

        .blog-featured {
          gap: 24px;
          padding: 20px;
        }
        .blog-featured h2 {
          font-size: 28px;
        }

        .contact-grid {
          padding: 40px 0 56px;
        }
        .map-frame {
          aspect-ratio: unset;
          height: 280px;
        }

        .footer {
          padding: 56px 0 28px;
        }
        .footer-top {
          gap: 32px;
        }

        .badges {
          grid-template-columns: 1fr;
        }
        .tl-item {
          grid-template-columns: 72px 1fr;
          gap: 12px;
        }
        .tl-what {
          font-size: 18px;
        }

        .home-teasers-grid {
          grid-template-columns: 1fr;
        }
        .testi-grid {
          grid-template-columns: 1fr;
        }
      }

      /* Tablets & large phones (<=1024px): use the mobile hamburger nav so the
   desktop links + 580px Services dropdown never overflow or get cramped.
   Placed here (after the .nav-hamburger base rule) so the cascade is correct. */
      @media (max-width: 1024px) {
        .nav-links {
          display: none;
        }
        .nav-hamburger {
          display: flex;
        }
        .lang-toggle-mobile {
          display: inline-flex;
        }

        /* Awards rail on touch devices (tablet + mobile): the nav-arrow buttons
     overlap the photo and aren't needed when you can swipe. Their inline
     display:flex requires !important to override. Also shorten the tall
     3:4 award image so a whole card fits with a clean peek of the next. */
        .awards-arrow {
          display: none !important;
        }
        .award-card-image {
          aspect-ratio: 1 / 1;
        }
      }

      @media (max-width: 420px) {
        .stat-row {
          grid-template-columns: 1fr;
        }
        .nav-mobile-ctas {
          flex-direction: column;
        }
      }

      /* Ultra-narrow phones / foldables (<=340px): final overflow safety net.
   Let the nowrap contact title wrap, ease oversized display headings. */
      @media (max-width: 340px) {
        .page-head-title.contact-title {
          white-space: normal;
        }
        .hero h1 {
          font-size: clamp(26px, 7vw, 34px);
        }
        .page-head-title {
          font-size: clamp(34px, 10vw, 48px);
        }
        .container,
        .container-narrow {
          padding: 0 10px;
        }
        .bento-card {
          padding: 20px;
        }
        .bento-card .big-num {
          font-size: 40px;
        }
        .bento-card .big-num .unit {
          font-size: 20px;
        }
      }

      /* Telugu script needs more leading and no negative tracking — the
         Latin display line-heights (0.98–1.02) make matras overlap. */
      .lang-te h1,
      .lang-te h2,
      .lang-te h3,
      .lang-te h4,
      .lang-te .hero h1,
      .lang-te .hero-sub,
      .lang-te .section-title,
      .lang-te .page-head-title,
      .lang-te .bento-card h3,
      .lang-te .cta-banner h3,
      .lang-te .approach-detail h4 {
        line-height: 1.35;
        letter-spacing: normal;
      }
      .lang-te .hero h1 {
        line-height: 1.3;
      }

      /* Services nav dropdown — was inline-styled + JS-state-toggled in the
         React build; same values, now a real stylesheet rule so plain CSS
         hover (and a JS .open class for touch) can show/hide it. */
      .services-dropdown {
        position: relative;
      }
      .services-dropdown-trigger {
        display: inline-flex;
        align-items: center;
        gap: 2px;
      }
      .services-dropdown-trigger .mi {
        transition: transform 0.2s;
      }
      .services-dropdown.open .services-dropdown-trigger .mi {
        transform: rotate(180deg);
      }
      .services-dropdown-panel {
        display: none;
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translateX(-50%);
        padding-top: 10px;
        z-index: 200;
      }
      .services-dropdown:hover .services-dropdown-panel,
      .services-dropdown.open .services-dropdown-panel {
        display: block;
      }
      .services-dropdown-panel::before {
        content: "";
        display: block;
        height: 3px;
        border-radius: 20px 20px 0 0;
        background: linear-gradient(90deg, #3b82f6, #10b981);
      }
      .services-dropdown-panel {
        background: #fff;
        border-radius: 20px;
        border: 1px solid var(--line);
        box-shadow: 0 32px 72px -12px rgba(11, 18, 32, 0.24), 0 6px 16px rgba(11, 18, 32, 0.07);
        overflow: hidden;
        width: 580px;
        animation: fadeUp 0.18s ease-out;
      }
      .services-dropdown-head {
        padding: 16px 20px 14px;
        border-bottom: 1px solid var(--line-soft);
        display: flex;
        justify-content: space-between;
        align-items: center;
      }
      .services-dropdown-head-title {
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--blue);
        margin-bottom: 3px;
      }
      .services-dropdown-head-sub {
        font-size: 13px;
        color: var(--ink-muted);
        font-weight: 500;
      }
      .services-dropdown-count {
        font-size: 11px;
        font-weight: 700;
        padding: 4px 10px;
        border-radius: 999px;
        background: var(--green-50);
        color: var(--green-700);
      }
      .services-dropdown-grid {
        padding: 12px;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 4px;
      }
      .services-dropdown-item {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        text-align: left;
        transition: all 0.15s;
        width: 100%;
      }
      .services-dropdown-item:hover {
        background: var(--blue-50);
        transform: translateY(-1px);
      }
      .services-dropdown-item-icon {
        width: 36px;
        height: 36px;
        border-radius: 10px;
        background: linear-gradient(135deg, var(--blue-50), var(--green-50));
        color: var(--blue);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
      }
      .services-dropdown-item-name {
        font-weight: 700;
        font-size: 13px;
        color: var(--ink);
        line-height: 1.2;
        display: block;
      }
      .services-dropdown-item-tag {
        font-size: 11px;
        color: var(--ink-muted);
        margin-top: 2px;
        display: block;
      }

      /* .lightbox has unconditional display:flex because the React build
         only ever mounted it while open. The static build keeps one
         instance per page and toggles the [hidden] attribute instead. */
      .lightbox[hidden] {
        display: none;
      }