/* ---------- Section headings ---------- */


 .kicker {
     display: inline-block;
     font-size: 13.5px;
     font-weight: 600;
     color: var(--teal);
     background: var(--teal-light);
     padding: 6px 14px;
     border-radius: 100px;
     margin-bottom: 18px;
 }

 .section-head {
     max-width: 640px;
     margin-bottom: 56px;
 }

 .section-head h2 {
     font-size: clamp(28px, 3.4vw, 40px);
     font-weight: 700;
     line-height: 1.18;
 }

 .section-head p {
     margin-top: 16px;
     font-size: 16.5px;
     color: var(--text-muted);
     max-width: 540px;
 }

 .section-head.center {
     margin-left: auto;
     margin-right: auto;
     text-align: center;
 }


 /* =========================================================
   FORMS — contact, enroll, find-business
========================================================= */
 .form-card {
     background: var(--white);
     border: 1px solid var(--line);
     border-radius: var(--radius-lg);
     padding: 44px;
     box-shadow: var(--shadow-soft);
 }

 .form-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 20px;
 }

 .field {
     display: flex;
     flex-direction: column;
     gap: 8px;
     margin-bottom: 0px;
 }

 .field.full {
     grid-column: 1 / -1;
 }

 .field label {
     font-size: 12px;
     font-weight: 400;
     color: var(--ink);
 }

 .field .hint {
     font-size: 12.5px;
     color: var(--text-muted);
     font-weight: 400;
 }

 .field input,
 .field select,
 .field textarea {
     border: 1.5px solid var(--line);
     border-radius: 12px;
     padding: 12px 16px;
     font-family: Helvetica, Arial, sans-serif;
     font-size: 14.5px;
     color: var(--ink);
     background: var(--paper);
     outline: none;
     transition: border-color .25s ease, box-shadow .25s ease;
     width: 100%;
 }

 .field textarea {
     resize: vertical;
     min-height: 110px;
 }

 .field input:focus,
 .field select:focus,
 .field textarea:focus {
     border-color: var(--marigold);
     box-shadow: 0 0 0 4px rgba(254, 94, 18, 0.12);
     background: var(--white);
 }

 .field-radio-group {
     display: flex;
     gap: 10px;
     flex-wrap: wrap;
 }

 .field-radio {
     border: 1.5px solid var(--line);
     border-radius: 100px;
     padding: 9px 18px;
     font-size: 13.5px;
     cursor: pointer;
     color: var(--ink-soft);
     transition: all .2s ease;
     position: relative;
 }

 .field-radio input {
     position: absolute;
     opacity: 0;
     width: 0;
     height: 0;
 }

 .field-radio.checked {
     background: var(--ink);
     color: var(--white);
     border-color: var(--ink);
 }

 .form-note {
     font-size: 13px;
     color: var(--text-muted);
     margin-top: 6px;
 }

 .form-success {
     display: none;
     background: var(--teal-light);
     border: 1px solid rgba(18, 51, 92, 0.15);
     border-radius: 14px;
     padding: 18px 20px;
     margin-top: 22px;
     font-size: 14.5px;
     color: var(--teal);
     align-items: center;
     gap: 12px;
 }

 .form-success.show {
     display: flex;
 }

 .form-success svg {
     flex-shrink: 0;
 }

 /* pincode lookup card */
 .lookup-card {
     background: var(--white);
     border: 1px solid var(--line);
     border-radius: var(--radius-lg);
     padding: 36px;
     box-shadow: var(--shadow-soft);
     display: flex;
     gap: 14px;
     flex-wrap: wrap;
     align-items: flex-end;
 }

 .lookup-card .field {
     margin-bottom: 0;
     flex: 1;
     min-width: 220px;
 }

 .lookup-results {
     margin-top: 32px;
     display: flex;
     flex-direction: column;
     gap: 16px;
 }

 .result-card {
     background: var(--white);
     border: 1px solid var(--line);
     border-radius: var(--radius-md);
     padding: 22px 24px;
     display: flex;
     justify-content: space-between;
     align-items: center;
     gap: 18px;
     flex-wrap: wrap;
 }

 .result-card h4 {
     font-size: 16.5px;
     font-weight: 600;
     margin-bottom: 4px;
 }

 .result-card p {
     font-size: 13.5px;
     color: var(--text-muted);
 }

 .result-card .result-tag {
     font-size: 12px;
     font-weight: 600;
     padding: 5px 12px;
     border-radius: 100px;
     background: var(--teal-light);
     color: var(--teal);
     white-space: nowrap;
 }

 .lookup-empty {
     text-align: center;
     padding: 50px 20px;
     color: var(--text-muted);
     font-size: 14.5px;
     border: 1.5px dashed var(--line);
     border-radius: var(--radius-md);
     display: none;
 }

 .lookup-empty.show {
     display: block;
 }

 /* contact info cards */
 .contact-grid {
     display: grid;
     grid-template-columns: 1fr 1.3fr;
     gap: 40px;
 }

 .contact-info {
     display: flex;
     flex-direction: column;
     gap: 18px;
 }

 .contact-info-card {
     background: var(--white);
     border: 1px solid var(--line);
     border-radius: var(--radius-md);
     padding: 24px;
     display: flex;
     gap: 16px;
     align-items: flex-start;
 }

 .contact-info-card h4 {
     font-size: 15.5px;
     font-weight: 600;
     margin-bottom: 4px;
 }

 .contact-info-card p,
 .contact-info-card a {
     font-size: 14px;
     color: var(--text-muted);
 }

 .contact-info-card a:hover {
     color: var(--marigold-dark);
 }

 /* legal / static content pages */
 .legal-content {
     max-width: 1260px; 
 }

 .legal-content h2 {
     font-size: 18px;
     margin-top: 40px;
     font-weight: 600;
     margin-bottom: 5px;
 }

 .legal-content h2:first-child {
     margin-top: 0;
 }

 .legal-content p {
     color: var(--text-muted);
     font-size: 12x;
     margin-bottom: 16px;
 }

 .legal-content ul {
     margin-bottom: 16px;
 }

 .legal-content ul li {
     color: var(--text-muted);
     font-size: 15.5px;
     margin-bottom: 10px;
     padding-left: 22px;
     position: relative;
 }

 .legal-content ul li::before {
     content: '';
     position: absolute;
     left: 0;
     top: 9px;
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background: var(--marigold);
 }

 .legal-updated {
     font-size: 13px;
     color: var(--text-muted);
     margin-bottom: 36px;
     display: inline-block;
     background: var(--paper-alt);
     padding: 6px 14px;
     border-radius: 100px;
 }

 .legal-toc {
     background: var(--paper-alt);
     border-radius: var(--radius-md);
     padding: 26px 28px;
     margin-bottom: 8px;
 }

 .legal-toc h5 {
     font-size: 13.5px;
     text-transform: none;
     font-weight: 600;
     margin-bottom: 14px;
     color: var(--ink);
 }

 .legal-toc ol {
     margin: 0;
     padding-left: 20px;
 }

 .legal-toc ol li {
     font-size: 14px;
     color: var(--ink-soft);
     margin-bottom: 8px;
 }

 .legal-toc a:hover {
     color: var(--marigold-dark);
 }

 .legal-layout {
     display: grid;
     grid-template-columns: 260px 1fr;
     gap: 56px;
     align-items: start;
 }

 .legal-layout .legal-toc {
     position: sticky;
     top: calc(var(--nav-h) + 24px);
 }

 /* about page */
 .about-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 60px;
     align-items: center;
 }

 .value-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 24px;
 }

 .team-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 24px;
 }

 .team-card {
     text-align: center;
 }

 .team-card img {
     width: 100%;
     aspect-ratio: 1/1;
     object-fit: cover;
     border-radius: var(--radius-md);
     margin-bottom: 14px;
 }

 .team-card h4 {
     font-size: 15.5px;
     font-weight: 600;
 }

 .team-card span {
     font-size: 13px;
     color: var(--text-muted);
 }

 /* =========================================================
    RESPONSIVE — spacing tightened for tablet/mobile
========================================================= */

 /* ---------- Tablet (\u2264 900px) ---------- */
 @media (max-width: 900px) {
     .section-head { margin-bottom: 40px; }
     .form-card { padding: 32px; }
     .lookup-card { padding: 28px; }
     .contact-grid { gap: 28px; }
     .legal-layout { grid-template-columns: 1fr; gap: 32px; }
     .legal-layout .legal-toc { position: static; }
     .about-grid { gap: 36px; }
     .value-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
     .team-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
 }

 /* ---------- Mobile (\u2264 600px) ---------- */
 @media (max-width: 600px) {
     .kicker { font-size: 12.5px; padding: 5px 12px; margin-bottom: 12px; }
     .section-head { margin-bottom: 28px; }
     .section-head p { margin-top: 10px; font-size: 13px; }

     .form-card { padding: 22px; border-radius: var(--radius-md); }
     .form-grid { grid-template-columns: 1fr; gap: 14px; }

     .lookup-card { padding: 20px; gap: 12px; }
     .lookup-card .field { min-width: 100%; }
     .lookup-results { margin-top: 20px; gap: 12px; }
     .result-card { padding: 16px 18px; gap: 10px; }
     .lookup-empty { padding: 32px 16px; }

     .contact-grid { grid-template-columns: 1fr; gap: 20px; }
     .contact-info { gap: 12px; }
     .contact-info-card { padding: 18px; gap: 12px; }

     .legal-content h2 { font-size: 19px;font-weight: bold; margin-top: 15px; margin-bottom: 10px; }
     .legal-updated { margin-bottom: 24px; }
     .legal-toc { padding: 18px 20px; margin-bottom: 5px;}
     .legal-layout { gap: 20px; }

     .about-grid { grid-template-columns: 1fr; gap: 24px; }
     .value-grid { grid-template-columns: 1fr; gap: 14px; }
     .team-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
 }