/* Responsive refinements for Purposeful Money across desktop, tablets and phones. */
:root{color-scheme:light}html,body{max-width:100%;overflow-x:clip}img,svg{max-width:100%;height:auto}button,input,select{font-family:var(--pm-body-font, "DM Sans"),Arial,sans-serif}button,a,input,select{-webkit-tap-highlight-color:transparent}.site-shell{width:min(1180px,calc(100% - 48px))}.brand{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:95px;height:auto;padding:12px 0}.brand>a{min-width:0;flex:none}.brand .brand-wordmark{min-width:0}.brand .site-nav{margin-left:auto}.brand .site-nav a{min-height:44px}.member-session{display:flex;gap:9px;align-items:center;justify-content:flex-end;min-height:44px;flex-wrap:wrap}.member-session .session-link,.member-session .session-signout{border:1.5px solid var(--pm-black, #000000);border-radius:9px;padding:11px 13px;min-height:44px;background:var(--pm-white, #FFFFFF);text-decoration:none;cursor:pointer;color:var(--pm-black, #000000);font:800 12px var(--pm-body-font, "DM Sans"),sans-serif;white-space:nowrap}.member-session .session-link{background:var(--pm-mint, #20DCC0)}.member-session .session-name{color:#42544f;font-size:12px;font-weight:800;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.member-session .session-loading{font-size:11px;color:#697570}.hero{min-height:0}.hero-copy,.hero-product{min-width:0}.cover-frame img{height:auto}.calc-layout>*{min-width:0}.calculator-page .calc-hero{max-width:100%}.expense-row>span:first-child{min-width:0}.expense-row .money-field{flex:0 0 125px}.calc-form,.results-panel,.workbook-banner{min-width:0}.gate-prompt{border:2px solid var(--pm-black, #000000);border-radius:20px;background:#f2fffa;padding:clamp(24px,5vw,52px);margin:0 0 60px;max-width:100%;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}.gate-prompt .gate-kicker{font-size:11px;letter-spacing:1.5px;font-weight:800;color:#138f7b}.gate-prompt h2{font:clamp(30px,4vw,50px)/1.1 var(--pm-heading-font, "Chewy"),sans-serif;margin:10px 0}.gate-prompt p{font-size:14px;line-height:1.65;color:#445b53;max-width:660px;margin:0}.gate-links{display:flex;flex-direction:column;gap:10px;min-width:205px}.gate-links a{border:2px solid var(--pm-black, #000000);border-radius:11px;padding:15px 19px;text-decoration:none;font:800 13px var(--pm-body-font, "DM Sans"),sans-serif;text-align:center;color:var(--pm-black, #000000);min-height:50px}.gate-links a:first-child{background:var(--pm-mint, #20DCC0)}.gate-links a:last-child{background:var(--pm-white, #FFFFFF)}.gate-links a:hover{box-shadow:3px 3px 0 var(--pm-black, #000000)}.gate-loading{color:#51615a;font-size:14px;padding:25px 0}.calc-private[hidden],.gate-prompt[hidden]{display:none!important}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #119f88;outline-offset:3px}@media (min-width:1200px){.site-shell{width:min(1240px,calc(100% - 80px))}.hero{gap:60px}.calc-layout{gap:36px}.calculator-page .calc-hero{padding-top:82px}}@media(max-width:1100px){.calc-layout{grid-template-columns:1fr;max-width:820px;margin-inline:auto}.calculator-page .calc-hero{max-width:820px;margin-inline:auto}.results-panel{grid-row:auto}.gate-prompt{grid-template-columns:1fr;gap:20px}.gate-links{flex-direction:row}.gate-links a{flex:1}.hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:28px}.brand{flex-wrap:wrap}.brand .site-nav{margin-left:auto}}@media(min-width:821px) and (max-width:1050px){.hero h1{font-size:clamp(56px,6.7vw,78px)}.hero{padding:55px 0}.cover-frame{width:min(100%,300px)}.brand .brand-mascot{height:66px}}@media(max-width:820px){.site-shell{width:min(720px,calc(100% - 34px))}.brand{min-height:80px;gap:7px 14px;padding:9px 0 12px;justify-content:space-between}.brand .site-nav{order:3;flex:1 1 auto;margin-left:0;width:auto;gap:3px}.brand .site-nav a{font-size:11px;padding:10px}.member-session{order:2;margin-left:auto;min-width:0}.member-session .session-name{max-width:95px}.hero{grid-template-columns:1fr}.hero-product{display:none}.hero .mobile-cover{display:block;max-width:210px;margin-inline:auto}.calc-hero{padding-top:44px!important}.steps{grid-template-columns:1fr}.gate-prompt{margin-bottom:34px}}@media(max-width:520px){.site-shell{width:calc(100% - 28px)}.brand{gap:5px 9px}.brand>a{gap:5px}.brand .brand-mascot{height:47px}.brand a{font-size:clamp(16px,4.2vw,22px)}.brand .brand-wordmark{gap:.16em}.brand .site-nav{width:100%;order:3;justify-content:space-between}.brand .site-nav a{flex:1}.member-session .session-link,.member-session .session-signout{font-size:11px;padding:9px}.member-session .session-name{font-size:11px;max-width:70px}.hero{padding:35px 0}.hero h1{font-size:clamp(49px,12vw,64px)}.hero-detail{line-height:1.65}.steps{padding:23px 0}.calc-form{padding:20px 15px}.expense-row{gap:7px}.expense-row .money-field{flex-basis:112px;width:112px}.money-field input{font-size:13px}.calc-hero h1{font-size:clamp(45px,11vw,64px)}.gate-links{flex-direction:column;min-width:0}.gate-prompt{padding:22px 19px}.free-tool{padding:22px 17px}.primary-btn{min-height:56px}footer{padding-bottom:40px}}@media(max-width:350px){.brand .brand-mascot{height:41px}.brand>a{font-size:15px}.brand .member-session{gap:4px}.member-session .session-name{max-width:55px}.expense-row .money-field{flex-basis:104px;width:104px}.auth-name-row{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Purposeful Money heading + inline cart SVG */
.hero h1 { font-size: clamp(48px, 5.3vw, 72px); line-height: 1.045; }
.primary-btn svg.btn-cart-icon { display: block; flex: 0 0 28px; width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.primary-btn svg.btn-cart-icon circle { fill: currentColor; stroke: none; }
@media (max-width: 820px) { .hero h1 { font-size: clamp(44px, 8.4vw, 62px); } }
@media (max-width: 520px) { .hero h1 { font-size: clamp(40px, 10.2vw, 50px); } }

@media(min-width:821px) and (max-width:1100px){.brand .brand-mascot{height:54px}}
@media(max-width:820px){.brand .brand-mascot{height:45px}}
@media(max-width:350px){.brand .brand-mascot{height:38px}}

/* Give the mobile navigation its own breathing room below the logo, cart and member actions. */
@media (max-width: 820px) {
  .brand .site-nav {
    margin-top: 15px;
    padding-top: 3px;
  }
}

/* Budget calculator: reduce header-divider to first-section gap only. */
@media(min-width:821px){.calculator-page .calc-hero{padding-top:44px}}
@media(max-width:820px){.calculator-page .calc-hero{padding-top:25px!important}}

/* Match Toolkit hero top spacing to the Free Budget Calculator hero. */
@media(min-width:821px){#main > .hero{padding-top:44px}}
@media(max-width:820px){#main > .hero{padding-top:25px}}

/* Keep the approved Toolkit cover shadow and circular tick caption visible on mobile. */
@media(max-width:820px){
  .hero .mobile-cover{max-width:min(275px,100%);margin:25px auto 0;}
  .hero .mobile-cover>img{display:block;width:calc(100% - 15px);height:auto;margin:0 auto;box-shadow:13px 16px 0 rgba(32,220,192,.62);transform:rotate(2deg);}
  .hero .mobile-cover .frame-label{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:36px;font-size:10px;letter-spacing:.35px;white-space:nowrap;}
  .hero .mobile-cover .frame-label .check{flex:0 0 21px;}
}
