/* ═══════════════════════════════════════════════════════════
   SHARED STYLES — main.css
   Used across Landing.html, HomePage2.html, and static pages
   ═══════════════════════════════════════════════════════════ */

/* ── RESET & TOKENS ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}

:root{
  --primary:    #A2185B;
  --primary-d:  #8a1450;
  --primary-l:  #bd1f6b;
  --primary-bg: #fdf2f7;
  --rose:       #f9a8c9;
  --navy:       #0b3a6f;
  --navy-d:     #072c56;
  --bg:         #EFF8FD;
  --bg-card:    #ffffff;
  --bg-alt:     #f8fafc;
  --text:       #0f172a;
  --text-2:     #334155;
  --text-3:     #64748b;
  --text-4:     #94a3b8;
  --border:     #e2e8f0;
  --border-2:   #cbd5e1;
  --green:      #16a34a;
  --green-bg:   #dcfce7;
  --amber:      #b45309;
  --amber-bg:   #fef3c7;
  --shadow-s:   0 1px 4px rgba(15,23,42,.07);
  --shadow-m:   0 4px 20px rgba(15,23,42,.09);
  --shadow-l:   0 16px 48px rgba(15,23,42,.13);
  --r:          10px;
}

body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);font-size:16px;line-height:1.6}
h1,h2,h3{font-family:'Sora',sans-serif;line-height:1.15;letter-spacing:-.02em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* ── SKIP TO CONTENT LINK ── */
.skip-to-content{
  position:absolute;top:-40px;left:0;background:var(--primary);color:#fff;
  padding:8px 16px;text-decoration:none;z-index:1000;border-radius:0 0 8px 0;
  font-family:'DM Sans',sans-serif;font-size:14px;font-weight:600;
}
.skip-to-content:focus{top:0;outline:2px solid #fff;outline-offset:2px}

/* ── NAV ── */
nav{
  background:var(--primary);
  position:sticky;top:0;z-index:100;
  border-bottom:3px solid rgba(255,255,255,0.4);
}
.nav-wrap{
  max-width:1200px;margin:0 auto;padding:0 32px;
  height:60px;display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.nav-logo{
  font-family:'Sora',sans-serif;font-weight:800;font-size:18px;
  color:#fff;letter-spacing:-.03em;white-space:nowrap;
}
.nav-logo span{color:var(--rose)}
.nav-links{display:flex;gap:16px;list-style:none;align-items:center}
.nav-links a{
  font-family:'Sora',sans-serif;
  font-size:13px;
  font-weight:600;
  color:#fff;
  padding:6px 10px;
  border-radius:6px;
  transition:all .15s ease;
  text-decoration:none;
}
.nav-links a:hover{
  background:rgba(255,255,255,0.15);
}
.nav-cta{
  background:#fff!important;color:var(--primary)!important;
  padding:8px 18px;border-radius:7px;font-weight:700!important;
  transition:opacity .15s!important;white-space:nowrap;font-size:14px!important;
}
.nav-cta:hover{opacity:.9!important}
.nav-burger{display:none;background:none;border:none;cursor:pointer;padding:4px;gap:5px;flex-direction:column}
.nav-burger span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:transform .2s,opacity .2s}
.nav-burger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.nav-burger.open span:nth-child(2){opacity:0}
.nav-burger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ── MOBILE NAV DRAWER ── */
.nav-mobile{
  background:var(--primary-d);
  border-top:1px solid rgba(255,255,255,.08);
  max-height:0;overflow:hidden;
  transition:max-height .3s ease;
}
.nav-mobile.open{max-height:440px}
.nav-mobile-inner{padding:10px 20px 18px}
.nav-mobile-links{list-style:none;display:flex;flex-direction:column}
.nav-mobile-links li a{
  display:block;padding:13px 4px;
  color:rgba(255,255,255,.85);font-size:15px;font-weight:600;font-family:'DM Sans',sans-serif;
  border-bottom:1px solid rgba(255,255,255,.07);
  transition:color .15s;
}
.nav-mobile-links li:last-child a{border-bottom:none}
.nav-mobile-links li a:hover{color:#fff}
.nav-mobile-cta-wrap{padding:14px 0 2px}
.nav-mobile-cta{
  display:block;
  background:#fff;color:var(--primary);text-align:center;
  padding:13px 20px;border-radius:8px;
  font-family:'DM Sans',sans-serif;font-weight:700;font-size:15px;
  transition:opacity .15s;
}
.nav-mobile-cta:hover{opacity:.9}

/* ── BUTTONS ── */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-family:'DM Sans',sans-serif;font-weight:700;font-size:15px;
  padding:14px 28px;border-radius:9px;cursor:pointer;border:none;
  transition:transform .15s,box-shadow .15s,opacity .15s;text-decoration:none;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-m)}
.btn-white{background:#fff;color:var(--primary)}
.btn-white:hover{opacity:.95}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-d);opacity:1}
/* legacy alias — same as btn btn-primary */
.btn-midpage{display:inline-flex;align-items:center;gap:9px;background:var(--primary);color:#fff;font-family:'DM Sans',sans-serif;font-weight:700;font-size:15px;padding:14px 28px;border-radius:9px;white-space:nowrap;transition:transform .15s,box-shadow .15s;text-decoration:none}
.btn-midpage:hover{background:var(--primary-d);transform:translateY(-1px);box-shadow:var(--shadow-m)}

/* ── CTA / TRUST ── */
.cta-group{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.cta-meta{font-size:12px;color:rgba(255,255,255,.45);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cta-meta span{display:flex;align-items:center;gap:4px}
.cta-meta span::before{content:'·';margin-right:6px;opacity:.4}
.cta-meta span:first-child::before{display:none}
.trust-badge{
  display:flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  padding:5px 11px;border-radius:6px;
}
.trust-badge .ico{font-size:12px}
.trust-badge span{font-size:11px;color:rgba(255,255,255,.6);font-weight:500}
.trust-row{
  display:flex;gap:20px;justify-content:center;flex-wrap:wrap;
}
.trust-row span{font-size:12px;color:rgba(255,255,255,.38)}

/* ── GENERIC SECTION UTILITIES ── */
.section{padding:96px 48px}
.wrap{max-width:1100px;margin:0 auto}
.sec-eyebrow{
  font-family:'DM Sans',sans-serif;font-size:11px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--primary);
  display:block;margin-bottom:10px;
}
.sec-h{font-size:clamp(22px,2.6vw,30px);color:var(--text);margin-bottom:40px}

/* ── FOOTER ── */
footer{background:var(--navy-d);padding:36px 32px;border-top:1px solid rgba(255,255,255,.06)}
.footer-wrap{max-width:1100px;margin:0 auto;text-align:center}
.footer-top{display:flex;flex-direction:column;align-items:center;gap:12px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.07)}
.footer-logo{font-family:'Sora',sans-serif;font-weight:800;font-size:15px;color:rgba(255,255,255,.3)}
.footer-logo span{color:var(--rose)}
.footer-nav{display:flex;gap:16px;list-style:none;flex-wrap:wrap;justify-content:center}
.footer-nav a{font-size:12px;color:rgba(255,255,255,.28);transition:color .15s;text-decoration:none}
.footer-nav a:hover{color:rgba(255,255,255,.65)}
.footer-copy{font-size:11px;color:rgba(255,255,255,.15);padding-top:16px;line-height:1.6;text-align:center}
.footer-disc{font-size:11px;color:rgba(255,255,255,.45);max-width:800px;margin:0 auto 12px;line-height:1.6;text-align:center}

/* ── FOCUS ACCESSIBILITY ── */
:focus-visible{
  outline:2px solid var(--primary);
  outline-offset:3px;
  border-radius:4px;
}
a:focus-visible,button:focus-visible{
  outline:2px solid #fff;
  outline-offset:3px;
}
nav a:focus-visible,nav button:focus-visible{
  outline:2px solid #fff;
  outline-offset:3px;
}
input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--primary);
  outline-offset:2px;
}

/* ── REDUCED MOTION ── */
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none;transition:none}
}

/* ── GENERIC ANIMATIONS ── */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}
.reveal.in{opacity:1;transform:none}
.reveal:nth-child(2){transition-delay:.08s}
.reveal:nth-child(3){transition-delay:.16s}
.reveal:nth-child(4){transition-delay:.24s}

/* ── RESPONSIVE: NAV ── */
@media(max-width:1100px){
  .nav-links{display:none}
  .nav-burger{display:flex}
}

/* ── RESPONSIVE: GENERIC SECTIONS ── */
@media(max-width:640px){
  .section{padding:64px 24px}
  .nav-wrap{padding:0 20px}
  footer{padding:28px 20px}
  .btn{white-space:normal;text-align:center;justify-content:center}
  .cta-group{align-items:stretch}
}

@media(max-width:480px){
  .section{padding:48px 20px}
}
