/* ==========================================================================
   Ranjana Kumbhat — HDFC Life Insurance Advisor
   Design system: deep blue + gold accent
   ========================================================================== */

:root{
  /* Colors */
  --blue:#0A3D62;
  --blue-light:#1B5A8A;
  --blue-deep:#042135;
  --gold:#D4AF37;
  --gold-light:#E6C767;
  --gold-dark:#A6811F;
  --gold-tint:#FBF1D9;
  --bg-light:#F5F8FB;
  --white:#FFFFFF;
  --text:#1A2530;
  --text-light:#4A5A6A;
  --text-muted:#7C8B99;
  --border:#E0E6EC;

  /* Shadows (blue-tinted) */
  --shadow-sm:0 1px 2px 0 rgb(10 61 98 / 0.05);
  --shadow:0 4px 16px -4px rgb(10 61 98 / 0.10);
  --shadow-md:0 12px 28px -8px rgb(10 61 98 / 0.14);
  --shadow-lg:0 24px 48px -12px rgb(10 61 98 / 0.18);
  --shadow-xl:0 32px 64px -16px rgb(10 61 98 / 0.28);

  /* Radii */
  --radius-sm:6px;
  --radius:10px;
  --radius-lg:14px;
  --radius-xl:22px;

  /* Motion */
  --transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

  /* Fonts */
  --font-display:'Playfair Display', Georgia, 'Times New Roman', serif;
  --font:'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ==========================================================================
   Reset & base
   ========================================================================== */
*{ margin:0; padding:0; box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  font-family:var(--font);
  font-size:16px;
  line-height:1.7;
  color:var(--text);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }

a{ color:inherit; text-decoration:none; }

ul, ol{ list-style:none; }

button{ font-family:inherit; cursor:pointer; border:none; background:none; }

input, select, textarea{ font-family:inherit; font-size:1rem; color:var(--text); }

h1, h2, h3, h4{
  font-family:var(--font-display);
  font-weight:700;
  line-height:1.2;
  color:var(--blue-deep);
}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
}

[id]{ scroll-margin-top:100px; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 28px;
  border-radius:var(--radius);
  font-size:0.95rem;
  font-weight:600;
  white-space:nowrap;
  transition:var(--transition);
}

.btn-primary{
  background:var(--gold);
  color:var(--blue-deep);
  box-shadow:var(--shadow);
}
.btn-primary:hover{
  background:var(--gold-light);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}

.btn-outline{
  background:transparent;
  border:1.5px solid var(--blue);
  color:var(--blue);
}
.btn-outline:hover{
  background:var(--blue);
  color:var(--white);
  transform:translateY(-2px);
}

.btn-outline-light{
  background:transparent;
  border:1.5px solid rgb(255 255 255 / 0.35);
  color:var(--white);
}
.btn-outline-light:hover{
  background:rgb(255 255 255 / 0.1);
  border-color:var(--gold-light);
  color:var(--gold-light);
  transform:translateY(-2px);
}

.btn-light{
  background:var(--white);
  color:var(--blue);
  box-shadow:var(--shadow);
}
.btn-light:hover{
  background:var(--gold-tint);
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}

.btn-ghost{
  color:var(--blue);
  font-weight:600;
  gap:6px;
  padding:0;
}
.btn-ghost svg{ transition:var(--transition); }
.btn-ghost:hover svg{ transform:translateX(4px); }

.btn-xl{
  padding:16px 36px;
  font-size:1rem;
}

.btn-block{ width:100%; }

/* ==========================================================================
   Eyebrows, badges, pills
   ========================================================================== */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:0.8rem;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--gold-dark);
  margin-bottom:14px;
}
.eyebrow::before{
  content:'';
  width:24px;
  height:2px;
  background:var(--gold);
  display:inline-block;
}
.eyebrow.light{ color:var(--gold-light); }

.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 14px;
  border-radius:99px;
  background:var(--gold-tint);
  color:var(--gold-dark);
  font-size:0.8rem;
  font-weight:700;
}

/* ==========================================================================
   Section rhythm
   ========================================================================== */
.section{ padding:108px 0; }
.section-tint{ background:var(--bg-light); }
.section-deep{ background:linear-gradient(160deg, var(--blue-deep), var(--blue)); color:var(--white); }
.section-deep h2, .section-deep h3{ color:var(--white); }
.section-cta{ background:linear-gradient(160deg, var(--blue-deep), var(--blue)); color:var(--white); }

.section-header{
  max-width:680px;
  margin:0 auto 64px;
  text-align:center;
}
.section-header.left{
  margin:0 0 56px;
  text-align:left;
}
.section-title{
  font-size:clamp(1.875rem, 1.4rem + 2vw, 2.75rem);
  margin-bottom:16px;
}
.section-title em{
  font-style:italic;
  color:var(--gold-dark);
}
.section-deep .section-title em, .section-cta .section-title em{ color:var(--gold-light); }
.section-lead{
  font-size:1.0625rem;
  color:var(--text-light);
  line-height:1.75;
}
.section-deep .section-lead, .section-cta .section-lead{ color:rgb(255 255 255 / 0.78); }

/* ==========================================================================
   Navigation
   ========================================================================== */
.nav{
  position:sticky;
  top:0;
  z-index:100;
  background:var(--blue-deep);
  transition:var(--transition);
  border-bottom:1px solid rgb(255 255 255 / 0.06);
}
.nav.scrolled{
  box-shadow:var(--shadow-lg);
}
.nav-container{
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:84px;
}
.nav-logo{
  display:flex;
  flex-direction:column;
  line-height:1.2;
}
.nav-logo-name{
  font-family:var(--font-display);
  font-size:1.35rem;
  font-weight:700;
  color:var(--white);
}
.nav-logo-tag{
  font-size:0.7rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--gold-light);
  font-weight:600;
}
.nav-menu{
  display:flex;
  align-items:center;
  gap:28px;
}
.nav-link{
  font-size:0.9rem;
  font-weight:500;
  color:rgb(255 255 255 / 0.78);
  transition:var(--transition);
  position:relative;
  white-space:nowrap;
}
.nav-link:hover, .nav-link.active{ color:var(--gold-light); }
.nav-cta{ white-space:nowrap; }
.nav-actions{
  display:flex;
  align-items:center;
  gap:20px;
}

.nav-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:32px;
  height:32px;
}
.nav-toggle span{
  display:block;
  width:24px;
  height:2px;
  background:var(--white);
  border-radius:2px;
  transition:var(--transition);
}
.nav-toggle.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.active span:nth-child(2){ opacity:0; }
.nav-toggle.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

.overlay{
  position:fixed;
  inset:0;
  background:rgb(4 33 53 / 0.6);
  z-index:90;
  opacity:0;
  visibility:hidden;
  transition:var(--transition);
}
.overlay.active{ opacity:1; visibility:visible; }

/* ==========================================================================
   Hero + lead form
   ========================================================================== */
.hero{
  position:relative;
  overflow:hidden;
  background:linear-gradient(160deg, var(--blue-deep) 0%, var(--blue) 65%, var(--blue-light) 130%);
  padding:72px 0 96px;
}
.hero-grid-bg{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgb(255 255 255 / 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgb(255 255 255 / 0.05) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(180deg, rgb(0 0 0 / 0.5), transparent 70%);
}
.hero-glow{
  position:absolute;
  top:-220px;
  right:-160px;
  width:560px;
  height:560px;
  background:radial-gradient(circle, rgb(212 175 55 / 0.28), transparent 70%);
  border-radius:50%;
  pointer-events:none;
}
.hero .container{ position:relative; z-index:1; }
.hero-grid{
  display:grid;
  grid-template-columns:1.05fr 0.95fr;
  gap:64px;
  align-items:start;
}
.hero-content{ padding-top:32px; }
.hero-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 18px;
  border-radius:99px;
  background:rgb(255 255 255 / 0.08);
  border:1px solid rgb(255 255 255 / 0.16);
  color:var(--gold-light);
  font-size:0.8rem;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  margin-bottom:28px;
}
.hero-pill svg{ width:14px; height:14px; }
.hero-title{
  font-size:clamp(2.25rem, 1.4rem + 3.4vw, 3.5rem);
  color:var(--white);
  margin-bottom:24px;
}
.hero-title em{
  font-style:italic;
  color:var(--gold-light);
}
.hero-lead{
  font-size:1.125rem;
  color:rgb(255 255 255 / 0.8);
  max-width:520px;
  margin-bottom:36px;
  line-height:1.75;
}
.hero-ctas{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:40px;
}
.hero-meta{
  display:flex;
  align-items:center;
  gap:16px;
}
.hero-meta-avatars{
  display:flex;
}
.hero-meta-avatars span{
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--gold-tint);
  color:var(--gold-dark);
  border:2px solid var(--blue-deep);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0.75rem;
  font-weight:700;
  margin-left:-10px;
}
.hero-meta-avatars span:first-child{ margin-left:0; }
.hero-meta-text{
  font-size:0.875rem;
  color:rgb(255 255 255 / 0.7);
}
.hero-meta-text strong{ color:var(--white); }

/* Hero lead-capture form card */
.hero-form-card{
  background:var(--white);
  border-radius:var(--radius-xl);
  padding:36px;
  box-shadow:var(--shadow-xl);
}
.hero-form-title{
  font-size:1.375rem;
  margin-bottom:6px;
}
.hero-form-sub{
  font-size:0.9rem;
  color:var(--text-light);
  margin-bottom:24px;
}

/* ==========================================================================
   Forms (shared by hero card + contact page)
   ========================================================================== */
.form-group{
  margin-bottom:18px;
}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.form-label{
  display:block;
  font-size:0.825rem;
  font-weight:600;
  color:var(--text);
  margin-bottom:8px;
}
.form-group input,
.form-group select,
.form-group textarea{
  width:100%;
  padding:13px 16px;
  border:1.5px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--white);
  transition:var(--transition);
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  outline:none;
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgb(10 61 98 / 0.08);
}
.form-group select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237C8B99' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:18px;
  padding-right:42px;
}
.form-group textarea{
  resize:vertical;
  min-height:120px;
}
.form-note{
  font-size:0.8rem;
  color:var(--text-muted);
  margin-top:14px;
  line-height:1.6;
}
.form-note a{ color:var(--blue); font-weight:600; text-decoration:underline; }

/* Honeypot field — hidden from real users */
.hp-field{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

.form-notice{
  padding:14px 18px;
  border-radius:var(--radius-sm);
  font-size:0.9rem;
  font-weight:600;
  margin-bottom:24px;
}
.form-notice.success{
  background:#E6F4EA;
  color:#1E7A3D;
  border:1px solid #BCE3C9;
}
.form-notice.error{
  background:#FBEAEA;
  color:#B3261E;
  border:1px solid #F2C6C4;
}

/* ==========================================================================
   Trust strip
   ========================================================================== */
.trust-strip{
  background:var(--white);
  border-bottom:1px solid var(--border);
  padding:40px 0;
}
.trust-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:32px;
  text-align:center;
}
.trust-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
}
.trust-num{
  font-family:var(--font-display);
  font-size:2rem;
  font-weight:700;
  color:var(--blue);
}
.trust-label{
  font-size:0.875rem;
  color:var(--text-light);
  font-weight:500;
}

/* ==========================================================================
   Plans grid
   ========================================================================== */
.plans-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
}
.plan-card{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  transition:var(--transition);
  display:flex;
  flex-direction:column;
}
.plan-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
  border-color:transparent;
}
.plan-icon{
  width:52px;
  height:52px;
  border-radius:var(--radius);
  background:var(--gold-tint);
  color:var(--gold-dark);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:20px;
}
.plan-icon svg{ width:26px; height:26px; }
.plan-title{
  font-size:1.15rem;
  margin-bottom:10px;
}
.plan-desc{
  font-size:0.9rem;
  color:var(--text-light);
  line-height:1.7;
  flex-grow:1;
  margin-bottom:18px;
}
.plan-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:0.875rem;
  font-weight:700;
  color:var(--blue);
}
.plan-link svg{ width:16px; height:16px; transition:var(--transition); }
.plan-card:hover .plan-link svg{ transform:translateX(4px); }

/* ==========================================================================
   Why choose grid
   ========================================================================== */
.why-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
}
.why-card{
  background:rgb(255 255 255 / 0.04);
  border:1px solid rgb(255 255 255 / 0.1);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  transition:var(--transition);
}
.why-card:hover{
  background:rgb(255 255 255 / 0.07);
  transform:translateY(-6px);
}
.why-icon{
  width:52px;
  height:52px;
  border-radius:var(--radius);
  background:rgb(212 175 55 / 0.15);
  color:var(--gold-light);
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:20px;
}
.why-icon svg{ width:26px; height:26px; }
.why-card h3{
  font-size:1.15rem;
  color:var(--white);
  margin-bottom:10px;
}
.why-card p{
  font-size:0.9rem;
  color:rgb(255 255 255 / 0.7);
  line-height:1.7;
}

/* ==========================================================================
   Financial tools teaser
   ========================================================================== */
.tools-teaser-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:24px;
}
.tool-teaser-card{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px;
  text-align:center;
  transition:var(--transition);
}
.tool-teaser-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
}
.tool-teaser-icon{
  width:56px;
  height:56px;
  border-radius:50%;
  background:var(--blue);
  color:var(--gold-light);
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 18px;
}
.tool-teaser-icon svg{ width:26px; height:26px; }
.tool-teaser-card h3{
  font-size:1.05rem;
  margin-bottom:8px;
}
.tool-teaser-card p{
  font-size:0.875rem;
  color:var(--text-light);
  margin-bottom:16px;
  line-height:1.6;
}

/* ==========================================================================
   About / story
   ========================================================================== */
.story-grid{
  display:grid;
  grid-template-columns:0.85fr 1.15fr;
  gap:64px;
  align-items:center;
}
.story-photo{
  width:100%;
  aspect-ratio:4/5;
  border-radius:var(--radius-xl);
  background:linear-gradient(160deg, var(--blue), var(--blue-light));
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:var(--shadow-lg);
  position:relative;
}
.story-photo span{
  font-family:var(--font-display);
  font-size:5rem;
  font-weight:700;
  color:rgb(255 255 255 / 0.85);
}
.story-photo-note{
  position:absolute;
  bottom:18px;
  left:18px;
  right:18px;
  background:rgb(4 33 53 / 0.55);
  color:var(--gold-light);
  font-size:0.75rem;
  font-weight:600;
  text-align:center;
  padding:8px 12px;
  border-radius:var(--radius-sm);
  backdrop-filter:blur(4px);
}
.story-content p{
  color:var(--text-light);
  margin-bottom:18px;
  line-height:1.8;
}
.story-stats{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
  margin-top:32px;
  padding-top:32px;
  border-top:1px solid var(--border);
}
.story-stat strong{
  display:block;
  font-family:var(--font-display);
  font-size:1.75rem;
  color:var(--blue);
}
.story-stat span{
  font-size:0.825rem;
  color:var(--text-muted);
}

/* ==========================================================================
   Awards & Recognition
   ========================================================================== */
.awards-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:48px;
  align-items:center;
}
.awards-photo img{
  width:100%;
  display:block;
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-lg);
}
.awards-list{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.awards-list li{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:18px 20px;
  background:var(--bg-light);
  border:1px solid var(--border);
  border-radius:var(--radius);
}
.award-icon{
  flex-shrink:0;
  width:42px;
  height:42px;
  border-radius:50%;
  background:var(--gold-tint);
  color:var(--gold-dark);
  display:flex;
  align-items:center;
  justify-content:center;
}
.award-icon svg{ width:20px; height:20px; }
.awards-list strong{
  display:block;
  font-family:var(--font-display);
  font-size:1.05rem;
  color:var(--blue);
}
.awards-list span{
  font-size:0.875rem;
  color:var(--text-light);
}

/* ==========================================================================
   Testimonials
   ========================================================================== */
.testimonial-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:24px;
}
.testimonial-card{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  display:flex;
  flex-direction:column;
}
.testimonial-stars{
  color:var(--gold);
  font-size:1rem;
  letter-spacing:2px;
  margin-bottom:16px;
}
.testimonial-quote{
  font-size:0.95rem;
  color:var(--text-light);
  line-height:1.8;
  flex-grow:1;
  margin-bottom:20px;
}
.testimonial-author{
  display:flex;
  align-items:center;
  gap:14px;
}
.testimonial-avatar{
  width:44px;
  height:44px;
  border-radius:50%;
  background:var(--gold-tint);
  color:var(--gold-dark);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-family:var(--font-display);
}
.testimonial-name{ font-weight:700; font-size:0.9rem; }
.testimonial-role{ font-size:0.8rem; color:var(--text-muted); }

/* ==========================================================================
   FAQ accordion
   ========================================================================== */
.faq-list{
  max-width:760px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.faq-item{
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--white);
  overflow:hidden;
  transition:var(--transition);
}
.faq-item.active{
  border-color:var(--gold);
  box-shadow:var(--shadow);
}
.faq-question{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 24px;
  text-align:left;
  font-size:1rem;
  font-weight:600;
  color:var(--blue-deep);
}
.faq-icon{
  flex-shrink:0;
  width:24px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--gold-dark);
  transition:var(--transition);
}
.faq-item.active .faq-icon{ transform:rotate(45deg); }
.faq-answer{
  max-height:0;
  overflow:hidden;
  transition:max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.faq-answer-inner{
  padding:0 24px 22px;
  font-size:0.925rem;
  color:var(--text-light);
  line-height:1.75;
}

/* ==========================================================================
   Final CTA
   ========================================================================== */
.final-cta{
  text-align:center;
  max-width:680px;
  margin:0 auto;
}
.final-cta h2{
  color:var(--white);
  font-size:clamp(1.875rem, 1.4rem + 2vw, 2.75rem);
  margin-bottom:18px;
}
.final-cta h2 em{ color:var(--gold-light); font-style:italic; }
.final-cta p{
  color:rgb(255 255 255 / 0.78);
  font-size:1.0625rem;
  margin-bottom:36px;
}
.final-cta-actions{
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
}
.final-cta-actions .btn svg{ width:18px; height:18px; }

/* ==========================================================================
   Footer
   ========================================================================== */
.footer{
  background:var(--blue-deep);
  color:rgb(255 255 255 / 0.7);
  padding:80px 0 0;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 0.9fr 0.9fr 1.2fr;
  gap:48px;
  padding-bottom:56px;
}
.footer-brand-name{
  font-family:var(--font-display);
  font-size:1.5rem;
  font-weight:700;
  color:var(--white);
  margin-bottom:6px;
}
.footer-brand-tag{
  font-size:0.8rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--gold-light);
  font-weight:600;
  margin-bottom:18px;
}
.footer-brand p{
  font-size:0.9rem;
  line-height:1.75;
  max-width:340px;
  margin-bottom:20px;
}
.socials{
  display:flex;
  gap:12px;
}
.socials a{
  width:38px;
  height:38px;
  border-radius:50%;
  background:rgb(255 255 255 / 0.06);
  display:flex;
  align-items:center;
  justify-content:center;
  transition:var(--transition);
}
.socials a:hover{ background:var(--gold); color:var(--blue-deep); }
.socials svg{ width:18px; height:18px; }

.footer-col h4{
  color:var(--white);
  font-size:0.95rem;
  font-family:var(--font);
  font-weight:700;
  margin-bottom:18px;
}
.footer-col ul{ display:flex; flex-direction:column; gap:12px; }
.footer-col a{
  font-size:0.9rem;
  transition:var(--transition);
}
.footer-col a:hover{ color:var(--gold-light); }

.footer-contact li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:0.9rem;
  margin-bottom:14px;
  line-height:1.6;
}
.footer-contact svg{
  width:17px;
  height:17px;
  flex-shrink:0;
  margin-top:2px;
  color:var(--gold-light);
}

.footer-disclosure{
  border-top:1px solid rgb(255 255 255 / 0.08);
  padding:28px 0;
  font-size:0.8rem;
  line-height:1.8;
  color:rgb(255 255 255 / 0.5);
}
.footer-disclosure strong{ color:rgb(255 255 255 / 0.7); }

.footer-bottom{
  border-top:1px solid rgb(255 255 255 / 0.08);
  padding:24px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  font-size:0.85rem;
}
.footer-links{ display:flex; gap:24px; }
.footer-links a{ transition:var(--transition); }
.footer-links a:hover{ color:var(--gold-light); }

/* ==========================================================================
   Page hero (inner pages)
   ========================================================================== */
.page-hero{
  background:linear-gradient(160deg, var(--blue-deep) 0%, var(--blue) 100%);
  padding:72px 0;
  position:relative;
  overflow:hidden;
}
.page-hero-inner{
  position:relative;
  z-index:1;
  max-width:680px;
}
.page-hero-inner h1{
  color:var(--white);
  font-size:clamp(2rem, 1.5rem + 2.2vw, 3rem);
  margin-bottom:14px;
}
.page-hero-inner h1 em{ color:var(--gold-light); font-style:italic; }
.page-hero-inner p{
  color:rgb(255 255 255 / 0.8);
  font-size:1.0625rem;
}

/* ==========================================================================
   Legal content (privacy / terms)
   ========================================================================== */
.legal-content{
  max-width:760px;
  margin:0 auto;
}
.legal-content h2{
  font-size:1.5rem;
  margin:40px 0 16px;
}
.legal-content h2:first-child{ margin-top:0; }
.legal-content p{
  color:var(--text-light);
  margin-bottom:16px;
  line-height:1.8;
}
.legal-content ul{
  margin-bottom:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.legal-content li{
  position:relative;
  padding-left:22px;
  color:var(--text-light);
  line-height:1.8;
}
.legal-content li::before{
  content:'';
  position:absolute;
  left:0;
  top:11px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gold);
}
.legal-content .updated{
  font-size:0.875rem;
  color:var(--text-muted);
  margin-bottom:32px;
}
.legal-content .disclosure-box{
  background:var(--bg-light);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:24px;
  margin:24px 0;
  font-size:0.95rem;
  color:var(--text);
  line-height:1.8;
}

/* ==========================================================================
   Contact page
   ========================================================================== */
.contact-grid{
  display:grid;
  grid-template-columns:0.85fr 1.15fr;
  gap:48px;
}
.contact-info h2{
  font-size:1.75rem;
  margin-bottom:16px;
}
.contact-info > p{
  color:var(--text-light);
  margin-bottom:32px;
  line-height:1.8;
}
.contact-card{
  background:var(--bg-light);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:24px;
  margin-bottom:16px;
}
.contact-card h3{
  font-size:1rem;
  margin-bottom:12px;
}
.contact-card a, .contact-card p{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:0.95rem;
  color:var(--text-light);
  margin-bottom:8px;
  transition:var(--transition);
}
.contact-card a:hover{ color:var(--blue); }
.contact-card svg{
  width:18px;
  height:18px;
  color:var(--gold-dark);
  flex-shrink:0;
}
.contact-form-wrap{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:36px;
  box-shadow:var(--shadow);
}
.contact-form-wrap h2{
  font-size:1.5rem;
  margin-bottom:6px;
}
.contact-form-wrap > p{
  color:var(--text-light);
  font-size:0.925rem;
  margin-bottom:24px;
}

/* ==========================================================================
   Financial tools page (calculators)
   ========================================================================== */
.tools-disclaimer{
  background:var(--gold-tint);
  border:1px solid #F0E0B8;
  border-radius:var(--radius);
  padding:18px 22px;
  font-size:0.9rem;
  color:var(--gold-dark);
  margin-bottom:48px;
  line-height:1.7;
}
.tools-disclaimer strong{ color:var(--blue-deep); }

.calc-tabs{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:40px;
}
.calc-tab{
  padding:12px 22px;
  border-radius:99px;
  background:var(--bg-light);
  border:1.5px solid var(--border);
  font-size:0.9rem;
  font-weight:600;
  color:var(--text-light);
  transition:var(--transition);
}
.calc-tab:hover{
  border-color:var(--blue);
  color:var(--blue);
}
.calc-tab.active{
  background:var(--blue);
  border-color:var(--blue);
  color:var(--white);
}

.calc-panel{ display:none; }
.calc-panel.active{ display:block; animation:fadeIn 0.4s ease; }

@keyframes fadeIn{
  from{ opacity:0; transform:translateY(8px); }
  to{ opacity:1; transform:translateY(0); }
}

.calc-header{
  margin-bottom:32px;
}
.calc-header h2{
  font-size:1.625rem;
  margin-bottom:8px;
}
.calc-header p{
  color:var(--text-light);
  font-size:0.95rem;
}

.calc-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:start;
}
.calc-inputs{
  background:var(--bg-light);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px;
}
.calc-results{
  background:linear-gradient(160deg, var(--blue-deep), var(--blue));
  border-radius:var(--radius-lg);
  padding:32px;
  color:var(--white);
}
.calc-results h3{
  color:var(--gold-light);
  font-size:0.85rem;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  margin-bottom:24px;
}
.calc-result-card{
  margin-bottom:24px;
}
.calc-result-label{
  font-size:0.85rem;
  color:rgb(255 255 255 / 0.7);
  margin-bottom:6px;
}
.calc-result-value{
  font-family:var(--font-display);
  font-size:2rem;
  font-weight:700;
  color:var(--white);
}
.calc-result-value small{
  font-size:1rem;
  font-weight:500;
  color:rgb(255 255 255 / 0.7);
}
.calc-divider{
  border-top:1px solid rgb(255 255 255 / 0.12);
  margin:24px 0;
}
.calc-note{
  font-size:0.825rem;
  color:rgb(255 255 255 / 0.6);
  line-height:1.7;
}

/* slider input row */
.calc-range-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:4px;
}
.calc-range-value{
  font-weight:700;
  color:var(--blue);
  font-size:0.9rem;
}
.form-group input[type="range"]{
  width:100%;
  padding:0;
  accent-color:var(--blue);
  border:none;
  background:transparent;
  height:6px;
}

/* Bar chart visualization for ULIP projector */
.calc-bars{
  display:flex;
  align-items:flex-end;
  gap:10px;
  height:160px;
  margin-top:8px;
}
.calc-bar{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  height:100%;
  gap:8px;
}
.calc-bar-fill{
  width:100%;
  border-radius:6px 6px 0 0;
  background:linear-gradient(180deg, var(--gold-light), var(--gold));
  transition:height 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  min-height:4px;
}
.calc-bar-label{
  font-size:0.7rem;
  color:rgb(255 255 255 / 0.6);
}

.calc-cta{
  margin-top:48px;
  padding:32px;
  background:var(--bg-light);
  border-radius:var(--radius-lg);
  text-align:center;
}
.calc-cta h3{ margin-bottom:8px; font-size:1.25rem; }
.calc-cta p{ color:var(--text-light); margin-bottom:20px; }

/* ==========================================================================
   Reveal animation
   ========================================================================== */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.reveal.in{ opacity:1; transform:translateY(0); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1100px){
  .nav-menu{ gap:16px; }
  .nav-link{ font-size:0.85rem; }
}

@media (max-width:1024px){
  .hero-grid{ grid-template-columns:1fr; gap:48px; }
  .hero-content{ padding-top:0; text-align:center; }
  .hero-lead{ margin-left:auto; margin-right:auto; }
  .hero-pill, .hero-ctas{ justify-content:center; }
  .hero-ctas{ display:flex; }
  .hero-meta{ justify-content:center; }

  .plans-grid, .why-grid, .tools-teaser-grid{ grid-template-columns:repeat(2, 1fr); }
  .trust-grid{ grid-template-columns:repeat(3, 1fr); }
  .story-grid, .contact-grid, .awards-grid{ grid-template-columns:1fr; gap:40px; }
  .story-photo{ max-width:360px; margin:0 auto; }
  .testimonial-grid{ grid-template-columns:repeat(2, 1fr); }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:40px; }
  .calc-grid{ grid-template-columns:1fr; }
}

@media (max-width:768px){
  .section{ padding:72px 0; }
  .nav-menu{
    position:fixed;
    top:84px;
    right:0;
    width:280px;
    height:calc(100vh - 84px);
    background:var(--blue-deep);
    flex-direction:column;
    align-items:flex-start;
    padding:32px 28px;
    gap:24px;
    transform:translateX(100%);
    transition:var(--transition);
    z-index:95;
    overflow-y:auto;
  }
  .nav-menu.active{ transform:translateX(0); box-shadow:var(--shadow-xl); }
  .nav-cta{ align-self:stretch; justify-content:center; margin-top:8px; }
  .nav-toggle{ display:flex; }

  .plans-grid, .why-grid, .tools-teaser-grid, .testimonial-grid{ grid-template-columns:1fr; }
  .trust-grid{ grid-template-columns:1fr; gap:24px; }
  .form-row{ grid-template-columns:1fr; gap:0; }
  .footer-grid{ grid-template-columns:1fr; gap:36px; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .final-cta-actions{ flex-direction:column; align-items:stretch; }
  .hero-ctas{ flex-direction:column; align-items:stretch; }
  .hero-ctas .btn{ justify-content:center; }
}

@media (max-width:480px){
  .container{ padding:0 16px; }
  .section{ padding:56px 0; }
  .hero{ padding:48px 0 64px; }
  .hero-form-card{ padding:24px; }
  .hero-title{ font-size:2rem; }
  .section-title{ font-size:1.75rem; }
  .story-stats{ grid-template-columns:1fr; gap:16px; text-align:left; }
}

@media (prefers-reduced-motion: reduce){
  *{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
}