/* btg-free.css: the shared look of the free study pages, each a CMS page on template 15 whose content is one <div id="bf">:
   /mba/free-gmat-prep-flashcards (content 40, docs/flashcards), /mba/gmat-error-log (content 41, docs/error-log), /mba/store/free-resources (docs/free-stuff).
   The questions section (#faq.ask, last block) also serves /mba/your-daily-quant-verbal-question (docs/daily-questions) and /60-day-plan.php (sdp_dash_body.html).
   Served at /assets/css/btg-free.css?v=<first 10 hex of its sha256>; each page's build writes that token and sdp_dash_body.html holds it by hand, so a change here needs a rebuild and ship of all five.
   Look: the 60-Day Plan (sdp-dash.css) and the TTP offer card: Manrope, ink #1e2640, blue #4059c7, line #e6e9f2, cards 18px corners, inner 12px, buttons 11px.
   The wrapper is an id because combined.css's section:not(...)+section{padding-top:0} outranks any class. */
#bf{--ink:#1e2640;--soft:#3e4658;--muted:#5d6577;--paper:#f6f7fc;--tint:#fafbfe;--line:#e6e9f2;--blue:#4059c7;--blue-t:#eef1fc;--orange:#f47c20;--ok:#16713a;--ok-t:#ecf8f0;--no:#a84a08;--no-t:#fdf0e6;
--sh:0 8px 24px rgba(32,48,91,.05);--sh-up:0 16px 36px rgba(36,55,107,.1);--sh-shell:0 20px 60px rgba(29,42,78,.09),inset 0 1px 0 #fff;--sh-pill:0 8px 22px rgba(32,44,78,.05);
--spring:linear(0,.03567,.121,.2311,.3491,.464,.5696,.6624,.7414,.8067,.8593,.9007,.9326,.9565,.9739,.9863,.9948,1,1.004,1.005,1.006,1.006,1.006,1.005,1.005,1);
font:400 16px/1.55 var(--btg-font);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:clip}
#bf *{box-sizing:border-box}#bf h1,#bf h2,#bf h3{margin:0;font-family:var(--btg-font);font-weight:800;letter-spacing:-.03em;color:var(--ink);text-wrap:balance;text-transform:none}
#bf p,#bf ol,#bf ul,#bf dl,#bf dd{margin:0;padding:0;font-size:inherit;line-height:inherit;color:inherit}#bf ol,#bf ul{list-style:none}#bf p,#bf li{text-wrap:pretty}#bf b{font-weight:800}#bf sup,#bf sub{font-size:.7em;line-height:0}
#bf a{color:var(--blue);font-weight:800;text-decoration:none}#bf .muted{color:var(--muted)}
/* one color per exam section: Quant blue, Verbal violet, Data Insights teal, test day orange */
#bf .sq{--c:#4059c7;--t:#eef1fc}#bf .sv{--c:#6d55c9;--t:#eee9fb}#bf .sd{--c:#17706b;--t:#dbf3f0}#bf .st{--c:#a84a08;--t:#fdf0e6}
#bf .wrap{width:min(1510px,100%);margin:0 auto;padding:0 clamp(16px,2.4vw,36px)}#bf section{position:relative;padding:64px 0}#bf section.alt{background:#fff}
#bf .head{max-width:860px;margin-bottom:24px}#bf h2{font-size:clamp(26px,2.6vw,36px);line-height:1.1;letter-spacing:-.035em}#bf .head p{margin-top:10px;font-size:17px;color:var(--muted)}
#bf .card{border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--sh)}#bf a.card{display:block;color:var(--ink);font-weight:400;transition:transform .19s ease,border-color .19s ease,box-shadow .19s ease}#bf a.card:hover{transform:translateY(-3px);border-color:#cdd4eb;box-shadow:var(--sh-up)}
#bf a:focus-visible,#bf button:focus-visible,#bf summary:focus-visible,#bf [tabindex]:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
#bf button{--fg:var(--ink);--bd:transparent;height:auto;margin:0;padding:0;border:0;background:none;font:600 14px/1.2 var(--btg-font);font-size:14px!important;letter-spacing:0;text-transform:none;cursor:pointer}/* combined.css: button{height:52px;letter-spacing:1px;font-size:.625em!important} */
/* combined.css also forces button:hover,button:focus,button:active{color:#fff!important;border-color:#425cbb!important}, white on our white and pale buttons.
   So every button here takes its text and border color from --fg and --bd, set per button and per state. */
#bf button,#bf button:hover,#bf button:focus,#bf button:active{color:var(--fg)!important;border-color:var(--bd)!important}
/* the one action: the TTP card's blue gradient button with a light sweep on hover; .ghost is the quiet second action */
#bf .go,#bf .ghost{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:12px 24px;border-radius:11px;font:800 14px/1.2 var(--btg-font);font-size:14px!important;letter-spacing:.025em;text-transform:uppercase;text-align:center;white-space:nowrap}
#bf .go{--fg:#fff;--bd:rgba(45,65,153,.35);border:1px solid rgba(45,65,153,.35);background:linear-gradient(135deg,#536cd5,#3e56c0 58%,#3349a9);color:#fff;box-shadow:0 8px 16px rgba(53,75,175,.2),inset 0 1px 0 rgba(255,255,255,.28);transition:transform .18s ease,box-shadow .18s ease}
#bf .go:before{content:"";position:absolute;top:0;left:-100px;width:70px;height:100%;transform:skewX(-24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);transition:left .5s ease}#bf .go:hover:before{left:calc(100% + 30px)}#bf .go:hover{transform:translateY(-2px);box-shadow:0 13px 24px rgba(53,75,175,.28);color:#fff}
#bf .ghost{border:1px solid #c9cfdf;background:#fff;color:var(--ink);box-shadow:var(--sh-pill)}#bf .ghost:hover{border-color:var(--blue);color:var(--blue)}
/* hero: the pitch beside the page's main tool */
#bf .hero{padding:56px 0 72px;overflow:hidden}#bf .bloom{position:absolute;inset:0;pointer-events:none;-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}
#bf .bloom:before,#bf .bloom:after{content:"";position:absolute;width:56vmax;height:56vmax;border-radius:50%}#bf .bloom:before{left:-16vmax;top:-24vmax;background:radial-gradient(closest-side,rgb(68 95 184/.22),transparent)}#bf .bloom:after{right:-18vmax;top:-6vmax;background:radial-gradient(closest-side,rgb(244 124 32/.16),transparent)}
#bf .grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px;align-items:center}
#bf .kicker{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;background:#fff;box-shadow:var(--sh-pill);font-size:14px;font-weight:800;color:var(--soft)}#bf .kicker i{width:8px;height:8px;border-radius:50%;background:var(--orange)}
#bf h1{margin:18px 0 16px;font-size:clamp(38px,4.6vw,60px);line-height:.98;letter-spacing:-.045em}#bf h1 span{display:block;color:var(--blue)}#bf .lead{max-width:54ch;font-size:18px;color:var(--soft)}
#bf .acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
/* the email form in front of each download (btg-free.js): the 60-Day Plan's signup form (sdp-dash.css), copied */
#bf .sr{position:absolute;left:-5000px}#bf .form{max-width:560px;margin-top:26px}#bf .form .one{display:flex;gap:10px}#bf .busy .go{opacity:.6;pointer-events:none}
#bf .form input{flex:1 1 auto;min-width:0;height:52px;margin:0;padding:0 16px;border:0;border-radius:11px;background:#fff;box-shadow:var(--sh-pill),inset 0 0 0 1px #c9cfdf;font:400 17px var(--btg-font);color:var(--ink);outline:0}#bf input::placeholder{font-style:normal;color:var(--muted)}
#bf .form input:focus{box-shadow:inset 0 0 0 2px var(--blue),0 0 0 4px rgb(68 95 184/.25)}#bf .fine.err{color:var(--no);font-weight:800}#bf .fine.yes{color:var(--ok);font-weight:800}#bf .fine{margin-top:10px;font-size:14px;color:var(--muted)}
#bf .facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;max-width:580px;margin-top:26px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;line-height:1.35;color:var(--muted)}#bf .facts b{display:block;font-size:26px;line-height:1.1;color:var(--ink);font-variant-numeric:tabular-nums}
#bf .shell{padding:24px;border-color:rgba(213,218,232,.82);border-radius:24px;box-shadow:var(--sh-shell)}#bf .k{font-size:14px;font-weight:800;color:var(--c,var(--blue))}
/* numbered steps, check lists, two cards side by side */
#bf .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}#bf .two>.card{padding:28px}#bf .two h2{font-size:28px}#bf .two>.card>p{margin-top:8px;color:var(--muted)}
#bf .steps{display:grid;gap:12px;margin:18px 0 22px}#bf .steps li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start}#bf .steps li>b{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--blue-t);color:var(--blue)}#bf .steps li>span{padding-top:4px}
#bf .ticks{display:grid;gap:10px;margin-top:16px}#bf .ticks li{position:relative;padding-left:28px}#bf .ticks li:before{content:"";position:absolute;left:2px;top:7px;width:14px;height:8px;border-left:2.5px solid #16a34a;border-bottom:2.5px solid #16a34a;transform:rotate(-45deg)}
/* free tools and trials: the homepage school card (btg-schools.css, copied whole; Justin 11-03 banned grids of text-only cards sitewide): a screenshot or a logo (.lg)
   with the name on it, two numbers, one line, one button. Not .sc: the loans page carries its own #bf .sc copy */
#bf .kit{padding:20px;border-radius:24px;background:linear-gradient(135deg,#e9edfd 0%,#f4eef8 55%,#fdf1e4 100%);container-type:inline-size}#bf .kit .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}#bf .kit .c3{grid-template-columns:repeat(3,minmax(0,1fr))}
#bf .kit article{display:flex;flex-direction:column;overflow:hidden;border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(32,48,91,.1);transition:transform .19s ease,box-shadow .19s ease}#bf .kit article:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(36,55,107,.17)}
#bf .kit .ph{position:relative;display:block;aspect-ratio:8/5;overflow:hidden;background:#1a2036}#bf .kit img{display:block;width:100%;height:100%;max-width:none;margin:0;border:0;object-fit:cover;transition:transform .4s ease}#bf .kit article:hover .ph img{transform:scale(1.04)}
#bf .kit .lg{background:linear-gradient(135deg,#e9edfd 0%,#f4eef8 55%,#fdf1e4 100%)}#bf .kit .lg img{position:absolute;inset:0 0 80px;width:auto;height:auto;max-width:60%;max-height:40%;margin:auto;object-fit:contain;mix-blend-mode:multiply}
#bf .kit .cap{position:absolute;inset:auto 0 0;padding:30px 14px 11px;background:linear-gradient(0deg,rgba(12,16,38,.94) 0%,rgba(12,16,38,.78) 58%,transparent 100%)}#bf .kit h3{font-size:18px;line-height:1.15;letter-spacing:-.02em;color:#fff}#bf .kit .cap p{margin-top:2px;font-size:13px;font-weight:600;line-height:1.3;color:#fff}
#bf .kit .bd{flex:1;display:flex;flex-direction:column;padding:12px 14px}#bf .kit .st{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:8px 10px}
#bf .kit dd{font-size:17px;font-weight:800;line-height:1.15;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}#bf .kit dt{min-height:2.5em;margin-top:2px;font-size:12px;font-weight:500;line-height:1.25;color:var(--muted)}
#bf .kit .dl{margin-top:8px;padding-top:9px;border-top:1px solid var(--line);font-size:13px;line-height:1.45;color:var(--muted)}#bf .kit .dl b{color:var(--ink);white-space:nowrap}
#bf .kit .btns{display:grid;margin-top:auto;padding-top:11px}#bf .kit .go{min-height:42px;padding:0 6px;letter-spacing:0;text-transform:none}
@container (max-width:900px){#bf .kit .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@container (max-width:480px){#bf .kit .grid{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){#bf .kit article{animation:bf-rise linear backwards;animation-timeline:view();animation-range:entry 0% entry 70%}}}@keyframes bf-rise{from{opacity:0;transform:translateY(26px)}}
@media (max-width:979px){#bf .two{grid-template-columns:minmax(0,1fr);gap:20px}
/* phone and tablet: the page's main tool comes right after the headline */#bf .grid{display:flex;flex-direction:column;align-items:stretch;gap:0}#bf .pitch{display:contents}#bf .kicker{align-self:flex-start}#bf .grid>.shell{order:4;margin-top:24px}#bf .acts,#bf .grid .form{order:5}#bf .fine{order:6}#bf .facts{order:7}}
@media (max-width:640px){#bf section{padding:44px 0}#bf .hero{padding:32px 0 44px}#bf .acts>a{flex:1 1 100%}#bf .form .one{flex-direction:column}#bf .facts{grid-template-columns:repeat(2,minmax(0,1fr))}#bf .shell{padding:16px;border-radius:20px}#bf .two>.card{padding:22px}}
@media (prefers-reduced-motion:reduce){#bf *,#faq *{transition:none!important}}
/* questions and answers, on all five pages: one details/summary accordion in a dark section on the --btg-g1 gradient (btg-tokens.css) with white text, the look of the
   marketplace hero and its closing box (Justin 11-03 banned white question cards sitewide). docs/faq.py writes the FAQPage data from it. The id outranks #bf, #dq and .sdp. */
#faq.ask{padding:64px 0;background:var(--btg-g1);color:#fff}#faq.ask h2{margin:0 0 24px;font:800 clamp(26px,2.6vw,36px)/1.1 var(--btg-font);letter-spacing:-.035em;color:#fff;text-transform:none;text-wrap:balance}
#faq.ask .qa{max-width:920px;border-top:1px solid rgba(255,255,255,.18)}#faq.ask details{border-bottom:1px solid rgba(255,255,255,.18)}
#faq.ask summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 2px;list-style:none;cursor:pointer}#faq.ask summary::-webkit-details-marker{display:none}#faq.ask summary:focus-visible{outline:3px solid #fff;outline-offset:3px;border-radius:6px}
#faq.ask summary:after{content:"";flex:none;width:9px;height:9px;margin-right:4px;border-right:2.5px solid #b9c3f5;border-bottom:2.5px solid #b9c3f5;transform:rotate(45deg);transition:transform .2s ease}#faq.ask details[open] summary:after{transform:rotate(-135deg)}
#faq.ask h3{margin:0;font:800 19px/1.3 var(--btg-font);letter-spacing:-.01em;color:#fff;text-transform:none}#faq.ask p{max-width:72ch;margin:0;padding:0 2px 20px;font-size:16px;line-height:1.6;color:#d7ddf6}
@media (max-width:640px){#faq.ask{padding:44px 0}#faq.ask h3{font-size:17px}}