/* CVforGulf – site.css (global + marketing + account)
   Per-CV-template styles stay in cv-templates/*.php — do not put them here. */

/* --- from site.css --- */
/* CVforGulf – shared site styles */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
  html{-webkit-text-size-adjust:100%}
  @media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
  img,svg{display:block;max-width:100%}
  a{color:inherit;text-decoration:none}
  button{font:inherit;cursor:pointer}
  ul{list-style:none}

  :root{
    --ink:#0B2540;--blue:#1D5FBF;--blue-deep:#123F82;--blue-soft:#E7F0FB;
    --green:#159862;--green-soft:#E2F6EC;--gold:#C9963E;--gold-soft:#F7E7C4;
    --purple:#5B3FD1;--purple-soft:#EDE8FB;--bg:#F7F8FA;--bg-panel:#FFFFFF;
    --text:#16202B;--text-muted:#57636E;--border:#E4E7EC;--radius:10px;
    --maxw:1200px;--shadow:0 6px 20px rgba(11,37,64,0.08);--shadow-hover:0 12px 28px rgba(11,37,64,0.13);
  }

  body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55;font-size:16px;-webkit-font-smoothing:antialiased}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}
  h1,h2,h3{line-height:1.15;font-weight:700;letter-spacing:-0.01em;color:var(--ink)}
  h1{font-size:clamp(28px,6vw,42px)}
  h2{font-size:clamp(22px,4.2vw,30px);text-align:left}
  h3{font-size:16px}
  p{color:var(--text-muted)}


/* =========================================================
   Header / navigation (always above page content)
   ========================================================= */

/* Skip link – hidden until keyboard focus (accessibility) */
.skip-link{
  position:absolute;
  left:12px;
  top:0;
  z-index:10050;
  padding:10px 14px;
  background:#fff;
  color:var(--ink);
  font-size:14px;
  font-weight:700;
  border:2px solid var(--blue);
  border-radius:8px;
  text-decoration:none;
  transform:translateY(-120%);
  transition:transform .15s ease;
  pointer-events:none;
}
.skip-link:focus,
.skip-link:focus-visible{
  transform:translateY(12px);
  outline:none;
  pointer-events:auto;
}

/* Only the real site chrome — never style page <header> heroes */
header.site-header{
  background:var(--bg-panel);
  border-bottom:1px solid var(--border);
  position:sticky;
  top:0;
  z-index:10000;
  isolation:isolate;
}
.nav-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 20px;
  max-width:var(--maxw);
  margin:0 auto;
  gap:16px;
  position:relative;
  z-index:2;
}
.logo-link{display:inline-flex;align-items:center;position:relative;z-index:2}
.logo-link img{width:auto;height:40px;max-width:180px;object-fit:contain}

nav.links{
  display:none;
  align-items:center;
  gap:6px;
  font-size:14px;
  font-weight:600;
  color:var(--ink);
  position:relative;
  z-index:3;
}
nav.links > a,
nav.links .nav-item > a.parent{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:8px 10px;
  border-radius:8px;
  color:var(--ink);
  text-decoration:none;
  white-space:nowrap;
}
nav.links > a:hover,
nav.links .nav-item > a.parent:hover{
  background:var(--bg);
  color:var(--blue);
}
nav.links a.is-active,
nav.links .nav-item.is-active > a.parent,
nav.links a.parent.is-active{
  color:var(--blue);
  background:var(--blue-soft);
}
nav.links a.parent svg{width:12px;height:12px;flex:0 0 auto}

nav.links .nav-item{
  position:relative;
}
/* Bridge gap so hover is not lost between parent and dropdown */
nav.links .nav-item::after{
  content:"";
  position:absolute;
  left:0;right:0;top:100%;
  height:12px;
}
.dropdown{
  display:none;
  position:absolute;
  top:calc(100% + 4px);
  left:0;
  min-width:220px;
  padding:8px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-hover);
  z-index:10020;
  pointer-events:auto;
}
nav.links .nav-item:hover > .dropdown,
nav.links .nav-item:focus-within > .dropdown,
nav.links .nav-item.open > .dropdown{
  display:block;
}
.dropdown a{
  display:block;
  padding:10px 12px;
  border-radius:6px;
  font-weight:500;
  font-size:13px;
  color:var(--text);
  text-decoration:none;
  pointer-events:auto;
}
.dropdown a:hover,
.dropdown a:focus{
  background:var(--bg);
  color:var(--blue);
  outline:none;
}
.dropdown a.is-active{
  background:var(--blue-soft);
  color:var(--blue);
  font-weight:700;
}

.nav-actions{
  display:flex;
  align-items:center;
  gap:10px;
  position:relative;
  z-index:3;
}
.btn-login{
  font-size:13px;font-weight:700;color:var(--blue);
  padding:9px 14px;border:1.5px solid var(--blue);border-radius:var(--radius);
  white-space:nowrap;text-decoration:none;
}
.btn-login.is-active{background:var(--blue-soft)}
.btn-signup{
  background:var(--blue);color:#fff;padding:10px 16px;border-radius:var(--radius);
  font-size:13px;font-weight:700;border:none;white-space:nowrap;text-decoration:none;
}
.btn-signup:hover{background:var(--blue-deep)}
.btn-logout{
  background:transparent;color:var(--ink);border:1.5px solid var(--border);
}

.menu-btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  background:#fff;
  border:1px solid var(--border);
  padding:8px 10px;
  border-radius:var(--radius);
  cursor:pointer;
  color:var(--ink);
  min-width:44px;
  min-height:44px;
  position:relative;
  z-index:5;
}
.menu-btn svg{width:20px;height:20px;pointer-events:none}

#mobile-nav{
  display:none;
  flex-direction:column;
  padding:8px 16px 20px;
  gap:2px;
  font-size:15px;
  font-weight:600;
  background:var(--bg-panel);
  border-bottom:1px solid var(--border);
  max-height:min(80vh,640px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  position:relative;
  z-index:10010;
  pointer-events:auto;
}
#mobile-nav.open{display:flex !important}
#mobile-nav a{
  display:block;
  padding:12px 10px;
  border-radius:8px;
  color:var(--ink);
  text-decoration:none;
  pointer-events:auto;
  position:relative;
  z-index:1;
}
#mobile-nav a:hover,
#mobile-nav a:active{background:var(--bg)}
#mobile-nav a.is-active{
  background:var(--blue-soft);
  color:var(--blue);
  font-weight:800;
}
#mobile-nav .sub{
  padding:0 0 8px 12px;
  display:flex;
  flex-direction:column;
  gap:0;
  font-size:13px;
  font-weight:500;
  color:var(--text-muted);
  border-left:2px solid var(--border);
  margin:0 0 6px 8px;
}
#mobile-nav .sub a{padding:10px 8px;font-weight:500}

@media(min-width:760px){
  nav.links{display:flex}
  .menu-btn{display:none !important}
  #mobile-nav,
  #mobile-nav.open{display:none !important}
  .logo-link img{height:44px;max-width:200px}
}

.btn-primary{background:var(--blue);color:#fff;padding:14px 24px;border-radius:var(--radius);font-weight:700;font-size:15px;text-align:center;border:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn-primary:hover{background:var(--blue-deep)}
.btn-outline{background:rgba(255,255,255,0.08);color:#fff;padding:13px 24px;border-radius:var(--radius);font-weight:700;font-size:15px;border:1.5px solid rgba(255,255,255,0.4);text-align:center}

.verify-banner{background:#FFF8E6;border-bottom:1px solid #F0D78C;color:#7A5A12;font-size:13px;padding:10px 16px;text-align:center;position:relative;z-index:9990}
.verify-banner strong{font-weight:800}
.verify-banner a{color:#1D5FBF;font-weight:700;text-decoration:underline}
.verify-banner form{display:inline}
.verify-banner button{background:none;border:none;color:#1D5FBF;font-weight:700;text-decoration:underline;cursor:pointer;font:inherit;padding:0}

/* =========================================================
   Footer (site-footer) – responsive, no external libs
   ========================================================= */
.site-footer{
  margin-top:auto;
  background:#101827;
  color:#9AAABD;
  padding:46px 0 0;
}
.site-footer .wrap{
  width:min(1160px, calc(100% - 32px));
  margin:0 auto;
}
.footer-top{
  display:grid;
  grid-template-columns:1.8fr 1fr 1fr 1fr;
  gap:50px;
  padding-bottom:42px;
}
.footer-brand{max-width:350px}
.footer-logo{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}
.footer-logo img{
  display:block;
  width:auto;
  height:40px;
  max-width:180px;
}
.footer-brand p{
  margin:16px 0 18px;
  max-width:330px;
  color:#91A1B3;
  font-size:13px;
  line-height:1.7;
}
.footer-social{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 20px;
}
.footer-social a{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:rgba(255,255,255,.045);
  color:#A9B7C7;
  text-decoration:none;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease,transform .15s ease;
}
.footer-social svg{
  width:17px;
  height:17px;
  display:block;
  fill:currentColor;
}
.footer-social svg rect,
.footer-social svg circle{
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
}
.footer-social svg .social-play{
  fill:#101827;
  stroke:none;
}
.footer-social a:hover{
  background:rgba(255,255,255,.10);
  color:#fff;
  border-color:rgba(255,255,255,.25);
  transform:translateY(-2px);
}
.footer-social a:focus-visible{
  outline:2px solid #fff;
  outline-offset:3px;
}
.footer-links{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.footer-links h2{
  margin:1px 0 15px;
  color:#fff;
  font-size:13px;
  font-weight:700;
  line-height:1.3;
}
.footer-links a{
  display:block;
  margin-bottom:10px;
  color:#9BAABC;
  font-size:12.5px;
  line-height:1.4;
  text-decoration:none;
  transition:color .15s ease,transform .15s ease;
}
.footer-links a:hover{
  color:#fff;
  transform:translateX(2px);
}
.footer-links a:focus-visible{
  outline:2px solid #fff;
  outline-offset:3px;
  border-radius:4px;
}
.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:52px;
  border-top:1px solid rgba(255,255,255,.09);
  color:#718398;
  font-size:11px;
  line-height:1.5;
  text-align:center;
}
.footer-bottom-separator{color:#455467}
@media (max-width:900px){
  .footer-top{
    grid-template-columns:1.5fr 1fr 1fr;
    gap:36px 30px;
  }
  .footer-brand{
    grid-column:1 / -1;
    max-width:600px;
  }
}
@media (max-width:620px){
  .site-footer{padding-top:36px}
  .site-footer .wrap{width:calc(100% - 28px)}
  .footer-top{
    grid-template-columns:1fr 1fr;
    gap:30px 22px;
    padding-bottom:30px;
  }
  .footer-brand{
    grid-column:1 / -1;
    max-width:100%;
  }
  .footer-logo img{height:38px;max-width:175px}
  .footer-brand p{max-width:520px;margin-top:13px;margin-bottom:17px}
  .footer-social{margin-bottom:17px}
  .footer-social a{width:33px;height:33px}
  .footer-links h2{margin-bottom:12px}
  .footer-links a{margin-bottom:9px;padding:2px 0}
  .footer-bottom{
    min-height:60px;
    padding:10px 0;
    flex-wrap:wrap;
    gap:4px 8px;
  }
}
@media (max-width:380px){
  .footer-top{grid-template-columns:1fr 1fr;gap:27px 16px}
  .footer-links a{font-size:12px}
  .footer-bottom{font-size:10.5px}
}

/* Shared page utilities (auth, pricing, tools) */
.page-hero{padding:36px 0 12px}
.page-hero h1{font-size:clamp(24px,4vw,32px);margin:0 0 8px;color:var(--ink)}
.page-hero p{font-size:15px;color:var(--text-muted);max-width:560px;margin:0;line-height:1.5}
.card-panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:20px 18px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:11px 16px;border-radius:var(--radius);font-weight:700;font-size:14px;border:1px solid var(--border);background:#fff;color:var(--ink);cursor:pointer;text-decoration:none}
.btn:hover{box-shadow:var(--shadow)}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-primary:hover{background:var(--blue-deep)}
.btn-block{width:100%}
.form-field{margin-bottom:14px}
.form-field label{display:block;font-size:12px;font-weight:700;margin-bottom:5px;color:var(--ink)}
.form-field input,.form-field select,.form-field textarea{
  width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:8px;
  font:inherit;font-size:14px;background:#fff;color:var(--text);box-sizing:border-box
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{
  outline:2px solid var(--blue-soft);border-color:var(--blue)
}
.form-hint{font-size:12px;color:var(--text-muted);margin-top:4px;line-height:1.4}
.form-error{background:#FDECEC;color:#8B1E1E;padding:10px 12px;border-radius:10px;font-size:13px;margin-bottom:14px}
.form-ok{background:#E6F6EE;color:#0d7a52;padding:10px 12px;border-radius:10px;font-size:13px;margin-bottom:14px}
.auth-wrap{max-width:420px;margin:0 auto;padding:28px 16px 56px}
.auth-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:24px 20px;box-shadow:var(--shadow)}
.auth-card h1{font-size:22px;margin:0 0 6px}
.auth-card .sub{font-size:13px;color:var(--text-muted);margin-bottom:18px}
.auth-divider{display:flex;align-items:center;gap:10px;margin:16px 0;font-size:12px;color:var(--text-muted)}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--border)}
/* --- from home.css --- */
/* home.css – homepage only */
/* ================= HERO (buildings + CVs + sun) ================= */
.hero{
  position:relative;padding:0;overflow:hidden;
  background:linear-gradient(120deg,#0B2540 0%,#123F82 35%,#1D5FBF 58%,#8FB9CE 82%,#FCE8C7 100%);
}
.hero::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(8,26,46,.94) 0%,rgba(8,26,46,.82) 30%,rgba(8,26,46,.35) 55%,rgba(8,26,46,0) 74%);
}
.hero-bg{position:absolute;inset:0;z-index:0;width:100%;height:100%}
.hero-bg svg{width:100%;height:100%;display:block}
.hero-grid{
  position:relative;z-index:2;display:grid;grid-template-columns:1fr;gap:28px;
  align-items:center;padding:52px 0 48px;min-height:380px;
}
.hero-eyebrow{
  display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);
  color:#fff;font-size:12px;font-weight:700;padding:6px 14px;border-radius:20px;margin-bottom:16px;
}
.hero h1{margin-bottom:14px;color:#fff}
.hero p.lead{font-size:15px;max-width:480px;margin-bottom:22px;color:#D7E3EF}
.hero .cta-row{display:flex;flex-direction:column;gap:10px}
.btn-outline{
  background:rgba(255,255,255,.08);color:#fff;padding:13px 24px;border-radius:var(--radius);
  font-weight:700;font-size:15px;border:1.5px solid rgba(255,255,255,.4);text-align:center;
}
.btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.16)}

/* Badges BELOW hero so text is never hidden */
.badge-wrap{position:relative;z-index:3;margin-top:-28px;padding:0 0 8px}
.badge-strip{
  display:grid;grid-template-columns:repeat(2,1fr);gap:0;background:#fff;border-radius:14px;
  box-shadow:var(--shadow-hover);overflow:hidden;border:1px solid var(--border);
}
.badge-item{display:flex;gap:10px;align-items:flex-start;padding:16px;border-top:1px solid var(--border)}
.badge-item .ic{
  flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--green-soft);
  color:var(--green);display:flex;align-items:center;justify-content:center;
}
.badge-item .ic svg{width:16px;height:16px}
.badge-item.gold .ic{background:var(--gold-soft);color:#8A6423}
.badge-item.blue .ic{background:var(--blue-soft);color:var(--blue)}
.badge-item.purple .ic{background:var(--purple-soft);color:var(--purple)}
.badge-item strong{display:block;font-size:13px;color:var(--ink)}
.badge-item span{font-size:12px;color:var(--text-muted)}

@media(min-width:600px){
  .badge-strip{grid-template-columns:repeat(4,1fr)}
  .badge-item{border-top:none;border-left:1px solid var(--border)}
  .badge-item:first-child{border-left:none}
}
@media(min-width:760px){
  .hero-grid{grid-template-columns:1.15fr .85fr;min-height:460px;padding:64px 0 56px}
  .hero .cta-row{flex-direction:row;align-items:center}
}


  /* Trust pills – below hero, no overlap */
  .trust-pills{background:var(--bg);padding:0 0 8px;position:relative;z-index:3;margin-top:-24px}
  .trust-inner{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#fff;border:1px solid var(--border);border-radius:16px;padding:14px;box-shadow:var(--shadow-hover)}
  .trust-pill{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--bg)}
  .trust-pill .ic{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
  .trust-pill .ic svg{width:16px;height:16px}
  .trust-pill.green .ic{background:var(--green-soft);color:var(--green)}
  .trust-pill.blue .ic{background:var(--blue-soft);color:var(--blue)}
  .trust-pill.gold .ic{background:var(--gold-soft);color:#8A6423}
  .trust-pill.purple .ic{background:var(--purple-soft);color:var(--purple)}
  .trust-pill strong{display:block;font-size:13px;color:var(--ink)}
  .trust-pill span{font-size:11px;color:var(--text-muted)}
  @media(min-width:700px){.trust-inner{grid-template-columns:repeat(4,1fr);gap:8px}}

  .stats-section{background:linear-gradient(135deg,var(--ink),#123F82);padding:40px 0}
  .stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0}
  .stat-item{padding:18px 12px;text-align:center;border-top:1px solid rgba(255,255,255,.12)}
  .stat-num{display:block;font-size:clamp(22px,5vw,32px);font-weight:800;color:#fff}
  .stat-label{display:block;font-size:12px;color:#B9C7D6;margin-top:6px;font-weight:600;line-height:1.35;max-width:200px;margin-left:auto;margin-right:auto}
  @media(min-width:600px){
    .stats-grid{grid-template-columns:repeat(4,1fr)}
    .stat-item{border-top:none;border-left:1px solid rgba(255,255,255,.12)}
    .stat-item:first-child{border-left:none}
  }

  section{padding:40px 0}@media(min-width:760px){section{padding:40px 0}@media(min-width:760px){section{padding:52px 0}}}
  .section-head{margin-bottom:28px;text-align:center}
  .section-head h2{text-align:center}
  .section-sub{max-width:560px;margin:8px auto 0;text-align:center;font-size:15px}
  .eyebrow-label{display:block;text-align:center;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);margin-bottom:8px}

  .tools-grid{display:grid;gap:16px;grid-template-columns:1fr}
  .tool-card{background:var(--bg-panel);border:1px solid var(--border);border-top:4px solid var(--blue);border-radius:var(--radius);padding:22px;transition:box-shadow .15s,transform .15s}
  .tool-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-3px)}
  .tool-card:nth-child(2){border-top-color:var(--green)}
  .tool-card:nth-child(3){border-top-color:var(--gold)}
  .tool-card:nth-child(4){border-top-color:var(--purple)}
  .tool-ic{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
  .tool-card:nth-child(1) .tool-ic{background:var(--blue-soft);color:var(--blue)}
  .tool-card:nth-child(2) .tool-ic{background:var(--green-soft);color:var(--green)}
  .tool-card:nth-child(3) .tool-ic{background:var(--gold-soft);color:#8A6423}
  .tool-card:nth-child(4) .tool-ic{background:var(--purple-soft);color:var(--purple)}
  .tool-ic svg{width:22px;height:22px}
  .tool-card h3{margin-bottom:6px;font-size:16px;text-align:left}
  .tool-card p{font-size:13px;margin-bottom:12px}
  .tool-card a.link{font-size:13px;font-weight:700;color:var(--blue)}
  .tools-more-link{text-align:center;margin-top:22px;font-size:13px;color:var(--text-muted)}
  .tools-more-link a{color:var(--blue);font-weight:700}
  @media(min-width:600px){.tools-grid{grid-template-columns:repeat(2,1fr)}}
  @media(min-width:900px){.tools-grid{grid-template-columns:repeat(4,1fr)}}
  .tools-grid .tool-card{padding:16px 14px}
  .tools-grid .tool-card h3{font-size:15px}
  .tools-grid .tool-card p{font-size:12.5px;line-height:1.45;margin-bottom:10px}
  .tool-card:nth-child(7){border-top-color:var(--gold)}
  .tool-card:nth-child(8){border-top-color:var(--purple)}
  .tool-card:nth-child(7) .tool-ic{background:var(--gold-soft);color:#8A6423}
  .tool-card:nth-child(8) .tool-ic{background:var(--purple-soft);color:var(--purple)}

  .tiers-section{background:#EEF2F7}
  .tiers-grid{display:grid;gap:18px;grid-template-columns:1fr}
  .tier-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:24px;display:flex;flex-direction:column}
  .tier-card.free{border-color:#BEE7D2}.tier-card.gold{border-color:var(--gold-soft)}.tier-card.expert{border-color:var(--purple-soft)}
  .tier-badge{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.04em;padding:4px 12px;border-radius:20px;margin-bottom:12px;width:fit-content}
  .tier-badge.free{background:#D1FAE5;color:#065F46} /* WCAG AA on soft green */
  .tier-badge.gold{background:#FEF3C7;color:#78350F}
  .tier-badge.expert{background:#EDE9FE;color:#4C1D95}
  .tier-card h3{font-size:18px;margin-bottom:6px;text-align:left}
  .tier-card > p{font-size:13px;margin-bottom:14px}
  .tier-list{display:flex;flex-direction:column;gap:8px;margin-bottom:18px;flex:1}
  .tier-list li{display:flex;gap:8px;font-size:13px}
  .tier-list li svg{width:15px;height:15px;margin-top:2px;flex:0 0 auto}
  .tier-card.free .tier-list li svg{color:#047857}
  .tier-card.gold .tier-list li svg{color:#92400E}
  .tier-card.expert .tier-list li svg{color:#5B21B6}
  .tier-cta{border:none;border-radius:var(--radius);padding:12px;font-weight:700;font-size:14px;text-align:center;display:block}
  .tier-cta.free{background:#047857;color:#ffffff} /* darker green + white */
  .tier-cta.gold{background:#92400E;color:#ffffff} /* brown-gold + white — gold+white fails AA */
  .tier-cta.expert{background:#5B21B6;color:#ffffff}
  @media(min-width:760px){.tiers-grid{grid-template-columns:repeat(3,1fr)}}

  /* Why + CV showcase */
  .why-grid{display:grid;grid-template-columns:1fr;gap:28px;align-items:center}
  .cv-showcase{background:linear-gradient(160deg,#0B2540,#1D5FBF 55%,#C9963E);border-radius:16px;padding:16px 14px 18px;min-height:200px;max-height:240px;position:relative;overflow:hidden}
  .cv-showcase-label{color:#fff;font-size:13px;font-weight:700;margin-bottom:16px;opacity:.95}
  .cv-stack{position:relative;height:220px;max-width:320px;margin:0 auto}
  .mini-cv{position:absolute;width:150px;background:#fff;border-radius:10px;padding:10px;box-shadow:0 8px 20px rgba(0,0,0,.22);font-size:9px;color:#333}
  .mini-cv:nth-child(1){left:10px;top:30px;transform:rotate(-8deg);z-index:1}
  .mini-cv:nth-child(2){left:50%;top:8px;transform:translateX(-50%) rotate(2deg);z-index:2}
  .mini-cv:nth-child(3){right:10px;top:40px;transform:rotate(7deg);z-index:3}
  .mini-cv .bar{height:6px;border-radius:3px;background:#E4E7EC;margin-bottom:6px}
  .mini-cv .hdr{height:10px;border-radius:4px;margin-bottom:10px;width:70%}
  .mini-cv.purple .hdr{background:#5B3FD1}.mini-cv.green .hdr{background:#159862}.mini-cv.gold .hdr{background:#C9963E}
  .mini-cv .role{font-weight:700;font-size:11px;color:#0F172A;margin-bottom:2px}
  .mini-cv .loc{font-size:10px;color:#334155;margin-bottom:8px;font-weight:600} /* was #888 — fails AA at 9px */
  .why-eyebrow{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--blue);margin-bottom:6px}
  .why-grid h2{text-align:left;margin-bottom:14px}
.why-intro{font-size:14px;line-height:1.55;color:var(--text);max-width:100%;margin:0 0 14px}
  .why-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .why-grid{gap:22px !important;align-items:stretch !important}
  @media(min-width:760px){
    .why-grid{grid-template-columns:1fr 1.05fr !important}
  }
  .cv-showcase{
    min-height:0 !important;
    height:auto !important;
    max-height:220px !important;
    padding:14px 14px 16px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    box-sizing:border-box;
  }
  .cv-stack{
    height:160px !important;
    max-width:100% !important;
    flex:0 0 auto;
    min-height:140px !important;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .cv-showcase-label{margin-bottom:8px !important;font-size:12px !important}
  .mini-cv{width:130px !important}
  @media(min-width:760px){
    .cv-showcase{max-height:230px !important}
    .cv-stack{height:170px !important;min-height:150px !important}
    .mini-cv{width:140px !important}
  }
  .why-item{background:var(--bg-panel);border:1px solid var(--border);border-radius:10px;padding:10px 12px}
  .why-item .ic{margin-bottom:6px !important}
  .why-side{display:flex;flex-direction:column;height:100%}
  .why-side .why-list{margin-top:auto}
  .why-item .ic{width:30px;height:30px;border-radius:50%;background:var(--blue-soft);color:var(--blue);display:flex;align-items:center;justify-content:center;margin-bottom:6px}
  .why-item .ic svg{width:16px;height:16px}
  .why-item h3{font-size:13px;margin-bottom:2px;text-align:left}
  .why-item p{font-size:12px;line-height:1.4;margin:0}
  .why-list{gap:8px !important}
  .why-intro{margin-bottom:10px !important;font-size:13.5px !important}
  .why-grid h2{margin-bottom:10px !important;font-size:clamp(1.25rem,2.5vw,1.5rem)}
  @media(min-width:760px){.why-grid{grid-template-columns:1fr 1fr}}

  .testimonials-grid{display:grid;grid-template-columns:1fr;gap:16px}
  .testimonial-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:var(--shadow)}
  .testimonial-card .stars{color:var(--gold);font-size:13px;letter-spacing:2px;margin-bottom:8px}
  .testimonial-card .quote{font-size:13.5px;color:var(--text);font-style:italic;margin-bottom:14px}
  .testimonial-author{display:flex;align-items:center;gap:10px}
  .testimonial-author .avatar{width:36px;height:36px;border-radius:50%;background:var(--purple-soft);color:var(--purple);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px}
  .testimonial-author strong{display:block;font-size:13px;color:var(--ink)}
  .testimonial-author span{font-size:11.5px;color:var(--text-muted)}
  .review-cta{text-align:center;margin-top:20px;font-size:13px}
  .review-cta a{color:var(--blue);font-weight:700}
  @media(min-width:600px){.testimonials-grid{grid-template-columns:repeat(2,1fr)}}
  @media(min-width:900px){.testimonials-grid{grid-template-columns:repeat(3,1fr)}}

  .expert-section{background:#EEF2F7}
  .expert-grid{display:grid;grid-template-columns:1fr;gap:28px}
  .expert-eyebrow{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--purple);margin-bottom:6px}
  .expert-copy h2{text-align:left;margin-bottom:10px}
  .expert-copy p{font-size:14px;margin-bottom:12px;max-width:480px}
  .expert-services-grid{display:grid;grid-template-columns:1fr;gap:10px}
  .expert-service-item{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;display:flex;gap:10px;align-items:center;font-size:13px;font-weight:600;color:var(--ink)}
  .expert-service-item .ic{width:32px;height:32px;border-radius:8px;background:var(--purple-soft);color:var(--purple);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
  .expert-service-item .ic svg{width:15px;height:15px}
  @media(min-width:600px){.expert-services-grid{grid-template-columns:1fr 1fr}}
  @media(min-width:900px){.expert-services-grid{grid-template-columns:1fr 1fr}}
  @media(min-width:760px){.expert-grid{grid-template-columns:1fr 1.1fr}}

  .steps-row{display:grid;grid-template-columns:1fr;gap:18px}
  .step-block{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 16px;background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow)}
  .step-circle{width:56px;height:56px;border-radius:50%;color:#fff;font-weight:800;font-size:20px;display:flex;align-items:center;justify-content:center;margin-bottom:14px}
  .step-block:nth-child(1) .step-circle{background:linear-gradient(135deg,var(--green),#0d7a52)}
  .step-block:nth-child(2) .step-circle{background:linear-gradient(135deg,var(--gold),#8A6423)}
  .step-block:nth-child(3) .step-circle{background:linear-gradient(135deg,var(--purple),#3d2a9e)}
  .step-block h3{margin-bottom:6px}
  .step-block p{font-size:13px;max-width:240px}
  @media(min-width:760px){.steps-row{grid-template-columns:repeat(3,1fr)}}

  .cta-banner{background:linear-gradient(135deg,var(--ink),#123F82);border-radius:16px;padding:28px 24px;display:flex;flex-direction:column;gap:16px;align-items:flex-start;color:#fff}
  .cta-banner h2{color:#fff;text-align:left}
  .cta-banner p{color:#C9D9EA;font-size:14px}
  .cta-banner .btn-primary{background:#fff;color:var(--ink)}
  @media(min-width:760px){.cta-banner{flex-direction:row;justify-content:space-between;align-items:center}}

  .faq-wrap{max-width:760px;margin:0 auto}
  .faq-item{border-bottom:1px solid var(--border);padding:16px 0}
  .faq-item summary{cursor:pointer;font-weight:700;font-size:15px;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
  .faq-item summary::-webkit-details-marker{display:none}
  .faq-item summary span{color:var(--text-muted);font-weight:700}
  .faq-item p{margin-top:10px;font-size:14px;color:var(--text-muted)}




  .tool-card:nth-child(5){border-top-color:var(--blue)}
  .tool-card:nth-child(6){border-top-color:var(--green)}
  .tool-card:nth-child(5) .tool-ic{background:var(--blue-soft);color:var(--blue)}
  .tool-card:nth-child(6) .tool-ic{background:var(--green-soft);color:var(--green)}
  .career-tools-strip{
    background:
      radial-gradient(ellipse 80% 60% at 10% 0%, rgba(146,64,14,.35), transparent 55%),
      radial-gradient(ellipse 60% 50% at 100% 100%, rgba(29,95,191,.45), transparent 50%),
      linear-gradient(135deg,#081828 0%,#0B2540 40%,#123F82 100%);
    padding:36px 0 40px;position:relative;overflow:hidden;
  }
  .career-tools-strip::before{
    content:"";position:absolute;inset:0;opacity:.12;pointer-events:none;
    background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
    background-size:28px 28px;
  }
  .career-tools-panel{
    position:relative;z-index:1;
    display:grid;gap:20px;align-items:stretch;
  }
  @media(min-width:900px){
    .career-tools-panel{grid-template-columns:minmax(200px,260px) 1fr;gap:24px}
  }
  .career-score-card{
    background:linear-gradient(160deg,rgba(251,191,36,.22),rgba(255,255,255,.08));
    border:1px solid rgba(251,191,36,.45);
    border-radius:18px;padding:22px 18px;color:#fff;text-align:center;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    backdrop-filter:blur(8px);
    box-shadow:0 12px 40px rgba(0,0,0,.25);
  }
  .career-meter{
    width:118px;height:118px;border-radius:50%;
    background:conic-gradient(#34D399 0 68%, #FBBF24 68% 85%, rgba(255,255,255,.12) 0);
    display:flex;align-items:center;justify-content:center;margin:0 auto 14px;
    box-shadow:0 0 0 7px rgba(52,211,153,.18), 0 8px 24px rgba(0,0,0,.3);
  }
  .career-meter > span{
    width:90px;height:90px;border-radius:50%;
    background:linear-gradient(160deg,#0B2540,#123F82);
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    font-weight:800;font-size:22px;line-height:1.1;color:#FFFFFF;
  }
  .career-meter small{font-size:10px;font-weight:700;color:#A7F3D0;letter-spacing:.04em;text-transform:uppercase}
  .career-score-card h2{font-size:18px;margin:0 0 8px;color:#FFFFFF;font-weight:800}
  .career-score-card p{font-size:12.5px;color:#E2E8F0;margin:0;line-height:1.5;max-width:220px}
  .career-flow{display:grid;gap:12px;grid-template-columns:1fr}
  @media(min-width:600px){.career-flow{grid-template-columns:1fr 1fr}}
  @media(min-width:900px){.career-flow{grid-template-columns:repeat(4,1fr)}}
  .career-step{
    position:relative;display:flex;flex-direction:column;gap:6px;height:100%;
    background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
    border-radius:14px;padding:16px 14px 16px;color:#fff;text-decoration:none;
    transition:transform .15s, background .15s, border-color .15s, box-shadow .15s;
    overflow:hidden;
  }
  .career-step::before{
    content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:14px 0 0 14px;
  }
  .career-step:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(0,0,0,.28)}
  .career-step .n{
    width:28px;height:28px;border-radius:9px;color:#0B2540;
    font-size:13px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;
    margin-bottom:4px;
  }
  .career-step strong{font-size:13.5px;line-height:1.3;color:#FFFFFF}
  .career-step span{font-size:12px;color:#E2E8F0;line-height:1.45;flex:1}
  .career-step em{
    font-style:normal;font-size:11px;font-weight:800;letter-spacing:.02em;
    padding:3px 8px;border-radius:99px;width:fit-content;margin-top:4px;
  }
  /* Distinct, eye-catching step colours */
  .career-step.step-ats{background:linear-gradient(145deg,rgba(16,185,129,.28),rgba(255,255,255,.08));border-color:rgba(52,211,153,.45)}
  .career-step.step-ats::before{background:#34D399}
  .career-step.step-ats .n{background:#34D399}
  .career-step.step-ats em{background:rgba(52,211,153,.25);color:#A7F3D0}
  .career-step.step-ats:hover{background:linear-gradient(145deg,rgba(16,185,129,.4),rgba(255,255,255,.1))}

  .career-step.step-jd{background:linear-gradient(145deg,rgba(59,130,246,.3),rgba(255,255,255,.08));border-color:rgba(96,165,250,.5)}
  .career-step.step-jd::before{background:#60A5FA}
  .career-step.step-jd .n{background:#60A5FA}
  .career-step.step-jd em{background:rgba(96,165,250,.25);color:#BFDBFE}
  .career-step.step-jd:hover{background:linear-gradient(145deg,rgba(59,130,246,.42),rgba(255,255,255,.1))}

  .career-step.step-cover{background:linear-gradient(145deg,rgba(201,150,62,.28),rgba(255,255,255,.08));border-color:rgba(251,191,36,.5)}
  .career-step.step-cover::before{background:#FBBF24}
  .career-step.step-cover .n{background:#FBBF24}
  .career-step.step-cover em{background:rgba(251,191,36,.22);color:#FDE68A}
  .career-step.step-cover:hover{background:linear-gradient(145deg,rgba(201,150,62,.4),rgba(255,255,255,.1))}

  .career-step.step-li{background:linear-gradient(145deg,rgba(139,92,246,.3),rgba(255,255,255,.08));border-color:rgba(167,139,250,.5)}
  .career-step.step-li::before{background:#A78BFA}
  .career-step.step-li .n{background:#A78BFA;color:#1E1B4B}
  .career-step.step-li em{background:rgba(167,139,250,.25);color:#DDD6FE}
  .career-step.step-li:hover{background:linear-gradient(145deg,rgba(139,92,246,.42),rgba(255,255,255,.1))}
  .pill-free{display:inline-block;font-size:10px;font-weight:800;padding:2px 8px;border-radius:99px;background:#D1FAE5;color:#065F46;margin-left:4px;vertical-align:middle}
  .pill-gold{display:inline-block;font-size:10px;font-weight:800;padding:2px 8px;border-radius:99px;background:#FEF3C7;color:#78350F;margin-left:4px;vertical-align:middle}
  @media(max-width:599px){
    .why-list{grid-template-columns:1fr}
    .mini-cv{width:160px}
    .cv-stack{height:200px;max-width:100%}
  }

/* --- from login.css --- */
/* login.css */
main.auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:40px 20px;min-height:60vh}
  .auth-card{width:100%;max-width:420px;background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:28px 24px;box-shadow:var(--shadow)}
  .auth-card h1{font-size:24px;color:var(--ink);margin-bottom:6px;text-align:center}
  .auth-card .sub{font-size:14px;color:var(--text-muted);text-align:center;margin-bottom:22px}
  .btn-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px;border:1.5px solid var(--border);border-radius:var(--radius);background:#fff;font-weight:600;font-size:14px;color:var(--text)}
  .btn-google:hover{background:var(--bg)}
  .btn-google svg{width:18px;height:18px}
  .divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--text-muted);font-size:12px;font-weight:600}
  .divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--border)}
  .form-group{margin-bottom:14px}
  .form-group label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}
  .form-group input{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:var(--radius);font-size:14px}
  .form-group input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,95,191,.12)}
  .btn-submit{width:100%;background:var(--blue);color:#fff;padding:13px;border:none;border-radius:var(--radius);font-weight:700;font-size:15px;cursor:pointer;margin-top:6px}
  .btn-submit:hover{background:var(--blue-deep)}
  .auth-footer{text-align:center;margin-top:18px;font-size:13px;color:var(--text-muted)}
  .auth-footer a{color:var(--blue);font-weight:600}
  .error-box{background:#FDECEA;color:#C0392B;border:1px solid #f5c6cb;border-radius:var(--radius);padding:10px 14px;font-size:13px;margin-bottom:16px}
  .success-box{background:var(--green-soft);color:#0d7a52;border-radius:var(--radius);padding:10px 14px;font-size:13px;margin-bottom:16px}

/* --- from register.css --- */
/* register.css */
.register-main{flex:1;width:100%;padding:40px 16px 56px;background:var(--bg)}
.register-wrap{width:100%;max-width:460px;margin:0 auto}
.auth-card{width:100%;background:var(--bg-panel);border:1px solid var(--border);border-radius:16px;padding:28px 24px;box-shadow:var(--shadow)}
.auth-header{text-align:center;margin-bottom:24px}
.auth-header h1{margin:0 0 8px;color:var(--ink);font-size:26px;line-height:1.2}
.auth-header .sub{margin:0 auto;max-width:380px;color:var(--text-muted);font-size:14px;line-height:1.55}
.error-box{display:flex;align-items:flex-start;gap:9px;background:#FDECEA;color:#A93226;border:1px solid #F5C6CB;border-radius:10px;padding:11px 13px;margin-bottom:18px;font-size:13px;line-height:1.45}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:46px;padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--radius);background:#fff;color:var(--text);font-size:14px;font-weight:700}
.btn-google:hover{background:var(--bg);border-color:#B9C5D1}
.google-icon{width:18px;height:18px;flex:0 0 18px}
.divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:var(--text-muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--border)}
.form-group{margin-bottom:15px}
.form-group label{display:block;margin-bottom:6px;color:var(--ink);font-size:13px;font-weight:700}
.form-group input{display:block;width:100%;min-height:44px;padding:10px 13px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-panel);color:var(--text);font:inherit;font-size:14px}
.form-group input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,95,191,.12)}
.form-group input.input-error{border-color:#C0392B}
.hint{margin:5px 0 0;color:var(--text-muted);font-size:11.5px}
.password-status{min-height:18px;margin-top:5px;font-size:11.5px}
.password-status.good{color:#137A4A}.password-status.bad{color:#B33A2E}
.btn-submit{display:block;width:100%;min-height:46px;margin-top:7px;padding:11px 16px;border:0;border-radius:var(--radius);background:var(--blue);color:#fff;font:inherit;font-size:15px;font-weight:800;cursor:pointer}
.btn-submit:hover{background:var(--blue-deep)}.btn-submit:disabled{opacity:.65;cursor:not-allowed}
.terms{margin:15px 0 0;color:var(--text-muted);text-align:center;font-size:11.5px;line-height:1.55}
.terms a,.auth-footer a{color:var(--blue);font-weight:700}
.auth-footer{margin:18px 0 0;color:var(--text-muted);text-align:center;font-size:13px}
.debug-bar{background:#fff3cd;border:1px solid #ffc107;color:#664d03;padding:10px 16px;margin:0 0 16px;border-radius:8px;font-size:13px;line-height:1.45}
@media(max-width:480px){.register-main{padding:24px 12px 40px}.auth-card{padding:23px 16px}.auth-header h1{font-size:23px}}

/* --- from pricing.css --- */
/* pricing.css */
.page-hero{background:linear-gradient(135deg,var(--ink),#123F82);padding:48px 0 40px;color:#fff}
  .page-hero h1{color:#fff;margin-bottom:10px}
  .page-hero p{color:#C9D9EA;max-width:560px;font-size:15px}
  .breadcrumb{font-size:13px;color:#9FB4C6;margin-bottom:14px}
  .breadcrumb a{color:#B9C7D6}
  section{padding:40px 0}@media(min-width:760px){section{padding:52px 0}}
  .section-head{margin-bottom:32px}
  .section-sub{max-width:560px;margin:8px auto 0;text-align:center;font-size:15px}
  .eyebrow-label{display:block;text-align:center;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);margin-bottom:8px}
  .pricing-grid{display:grid;gap:20px;grid-template-columns:1fr}
  .price-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:28px 24px;display:flex;flex-direction:column;position:relative;transition:box-shadow .15s,transform .15s}
  .price-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}
  .price-card.free{border-color:#BEE7D2}
  .price-card.gold{border-color:var(--gold)}
  .price-card.pro,.price-card.popular{border-color:var(--blue)}
  .price-card.expert{border-color:var(--purple-soft)}
  .popular-badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--blue);color:#fff;font-size:11px;font-weight:800;letter-spacing:.04em;padding:4px 14px;border-radius:20px}
  .tier-badge{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.04em;padding:4px 12px;border-radius:20px;margin-bottom:12px;width:fit-content}
  .tier-badge.free{background:var(--green-soft);color:var(--green)}
  .tier-badge.gold,.tier-badge.pro{background:var(--gold-soft);color:#8A6423}
  .tier-badge.expert{background:var(--purple-soft);color:var(--purple)}
  .price-card h3{font-size:20px;margin-bottom:4px;text-align:left}
  .price-card .desc{font-size:13px;margin-bottom:16px}
  .price-row{display:flex;align-items:baseline;gap:4px;margin-bottom:6px}
  .price-amount{font-size:36px;font-weight:800;color:var(--ink)}
  .price-currency{font-size:16px;font-weight:700;color:var(--text-muted)}
  .price-note{font-size:12px;color:var(--text-muted);margin-bottom:18px}
  .feature-list{display:flex;flex-direction:column;gap:10px;margin-bottom:22px;flex:1}
  .feature-list li{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--text)}
  .feature-list li svg{flex:0 0 auto;width:16px;height:16px;margin-top:1px;color:var(--green)}
  .price-card.gold .feature-list li svg,.price-card.pro .feature-list li svg{color:var(--gold)}
  .price-card.expert .feature-list li svg{color:var(--purple)}
  .price-cta{display:block;text-align:center;padding:13px;border-radius:var(--radius);font-weight:700;font-size:14px;color:#fff}
  .price-cta.free{background:var(--green)}.price-cta.gold{background:var(--gold)}
  .price-cta.pro{background:var(--blue)}.price-cta.expert{background:var(--purple)}
  .compare-note{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:24px;margin-top:28px;text-align:center}
  .compare-note h3{margin-bottom:8px;font-size:16px}
  .compare-note p{font-size:13px;max-width:520px;margin:0 auto 14px}
  .compare-note a{font-size:13px;font-weight:700;color:var(--blue)}
  .faq-mini{max-width:640px;margin:0 auto}
  .faq-item{border-bottom:1px solid var(--border);padding:16px 0}
  .faq-item summary{cursor:pointer;font-weight:700;font-size:14px;color:var(--ink);list-style:none;display:flex;justify-content:space-between;gap:12px}
  .faq-item summary::-webkit-details-marker{display:none}
  .faq-item p{margin-top:10px;font-size:13px}
  @media(min-width:600px){.pricing-grid{grid-template-columns:repeat(2,1fr)}}
  @media(min-width:900px){.pricing-grid{grid-template-columns:repeat(4,1fr)}}

/* --- from templates.css --- */

/* Templates page – no sticky page header, calm spacing */
main.tpl-page{
  padding:20px 0 48px;
  position:relative;
  z-index:1;
}
main.tpl-page .tpl-hero{
  margin:0 0 16px;
  padding:0;
  background:transparent;
  border:none;
  position:static;
  z-index:auto;
}
main.tpl-page .tpl-hero h1{
  font-size:clamp(24px,4vw,32px);
  margin:0 0 8px;
  text-align:left;
  color:var(--ink);
}
main.tpl-page .tpl-hero p{
  color:var(--text-muted);
  font-size:15px;
  max-width:560px;
  margin:0 0 8px;
  line-height:1.5;
}
main.tpl-page .tpl-filters{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 20px;
}
main.tpl-page .tpl-grid{
  margin-top:0;
}

/* templates.css */
.tpl-page{padding:20px 0 48px;position:relative;z-index:1}
  .tpl-hero h1{font-size:clamp(24px,4vw,32px);margin:0 0 8px;text-align:left;color:var(--ink)}
  .tpl-hero p{color:var(--text-muted);font-size:15px;max-width:560px;margin:0 0 20px}
  .tpl-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
  .tpl-filters a{font-size:13px;font-weight:700;padding:8px 14px;border-radius:20px;border:1px solid var(--border);background:#fff;color:var(--ink)}
  .tpl-filters a.active,.tpl-filters a:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
  .tpl-grid{display:grid;grid-template-columns:1fr;gap:16px}
  @media(min-width:600px){.tpl-grid{grid-template-columns:1fr 1fr}}
  @media(min-width:900px){.tpl-grid{grid-template-columns:1fr 1fr 1fr}}
  .tpl-card{background:#fff;border:1px solid var(--border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s,transform .15s}
  .tpl-card:hover{box-shadow:0 10px 28px rgba(11,37,64,.1);transform:translateY(-2px)}
  .tpl-thumb{aspect-ratio:3/4;background:#EEF2F6;position:relative;overflow:hidden;display:block}
  .tpl-thumb img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
  .tpl-thumb .no-prev{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;text-align:center;font-size:13px;font-weight:600;color:#64748B;line-height:1.4}
  .tpl-body{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1;gap:8px}
  .tpl-badge{font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--blue)}
  .tpl-card h2{font-size:16px;margin:0;text-align:left;color:var(--ink)}
  .tpl-card .desc{font-size:13px;color:var(--text-muted);margin:0;flex:1;line-height:1.45}
  .tpl-card .cta{display:inline-flex;align-items:center;justify-content:center;margin-top:6px;padding:10px 14px;border-radius:10px;background:var(--blue);color:#fff;font-weight:700;font-size:13px;text-align:center}
  .tpl-card .cta.secondary{background:#fff;color:var(--blue);border:1.5px solid var(--blue)}
  .tpl-empty{background:#fff;border:1px solid var(--border);border-radius:14px;padding:40px 20px;text-align:center;color:var(--text-muted)}

/* --- from expert-services.css --- */
/* expert-services.css */
.page-hero{background:linear-gradient(135deg,var(--ink),#123F82);padding:48px 0 40px;color:#fff}
  .page-hero h1{color:#fff;margin-bottom:10px}
  .page-hero p{color:#C9D9EA;max-width:560px;font-size:15px}
  .breadcrumb{font-size:13px;color:#9FB4C6;margin-bottom:14px}
  .breadcrumb a{color:#B9C7D6}
  .hero-cta{display:inline-flex;margin-top:18px;background:#fff;color:var(--ink);padding:12px 22px;border-radius:var(--radius);font-weight:700;font-size:14px}
  section{padding:40px 0}@media(min-width:760px){section{padding:52px 0}}
  .section-head{margin-bottom:32px}
  .section-sub{max-width:560px;margin:8px auto 0;text-align:center;font-size:15px}
  .eyebrow-label{display:block;text-align:center;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--purple);margin-bottom:8px}
  .services-grid{display:grid;gap:16px;grid-template-columns:1fr}
  .svc-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:22px;display:flex;flex-direction:column;transition:box-shadow .15s,transform .15s}
  .svc-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}
  .svc-ic{width:44px;height:44px;border-radius:12px;background:var(--purple-soft);color:var(--purple);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
  .svc-ic svg{width:20px;height:20px}
  .svc-card h3{margin-bottom:6px;font-size:17px;text-align:left}
  .svc-card p{font-size:13px;margin-bottom:14px;flex:1}
  .svc-price{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:12px}
  .svc-price span{font-weight:500;color:var(--text-muted);font-size:12px}
  .svc-cta{display:inline-block;background:var(--purple);color:#fff;padding:10px 16px;border-radius:var(--radius);font-size:13px;font-weight:700;text-align:center}
  .how-grid{display:grid;gap:20px;grid-template-columns:1fr}
  .how-step{background:var(--bg-panel);border:1px solid var(--border);border-radius:14px;padding:22px;text-align:center}
  .how-num{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--purple),#3d2a9e);color:#fff;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
  .how-step h3{margin-bottom:6px}
  .how-step p{font-size:13px}
  .why-list{display:grid;gap:14px;grid-template-columns:1fr}
  .why-item{background:var(--bg-panel);border:1px solid var(--border);border-left:3px solid var(--purple);border-radius:10px;padding:10px 12px}
  .why-item h3{font-size:13px;margin-bottom:2px;text-align:left}
  .why-item p{font-size:12px;line-height:1.4;margin:0}
  .cta-banner{background:linear-gradient(135deg,var(--ink),#123F82);border-radius:16px;padding:28px 24px;text-align:center;color:#fff}
  .cta-banner h2{color:#fff;margin-bottom:8px}
  .cta-banner p{color:#C9D9EA;font-size:14px;margin-bottom:16px}
  .cta-banner a{display:inline-block;background:#fff;color:var(--ink);padding:12px 22px;border-radius:var(--radius);font-weight:700;font-size:14px}
  @media(min-width:600px){
    .services-grid{grid-template-columns:repeat(2,1fr)}
    .how-grid{grid-template-columns:repeat(3,1fr)}
    .why-list{grid-template-columns:repeat(2,1fr)}
  }
  @media(min-width:900px){.services-grid{grid-template-columns:repeat(3,1fr)}}

/* --- from expert-apply.css --- */
/* expert-apply.css */
.apply-page{padding:28px 0 56px}
  .apply-hero h1{font-size:clamp(22px,4vw,30px);margin:0 0 8px;text-align:left}
  .apply-hero p{color:var(--text-muted);font-size:15px;max-width:560px;margin:0 0 20px}
  .apply-grid{display:grid;grid-template-columns:1fr;gap:24px}
  @media(min-width:860px){.apply-grid{grid-template-columns:1fr 1.15fr;align-items:start}}
  .svc-pick{display:flex;flex-direction:column;gap:10px}
  .svc-option{display:block;border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;background:#fff;cursor:pointer;transition:border-color .15s,box-shadow .15s}
  .svc-option:hover{border-color:#B7C9E8}
  .svc-option.active{border-color:var(--purple);box-shadow:0 0 0 3px rgba(91,63,209,.12)}
  .svc-option strong{display:block;font-size:14px;color:var(--ink);margin-bottom:2px}
  .svc-option span{font-size:12px;color:var(--text-muted);line-height:1.4}
  .svc-option input{accent-color:var(--purple);margin-right:8px}
  .apply-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px 18px}
  .apply-card h2{font-size:16px;margin:0 0 14px;text-align:left}
  .field{margin-bottom:12px}
  .field label{display:block;font-size:13px;font-weight:600;margin-bottom:5px;color:var(--ink)}
  .field input,.field select,.field textarea{width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:10px;font-size:14px;font-family:inherit}
  .field textarea{min-height:120px;resize:vertical}
  .field-row{display:grid;grid-template-columns:1fr;gap:12px}
  @media(min-width:560px){.field-row{grid-template-columns:1fr 1fr}}
  .btn-submit{width:100%;background:var(--purple);color:#fff;border:0;padding:13px;border-radius:10px;font-weight:700;font-size:15px;cursor:pointer;margin-top:6px}
  .btn-submit:hover{filter:brightness(.95)}
  .flash-ok{background:var(--green-soft,#E8F7EF);color:#0d7a52;padding:12px 14px;border-radius:10px;margin-bottom:16px;font-size:14px}
  .flash-err{background:#FDECEA;color:#C0392B;padding:12px 14px;border-radius:10px;margin-bottom:16px;font-size:14px}
  .side-note{font-size:13px;color:var(--text-muted);margin-top:14px;line-height:1.5}
  .side-note a{color:var(--blue);font-weight:600}

/* --- from error.css --- */
/* error.css */
.err-wrap{max-width:640px;margin:0 auto;padding:64px 20px 80px;text-align:center}
  .err-code{font-size:clamp(64px,14vw,96px);font-weight:800;line-height:1;color:var(--blue);letter-spacing:-.03em;margin-bottom:8px}
  .err-wrap h1{font-size:clamp(22px,4vw,28px);margin-bottom:10px}
  .err-wrap > p{font-size:15px;color:var(--text-muted);max-width:440px;margin:0 auto 28px}
  .err-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:36px}
  .err-actions a{
    display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;border-radius:var(--radius);
    font-size:14px;font-weight:700;text-decoration:none;
  }
  .err-actions .primary{background:var(--blue);color:#fff}
  .err-actions .primary:hover{background:var(--blue-deep)}
  .err-actions .ghost{background:var(--bg-panel);color:var(--ink);border:1.5px solid var(--border)}
  .err-actions .ghost:hover{border-color:var(--blue);color:var(--blue)}
  .err-links{display:grid;gap:10px;grid-template-columns:1fr;text-align:left;max-width:420px;margin:0 auto}
  @media(min-width:480px){.err-links{grid-template-columns:1fr 1fr}}
  .err-links a{
    display:block;padding:14px 16px;background:var(--bg-panel);border:1px solid var(--border);
    border-radius:12px;font-size:13px;font-weight:600;color:var(--ink);transition:box-shadow .15s,border-color .15s;
  }
  .err-links a:hover{border-color:var(--blue);box-shadow:var(--shadow)}
  .err-links a span{display:block;font-size:11px;font-weight:500;color:var(--text-muted);margin-top:4px}

/* --- from account-profile.css --- */
/* account-profile.css */
.prof-section{background:#fff;border:1px solid var(--border,#D8DEE6);border-radius:14px;padding:18px 16px;margin-bottom:16px}
.prof-section h2{font-size:16px;margin:0 0 6px}
.prof-section .sub{font-size:13px;color:#5B6B7C;margin-bottom:14px}
.prof-grid{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:640px){.prof-grid.two{grid-template-columns:1fr 1fr}}
.prof-field label{display:block;font-size:12px;font-weight:600;margin-bottom:4px;color:#16202B}
.prof-field input,.prof-field textarea{width:100%;padding:10px 12px;border:1px solid #D8DEE6;border-radius:10px;font:inherit;box-sizing:border-box}
.prof-field textarea{min-height:90px;resize:vertical}
.prof-block{border:1px solid #E2E8F0;border-radius:12px;padding:12px;margin-bottom:10px;background:#FAFBFC}
.prof-block-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-weight:700;font-size:13px}
.prof-add{width:100%;padding:10px;border:1px dashed #B7C9E8;border-radius:10px;background:#F5F9FF;color:#1D5FBF;font-weight:700;cursor:pointer;margin-top:4px}
.prof-rm{background:none;border:0;color:#8B1E1E;font-weight:700;font-size:12px;cursor:pointer}
.prof-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;position:sticky;bottom:12px;background:rgba(255,255,255,.95);padding:12px 0;z-index:5}
.acc-flash{padding:12px 14px;border-radius:10px;margin-bottom:14px;font-size:14px}
.acc-flash.ok{background:#E6F6EE;color:#0d7a52}
.acc-flash.err{background:#FDE8E8;color:#8B1E1E}

/* --- from account-orders.css --- */
/* account-orders.css */
.acc-card{background:#fff;border:1px solid var(--border,#D8DEE6);border-radius:14px;padding:16px}
.acc-table{width:100%;border-collapse:collapse;font-size:13px}
.acc-table th,.acc-table td{text-align:left;padding:10px 8px;border-bottom:1px solid #E8ECF1;vertical-align:top}
.acc-table th{font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:#5B6B7C}
.table-wrap{overflow-x:auto}
.acc-badge{display:inline-block;font-size:10px;font-weight:800;padding:3px 8px;border-radius:999px;text-transform:uppercase}
.acc-badge.ok{background:#E6F6EE;color:#0d7a52}
.acc-badge.warn{background:#FFF6E5;color:#8A6423}
.acc-badge.bad{background:#FDE8E8;color:#8B1E1E}
.stat-card{background:#fff;border:1px solid var(--border,#D8DEE6);border-radius:12px;padding:14px}
.stat-card .label{font-size:12px;color:#5B6B7C}
.stat-card .value{font-size:22px;font-weight:800;margin-top:4px}

/* =========================================================
   Static pages (about, contact, privacy, terms, refund)
   Higher specificity so home/tools utilities do not break them
   ========================================================= */

main > section.page-hero,
main section.page-hero{
  background:linear-gradient(135deg,var(--ink),#123F82) !important;
  padding:48px 0 40px !important;
  color:#fff !important;
}
main section.page-hero h1{
  color:#fff !important;
  margin:0 0 10px !important;
  font-size:clamp(28px,5vw,40px);
  line-height:1.15;
}
main section.page-hero p{
  color:#C9D9EA !important;
  max-width:560px;
  margin:0;
  font-size:15px;
  line-height:1.55;
}
main .breadcrumb{
  font-size:13px;
  color:#9FB4C6;
  margin-bottom:14px;
  font-weight:600;
}
main .breadcrumb a{
  color:#B9C7D6;
  text-decoration:none;
}
main .breadcrumb a:hover{color:#fff}

/* About */
main .content-grid{
  display:grid;
  gap:28px;
  padding:48px 0;
  grid-template-columns:1fr;
}
@media(min-width:800px){
  main .content-grid{grid-template-columns:1fr 1fr}
}
main .content-card{
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:14px;
  padding:24px;
  box-shadow:var(--shadow);
}
main .content-card h2{
  margin:0 0 12px;
  font-size:20px;
  text-align:left;
  color:var(--ink);
}
main .content-card p{
  font-size:14px;
  margin:0 0 12px;
  line-height:1.65;
  color:var(--text-muted);
}
main .content-card p:last-child{margin-bottom:0}
main .content-card strong{color:var(--ink)}

main .values-grid{
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
  padding:0 0 48px;
}
@media(min-width:700px){
  main .values-grid{grid-template-columns:1fr 1fr}
}
@media(min-width:960px){
  main .values-grid{grid-template-columns:repeat(4,1fr)}
}
main .value-item{
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-left:4px solid var(--blue);
  border-radius:var(--radius);
  padding:18px;
}
main .value-item:nth-child(2){border-left-color:var(--green)}
main .value-item:nth-child(3){border-left-color:var(--gold)}
main .value-item:nth-child(4){border-left-color:var(--purple)}
main .value-item h3{
  margin:0 0 6px;
  font-size:15px;
  text-align:left;
  color:var(--ink);
}
main .value-item p{
  font-size:13px;
  margin:0;
  line-height:1.5;
  color:var(--text-muted);
}

main .team-note{
  background:var(--blue-soft);
  border:1px solid #C5D9F5;
  border-radius:14px;
  padding:22px 20px;
  margin:0 0 40px;
}
main .team-note h2{
  margin:0 0 8px;
  font-size:18px;
  text-align:left;
  color:var(--ink);
}
main .team-note p{
  margin:0;
  font-size:14px;
  line-height:1.6;
  color:var(--text);
}
main .cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  padding:0 0 56px;
}

/* Contact */
main .contact-grid{
  display:grid;
  gap:28px;
  grid-template-columns:1fr;
  padding:48px 0;
  align-items:start;
}
@media(min-width:760px){
  main .contact-grid{grid-template-columns:1.3fr .7fr}
}
main .contact-form-card,
main .contact-info-card{
  background:var(--bg-panel);
  border:1px solid var(--border);
  border-radius:14px;
  padding:24px;
  box-shadow:var(--shadow);
}
main .contact-form-card h2,
main .contact-info-card h2{
  margin:0 0 6px;
  font-size:20px;
  text-align:left;
  color:var(--ink);
}
main .contact-form-card > p,
main .contact-info-card > p{
  font-size:13px;
  margin:0 0 20px;
  color:var(--text-muted);
}
main .form-group{margin-bottom:16px}
main .form-group label{
  display:block;
  font-size:13px;
  font-weight:600;
  color:var(--ink);
  margin-bottom:6px;
}
main .form-group input,
main .form-group select,
main .form-group textarea{
  width:100%;
  padding:11px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:#fff;
  color:var(--text);
  font:inherit;
  font-size:14px;
  box-sizing:border-box;
  transition:border-color .15s ease;
}
main .form-group input:focus,
main .form-group select:focus,
main .form-group textarea:focus{
  outline:none;
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(29,95,191,0.12);
}
main .form-group textarea{min-height:120px;resize:vertical}
main .form-row{
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
  margin-bottom:0;
}
@media(min-width:600px){
  main .form-row{grid-template-columns:1fr 1fr}
}
main .btn-submit{
  width:100%;
  background:var(--blue);
  color:#fff;
  padding:13px 20px;
  border:none;
  border-radius:var(--radius);
  font-weight:700;
  font-size:15px;
  cursor:pointer;
  transition:background .15s ease;
  margin-top:4px;
}
main .btn-submit:hover{background:var(--blue-deep)}

main .info-list{display:flex;flex-direction:column;gap:16px}
main .info-item{display:flex;gap:12px;align-items:flex-start}
main .info-item .ic{
  flex:0 0 auto;
  width:40px;
  height:40px;
  border-radius:10px;
  background:var(--blue-soft);
  color:var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
}
main .info-item .ic svg{width:18px;height:18px}
main .info-item strong{display:block;font-size:14px;color:var(--ink);margin-bottom:2px}
main .info-item span{font-size:13px;color:var(--text-muted)}
main .info-item a{color:var(--blue);font-weight:600}

main .quick-links{
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid var(--border);
}
main .quick-links h3{
  margin:0 0 12px;
  font-size:14px;
  text-align:left;
  color:var(--ink);
}
main .quick-links a{
  display:block;
  font-size:13px;
  font-weight:600;
  color:var(--blue);
  padding:6px 0;
  text-decoration:none;
}
main .quick-links a:hover{text-decoration:underline}

/* Legal: privacy, terms, refund */
main .legal-content{
  max-width:720px;
  margin:0 auto;
  padding:40px 0 60px;
}
main .legal-content .updated{
  font-size:13px;
  color:var(--text-muted);
  margin-bottom:24px;
}
main .legal-content h2{
  font-size:17px;
  margin:28px 0 10px;
  text-align:left;
  color:var(--ink);
  line-height:1.3;
}
main .legal-content h2:first-of-type{margin-top:8px}
main .legal-content p{
  font-size:14px;
  line-height:1.7;
  margin:0 0 12px;
  color:var(--text);
}
main .legal-content a{
  color:var(--blue);
  font-weight:600;
  text-decoration:underline;
}
main ul.legal-list{
  list-style:disc;
  padding-left:20px;
  margin:8px 0 14px;
}
main ul.legal-list li{
  margin-bottom:8px;
  font-size:14px;
  line-height:1.6;
  color:var(--text);
}

/* =========================================================
   Section spacing (ALL pages)
   ========================================================= */
section{
  padding:40px 0;
}
@media(min-width:760px){
  section{
    padding:52px 0;
  }
}
main > section{
  padding:40px 0;
}
@media(min-width:760px){
  main > section{
    padding:52px 0;
  }
}
/* Homepage special blocks keep their own padding */
main > section.hero{
  padding:0 !important;
}
main > section.stats-section{
  padding:40px 0 !important;
}
main > section.career-tools-strip{
  padding:36px 0 40px !important;
}
main > section.page-hero{
  padding:48px 0 40px !important;
}
main > section.tiers-section,
main > section.expert-section{
  padding:48px 0;
}
@media(min-width:760px){
  main > section.tiers-section,
  main > section.expert-section{
    padding:56px 0;
  }
}

/* About CTA buttons on light background */
main .cta-row .btn-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--blue);
  color:#fff;
  padding:13px 22px;
  border-radius:var(--radius);
  font-weight:700;
  font-size:15px;
  border:none;
  text-decoration:none;
}
main .cta-row .btn-primary:hover{background:var(--blue-deep)}
main .cta-row .btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  color:var(--blue);
  padding:12px 22px;
  border-radius:var(--radius);
  font-weight:700;
  font-size:15px;
  border:1.5px solid var(--blue);
  text-decoration:none;
}
main .cta-row .btn-outline:hover{
  background:var(--blue-soft);
  color:var(--blue-deep);
  border-color:var(--blue-deep);
}


.home-soft-stats strong{color:var(--ink,#0B2540);font-weight:750}
@media(max-width:899px){
  .home-soft-stats{font-size:12px}
}

main > section.stats-section{display:none !important}

/* ===== Tools showcase (Concept 3 – clean rail + numbered grid) ===== */
.tools-showcase{
  background:linear-gradient(180deg,#F7FBFF 0%,#FFFFFF 40%);
  border-top:1px solid var(--border,#E5E9EF);
}
.tools-showcase-head{margin-bottom:28px}
.tools-showcase .grad-text{
  background:linear-gradient(90deg,#0B2540 0%,#1D5FBF 55%,#5B3FD1 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.tools-showcase-layout{
  display:grid;
  gap:20px;
  align-items:stretch;
}
@media(min-width:960px){
  .tools-showcase-layout{
    grid-template-columns:220px minmax(0,1fr);
    gap:24px;
  }
}
.tools-rail{
  background:#fff;
  border:1px solid #E5E9EF;
  border-radius:18px;
  padding:22px 18px;
  box-shadow:0 8px 24px rgba(11,37,64,.05);
  display:flex;
  flex-direction:column;
  gap:16px;
}
.tools-rail-tag{
  margin:0;
  font-size:1.05rem;
  font-weight:800;
  line-height:1.35;
  color:#0B2540;
  letter-spacing:-.02em;
}
.tools-rail-stats{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}
.tools-rail-stats li{
  display:grid;
  gap:2px;
  padding:10px 12px;
  border-radius:12px;
  background:#F5F8FC;
  border:1px solid #EEF2F7;
}
.tools-rail-num{
  font-size:1.25rem;
  font-weight:800;
  color:#123F82;
  line-height:1.2;
}
.tools-rail-label{
  font-size:12px;
  line-height:1.4;
  color:#64748b;
}
.tools-rail-cta{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 14px;
  border-radius:10px;
  background:#0B2540;
  color:#fff;
  font-weight:700;
  font-size:13px;
  text-decoration:none;
}
.tools-rail-cta:hover{background:#123F82;color:#fff}

.tools-showcase .tools-grid-8{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
@media(min-width:600px){
  .tools-showcase .tools-grid-8{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:960px){
  .tools-showcase .tools-grid-8{grid-template-columns:repeat(4,1fr);gap:14px}
}

.tools-showcase .tool-card-link{
  text-decoration:none;
  color:inherit;
  position:relative;
  background:#fff;
  border:1px solid #E8ECF2;
  border-top:none;
  border-radius:16px;
  padding:16px 14px 14px;
  box-shadow:0 4px 14px rgba(11,37,64,.04);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
  display:flex;
  flex-direction:column;
  min-height:100%;
}
.tools-showcase .tool-card-link:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 28px rgba(11,37,64,.08);
  border-color:#D0D9E6;
}
.tools-showcase .tool-num{
  position:absolute;
  top:12px;
  right:12px;
  font-size:11px;
  font-weight:800;
  color:#94A3B8;
  letter-spacing:.04em;
}
.tools-showcase .tool-ic{
  width:40px;
  height:40px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:10px;
}
.tools-showcase .tool-ic svg{width:20px;height:20px}
.tool-ic-blue{background:#E8F0FE;color:#1D5FBF}
.tool-ic-teal{background:#E6F7F2;color:#0D9488}
.tool-ic-amber{background:#FFF6E5;color:#B45309}
.tool-ic-violet{background:#F3E8FF;color:#7C3AED}
.tool-ic-sky{background:#E0F2FE;color:#0284C7}
.tool-ic-mint{background:#D1FAE5;color:#059669}
.tool-ic-rose{background:#FFE4E6;color:#E11D48}
.tool-ic-indigo{background:#E0E7FF;color:#4F46E5}

.tools-showcase .tool-card-link h3{
  font-size:14.5px;
  margin:0 0 6px;
  line-height:1.35;
  color:#0B2540;
  font-weight:750;
  padding-right:28px;
}
.tools-showcase .tool-card-link p{
  font-size:12.5px;
  line-height:1.45;
  color:#64748b;
  margin:0 0 12px;
  flex:1;
}
.tools-showcase .tool-card-link .link{
  font-size:13px;
  font-weight:700;
  color:#1D5FBF;
}
.tools-showcase .tool-card-link:hover .link{text-decoration:underline}
.tools-showcase .tools-more-link{margin-top:20px}

/* ===== Tools Concept 4 – soft & modern ===== */
.tools-c4{
  position:relative;
  background:
    radial-gradient(ellipse 80% 50% at 100% 0%, #EEF2FF 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 0% 100%, #ECFDF5 0%, transparent 50%),
    linear-gradient(180deg, #F8FBFF 0%, #FFFFFF 55%);
  border-top:1px solid #E8EEF6;
  overflow:hidden;
}
.tools-c4-inner{position:relative;z-index:1}
.tools-c4-head{
  display:grid;
  gap:16px;
  margin-bottom:28px;
  align-items:end;
}
@media(min-width:900px){
  .tools-c4-head{
    grid-template-columns:1fr auto;
    gap:24px;
  }
}
.tools-c4-head-text .section-sub{max-width:520px;margin:0}
.tools-c4-grad{
  background:linear-gradient(90deg, #1D5FBF 0%, #7C3AED 55%, #DB2777 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.tools-c4-deco{
  position:relative;
  width:180px;
  height:120px;
  margin:0 auto;
  display:none;
}
@media(min-width:900px){
  .tools-c4-deco{display:block}
}
.tools-c4-laptop{width:160px;height:auto}
.tools-c4-bubble{
  position:absolute;
  top:4px;
  left:-8px;
  font-size:11px;
  font-weight:700;
  font-style:italic;
  color:#64748b;
  background:#fff;
  border:1px solid #E2E8F0;
  border-radius:12px 12px 12px 4px;
  padding:6px 10px;
  box-shadow:0 4px 12px rgba(15,23,42,.06);
  white-space:nowrap;
}
.tools-c4-plant{
  position:absolute;
  right:0;
  bottom:8px;
  width:36px;
  height:auto;
}

.tools-c4-grid{
  display:grid;
  gap:14px;
  grid-template-columns:1fr;
}
@media(min-width:600px){
  .tools-c4-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:960px){
  .tools-c4-grid{grid-template-columns:repeat(4,1fr);gap:16px}
}

.c4-card{
  position:relative;
  display:flex;
  flex-direction:column;
  background:#fff;
  border:1px solid #E8ECF2;
  border-radius:18px;
  padding:18px 16px 16px;
  text-decoration:none;
  color:inherit;
  box-shadow:0 6px 18px rgba(15,23,42,.04);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  min-height:100%;
}
.c4-card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 32px rgba(15,23,42,.09);
  border-color:#D4DCE8;
}
.c4-num{
  position:absolute;
  top:14px;
  left:16px;
  font-size:11px;
  font-weight:800;
  color:#CBD5E1;
  letter-spacing:.06em;
}
.c4-arrow{
  position:absolute;
  top:12px;
  right:14px;
  width:28px;
  height:28px;
  border-radius:999px;
  background:#F1F5F9;
  color:#64748b;
  font-size:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background .15s,color .15s;
}
.c4-card:hover .c4-arrow{
  background:#1D5FBF;
  color:#fff;
}
.c4-ic{
  width:44px;
  height:44px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:22px 0 12px;
}
.c4-ic svg{width:22px;height:22px}
.c4-ic-blue{background:#E0EDFF;color:#1D5FBF}
.c4-ic-teal{background:#D1FAE5;color:#0D9488}
.c4-ic-amber{background:#FEF3C7;color:#B45309}
.c4-ic-violet{background:#EDE9FE;color:#7C3AED}
.c4-ic-sky{background:#E0F2FE;color:#0284C7}
.c4-ic-mint{background:#CCFBF1;color:#0F766E}
.c4-ic-rose{background:#FFE4E6;color:#E11D48}
.c4-ic-indigo{background:#E0E7FF;color:#4F46E5}

.c4-card h3{
  margin:0 0 8px;
  font-size:15px;
  font-weight:750;
  line-height:1.35;
  color:#0B2540;
}
.c4-card p{
  margin:0 0 14px;
  font-size:12.5px;
  line-height:1.5;
  color:#64748b;
  flex:1;
}
.c4-link{
  font-size:13px;
  font-weight:700;
  color:#1D5FBF;
}
.c4-card:hover .c4-link{text-decoration:underline}

/* Soft stats strip (Concept 4 bottom bar) */
.tools-c4-stats{
  margin-top:22px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px 0;
  padding:14px 18px;
  background:linear-gradient(90deg, #EFF6FF 0%, #F5F3FF 50%, #ECFDF5 100%);
  border:1px solid #E2E8F0;
  border-radius:999px;
}
.tools-c4-stat{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:4px 16px;
  font-size:12.5px;
  color:#475569;
  line-height:1.35;
}
.tools-c4-stat + .tools-c4-stat{
  border-left:1px solid #CBD5E1;
}
.tools-c4-stat-ic{
  width:28px;
  height:28px;
  border-radius:999px;
  background:#fff;
  border:1px solid #E2E8F0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#1D5FBF;
  flex-shrink:0;
}
.tools-c4-stat-ic svg{width:14px;height:14px}
.tools-c4-stat-text strong{
  color:#0B2540;
  font-weight:800;
  margin-right:4px;
}
@media(max-width:700px){
  .tools-c4-stats{
    border-radius:16px;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
  }
  .tools-c4-stat + .tools-c4-stat{border-left:0;padding-left:0}
}
.tools-c4-more{margin-top:18px;text-align:center}

/* ===== Why CVforGulf – Concept 3 Editorial ===== */
.why-c3{
  background:linear-gradient(180deg,#F7FAFF 0%,#FFFFFF 70%);
  border-top:1px solid #E8EEF6;
}
.why-c3-top{
  display:grid;
  gap:28px;
  align-items:center;
  margin-bottom:28px;
}
@media(min-width:900px){
  .why-c3-top{
    grid-template-columns:1.15fr .85fr;
    gap:36px;
  }
}
.why-c3-eyebrow{
  display:inline-block;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#1D5FBF;
  margin-bottom:8px;
}
.why-c3-copy h2{
  margin:0 0 14px;
  font-size:clamp(1.45rem,3vw,1.85rem);
  line-height:1.25;
  color:#0B2540;
  text-align:left;
}
.why-c3-markets{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 14px;
}
.why-c3-markets .mkt{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid #E5E9EF;
  font-size:12px;
  font-weight:650;
  color:#334155;
  box-shadow:0 2px 6px rgba(15,23,42,.03);
}
.mkt-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  flex-shrink:0;
}
.mkt-uae{background:linear-gradient(90deg,#00732F 33%,#fff 33% 66%,#FF0000 66%)}
.mkt-sa{background:#006C35}
.mkt-qa{background:#8A1538}
.mkt-kw{background:#007A3D}
.mkt-om{background:#C8102E}
.mkt-bh{background:#CE1126}
.mkt-pk{background:#01411C}

.why-c3-intro{
  margin:0;
  font-size:14.5px;
  line-height:1.65;
  color:#475569;
  max-width:540px;
}

.why-c3-visual{
  position:relative;
  min-height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.why-c3-skyline{
  position:absolute;
  bottom:12px;
  right:8%;
  width:70%;
  max-width:220px;
  opacity:.9;
  z-index:0;
}
.why-c3-cv-back{
  position:absolute;
  width:150px;
  height:190px;
  border-radius:14px;
  background:#EEF2FF;
  border:1px solid #E0E7FF;
  transform:rotate(8deg) translate(28px,8px);
  z-index:1;
  box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.why-c3-cv{
  position:relative;
  z-index:2;
  width:168px;
  background:#fff;
  border-radius:16px;
  border:1px solid #E5E9EF;
  box-shadow:0 16px 40px rgba(15,23,42,.1);
  padding:16px 14px;
  display:grid;
  grid-template-columns:44px 1fr;
  gap:12px;
  transform:rotate(-3deg);
}
.why-c3-cv-photo{
  width:44px;
  height:44px;
  border-radius:50%;
  background:linear-gradient(145deg,#BFDBFE,#93C5FD);
}
.why-c3-cv-lines{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-top:4px;
}
.why-c3-cv-lines .l{
  height:6px;
  border-radius:3px;
  background:#E2E8F0;
  width:100%;
}
.why-c3-cv-lines .l.wide{width:90%;height:8px;background:#CBD5E1}
.why-c3-cv-lines .l.mid{width:70%}
.why-c3-cv-lines .l.short{width:55%}
.why-c3-cv-lines .l.label{
  height:auto;
  background:transparent;
  font-size:9px;
  font-weight:700;
  color:#94A3B8;
  letter-spacing:.02em;
  margin-top:2px;
}

.why-c3-features{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
@media(min-width:600px){
  .why-c3-features{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:900px){
  .why-c3-features{grid-template-columns:repeat(4,1fr);gap:14px}
}
.why-c3-feat{
  background:#fff;
  border:1px solid #E8ECF2;
  border-radius:16px;
  padding:16px 14px;
  box-shadow:0 4px 14px rgba(15,23,42,.03);
  transition:transform .15s,box-shadow .15s;
}
.why-c3-feat:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(15,23,42,.07);
}
.why-c3-ic{
  width:40px;
  height:40px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:10px;
}
.why-c3-ic svg{width:20px;height:20px}
.why-c3-ic-blue{background:#E0EDFF;color:#1D5FBF}
.why-c3-ic-violet{background:#EDE9FE;color:#7C3AED}
.why-c3-ic-mint{background:#D1FAE5;color:#059669}
.why-c3-ic-purple{background:#F3E8FF;color:#6D28D9}
.why-c3-feat h3{
  margin:0 0 4px;
  font-size:14.5px;
  font-weight:750;
  color:#0B2540;
  text-align:left;
}
.why-c3-feat p{
  margin:0;
  font-size:12.5px;
  line-height:1.45;
  color:#64748b;
}
@media(max-width:899px){
  .why-c3-visual{min-height:180px;margin-top:4px}
}

/* Concept 4 decoration uses real illustration */
.tools-c4-deco{
  position:relative;
  width:auto;
  height:auto;
  margin:0;
  display:none;
  flex-shrink:0;
}
@media(min-width:900px){
  .tools-c4-deco{display:block}
}
.tools-c4-photo{
  display:block;
  width:min(220px,100%);
  height:auto;
  object-fit:contain;
}

/* Why section – Concept 2 style (no right CV stack, bluish bg, annotation) */
.why-c2{
  background:
    radial-gradient(ellipse 70% 60% at 100% 0%, #DBEAFE 0%, transparent 55%),
    radial-gradient(ellipse 50% 50% at 0% 100%, #EFF6FF 0%, transparent 50%),
    linear-gradient(180deg, #EEF5FF 0%, #F7FBFF 45%, #FFFFFF 100%) !important;
}
.why-c2-head{
  display:grid;
  gap:12px;
  margin-bottom:24px;
  align-items:start;
  position:relative;
}
@media(min-width:800px){
  .why-c2-head{
    grid-template-columns:1fr auto;
    gap:20px;
    align-items:start;
  }
}
.why-c2-copy h2{
  margin:0 0 14px;
  font-size:clamp(1.45rem,3vw,1.85rem);
  line-height:1.25;
  color:#0B2540;
  text-align:left;
}
.why-c2-note{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
  padding-top:8px;
  min-width:140px;
}
.why-c2-note-text{
  font-family:Georgia, "Times New Roman", serif;
  font-style:italic;
  font-size:1.05rem;
  font-weight:600;
  color:#1D5FBF;
  white-space:nowrap;
}
.why-c2-arrow{
  width:48px;
  height:36px;
  margin-right:8px;
}
@media(max-width:799px){
  .why-c2-note{
    align-items:flex-start;
    padding-top:0;
  }
}



/* ===== Beat the ATS – Concept 3 (full-blob cards, single arrows) ===== */
.ats-c3{
  position:relative;
  background:
    radial-gradient(ellipse 80% 60% at 0% 0%, rgba(167,243,208,.2) 0%, transparent 50%),
    radial-gradient(ellipse 70% 50% at 100% 10%, rgba(196,181,253,.2) 0%, transparent 50%),
    linear-gradient(180deg, #F6F4FF 0%, #F8FBFF 60%, #fff 100%);
  padding:44px 0 52px;
  overflow:hidden;
}
.ats-c3-head{
  text-align:center;
  margin:0 auto 32px;
  max-width:540px;
}
.ats-c3-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 0 10px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#818CF8;
}
.ats-c3-kicker .dot{
  width:5px;height:5px;border-radius:50%;background:#C4B5FD;
}
.ats-c3-head h2{
  margin:0 0 8px;
  font-size:clamp(1.45rem,3vw,1.85rem);
  color:#1E1B4B;
  font-weight:800;
  line-height:1.2;
}
.ats-c3-sub{
  margin:0;
  font-size:15px;
  color:#64748b;
  line-height:1.5;
}

/* Grid flow – no extra chevron nodes (avoids double arrows on wrap) */
.ats-c3-flow{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  align-items:stretch;
  max-width:1100px;
  margin:0 auto;
}
@media(min-width:640px){
  .ats-c3-flow{grid-template-columns:repeat(2,1fr);gap:16px}
}
@media(min-width:1000px){
  .ats-c3-flow{
    grid-template-columns:1.15fr repeat(4,1fr);
    gap:0 6px;
    align-items:center;
  }
}

/* Full-area soft blob = the card background itself */
.ats-c3-card{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  text-decoration:none;
  color:inherit;
  padding:22px 16px 20px;
  border:0;
  box-shadow:none;
  min-height:100%;
  transition:transform .15s ease;
  /* organic soft rounded shape covering ALL content */
  border-radius:40% 60% 50% 50% / 45% 40% 60% 55%;
}
.ats-c3-card:hover{transform:translateY(-2px)}

.ats-c3-hero{
  background:radial-gradient(ellipse 90% 90% at 50% 40%, #A7F3D0 0%, #D1FAE5 55%, #ECFDF5 100%);
  border-radius:48% 52% 50% 50% / 42% 48% 52% 58%;
  padding:24px 18px 22px;
}
@media(min-width:1000px){
  .ats-c3-hero{border-radius:42% 58% 48% 52% / 50% 42% 58% 50%}
}

.ats-c3-step.s1{background:transparent;}
.ats-c3-step.s2{background:transparent;}
.ats-c3-step.s3{background:transparent;}
.ats-c3-step.s4{background:transparent;}
.ats-c3-step{background:transparent;border-radius:0;}
/* Single arrow BETWEEN cards on large screens only (on the card, not a flex sibling) */
@media(min-width:1000px){
  .ats-c3-card:not(:last-child)::after{
    content:"›";
    position:absolute;
    right:-10px;
    top:50%;
    transform:translateY(-50%);
    font-size:22px;
    font-weight:300;
    color:#C4B5FD;
    line-height:1;
    pointer-events:none;
    z-index:2;
  }
}

/* Hide any leftover HTML chevrons */
.ats-c3-chev{display:none !important}

.ats-c3-badge{
  position:relative;
  width:76px;
  height:76px;
  margin:0 auto 12px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.ats-c3-ring{
  position:absolute;
  inset:0;
  border-radius:50%;
  background:conic-gradient(from 180deg,#059669,#34D399,#6EE7B7,#A7F3D0,#059669);
  box-shadow:0 0 0 5px rgba(167,243,208,.5);
}
.ats-c3-badge strong{
  position:relative;
  z-index:1;
  width:58px;
  height:58px;
  border-radius:50%;
  background:#064E3B;
  color:#ECFDF5;
  font-size:9.5px;
  font-weight:800;
  letter-spacing:.04em;
  line-height:1.15;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.ats-c3-hero h3{
  margin:0 0 8px;
  font-size:16px;
  font-weight:800;
  color:#1E1B4B;
}
.ats-c3-hero p{
  margin:0 0 14px;
  font-size:12.5px;
  line-height:1.5;
  color:#475569;
}
.ats-c3-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 16px;
  border-radius:999px;
  background:#10B981;
  color:#fff !important;
  font-size:12.5px;
  font-weight:700;
  text-decoration:none;
  margin-top:auto;
}
.ats-c3-cta:hover{background:#059669;color:#fff !important}

.ats-c3-top{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-bottom:10px;
}
.ats-c3-n{
  width:28px;
  height:28px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:800;
  color:#fff;
}
.ats-c3-ic{
  width:32px;
  height:32px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.7);
}
.ats-c3-ic svg{width:16px;height:16px}

.ats-c3-step h3{
  margin:0 0 6px;
  font-size:14px;
  font-weight:750;
  color:#1E1B4B;
  line-height:1.3;
}
.ats-c3-step p{
  margin:0 0 12px;
  font-size:12.5px;
  line-height:1.45;
  color:#64748b;
  flex:1;
}
.ats-c3-pill{
  display:inline-flex;
  padding:6px 12px;
  border-radius:999px;
  font-size:11.5px;
  font-weight:700;
  margin-top:auto;
}

.ats-c3-step.s1 .ats-c3-n{background:#10B981}
.ats-c3-step.s1 .ats-c3-ic{color:#059669}
.ats-c3-step.s1 .ats-c3-pill{background:#6EE7B7;color:#065F46}

.ats-c3-step.s2 .ats-c3-n{background:#3B82F6}
.ats-c3-step.s2 .ats-c3-ic{color:#2563EB}
.ats-c3-step.s2 .ats-c3-pill{background:#93C5FD;color:#1E3A8A}

.ats-c3-step.s3 .ats-c3-n{background:#F59E0B}
.ats-c3-step.s3 .ats-c3-ic{color:#B45309}
.ats-c3-step.s3 .ats-c3-pill{background:#FCD34D;color:#78350F}

.ats-c3-step.s4 .ats-c3-n{background:#8B5CF6}
.ats-c3-step.s4 .ats-c3-ic{color:#7C3AED}
.ats-c3-step.s4 .ats-c3-pill{background:#C4B5FD;color:#4C1D95}

/* Color only behind number + icon (top cluster) */
.ats-c3-step .ats-c3-top{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0 auto 12px;
  padding:14px 18px 16px;
  isolation:isolate;
}
.ats-c3-step .ats-c3-top::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:50% 50% 45% 55% / 55% 45% 55% 45%;
  opacity:1;
}
.ats-c3-step.s1 .ats-c3-top::before{
  background:radial-gradient(ellipse at 50% 50%, #A7F3D0 0%, #D1FAE5 60%, rgba(209,250,229,.4) 100%);
}
.ats-c3-step.s2 .ats-c3-top::before{
  background:radial-gradient(ellipse at 50% 50%, #BFDBFE 0%, #DBEAFE 60%, rgba(219,234,254,.4) 100%);
}
.ats-c3-step.s3 .ats-c3-top::before{
  background:radial-gradient(ellipse at 50% 50%, #FDE68A 0%, #FEF3C7 60%, rgba(254,243,199,.4) 100%);
}
.ats-c3-step.s4 .ats-c3-top::before{
  background:radial-gradient(ellipse at 50% 50%, #DDD6FE 0%, #EDE9FE 60%, rgba(237,233,254,.4) 100%);
}
.ats-c3-step h3,
.ats-c3-step p,
.ats-c3-step .ats-c3-pill{
  position:relative;
  z-index:1;
}


.home-blog-grid{
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}
@media(min-width:600px){
  .home-blog-grid{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:960px){
  .home-blog-grid{grid-template-columns:repeat(4,1fr)}
}
.home-blog-card h3{font-size:15px;margin-bottom:8px;line-height:1.35}
.home-blog-card p{font-size:13px;line-height:1.45;margin-bottom:12px}