:root{
  --navy:#071d58;
  --blue:#1468ff;
  --blue-2:#1e8bff;
  --teal:#10b9a6;
  --purple:#6b21e8;
  --purple-2:#8b2cf5;
  --pink:#ff3e7c;
  --orange:#ff8a00;
  --green:#14ad68;
  --text:#10204e;
  --muted:#62708f;
  --line:#dfe7f3;
  --soft:#f5f9ff;
  --white:#fff;
  --max:1240px;
  --radius:24px;
  --shadow:0 18px 48px rgba(30,72,140,.12);
  --shadow-soft:0 8px 28px rgba(29,66,127,.09);
}
*{box-sizing:border-box}
/* Always honour the HTML hidden attribute. */
[hidden]{display:none!important}

html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:#fff;
  font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
button,input{font:inherit}
button{cursor:pointer}
.skip-link,.visually-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(1px,1px,1px,1px)!important;
  white-space:nowrap!important;
}
.skip-link:focus{
  width:auto!important;height:auto!important;clip:auto!important;
  left:12px;top:12px;padding:10px 14px;background:#fff;border-radius:10px;z-index:9999;
}
.icon-svg{width:24px;height:24px;display:block}
.eyebrow{
  margin:0 0 10px;
  color:var(--blue);
  font-weight:850;
  letter-spacing:.01em;
}
.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(9,44,105,.08);
}
.header-inner{
  max-width:var(--max);
  margin:auto;
  min-height:78px;
  padding:0 20px;
  display:flex;
  align-items:center;
  gap:28px;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:11px;
  text-decoration:none;
  min-width:max-content;
}
.brand-mascot{
  width:48px;height:48px;border-radius:50%;
  display:grid;place-items:center;
  color:#ffd324;
  font-size:24px;
  background:
    radial-gradient(circle at 34% 34%,#25a7ff 0 23%,transparent 24%),
    linear-gradient(145deg,#0c3aab,#111b72 62%,#6c25e9);
  border:3px solid #fff;
  box-shadow:0 8px 20px rgba(20,104,255,.24);
}
.brand-copy{display:grid;line-height:1}
.brand-name{font-size:22px;font-weight:950;letter-spacing:-.04em;color:var(--navy)}
.brand-name span{color:var(--purple)}
.brand-tagline{font-size:10px;color:#59688c;margin-top:6px}
.desktop-nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:6px;
}
.desktop-nav a{
  padding:27px 12px 24px;
  color:#24355e;
  font-weight:700;
  text-decoration:none;
  border-bottom:3px solid transparent;
}
.desktop-nav a:hover,.desktop-nav a.active{color:var(--blue);border-color:var(--blue)}
.header-actions{display:flex;align-items:center;gap:10px}
.icon-button,.newsletter-button,.menu-button{
  border:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.icon-button{
  width:46px;height:46px;border-radius:50%;
  color:var(--navy);background:#fff;
  box-shadow:0 5px 16px rgba(27,61,119,.12);
}
.newsletter-button{
  gap:8px;
  height:46px;
  padding:0 19px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg,var(--purple),var(--purple-2));
  text-decoration:none;
  font-weight:800;
  box-shadow:0 10px 24px rgba(107,33,232,.25);
}
.newsletter-button .icon-svg{width:19px}
.menu-button{display:none;background:none;color:var(--navy);gap:4px}
.menu-button span{width:22px;height:2px;background:currentColor;display:block}
.menu-button b{margin-left:6px}
.mobile-nav{background:#fff;border-top:1px solid var(--line);padding:8px 20px 16px}
.mobile-nav a{display:block;padding:12px 8px;text-decoration:none;font-weight:750}
.search-overlay{
  position:fixed;inset:0;z-index:1500;
  background:rgba(4,19,58,.58);
  backdrop-filter:blur(8px);
  display:grid;place-items:start center;
  padding:110px 18px 30px;
}
.search-dialog{
  position:relative;
  width:min(680px,100%);
  background:#fff;
  border-radius:28px;
  padding:32px;
  box-shadow:0 30px 90px rgba(0,0,0,.28);
}
.search-dialog h2{margin:0 0 20px;font-size:32px}
.search-close{
  position:absolute;right:16px;top:12px;border:0;background:none;
  font-size:34px;color:#6b7894;
}
.search-dialog form{display:flex;gap:10px}
.search-field{
  flex:1;display:flex;align-items:center;gap:10px;
  border:1px solid var(--line);padding:0 14px;border-radius:15px;
}
.search-field input{width:100%;border:0;outline:0;padding:14px 0;background:transparent}
.button{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border:0;border-radius:14px;padding:13px 19px;text-decoration:none;font-weight:850;
}
.button.primary{
  color:#fff;
  background:linear-gradient(135deg,var(--blue),var(--purple));
  box-shadow:0 10px 24px rgba(20,104,255,.2);
}
.button.secondary{
  color:var(--navy);background:#fff;border:2px solid #2b78f5;
}
.hero-section{
  overflow:hidden;
  background:
    radial-gradient(circle at 72% 20%,rgba(255,218,86,.26),transparent 15%),
    radial-gradient(circle at 30% 0,rgba(55,177,255,.23),transparent 28%),
    linear-gradient(180deg,#eef9ff 0,#dff3ff 48%,#e8fff0 100%);
}
.hero-inner{
  position:relative;
  max-width:var(--max);
  min-height:545px;
  margin:auto;
  padding:68px 20px 72px;
  display:grid;
  grid-template-columns:1.02fr .82fr .74fr;
  gap:28px;
  align-items:center;
}
.hero-inner:after{
  content:"";
  position:absolute;
  left:-12%;right:-12%;bottom:-120px;height:190px;
  background:
    radial-gradient(ellipse at 15% 20%,#78dba3 0 22%,transparent 23%),
    radial-gradient(ellipse at 40% 0,#a7e29a 0 26%,transparent 27%),
    radial-gradient(ellipse at 68% 12%,#65c692 0 25%,transparent 26%),
    radial-gradient(ellipse at 92% 0,#4fae7c 0 24%,transparent 25%);
  opacity:.75;
  pointer-events:none;
}
.hero-copy{position:relative;z-index:2}
.hero-copy h1{
  margin:0;
  color:var(--navy);
  font-size:clamp(48px,5.4vw,74px);
  line-height:.97;
  letter-spacing:-.055em;
  text-transform:none;
}
.hero-copy h1 span{color:var(--blue)}
.hero-lead{
  margin:20px 0 8px;
  color:#15295d;
  font-size:22px;
  font-weight:680;
}
.hero-support{max-width:610px;margin:0;color:#536488;font-size:17px}
.hero-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.hero-buttons .button{min-height:52px}
.hero-buttons .icon-svg{width:21px}
.trust-pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.trust-pills span{
  padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.94);
  box-shadow:0 5px 12px rgba(26,76,119,.08);
  color:#284064;font-size:13px;font-weight:750;
}
.wizard-stage{
  position:relative;
  z-index:2;
  height:400px;
  min-width:300px;
}
.wizard-hat{
  position:absolute;left:50%;top:30px;transform:translateX(-50%) rotate(-5deg);
  width:180px;height:150px;
  clip-path:polygon(49% 0,75% 58%,100% 82%,68% 80%,53% 100%,30% 80%,4% 84%,27% 59%);
  background:linear-gradient(145deg,#071c68,#063dba 56%,#112282);
  color:#ffd934;font-size:38px;display:grid;place-items:center;
  filter:drop-shadow(0 12px 15px rgba(8,33,97,.2));
}
.wizard-body{
  position:absolute;left:50%;bottom:5px;transform:translateX(-50%);
  width:230px;height:245px;border-radius:48% 48% 18% 18%;
  background:linear-gradient(145deg,#0e4cc1,#053485 60%,#101e70);
  box-shadow:0 18px 32px rgba(6,48,135,.25);
}
.wizard-body:before{
  content:"";position:absolute;left:45px;top:25px;width:140px;height:118px;
  border-radius:48% 48% 62% 62%;
  background:#fff;
  box-shadow:inset 0 -18px 0 #e6eff9;
}
.wizard-face{
  position:absolute;left:82px;top:48px;z-index:2;
  width:70px;height:55px;border-radius:46%;
  background:#ffd0a8;color:#06256a;font-size:34px;text-align:center;line-height:48px;font-weight:900;
}
.wizard-book{
  position:absolute;right:16px;bottom:55px;
  width:76px;height:94px;border-radius:10px;
  background:#0d2b68;color:#53e5ff;display:grid;place-items:center;
  font-size:40px;border:4px solid #8ec8ff;transform:rotate(-6deg);
}
.magic-orb{
  position:absolute;right:12px;top:52px;width:82px;height:82px;
  border-radius:50%;display:grid;place-items:center;
  background:#ffc414;color:#d78100;font-size:42px;font-weight:950;
  border:8px solid #fff1a6;
  box-shadow:0 0 0 8px rgba(255,194,20,.15),0 0 45px #ffd84c;
}
.sparkle{position:absolute;color:#ffbe19;font-size:34px}
.s1{left:12%;top:90px}.s2{right:10%;top:15px}.s3{right:25%;top:122px}
.problem-panel{
  position:relative;z-index:3;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(21,65,127,.1);
  border-radius:24px;
  padding:24px;
  box-shadow:var(--shadow);
}
.problem-panel h2{margin:0 0 16px;font-size:25px;line-height:1.12}
.problem-links{display:grid;gap:8px}
.problem-links a{
  display:grid;grid-template-columns:42px 1fr 18px;align-items:center;gap:10px;
  padding:10px 11px;border:1px solid #e2e8f3;border-radius:13px;
  text-decoration:none;background:#fff;transition:.18s ease;
}
.problem-links a:hover{transform:translateX(3px);border-color:#a8c9ff;box-shadow:0 7px 16px rgba(24,87,174,.08)}
.problem-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#edf5ff;color:var(--blue)}
.problem-links b{display:block;font-size:13px}
.problem-links small{display:block;color:#71809b;font-size:10px;margin-top:2px}
.problem-links strong{font-size:24px;color:var(--blue);font-weight:500}
.content-section{max-width:var(--max);margin:auto;padding:54px 20px}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:20px}
.section-heading h2{margin:2px 0 0;font-size:18px;font-weight:500;color:#6a7894}
.section-kicker{
  display:flex;align-items:center;gap:8px;margin:0;color:var(--navy);
  font-size:27px;font-weight:950;letter-spacing:-.03em;
}
.section-kicker .icon-svg{width:30px;height:30px;color:var(--blue)}
.section-link{font-weight:800;color:var(--blue);text-decoration:none;white-space:nowrap}
.calculator-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.calculator-card{
  --accent:var(--blue);
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:20px 13px 15px;min-height:255px;
  background:linear-gradient(180deg,#fff,rgba(245,249,255,.82));
  border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow-soft);
}
.calculator-card.accent-teal{--accent:var(--teal)}
.calculator-card.accent-orange{--accent:var(--orange)}
.calculator-card.accent-pink{--accent:var(--pink)}
.calculator-card.accent-purple{--accent:var(--purple)}
.calculator-card.accent-green{--accent:var(--green)}
.calculator-icon{
  width:78px;height:78px;border-radius:26px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--accent) 14%,white);color:var(--accent);
  margin-bottom:12px;
}
.calculator-icon .icon-svg{width:48px;height:48px;stroke-width:1.5}
.calculator-card h3{font-size:16px;line-height:1.15;margin:0 0 9px;color:var(--navy)}
.calculator-card p{font-size:12px;line-height:1.5;color:#63718f;margin:0 0 16px}
.calculator-card a{
  margin-top:auto;width:100%;padding:9px 10px;border-radius:999px;
  color:#fff;background:var(--accent);text-decoration:none;font-size:13px;font-weight:850;
  box-shadow:0 7px 15px color-mix(in srgb,var(--accent) 28%,transparent);
}
.articles-newsletter-grid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(310px,.75fr);gap:28px;align-items:start}
.compact-heading{margin-bottom:18px}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.article-card{overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-soft)}
.article-image{position:relative;display:block;aspect-ratio:1.55/1;overflow:hidden;background:#eaf3ff}
.article-image img{width:100%;height:100%;object-fit:cover}
.article-category{position:absolute;left:10px;bottom:9px;padding:4px 8px;border-radius:999px;background:var(--teal);color:#fff;font-size:10px;font-weight:800}
.article-content{padding:13px}
.article-content h3{margin:0 0 8px;font-size:14px;line-height:1.25}
.article-content h3 a{text-decoration:none}
.article-content p{font-size:12px;color:#65728e;margin:0 0 14px}
.article-meta{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:#71809d}
.article-meta a{color:var(--blue);font-weight:800;text-decoration:none}
.newsletter-card{
  position:relative;overflow:hidden;
  padding:32px 28px 27px;border-radius:22px;
  color:#fff;background:
    radial-gradient(circle at 88% 10%,rgba(55,207,255,.26),transparent 26%),
    linear-gradient(145deg,#5b21d7,#104ec5 68%,#0067ad);
  box-shadow:0 24px 48px rgba(41,49,168,.23);
}
.newsletter-card:after{
  content:"";position:absolute;right:-40px;bottom:-50px;width:180px;height:180px;
  border-radius:50%;border:1px solid rgba(255,255,255,.13)
}
.newsletter-icon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:rgba(255,255,255,.15);margin-bottom:15px}
.newsletter-card h2{font-size:26px;line-height:1.05;margin:0 0 15px}
.newsletter-card p{color:#dce8ff;font-size:14px}
.newsletter-sparkle{position:absolute;right:28px;top:24px;color:#ffdf35;font-size:30px}
.newsletter-form{display:grid;gap:10px;margin-top:18px;position:relative;z-index:2}
.newsletter-form>input[type=email]{width:100%;border:0;border-radius:999px;padding:14px 17px;outline:none;color:var(--text)}
.newsletter-form button{
  border:2px solid rgba(255,255,255,.86);border-radius:999px;padding:12px 17px;
  color:#fff;background:linear-gradient(90deg,#6c1eea,#8c2af2);
  font-weight:850;
}
.consent{display:flex;align-items:flex-start;gap:8px;font-size:11px;color:#e7efff}
.consent input{margin-top:2px}
.newsletter-card small{display:block;margin-top:14px;color:#cddcff}
.form-message{font-size:12px;font-weight:750;min-height:18px}
.form-message.success{color:#c8ffe1}
.form-message.error{color:#ffd0d8}
.hp-field{position:absolute!important;left:-10000px!important;opacity:0!important}
.why-section{display:grid;grid-template-columns:1fr 350px;gap:28px;align-items:center}
.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:center}
.benefit-icon{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;margin:0 auto 10px}
.benefit-icon .icon-svg{width:30px;height:30px}
.benefit-icon.pink{background:#ffe4ec;color:#ff4d7d}.benefit-icon.blue{background:#dcecff;color:#1670f6}
.benefit-icon.green{background:#d8f8e7;color:#13a565}.benefit-icon.purple{background:#eadfff;color:#6f28dd}
.benefit-grid h3{font-size:14px;margin:0 0 5px}.benefit-grid p{font-size:11px;color:#70809f;margin:0}
.quote-card{padding:28px;border:1px solid var(--line);border-radius:20px;text-align:center;box-shadow:var(--shadow-soft)}
.quote-mark{font-size:58px;color:#2d59a9;line-height:.5}
.quote-card p{font-style:italic;color:#38517f}.quote-card strong{font-size:12px;color:#6c7890}
.problem-journey{padding-top:35px}
.problem-journey .section-heading h2{font-size:33px;font-weight:950;color:var(--navy)}
.problem-journey .section-heading p:last-child{color:#6b7893;max-width:780px}
.journey-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.journey-card{
  display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px;
  padding:16px;border:1px solid var(--line);border-radius:17px;text-decoration:none;background:#fff;
  transition:.18s ease;
}
.journey-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-soft);border-color:#bcd5ff}
.journey-card>span{width:42px;height:42px;border-radius:12px;background:#edf5ff;color:var(--blue);display:grid;place-items:center}
.journey-card h3{font-size:13px;margin:0 0 3px}.journey-card p{font-size:10px;color:#72809a;margin:0}.journey-card strong{color:var(--blue)}
.education-note{
  display:flex;gap:8px;margin-top:10px;margin-bottom:40px;padding:16px 18px;
  border-radius:14px;background:#fff8df;color:#594a14;font-size:13px;
}
.journey-cta{
  position:relative;overflow:hidden;
  max-width:calc(var(--max) - 40px);margin:25px auto 0;
  min-height:175px;padding:30px 32px;
  border-radius:24px 24px 0 0;
  display:flex;align-items:center;justify-content:center;text-align:center;
  background:
    radial-gradient(ellipse at 20% 100%,#70b966 0 20%,transparent 21%),
    radial-gradient(ellipse at 82% 110%,#3e8c62 0 27%,transparent 28%),
    linear-gradient(180deg,#fff0db,#d6edff);
}
.journey-cta h2{margin:0;color:var(--navy);font-size:31px}.journey-cta p{margin:3px 0 16px;color:#64728e}
.journey-sign{position:absolute;left:60px;bottom:6px;display:grid;gap:4px;transform:rotate(-2deg)}
.journey-sign span{padding:5px 22px;background:#9d542d;color:#fff;font-weight:800;border-radius:3px}
.site-footer{background:linear-gradient(135deg,#082f75,#003b85 55%,#004daa);color:#fff}
.footer-grid{
  max-width:var(--max);margin:auto;padding:38px 20px;
  display:grid;grid-template-columns:1.35fr .8fr .8fr .8fr 1.3fr;gap:28px;
}
.brand-footer .brand-name{color:#fff}.brand-footer .brand-tagline{color:#c9dcff}
.footer-brand p,.footer-grid p{color:#c7d7f3;font-size:12px}
.footer-grid h3{font-size:13px;margin:0 0 10px}.footer-grid>div>a{display:block;color:#d9e7ff;text-decoration:none;font-size:12px;padding:3px 0}
.footer-subscribe{display:grid;grid-template-columns:1fr auto;gap:0}
.footer-subscribe>input[type=email]{min-width:0;border:0;padding:10px 12px;border-radius:999px 0 0 999px}
.footer-subscribe>button{border:0;padding:10px 12px;border-radius:0 999px 999px 0;background:#1672f8;color:#fff}
.footer-subscribe .consent,.footer-subscribe .form-message{grid-column:1/-1;margin-top:8px}
.consent.compact{font-size:10px}
.footer-bottom{
  max-width:var(--max);margin:auto;padding:15px 20px 22px;border-top:1px solid rgba(255,255,255,.14);
  display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#aecdff;font-size:10px;
}
.footer-legal{display:flex;gap:14px}.footer-legal a{color:inherit;text-decoration:none}
.inner-page{min-height:70vh}
.page-hero{
  max-width:var(--max);margin:auto;padding:70px 20px 40px;text-align:center;
  background:radial-gradient(circle at 50% 0,#e6f4ff,transparent 65%);
}
.page-hero.small{max-width:900px}
.page-hero h1{font-size:clamp(42px,6vw,64px);line-height:1;margin:0 0 16px;color:var(--navy);letter-spacing:-.045em}
.page-hero p:not(.eyebrow){max-width:760px;margin:0 auto;color:#64728d;font-size:18px}
.page-hero-icon{width:72px;height:72px;margin:0 auto 15px;border-radius:22px;background:#eaf3ff;color:var(--blue);display:grid;place-items:center}
.page-hero-icon .icon-svg{width:38px;height:38px}
.guide-index-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}
.guide-index-card{
  display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:14px;
  padding:22px;border:1px solid var(--line);border-radius:20px;text-decoration:none;box-shadow:var(--shadow-soft)
}
.guide-index-card>span{width:58px;height:58px;border-radius:17px;background:#ecf4ff;color:var(--blue);display:grid;place-items:center}
.guide-index-card h2{font-size:20px;margin:0 0 4px}.guide-index-card p{margin:0;color:#6a7893;font-size:13px}.guide-index-card strong{color:var(--blue)}
.guide-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start}
.guide-copy{font-size:17px;line-height:1.75}
.guide-copy h2{margin-top:38px;color:var(--navy);font-size:29px}
.guide-copy h3{color:var(--navy)}
.guide-copy a{color:var(--blue);font-weight:700}
.next-step-box{padding:22px;border-radius:20px;background:linear-gradient(135deg,#eef8ff,#f5efff);border:1px solid #d9e6ff}
.next-step-box span{font-weight:850;color:var(--purple);font-size:12px;text-transform:uppercase}
.next-step-box h2{margin:5px 0 6px}.next-step-box p{margin:0}
.guide-sidebar{display:grid;gap:18px;position:sticky;top:100px}
.sidebar-card{padding:20px;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-soft)}
.sidebar-card h2{margin:0 0 12px;font-size:21px}
.sidebar-card>a{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;padding:12px 0;text-decoration:none;border-top:1px solid #edf1f7}
.sidebar-card>a>span{width:40px;height:40px;border-radius:11px;background:#eff5ff;color:var(--blue);display:grid;place-items:center}
.sidebar-card strong{display:block;font-size:12px}.sidebar-card small{display:block;color:#77849c;font-size:10px}.sidebar-card b{color:var(--blue)}
.article-links>a{grid-template-columns:1fr auto}
.empty-state{padding:30px;border:1px dashed #cbd8eb;border-radius:18px;background:#f8fbff}

@media(max-width:1100px){
  .desktop-nav{display:none}.menu-button{display:grid}.newsletter-button span{display:none}.newsletter-button{width:46px;padding:0}
  .hero-inner{grid-template-columns:1fr 1fr}.problem-panel{grid-column:1/-1;display:grid;grid-template-columns:220px 1fr;align-items:start}
  .problem-links{grid-template-columns:repeat(5,1fr)}.problem-links a{grid-template-columns:38px 1fr}.problem-links strong,.problem-links small{display:none}
  .calculator-grid{grid-template-columns:repeat(3,1fr)}.article-grid{grid-template-columns:repeat(3,1fr)}
  .journey-grid{grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:1.4fr repeat(3,1fr)}.footer-grid>div:last-child{grid-column:1/-1}
}
@media(max-width:820px){
  .hero-inner{grid-template-columns:1fr;padding-top:48px}.wizard-stage{display:none}.problem-panel{grid-column:auto;display:block}
  .problem-links{grid-template-columns:1fr 1fr}
  .articles-newsletter-grid,.why-section,.guide-layout{grid-template-columns:1fr}
  .newsletter-card{max-width:none}.guide-sidebar{position:static}
  .benefit-grid{grid-template-columns:repeat(2,1fr)}
  .journey-grid{grid-template-columns:1fr 1fr}
  .guide-index-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:last-child{grid-column:1/-1}
}
@media(max-width:600px){
  .header-inner{min-height:66px;padding:0 14px}.brand-mascot{width:40px;height:40px}.brand-name{font-size:19px}.brand-tagline{font-size:8px}
  .icon-button{display:none}.hero-inner{padding:36px 14px 48px}.hero-copy h1{font-size:48px}
  .hero-lead{font-size:19px}.hero-support{font-size:15px}.hero-buttons .button{width:100%}
  .problem-links{grid-template-columns:1fr}.problem-links small{display:block}
  .content-section{padding:42px 14px}.section-heading{align-items:flex-start;flex-direction:column}
  .section-kicker{font-size:24px}.calculator-grid,.article-grid,.journey-grid{grid-template-columns:1fr}
  .calculator-card{min-height:auto}.calculator-icon{width:64px;height:64px}.calculator-icon .icon-svg{width:38px}
  .benefit-grid{grid-template-columns:1fr 1fr;gap:28px 12px}
  .journey-cta{margin:0 14px;min-height:200px}.journey-sign{display:none}
  .footer-grid{grid-template-columns:1fr}.footer-grid>div:last-child{grid-column:auto}
  .footer-bottom{display:grid}
  .search-dialog form{display:grid}
}


/* ==========================================================================
   Budget Wizard Enterprise Homepage v4
   ========================================================================== */

[hidden]{display:none!important}

/* Header / real logo */
.header-inner{
  min-height:82px;
}

.brand-image-link{
  flex:0 0 auto;
  min-width:0;
}

.header-logo{
  display:block;
  width:235px;
  height:auto;
  max-height:64px;
  object-fit:contain;
  object-position:left center;
}

.brand-image-link .brand-mascot,
.brand-image-link .brand-copy{
  display:none!important;
}

/* Hero — scenic background plus foreground wizard */
.hero-section{
  position:relative;
  isolation:isolate;
  background:
    linear-gradient(
      90deg,
      rgba(246,251,255,.98) 0%,
      rgba(246,251,255,.92) 28%,
      rgba(238,248,255,.68) 46%,
      rgba(229,246,255,.18) 67%,
      rgba(229,246,255,.06) 100%
    ),
    var(--hero-background) center center / cover no-repeat;
}

.hero-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at 69% 17%,rgba(255,216,70,.25),transparent 15%),
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(21,100,175,.04));
  pointer-events:none;
}

.hero-inner{
  min-height:570px;
  padding-top:58px;
  padding-bottom:58px;
  grid-template-columns:minmax(500px,1.08fr) minmax(330px,.72fr) minmax(290px,.62fr);
  gap:26px;
}

.hero-inner::after{
  display:none;
}

.hero-copy{
  max-width:630px;
}

.hero-eyebrow-row,
.section-kicker-row,
.problem-title-row{
  display:flex;
  align-items:center;
  gap:10px;
}

.hero-copy h1{
  margin:8px 0 0;
  font-size:clamp(54px,5vw,74px);
  line-height:.96;
  letter-spacing:-.055em;
  text-transform:none;
}

.hero-title-line{
  display:block;
  white-space:nowrap;
  color:var(--navy);
}

.hero-title-accent{
  color:var(--blue);
}

.hero-lead{
  max-width:590px;
  font-size:20px;
  line-height:1.35;
}

.hero-support{
  max-width:585px;
  line-height:1.62;
}

.wizard-stage.wizard-stage-image{
  position:relative;
  min-width:0;
  height:470px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:visible;
}

.wizard-stage.wizard-stage-image .hero-wizard-image{
  display:block;
  width:auto;
  max-width:100%;
  height:465px;
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 22px 24px rgba(7,29,88,.22));
}

/* Tooltip disclaimer */
.info-tip{
  position:relative;
  display:inline-flex;
  flex:0 0 auto;
}

.info-tip-button{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border:1.5px solid #2d71ee;
  border-radius:50%;
  padding:0;
  color:#1559d8;
  background:#fff;
  font:800 13px/1 system-ui,-apple-system,"Segoe UI",sans-serif;
  box-shadow:0 4px 12px rgba(20,104,255,.10);
}

.info-tip-popover{
  position:absolute;
  left:50%;
  bottom:calc(100% + 12px);
  z-index:1200;
  width:310px;
  padding:15px 16px;
  border-radius:13px;
  background:#10203d;
  color:#f8fbff;
  font-size:12px;
  line-height:1.55;
  box-shadow:0 18px 42px rgba(3,15,41,.28);
  transform:translate(-50%,8px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
}

.info-tip-popover::after{
  content:"";
  position:absolute;
  top:100%;
  left:50%;
  border:7px solid transparent;
  border-top-color:#10203d;
  transform:translateX(-50%);
}

.info-tip-popover strong{
  display:block;
  margin-bottom:3px;
  color:#ffd84a;
}

.info-tip:hover .info-tip-popover,
.info-tip:focus-within .info-tip-popover{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0);
  pointer-events:auto;
}

/* Problem-led guidance */
.problem-journey{
  padding-top:52px;
  padding-bottom:24px;
}

.problem-journey-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:32px;
  margin-bottom:24px;
}

.problem-journey-head h2{
  max-width:820px;
  margin:7px 0 7px;
  color:var(--navy);
  font-size:clamp(29px,3.3vw,43px);
  line-height:1.05;
  letter-spacing:-.045em;
}

.problem-journey-head p:not(.section-kicker){
  max-width:780px;
  margin:0;
  color:#697793;
}

.problem-card-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:14px;
}

.problem-guide-card{
  --problem-accent:#1468ff;
  position:relative;
  min-height:255px;
  padding:23px 18px 18px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  border:1px solid #dce5f2;
  border-radius:20px;
  background:
    radial-gradient(circle at 50% -15%,color-mix(in srgb,var(--problem-accent) 10%,transparent),transparent 45%),
    #fff;
  box-shadow:0 10px 28px rgba(25,65,125,.08);
  text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.problem-guide-card::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:4px;
  background:var(--problem-accent);
}

.problem-guide-card:hover{
  transform:translateY(-4px);
  border-color:color-mix(in srgb,var(--problem-accent) 35%,#dce5f2);
  box-shadow:0 18px 40px rgba(25,65,125,.13);
}

.problem-accent-purple{--problem-accent:#6b21e8}
.problem-accent-green{--problem-accent:#10a875}
.problem-accent-orange{--problem-accent:#f57b10}
.problem-accent-teal{--problem-accent:#0da9c2}

.problem-guide-icon{
  width:78px;
  height:78px;
  margin-bottom:16px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:var(--problem-accent);
  background:color-mix(in srgb,var(--problem-accent) 12%,white);
  border:1px solid color-mix(in srgb,var(--problem-accent) 22%,white);
  box-shadow:0 10px 24px color-mix(in srgb,var(--problem-accent) 12%,transparent);
}

.problem-guide-icon .icon-svg{
  width:39px;
  height:39px;
  stroke-width:1.65;
}

.problem-guide-copy h3{
  margin:0 0 8px;
  color:var(--navy);
  font-size:18px;
  line-height:1.15;
  letter-spacing:-.02em;
}

.problem-guide-copy p{
  margin:0;
  color:#687690;
  font-size:13px;
  line-height:1.48;
}

.problem-guide-cta{
  width:38px;
  height:38px;
  margin-top:auto;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:var(--problem-accent);
  font-size:19px;
  box-shadow:0 9px 20px color-mix(in srgb,var(--problem-accent) 27%,transparent);
}

/* Quote stars */
.quote-stars{
  display:flex;
  justify-content:center;
  gap:3px;
  margin:10px 0 8px;
  color:#ffb800;
  font-size:22px;
  line-height:1;
}

/* Financial journey — one image, centered text */
.financial-journey-visual{
  position:relative;
  max-width:1200px;
  min-height:315px;
  margin:24px auto 58px;
  overflow:hidden;
  border-radius:28px;
  background:#d9eaff;
  box-shadow:0 22px 55px rgba(20,62,124,.16);
  isolation:isolate;
}

.financial-journey-visual > img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

.financial-journey-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at center,rgba(5,25,72,.20),rgba(5,25,72,.08) 42%,rgba(5,25,72,.23) 100%),
    linear-gradient(180deg,rgba(5,25,72,.05),rgba(5,25,72,.16));
}

.financial-journey-overlay{
  position:relative;
  z-index:2;
  min-height:315px;
  max-width:760px;
  margin:0 auto;
  padding:44px 28px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
  text-shadow:0 3px 22px rgba(5,25,72,.38);
}

.financial-journey-overlay h2{
  margin:5px 0 9px;
  max-width:700px;
  color:#fff;
  font-size:clamp(36px,4.4vw,55px);
  line-height:.98;
  letter-spacing:-.045em;
}

.financial-journey-overlay p{
  max-width:650px;
  margin:0 0 20px;
  color:rgba(255,255,255,.96);
  font-size:16px;
  font-weight:620;
}

.journey-label{
  padding:7px 12px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:999px;
  background:rgba(7,29,88,.28);
  backdrop-filter:blur(8px);
  font-size:12px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.journey-button{
  min-width:175px;
  color:#145bdc!important;
  background:#fff!important;
  text-shadow:none;
  box-shadow:0 10px 25px rgba(5,25,72,.20)!important;
}

/* Remove any legacy visible disclaimer and legacy duplicate journey CTA */
.education-note,
.journey-cta{
  display:none!important;
}

/* Professional section rhythm */
.calculators-section{
  padding-top:46px;
}

.articles-newsletter-grid{
  padding-top:44px;
}

.why-section{
  padding-top:38px;
}

@media(max-width:1180px){
  .hero-inner{
    grid-template-columns:minmax(430px,1fr) minmax(280px,.72fr);
  }

  .problem-panel{
    grid-column:1/-1;
  }

  .problem-card-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

@media(max-width:820px){
  .header-logo{
    width:205px;
  }

  .hero-section{
    background-position:62% center;
  }

  .hero-inner{
    grid-template-columns:1fr;
  }

  .hero-copy{
    max-width:650px;
  }

  .wizard-stage.wizard-stage-image{
    display:flex!important;
    height:330px;
  }

  .wizard-stage.wizard-stage-image .hero-wizard-image{
    height:325px;
  }

  .problem-panel{
    grid-column:auto;
  }

  .problem-card-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .problem-journey-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .info-tip-popover{
    left:auto;
    right:-12px;
    transform:translateY(8px);
  }

  .info-tip-popover::after{
    left:auto;
    right:17px;
    transform:none;
  }

  .info-tip:hover .info-tip-popover,
  .info-tip:focus-within .info-tip-popover{
    transform:translateY(0);
  }
}

@media(max-width:600px){
  .header-logo{
    width:178px;
  }

  .hero-section{
    background:
      linear-gradient(180deg,rgba(247,252,255,.96) 0%,rgba(247,252,255,.90) 46%,rgba(234,247,255,.48) 100%),
      var(--hero-background) 62% center / cover no-repeat;
  }

  .hero-copy h1{
    font-size:clamp(42px,12vw,56px);
  }

  .hero-title-line{
    white-space:normal;
  }

  .wizard-stage.wizard-stage-image{
    height:285px;
  }

  .wizard-stage.wizard-stage-image .hero-wizard-image{
    height:280px;
  }

  .problem-card-grid{
    grid-template-columns:1fr;
  }

  .problem-guide-card{
    min-height:0;
    display:grid;
    grid-template-columns:64px 1fr 38px;
    align-items:center;
    text-align:left;
    gap:14px;
  }

  .problem-guide-icon{
    width:62px;
    height:62px;
    margin:0;
  }

  .problem-guide-icon .icon-svg{
    width:32px;
    height:32px;
  }

  .problem-guide-cta{
    margin:0;
  }

  .financial-journey-visual{
    margin-left:14px;
    margin-right:14px;
    min-height:365px;
    border-radius:22px;
  }

  .financial-journey-overlay{
    min-height:365px;
    padding:35px 20px;
  }

  .financial-journey-overlay h2{
    font-size:38px;
  }
}


/* ==========================================================================
   Budget Wizard v5 refinements
   ========================================================================== */

/* Real logo in both header and footer */
.header-logo{
  width:230px;
  max-height:62px;
  object-fit:contain;
  object-position:left center;
}

.footer-logo-link{
  display:inline-block;
  max-width:220px;
  margin-bottom:12px;
}

.footer-logo{
  display:block;
  width:210px;
  height:auto;
  max-height:74px;
  object-fit:contain;
  object-position:left center;
  background:#fff;
  border-radius:12px;
  padding:5px 8px;
}

/* Hero background supplied separately from the wizard image */
.hero-section{
  background:
    linear-gradient(
      90deg,
      rgba(246,251,255,.98) 0%,
      rgba(246,251,255,.93) 28%,
      rgba(238,248,255,.74) 45%,
      rgba(229,246,255,.18) 68%,
      rgba(229,246,255,.05) 100%
    ),
    var(--hero-background) center center / cover no-repeat;
}

.hero-section::before{
  background:
    radial-gradient(circle at 68% 20%,rgba(255,218,75,.17),transparent 17%),
    linear-gradient(180deg,rgba(255,255,255,.02),rgba(18,78,148,.03));
}

/* Small hover/focus information icon only */
.info-tip-button{
  width:23px;
  height:23px;
  border:1.5px solid #245fd6;
  color:#174fb8;
  background:#fff;
  font-size:12px;
  box-shadow:0 3px 10px rgba(16,64,151,.10);
}

.info-tip-popover{
  width:300px;
  border:1px solid rgba(255,255,255,.10);
  background:#0d1d39;
  box-shadow:0 20px 45px rgba(3,15,41,.34);
}

.info-tip-popover strong{
  color:#ffd84a;
}

/* No large disclaimer banner */
.education-note{
  display:none!important;
}

/* No duplicate legacy journey CTA from footer */
.journey-cta{
  display:none!important;
}

/* Single journey image directly above footer */
.financial-journey-visual{
  position:relative;
  width:min(1200px,calc(100% - 40px));
  min-height:360px;
  margin:35px auto 0;
  overflow:hidden;
  border-radius:30px 30px 0 0;
  background:#dbeaff;
  box-shadow:0 20px 55px rgba(15,56,115,.15);
  isolation:isolate;
}

.financial-journey-visual > img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
}

.financial-journey-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(
      ellipse at center,
      rgba(5,25,72,.14) 0%,
      rgba(5,25,72,.22) 48%,
      rgba(5,25,72,.36) 100%
    );
}

.financial-journey-overlay{
  position:relative;
  z-index:2;
  min-height:360px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:36px 22px;
  text-align:center;
}

.journey-centred-box{
  width:min(650px,92%);
  padding:30px 34px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border:1px solid rgba(255,255,255,.28);
  border-radius:24px;
  background:rgba(7,29,88,.43);
  backdrop-filter:blur(8px);
  box-shadow:0 18px 45px rgba(4,18,55,.20);
  color:#fff;
}

.journey-centred-box .journey-label{
  margin:0 0 10px;
  color:#fff;
}

.journey-centred-box h2{
  margin:0;
  max-width:560px;
  color:#fff;
  font-size:clamp(34px,4.6vw,54px);
  line-height:1;
  letter-spacing:-.045em;
  text-shadow:0 3px 20px rgba(4,18,55,.35);
}

.journey-centred-box p{
  max-width:560px;
  margin:13px auto 18px;
  color:rgba(255,255,255,.94);
  font-size:16px;
  line-height:1.55;
}

.journey-steps{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 19px;
}

.journey-steps span{
  min-width:82px;
  padding:8px 14px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:999px;
  background:rgba(255,255,255,.13);
  color:#fff;
  font-size:13px;
  font-weight:850;
  text-align:center;
}

.journey-button{
  margin:0 auto;
  color:#145bdc!important;
  background:#fff!important;
  text-shadow:none!important;
}

/* Make footer sit directly under the journey image */
.site-footer{
  margin-top:0;
}

@media(max-width:820px){
  .header-logo{
    width:205px;
  }

  .hero-section{
    background:
      linear-gradient(
        180deg,
        rgba(247,252,255,.97) 0%,
        rgba(247,252,255,.92) 42%,
        rgba(234,247,255,.58) 100%
      ),
      var(--hero-background) 64% center / cover no-repeat;
  }

  .financial-journey-visual{
    width:calc(100% - 28px);
    min-height:390px;
    border-radius:24px 24px 0 0;
  }

  .financial-journey-overlay{
    min-height:390px;
    padding:26px 16px;
  }

  .journey-centred-box{
    padding:26px 22px;
  }
}

@media(max-width:600px){
  .header-logo{
    width:178px;
  }

  .footer-logo{
    width:190px;
  }

  .financial-journey-visual{
    min-height:420px;
  }

  .financial-journey-overlay{
    min-height:420px;
  }

  .journey-centred-box h2{
    font-size:38px;
  }

  .journey-centred-box p{
    font-size:14px;
  }
}


/* ==========================================================================
   Budget Wizard v6 refinements
   ========================================================================== */

/* Tooltip must sit above every other site layer */
.hero-section,
.content-section,
.problem-journey,
.section-heading,
.hero-copy{
  overflow:visible;
}

.hero-section{
  isolation:auto;
}

.info-tip{
  position:relative;
  z-index:2147483600;
}

.info-tip:hover,
.info-tip:focus-within{
  z-index:2147483646;
}

.info-tip-popover{
  z-index:2147483647 !important;
}

/* Footer newsletter: less pill-like, more premium wizard aesthetic */
.footer-grid > div:last-child{
  padding:18px;
  border:1px solid rgba(157,196,255,.20);
  border-radius:14px;
  background:
    radial-gradient(circle at 92% 8%,rgba(255,210,48,.12),transparent 27%),
    linear-gradient(145deg,rgba(255,255,255,.07),rgba(96,59,221,.10));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}

.footer-grid > div:last-child h3{
  margin-bottom:5px;
  font-size:15px;
  letter-spacing:-.01em;
}

.footer-grid > div:last-child > p{
  margin-top:0;
  margin-bottom:13px;
}

.footer-subscribe{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
}

.footer-subscribe > input[type=email]{
  min-width:0;
  min-height:42px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:8px;
  outline:none;
  color:#10204e;
  background:#fff;
  box-shadow:0 5px 14px rgba(3,24,70,.12);
}

.footer-subscribe > input[type=email]:focus{
  border-color:#8dc2ff;
  box-shadow:0 0 0 3px rgba(44,132,255,.18);
}

.footer-subscribe > button{
  position:relative;
  min-height:42px;
  padding:10px 16px 10px 35px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  border-radius:8px;
  color:#fff;
  background:
    linear-gradient(135deg,#155ee8 0%,#5630d8 56%,#7f2ae7 100%);
  font-weight:850;
  letter-spacing:.01em;
  box-shadow:
    0 8px 20px rgba(26,37,157,.28),
    inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .15s ease,box-shadow .15s ease;
}

.footer-subscribe > button::before{
  content:"✦";
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-53%);
  color:#ffd84a;
  font-size:16px;
  text-shadow:0 0 12px rgba(255,216,74,.65);
}

.footer-subscribe > button:hover{
  transform:translateY(-1px);
  box-shadow:
    0 11px 25px rgba(26,37,157,.34),
    inset 0 1px 0 rgba(255,255,255,.20);
}

.footer-subscribe .consent,
.footer-subscribe .form-message{
  grid-column:1/-1;
  margin-top:5px;
}

.footer-subscribe .consent.compact{
  color:#d5e3fb;
  font-size:10px;
}

/* Financial journey title: smaller and materially lighter */
.journey-centred-box h2{
  max-width:560px;
  font-size:clamp(28px,3.2vw,40px);
  line-height:1.06;
  font-weight:620;
  letter-spacing:-.028em;
}

.journey-centred-box p{
  max-width:525px;
}

/* Keep all journey overlay content centred */
.financial-journey-overlay,
.journey-centred-box,
.journey-steps{
  text-align:center;
}

@media(max-width:600px){
  .footer-subscribe{
    grid-template-columns:1fr;
  }

  .footer-subscribe > button{
    width:100%;
  }

  .journey-centred-box h2{
    font-size:30px;
  }
}


/* ==========================================================================
   Budget Wizard v7 - wider footer newsletter
   ========================================================================== */

/*
|--------------------------------------------------------------------------
| Give "Stay in the loop" more room
|--------------------------------------------------------------------------
*/
.footer-grid{
  grid-template-columns:
    minmax(190px,1.25fr)
    minmax(105px,.62fr)
    minmax(105px,.62fr)
    minmax(105px,.62fr)
    minmax(330px,1.75fr);
  gap:24px;
  align-items:start;
}

/*
|--------------------------------------------------------------------------
| Newsletter panel
|--------------------------------------------------------------------------
*/
.footer-grid > div:last-child{
  padding:22px;
  border-radius:16px;
}

.footer-grid > div:last-child h3{
  margin:0 0 5px;
  font-size:17px;
}

.footer-grid > div:last-child > p{
  margin:0 0 15px;
  max-width:390px;
  font-size:12px;
  line-height:1.5;
}

/*
|--------------------------------------------------------------------------
| Email field now gets its own full-width row
|--------------------------------------------------------------------------
*/
.footer-subscribe{
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
  width:100%;
}

.footer-subscribe > input[type=email]{
  width:100%;
  min-width:0;
  min-height:48px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:9px;
  font-size:14px;
  color:#10204e;
  background:#fff;
  box-shadow:
    0 7px 18px rgba(3,24,70,.14),
    inset 0 1px 0 rgba(255,255,255,.7);
}

.footer-subscribe > input[type=email]::placeholder{
  color:#7a869e;
}

.footer-subscribe > input[type=email]:focus{
  border-color:#9dccff;
  outline:none;
  box-shadow:
    0 0 0 3px rgba(44,132,255,.19),
    0 8px 20px rgba(3,24,70,.15);
}

/*
|--------------------------------------------------------------------------
| Wizard-styled subscribe button
|--------------------------------------------------------------------------
*/
.footer-subscribe > button{
  width:100%;
  min-height:46px;
  padding:11px 18px 11px 42px;
  border-radius:9px;
  font-size:13px;
  justify-self:stretch;
  letter-spacing:.01em;
}

.footer-subscribe > button::before{
  left:17px;
  font-size:18px;
}

.footer-subscribe .consent,
.footer-subscribe .form-message{
  grid-column:1;
  width:100%;
}

.footer-subscribe .consent.compact{
  margin-top:1px;
  line-height:1.4;
}

/*
|--------------------------------------------------------------------------
| Medium screens: newsletter takes a full footer row
|--------------------------------------------------------------------------
*/
@media(max-width:1180px){
  .footer-grid{
    grid-template-columns:1.35fr repeat(3,1fr);
  }

  .footer-grid > div:last-child{
    grid-column:1/-1;
    width:100%;
    max-width:none;
  }

  .footer-grid > div:last-child > p{
    max-width:620px;
  }

  .footer-subscribe{
    grid-template-columns:minmax(0,1fr) 190px;
    align-items:start;
  }

  .footer-subscribe > input[type=email]{
    min-height:48px;
  }

  .footer-subscribe > button{
    min-height:48px;
  }

  .footer-subscribe .consent,
  .footer-subscribe .form-message{
    grid-column:1/-1;
  }
}

/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/
@media(max-width:720px){
  .footer-grid{
    grid-template-columns:1fr 1fr;
  }

  .footer-grid > div:last-child{
    grid-column:1/-1;
  }

  .footer-subscribe{
    grid-template-columns:1fr;
  }

  .footer-subscribe > button{
    width:100%;
  }
}

@media(max-width:520px){
  .footer-grid{
    grid-template-columns:1fr;
  }

  .footer-grid > div:last-child{
    grid-column:auto;
    padding:18px;
  }

  .footer-subscribe > input[type=email]{
    min-height:50px;
    font-size:16px;
  }

  .footer-subscribe > button{
    min-height:48px;
  }
}
