/* ==========================================================================
   YITD | Get a quote pop-up v2 (site side). v2: straightened photo, "quote" wording. Keeps the live class names
   (.get-started-form, .bg, .container, h2.top) so existing triggers
   (classList.toggle('active') and openGetStartedForm) keep working.
   New elements: .gsf-media, __badge, __steps, __body, __kicker,
   __lede, __rule, __slot, __fine and a real <button class="gsf-close">.
   The variable Hanken file is registered under its own family name and
   applied only inside this modal, so the rest of the page keeps its faces.
   Load this file after /styles/global.css.
   ========================================================================== */
@font-face{
  font-family:"Hanken Grotesk Variable";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url("/fonts/hanken-grotesk/HankenGrotesk-Variable.woff2") format("woff2");
}
.get-started-form,.get-started-form *,.get-started-form *::before,.get-started-form *::after{box-sizing:border-box}
.get-started-form,.get-started-form *{font-family:"Hanken Grotesk Variable","Hanken Grotesk",system-ui,sans-serif}
.get-started-form{position:fixed;inset:0;z-index:10000;display:none;place-items:center;padding:24px;letter-spacing:-.1px;width:auto;height:auto}
.get-started-form.active{display:grid}
html:has(.get-started-form.active){overflow:hidden}
.get-started-form .bg{position:absolute;inset:0;display:block;width:auto;height:auto;background:rgba(20,29,16,.62);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.get-started-form .container{position:relative;z-index:1;width:min(1000px,100%)!important;min-width:0;max-height:calc(100dvh - 48px);overflow:hidden;display:grid;grid-template-columns:340px 1fr;padding:0;background:#fefbe8;border-radius:14px;box-shadow:0 30px 80px rgba(12,18,9,.45),0 0 0 1px rgba(41,59,33,.08);animation:gsfIn .28s cubic-bezier(.2,.7,.2,1)}
@keyframes gsfIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}

/* Photo column */
.gsf-media{position:relative;overflow:hidden;background:#293b21 url("/images/quote/quote-media-680x1020-v2.jpg") center 30%/cover no-repeat;display:flex;flex-direction:column;justify-content:flex-end;padding:28px 28px 30px;color:#fefbe8}
.gsf-media::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,45,24,.30) 0%,rgba(31,45,24,0) 26%,rgba(31,45,24,.35) 46%,rgba(31,45,24,.88) 68%,#1f2d18 100%)}
.gsf-media>*{position:relative}
.gsf-media__badge{display:none}
.gsf-media__head{margin:0 0 14px;font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fad86c}
.gsf-steps{list-style:none;margin:0;padding:0;counter-reset:s}
.gsf-steps li{counter-increment:s;position:relative;padding:0 0 0 38px;margin:0 0 14px;font-size:15px;line-height:1.4;color:rgba(254,251,232,.92)}
.gsf-steps li::before{content:counter(s);position:absolute;left:0;top:-1px;width:24px;height:24px;border-radius:50%;border:1px solid rgba(250,216,108,.75);color:#fad86c;font-size:12.5px;font-weight:600;display:grid;place-items:center}
.gsf-steps li b{display:block;font-weight:560;color:#fefbe8}
.gsf-trust{margin:18px 0 0;padding:16px 0 0;border-top:1px solid rgba(178,188,159,.35);display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;font-weight:500;color:rgba(254,251,232,.78)}
.gsf-trust span{display:inline-flex;align-items:center;gap:6px}
.gsf-trust span::before{content:"";width:5px;height:5px;border-radius:50%;background:#fad86c}

/* Form column (scrolls on its own) */
.gsf-body{overflow:auto;max-height:calc(100dvh - 48px);padding:36px 44px 24px;overscroll-behavior:contain}
.gsf-kicker{margin:0 0 10px;font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#7c6420}
.get-started-form .container h2.top{position:static;display:block;margin:0;padding:0;background:none;border:0;text-transform:none;font-family:inherit;font-weight:560;font-size:31px;line-height:1.08;letter-spacing:-.4px;color:#293b21;text-wrap:balance}
.gsf-lede{margin:10px 0 0;font-size:16px;line-height:1.5;color:#313131;max-width:540px}
.gsf-rule{height:1px;background:#b2bc9f;border:0;margin:18px 0 16px}
.gsf-slot iframe{display:block;width:100%;height:700px;border:0;background:transparent!important}
.gsf-fine{margin:-8px 0 0;font-size:13.5px;line-height:1.45;color:rgba(49,49,49,.72);text-align:center}
.gsf-fine a{color:#293b21;font-weight:600;text-decoration:none;white-space:nowrap}
.gsf-fine a:hover,.gsf-fine a:focus-visible{color:#d4b24c;text-decoration:underline}

/* Close. Beats the legacy `.get-started-form .container button` rule. */
.get-started-form .container .gsf-close{position:absolute;top:14px;right:14px;z-index:3;width:40px;height:40px;min-height:0;padding:0;border-radius:50%;border:0;background:rgba(41,59,33,.07);color:#293b21;cursor:pointer;display:grid;place-items:center;font-size:0;line-height:0;transition:background .15s}
.get-started-form .container .gsf-close::before,.get-started-form .container .gsf-close::after{content:"";position:absolute;width:16px;height:1.75px;border-radius:2px;background:currentColor;transform:rotate(45deg)}
.get-started-form .container .gsf-close::after{transform:rotate(-45deg)}
.get-started-form .container .gsf-close:hover{background:rgba(41,59,33,.14);color:#293b21}
.get-started-form .container .gsf-close:focus-visible{outline:3px solid #fad86c;outline-offset:2px}

/* Phones: full-height sheet, short photo header */
@media (max-width:767px){
 .get-started-form{padding:0;place-items:end stretch}
 .get-started-form .container{width:100%!important;max-height:calc(100dvh - 12px);height:calc(100dvh - 12px);grid-template-columns:1fr;grid-template-rows:auto 1fr;border-radius:18px 18px 0 0;animation-name:gsfUp}
 @keyframes gsfUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
 .gsf-media{background-image:url("/images/quote/quote-media-mobile-780x300-v2.jpg");background-position:center 40%;border-radius:18px 18px 0 0;padding:18px 64px 18px 20px;min-height:0;flex-direction:row;align-items:center;justify-content:flex-start;gap:14px}
 .gsf-media::before{background:linear-gradient(90deg,rgba(31,45,24,.92) 0%,rgba(31,45,24,.70) 60%,rgba(31,45,24,.45) 100%)}
 .gsf-media__badge{display:block;width:48px;height:48px;flex:none;filter:drop-shadow(0 3px 8px rgba(0,0,0,.35))}
 .gsf-media__mtitle{display:block!important;margin:0}
 .gsf-media__mtitle b{display:block;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#fad86c;margin-bottom:4px}
 .gsf-media__mtitle span{display:block;font-size:14.5px;font-weight:500;line-height:1.3;color:rgba(254,251,232,.9)}
 .gsf-media__info{display:none}
 .get-started-form .container .gsf-close{top:16px;right:12px;width:40px;height:40px;padding:0;border-radius:50%;background:rgba(254,251,232,.16);color:#fefbe8;font-size:0}
 .get-started-form .container .gsf-close:hover{background:rgba(254,251,232,.28);color:#fefbe8}
 .gsf-body{max-height:none;padding:22px 20px calc(20px + env(safe-area-inset-bottom))}
 .gsf-kicker{display:none}
 .get-started-form .container h2.top{font-size:26px}
 .gsf-lede{font-size:15.5px;margin-top:8px}
 .gsf-rule{margin:16px 0 14px}
 .gsf-slot iframe{height:1060px}
}
.gsf-media__mtitle{display:none}
@media (prefers-reduced-motion:reduce){.get-started-form .container{animation:none}}
