:root {
     --fs-xxs: .625rem;
     --fs-xs: .75rem;
     --fs-sm: .9rem;
     --fs-md: .95rem;
     --fs-lg: 1rem;
     --fs-xl: 1.1rem;
     --fs-xxl: 1.25rem;
     --fs-xxxl: 2.5rem;
     --fs-hero-h1: clamp(1.4rem, calc(1.5rem + 2vw), 2rem);
     --fs-hero-h2: clamp(1.4rem, calc(1rem + 2vw), 1.8rem);
     --fs-year-experience: clamp(2rem, calc(1.4rem + 3vw), 4rem);
     --fs-component-title: clamp(1.5rem, calc(1.1rem + 2.5vw), 2.2rem);
     --fs-packages-header-h2: clamp(1.8rem, calc(1.2rem + 2.2vw), 2.2rem);
     --fs-section-heading: clamp(1.5rem, calc(1rem + 1.5vw), 2rem);
     --fs-experience-number: clamp(3rem, calc(2.4rem + 1.5vw), 4.5rem);
     --fs-award-caption: clamp(16px, calc(12px + 1.2vw), 20px);
     --fs-blog-h3: clamp(1.25rem, calc(1rem + 1.5vw), 1.5rem);
     --fs-blog-text: clamp(.875rem, calc(.7rem + 1vw), 1rem);
     --font-ubuntu: 'Ubuntu', system-ui, -apple-system, sans-serif;
     --font-inter: 'Inter', system-ui, -apple-system, sans-serif;
     --font-family-base: var(--font-ubuntu);
     --fw-semibold: 600;
 }

 html {
     font-size: clamp(14px, 1vw, 16px);
 }

 input,
 textarea,
 select {
     font-family: inherit;
 }

 @font-face {
     font-family: 'Inter';
     src: url('../fonts/Inter/Inter-VariableFont.woff2') format('woff2');
     font-weight: 100 900;
     font-style: normal;
     font-display: swap;
 }

 @font-face {
     font-family: 'Inter';
     src: url('../fonts/Inter/Inter-Italic-VariableFont.woff2') format('woff2');
     font-weight: 100 900;
     font-style: italic;
     font-display: swap;
 }

 @font-face {
     font-family: 'Ubuntu';
     src: url('../fonts/Ubuntu/Ubuntu-Light.woff2') format('woff2');
     font-weight: 300;
     font-display: swap;
 }

 @font-face {
     font-family: 'Ubuntu';
     src: url('../fonts/Ubuntu/Ubuntu-Regular.woff2') format('woff2');
     font-weight: 400;
     font-display: swap;
 }

 @font-face {
     font-family: 'Ubuntu';
     src: url('../fonts/Ubuntu/Ubuntu-Medium.woff2') format('woff2');
     font-weight: 500;
     font-display: swap;
 }

 @font-face {
     font-family: 'Ubuntu';
     src: url('../fonts/Ubuntu/Ubuntu-Bold.woff2') format('woff2');
     font-weight: 700;
     font-display: swap;
 }

 body {
     font-family: var(--font-inter);
     font-size: clamp(.875rem, calc(.7rem + .5vw), 1.125rem);
 }

 .fs-sm {
     font-size: var(--fs-sm);
 }

 .fs-md {
     font-size: var(--fs-md);
 }

 .fs-lg {
     font-size: var(--fs-lg);
 }

 .ubuntu-font {
     font-family: var(--font-ubuntu);
 }

 .inter-font {
     font-family: var(--font-inter);
 }

 .ubuntu-font,
 .metropolis-header .navbar-brand,
 .metropolis-header .nav-link,
 .metropolis-header .contact-label,
 .metropolis-header .contact-number,
 .metropolis-header .sub-nav .nav-link,
 .logo-brand span,
 .offcanvas .nav-link,
 .offcanvas .nav-link i.nav-icon,
 .hero-text h1,
 .hero-text h2,
 .custom-form-title,
 .component-title,
 .packages-header h2,
 .package-title,
 .package-price,
 .card-title.popular-card-title,
 .section-heading,
 .experience-card .experience-number,
 .award-caption p,
 .blog-card-content h3,
 .faq-accordion .accordion-button,
 .custom-form-label,
 .header .nav-link,
 .contact-number,
 .contact-label,
 .award-deatils,
 .footer-heading,
 .metbuddy-text,
 h1,
 h2,
 h3,
 .note-text,
 .sub-nav .nav-item,
 .banner-text,
 .author-name,
 .reasons-section h4,
 .expert-card .card-title,
 .leader-title,
 .csr-title,
 .blog-card-title,
 .method-title,
 .technology-title,
 .banner-footer-contact-info,
 .feature-card-title,
 .btn-title,.coe-card-title {
     font-family: var(--font-ubuntu);
 }

 h4.fw-bold.mb-1 {
     font-size: .85rem;
     font-weight: bold;
 }

 .offcanvas-body .btn,
 .offcanvas-body .fw-bold,
 .offcanvas-body .text-dark,
 .custom-form-container,
 .custom-form-container .btn-book-test,
 .packages-header p,
 .banner-btn,
 .card-description,
 .card-info,
 .card-price,
 .btn-details,
 .test-tag,
 .app-store-text .subtext,
 .app-store-text .main-text,
 .site-footer,
 .footer-bottom,
 .video-card .video-title,
 .numerical,
 .subheading,
 .modal-form-label,
 .dropdown-text-content h6,
 .leader-subtitle {
     font-family: var(--font-inter);
 }

 .btn-custom,
 .btn-custom-sm,
 .btn-custom-md,
 .btn-custom-lg,
 .btn-custom-link,
 .tag {
     font-weight: 500;
     font-family: var(--font-inter);
 }

 .btn-custom {
     font-size: var(--fs-sm);
 }

 .btn-custom-md {
     font-size: var(--fs-md);
 }

 .btn-custom-lg {
     font-size: var(--fs-lg);
 }

 .help-btn i,
 .author-name {
     font-size: clamp(0.9rem, 1vw, 1.5rem);
 }

 .scroll-arrows-header .scroll-arrow {
     font-size: clamp(1rem, 1vw, 1.5rem);
 }

 .play-icon {
     font-size: clamp(2.5rem, 1vw, 3rem);
 }

 .search-box input,
 .expert-card {
     font-size: clamp(.875rem, 1vw, 1rem);
 }

 .tag {
     font-size: clamp(.75rem, .9vw, .85rem);
 }


 .header .navbar-brand,
 .metropolis-header .navbar-brand,
 .subheading,
 .logo-brand span,
 .method-title,
 .description-text {
     font-size: var(--fs-xxl);
 }

 .header .nav-link,
 .metropolis-header .nav-link,
 .header .sub-nav .nav-link,
 .metropolis-header .sub-nav .nav-link,
 .parameter-count,
 .modal-form-label,
 .dropdown-text-content h6 {
     font-size: var(--fs-lg);
 }

 .cart-item-name {
     font-size: var(--fs-xxl);
     font-weight: var(--fw-semibold);
 }

 .contact-label,
 .info-text,
 .cart-item-span {
     font-weight: 400 !important;
 }

 .info-value,
 .expert-card .card-title,
 .feature-card-title {
     font-size: clamp(1rem, 2vw, 1.25rem);
 }

 .info-label,
 .cart-item-span {
     font-size: clamp(0.9rem, 2vw, 1rem);
 }

 .header .search-input {
     font-size: clamp(.9rem, 2vw, 1rem);
 }

 .header .contact-number,
 .contact-label,
 .metropolis-header .contact-number {
     font-size: var(--fs-md);
     font-weight: 700;
 }

 .header .search-input::placeholder {
     font-family: var(--font-ubuntu);
 }

 .hero-text h1 {
     font-size: var(--fs-hero-h1);
     font-weight: 700;
 }

 .hero-text h2 {
     font-size: var(--fs-hero-h2);
 }

 .year-experience {
     font-size: var(--fs-year-experience);
     font-weight: 700;
 }

 .sub-nav .btn,
 .dropdown-text-content p,
 .dropdown-text-content {
     font-size: .85rem;
 }

 .left-content h1 {
     font-size: 3rem;
     font-weight: 700;
 }

 .left-content p {
     font-size: 1.15rem;
 }

 .metbuddy-text {
     font-size: .6rem;
 }

 .form-control {
     font-size: 1rem;
 }

 .component-title {
     font-size: var(--fs-component-title);
 }

 .card-title,
 .accordion-header .accordion-button,
 .popular-card-title {
     font-size: clamp(1rem, 1rem + 0.4vw, 1.2rem);
     font-weight: 700;
 }
 .card-video,
 .help-content h2,
 .help-btn,
 .square-card-day {
     font-weight: var(--fw-semibold);
 }

 .square-card-day {
     font-size: clamp(1.2rem, calc(.9rem + 1.5vw), 1.5rem);
 }

 .video-title {
     font-size: clamp(.9rem, 2vw, 1.2rem);
     font-weight: bold;
 }

 .card-description,
 .card-info {
     font-size: var(--fs-md);
 }

 .card-price,
 .info-p {
     font-size: clamp(1rem, 1.5vw, 1.4rem);
     font-weight: 700;
 }

 .help-content p {
     font-size: clamp(1rem, 2vw, 1.125rem);
 }

 .square-card-text,
 .test-name,
 .test-price,
 .parameter-count {
     font-weight: var(--fw-semibold);
 }

 .packages-header h2 {
     font-size: var(--fs-packages-header-h2);
 }

 .packages-header p {
     font-size: var(--fs-xl);
 }

 .section-heading {
     font-size: var(--fs-section-heading) !important;
     font-weight: 700;
 }

 .blog-card-content h3 {
     font-size: var(--fs-blog-h3);
 }

 .blog-card-content .text-secondary,
 .note-text {
     font-size: var(--fs-blog-text);
 }

 .award-caption p {
     font-size: var(--fs-award-caption);
 }

 .award-deatils {
     font-size: var(--fs-xl);
     font-weight: 700;
 }

 .modal-close {
     font-size: clamp(1.25rem, 2vw, 1.5rem);
 }

 .popular-cities-section h3,
 .all-cities-section h3,
 .organ-name {
     font-size: clamp(1rem, 1.5vw, 1.25rem);
     font-weight: 600;
 }

 .city-name {
     font-weight: 500;
     font-size: .95rem;
 }

 .condition-title {
     font-size: clamp(1rem, 1.5vw, 1.125rem);
     font-weight: 600;
 }

 .condition-description {
     font-size: clamp(.85rem, 1vw, .9rem);
 }

 /* Grouped: strong headings and active states share bold weight */
 .alphabet-nav button.active,
 .author-name,
 .custom-form-title,
 .feature-card-title,
 .hero-heading {
     font-weight: 700;
 }

 .app-store-text .subtext {
     font-size: var(--fs-xxs);
 }

 /* Grouped: app store main text + footer/card descriptors use the same base font size */
 .app-store-text .main-text,
 .site-footer,
 .card-desc,
 .director-submenu-item {
     font-size: var(--fs-lg);
 }

 .meta-small {
     font-size: var(--fs-xxl);
     font-weight: 400;
 }

 .small-text {
     font-size: 0.9rem;
 }

 .footer-bottom,
 .wallet-expiry-info {
     font-size: var(--fs-sm);
 }

 .small-semibold {
     font-weight: 600;
     font-size: var(--fs-lg);
 }

 .group-id {
     font-size: clamp(1rem, 2vw, 1.5rem);
 }