/* Mr. Good Stuff price estimator */
.mgse-est { --e-forest:#1F3D2B; --e-green:#2F821B; --e-sand:#F7F3EC; --e-line:#E4DED3; --e-ink:#1C1C1A; --e-muted:#6B665E;
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:0; background:#fff; border:1px solid var(--e-line);
  border-radius:22px; overflow:hidden; font-family:Inter,system-ui,-apple-system,sans-serif; color:var(--e-ink); text-align:left;
  box-shadow:0 18px 40px -28px rgba(31,61,43,.45); }
.mgse-preview { grid-column:1/-1; margin:0; padding:8px 16px; background:#FFF4E5; color:#7A4A12; font-size:13px; font-weight:600; border-bottom:1px solid #F1D9B8; }
.mgse-form { padding:24px 26px; display:flex; flex-direction:column; gap:18px; margin:0; }
.mgse-field { display:flex; flex-direction:column; gap:7px; margin:0; padding:0; border:0; min-width:0; }
.mgse-field > label, .mgse-method legend { font-weight:700; font-size:15px; color:var(--e-forest); padding:0; margin:0 0 2px; }
.mgse-est select, .mgse-est input[type=text] { width:100%; min-height:50px; font:400 16px/1.3 Inter,system-ui,sans-serif; color:var(--e-ink);
  padding:.7rem .85rem; border:1.5px solid var(--e-line); border-radius:12px; background:#fff; box-sizing:border-box; margin:0; }
.mgse-est select:focus, .mgse-est input:focus { outline:3px solid #B9E3A8; outline-offset:1px; border-color:var(--e-green); }
.mgse-qty { display:flex; gap:8px; align-items:stretch; }
.mgse-qty input { text-align:center; font-weight:700 !important; font-size:18px !important; }
.mgse-est .mgse-step { flex:0 0 50px; min-height:50px; border-radius:12px; border:1.5px solid var(--e-line); background:var(--e-sand); color:var(--e-forest);
  font:700 22px/1 Inter,system-ui,sans-serif; cursor:pointer; padding:0; }
.mgse-est .mgse-step:hover, .mgse-est .mgse-step:focus { border-color:var(--e-green); background:#EEF3EA; color:var(--e-forest); }
.mgse-est .mgse-link { align-self:flex-start; border-radius:0; min-height:0; white-space:normal; background:none; border:0; padding:2px 0; color:var(--e-green); font:600 14px/1.4 Inter,system-ui,sans-serif; text-decoration:underline; cursor:pointer; }
.mgse-calc { background:var(--e-sand); border-radius:12px; padding:12px; }
.mgse-calc[hidden] { display:none; }
.mgse-calc-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.mgse-calc-row label { display:flex; flex-direction:column; gap:4px; font-size:12.5px; font-weight:600; color:var(--e-muted); }
.mgse-calc-row input { min-height:44px !important; padding:.5rem .6rem !important; }
.mgse-calc-out { margin:10px 0 0; font-size:14px; color:var(--e-ink); }
.mgse-method { display:grid !important; grid-template-columns:1fr 1fr; gap:8px !important; }
.mgse-method legend { grid-column:1/-1; float:left; width:100%; margin-bottom:6px; }
.mgse-method label { position:relative; display:block; cursor:pointer; margin:0; }
.mgse-method input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.mgse-method span { display:flex; align-items:center; justify-content:center; min-height:48px; padding:0 10px; text-align:center; border:1.5px solid var(--e-line);
  border-radius:12px; font-weight:700; font-size:15px; color:var(--e-forest); background:#fff; }
.mgse-method input:checked + span { background:var(--e-forest); border-color:var(--e-forest); color:#fff; }
.mgse-method input:focus-visible + span { outline:3px solid #B9E3A8; outline-offset:2px; }
.mgse-zipf[hidden] { display:none; }
.mgse-out { background:var(--e-forest); color:#fff; padding:26px; display:flex; flex-direction:column; justify-content:center; min-height:100%; box-sizing:border-box; }
.mgse-out p { margin:0; }
.mgse-kicker { font-size:12px !important; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#8FC46F; }
.mgse-big { font:800 clamp(30px,4vw,42px)/1.1 "Archivo Black","Inter",system-ui,sans-serif; letter-spacing:-.01em; color:#fff; margin:6px 0 4px !important; font-variant-numeric:tabular-nums; }
.mgse-sub { font-size:14px; color:rgba(255,255,255,.75); }
.mgse-empty .mgse-big { font-size:clamp(24px,3vw,30px); }
.mgse-lines { list-style:none; margin:18px 0 0; padding:0; border-top:1px solid rgba(255,255,255,.16); }
.mgse-lines li { display:flex; justify-content:space-between; gap:14px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.12); font-size:14px; line-height:1.4; margin:0; }
.mgse-lines li span { color:rgba(255,255,255,.85); }
.mgse-lines li b { white-space:nowrap; font-variant-numeric:tabular-nums; }
.mgse-lines li.is-muted b { color:#B9E3A8; }
.mgse-note { margin-top:12px !important; font-size:13.5px; color:#B9E3A8; }
.mgse-btns { display:flex; flex-direction:column; gap:10px; margin-top:18px; }
.mgse-btn { display:flex; align-items:center; justify-content:center; min-height:52px; padding:.8rem 1rem; border-radius:12px; font:700 16px/1.2 Inter,system-ui,sans-serif;
  text-decoration:none !important; text-align:center; box-sizing:border-box; }
.mgse-btn--call { background:var(--e-green); color:#fff !important; border:2px solid var(--e-green); }
.mgse-btn--call:hover { background:#27701a; }
.mgse-btn--quote { background:transparent; color:#fff !important; border:2px solid rgba(255,255,255,.75); }
.mgse-btn--quote:hover { background:rgba(255,255,255,.1); }
.mgse-btn:focus-visible { outline:3px solid #B9E3A8; outline-offset:2px; }
.mgse-fine { margin-top:12px !important; font-size:12.5px; color:rgba(255,255,255,.6); line-height:1.45; }
@media (max-width: 900px) { .mgse-est { grid-template-columns:1fr; } }
/* Stack when the box it sits in is narrow, whatever the screen size. */
.mgs-estimator, [data-mgs-estimator], .mgse-step2-mount { container-type:inline-size; }
@container (max-width: 720px) { .mgse-est { grid-template-columns:1fr; } }
.mgse-measure-toggle[hidden] { display:none; }

/* Yardage calculator → step 2 */
.mgse-stepbadge { display:flex; align-items:center; gap:10px; margin:0 0 14px; font:700 13px/1.2 Inter,system-ui,sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#2F821B; }
.mgse-stepbadge span { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:#1F3D2B; color:#fff; font-size:14px; letter-spacing:0; }
.mgs-calc .mgse-calc-call { background:transparent !important; color:#1F3D2B !important; border:1.5px solid #E4DED3; margin-top:.6rem !important; }
.mgs-calc .mgse-calc-call:hover { border-color:#2F821B; background:#F6F2EA !important; }
.mgse-step2-go { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:1.25rem; min-height:52px; padding:.9rem 1rem; border-radius:10px;
  background:#2F821B; color:#fff !important; font:700 1.05rem/1.2 Inter,system-ui,sans-serif; text-decoration:none !important; text-align:center; box-sizing:border-box; }
.mgse-step2-go::after { content:"\2193"; font-size:1.1em; }
.mgse-step2-go:hover { background:#27701a; }
.mgse-step2-go[hidden] { display:none; }
.mgse-step2 { max-width:64rem; margin:2rem auto 0; padding:0; text-align:left; scroll-margin-top:90px; font-family:Inter,system-ui,sans-serif; }
.mgse-step2-head { max-width:46rem; margin:0 0 18px; }
.mgse-step2-head h3 { margin:0 0 8px; font:800 clamp(24px,3vw,32px)/1.15 "Archivo Black",Inter,system-ui,sans-serif; color:#1F3D2B; }
.mgse-step2-head h3 b { color:#2F821B; font-weight:inherit; }
.mgse-step2-sub { margin:0; color:#4A463F; font-size:16px; line-height:1.55; }
.mgse-step2-wait { display:none; margin:12px 0 0; padding:10px 14px; border-radius:10px; background:#F6F2EA; color:#6B665E; font-weight:600; font-size:15px; }
.mgse-step2.is-waiting .mgse-step2-wait { display:block; }
.mgse-step2.is-waiting .mgse-step2-mount { opacity:.45; filter:grayscale(.4); pointer-events:none; user-select:none; }
.mgse-step2-mount { transition:opacity .35s ease, filter .35s ease; }
.mgse-step2:not(.is-waiting) .mgse-est { animation:mgse-pop .5s ease; }
@keyframes mgse-pop { 0% { box-shadow:0 0 0 0 rgba(47,130,27,.45); } 100% { box-shadow:0 0 0 14px rgba(47,130,27,0); } }
@media (prefers-reduced-motion: reduce) { .mgse-step2:not(.is-waiting) .mgse-est { animation:none; } .mgse-step2-mount { transition:none; } }
@media (max-width: 767px) {
  .mgse-est { border-radius:18px; }
  .mgse-form { padding:18px 16px; gap:14px; }
  .mgse-out { padding:20px 16px; }
}

/* Keep the theme's generic button styles (border, hover fill) off the estimator's own buttons. */
.mgse-est .mgse-link:hover, .mgse-est .mgse-link:focus { background:none; color:var(--e-forest); }
.mgse-est .mgse-link:focus-visible, .mgse-est .mgse-step:focus-visible { outline:3px solid #B9E3A8; outline-offset:2px; }

/* Step 2 sitting on a dark photo hero (calculator page) */
.mgs-hero-photo .mgse-step2-head h3 { color:#fff; }
.mgs-hero-photo .mgse-step2-head h3 b { color:#B9E3A8; }
.mgs-hero-photo .mgse-step2-sub { color:rgba(255,255,255,.85); }
.mgs-hero-photo .mgse-step2-head .mgse-stepbadge { color:#B9E3A8; }
.mgs-hero-photo .mgse-step2-head .mgse-stepbadge span { background:#B9E3A8; color:#1F3D2B; }
.mgs-hero-photo .mgse-step2-wait { background:rgba(255,255,255,.1); color:rgba(255,255,255,.85); }
.mgs-hero-photo .mgse-step2.is-waiting .mgse-step2-mount { opacity:.55; }
