/* Assisted funnel — measurements modal. Additive only: nothing here touches
   the measured product-page layout. All selectors are under .fnl- / dialog. */

dialog.fnl-modal{
  padding:0; border:none; border-radius:14px; background:var(--bg,#fbf7f3);
  color:var(--ink,#151515); font-family:'Funnel Sans',sans-serif;
  width:min(520px, calc(100vw - 32px)); max-height:calc(100vh - 48px);
  overflow:auto; box-shadow:0 20px 60px rgba(0,0,0,.22);
}
dialog.fnl-modal::backdrop{background:rgba(13,13,13,.42);}
.fnl-inner{padding:26px 28px 30px;}
.fnl-close{
  position:absolute; top:12px; right:12px; width:32px; height:32px;
  border:1px solid var(--line,#e7e2da); background:#fff; border-radius:50%;
  font-size:16px; line-height:1; color:var(--ink,#151515);
}
.fnl-modal h2{
  font-family:'Figtree',sans-serif; font-weight:900; font-size:26px;
  letter-spacing:-0.01em; margin:0 34px 6px 0; line-height:1.15;
}
.fnl-lede{font-size:13px; color:var(--ink,#151515); margin:0 0 18px; line-height:1.5;}
.fnl-modal fieldset{border:none; margin:0 0 16px; padding:0;}
.fnl-legend{
  font-family:'Figtree',sans-serif; font-weight:700; font-size:10.5px;
  letter-spacing:.4px; text-transform:uppercase; margin:0 0 8px;
}
.fnl-row{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.fnl-row-3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px;}
.fnl-field{display:block; margin-bottom:10px;}
.fnl-field > span{
  display:block; font-family:'Figtree',sans-serif; font-weight:700;
  font-size:10.5px; letter-spacing:.2px; margin-bottom:4px;
}
.fnl-modal input[type=text],
.fnl-modal input[type=email],
.fnl-modal input[type=tel],
.fnl-modal input[type=number],
.fnl-modal textarea{
  width:100%; font-family:'Funnel Sans',sans-serif; font-size:14px;
  color:var(--ink,#151515); background:#fff;
  border:1px solid var(--line,#e7e2da); border-radius:6px; padding:10px 11px;
}
.fnl-modal textarea{min-height:72px; resize:vertical;}
.fnl-modal input:focus-visible,
.fnl-modal textarea:focus-visible,
.fnl-modal button:focus-visible,
.fnl-modal label.fnl-file:focus-within{
  outline:2px solid var(--lilac-sel-border,#8f80d6); outline-offset:2px;
}
.fnl-help{font-size:10.5px; color:var(--muted,#6f6f68); margin:4px 0 0; line-height:1.45;}
.fnl-check{display:flex; gap:9px; align-items:flex-start; font-size:13px; margin:2px 0 12px;}
.fnl-check input{margin:2px 0 0;}
.fnl-file{
  display:block; border:1px dashed var(--line,#e7e2da); border-radius:6px;
  background:#fff; padding:11px 12px; font-size:12.5px; cursor:pointer; margin-bottom:14px;
}
.fnl-file input{position:absolute; opacity:0; width:1px; height:1px;}
.fnl-filename{color:var(--muted,#6f6f68); font-size:11.5px; margin-top:5px;}
.fnl-submit{
  width:100%; background:var(--black,#0d0d0d); color:#fff; border:none;
  padding:14px 22px; font-size:12px; font-weight:700; letter-spacing:.4px;
  border-radius:3px; font-family:'Funnel Sans',sans-serif; margin-top:6px;
}
.fnl-submit[disabled]{opacity:.55;}
.fnl-foot{font-size:10.5px; color:var(--muted,#6f6f68); margin:10px 0 0; text-align:center;}
.fnl-error{
  background:#fff; border:1px solid #d8b3ad; border-radius:6px;
  padding:10px 12px; font-size:12.5px; margin:0 0 14px; color:#8a3b30;
}
.fnl-done h2{margin-right:34px;}
.fnl-done p{font-size:14px; line-height:1.55;}
.fnl-req{color:var(--muted,#6f6f68); font-weight:400;}

@media (max-width:640px){
  dialog.fnl-modal{
    width:100vw; max-width:100vw; height:100dvh; max-height:100dvh;
    border-radius:0; margin:0; top:0; left:0;
  }
  .fnl-inner{padding:22px 18px 40px;}
  .fnl-modal h2{font-size:23px;}
  .fnl-row{grid-template-columns:1fr;}
  .fnl-row-3{grid-template-columns:1fr 1fr 1fr; gap:8px;}
}

/* =======================================================================
   Round 4 — product page interactivity.
   Additive only: nothing below changes a measured box. The gallery track
   lives INSIDE .hero-media, so the frame keeps its measured geometry; the
   tab panels and accordion bodies are hidden until opened, so they add no
   height to the page as first painted.
   ======================================================================= */

/* --- gallery: swipeable hero track ------------------------------------ */
.hero-track{
  display:flex; width:100%; height:100%;
  overflow-x:auto; overflow-y:hidden;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; -ms-overflow-style:none;
}
.hero-track::-webkit-scrollbar{display:none;}
.hero-track:focus-visible{outline:2px solid var(--lilac-sel-border,#8f80d6); outline-offset:-2px;}
.hero-slide{flex:0 0 100%; width:100%; height:100%; scroll-snap-align:center; scroll-snap-stop:always;}
.gallery-frame .arrow{z-index:2; cursor:pointer; color:var(--ink,#151515); line-height:1;}
.dots span{cursor:pointer;}
.thumbs img:focus-visible{outline:2px solid var(--lilac-sel-border,#8f80d6); outline-offset:2px;}

/* --- pickers: keyboard + pointer affordances -------------------------- */
[data-pick]{cursor:pointer;}
[data-pick]:focus-visible{outline:2px solid var(--lilac-sel-border,#8f80d6); outline-offset:2px;}
.swatch[data-pick]:focus-visible{outline-offset:4px;}

/* --- tab panels (desktop) --------------------------------------------- */
/* .details-grid is display:grid in the measured stylesheet, which beats the
   UA's [hidden]{display:none}; say it again, louder. */
.details-grid[hidden],.tab-panel[hidden],.acc-body[hidden]{display:none !important;}
.tab-panel{margin-top:19px; padding-left:21px; max-width:700px;}
.tab-panel p{font-size:11px; line-height:17px; margin:0 0 12px;}
.tab-panel ul{list-style:none; margin:0 0 12px; padding:0;}
.tab-panel li{font-size:11px; line-height:17px; padding-left:12px; position:relative;}
.tab-panel li:before{content:"✓"; position:absolute; left:0; color:var(--star-green,#3f9e6d); font-weight:700;}
.tier-list{list-style:none; margin:0 0 12px; padding:0; max-width:420px;}
.tier-list li{display:flex; justify-content:space-between; gap:16px; font-size:11px; line-height:17px;
  padding:7px 0; border-bottom:1px solid var(--line,#e7e2da);}
.tier-list li:before{content:none;}
.tier-list .tier-name{font-weight:600;}
.tier-list .tier-price{font-weight:700; white-space:nowrap;}
.tier-note{color:var(--muted,#6f6f68);}
.ask-greg{color:#8a3b30; font-weight:700;}

/* --- accordion bodies (mobile) ---------------------------------------- */
.acc-body{padding:0 0 20px; font-size:14px; line-height:21px;}
.acc-body p{margin:0 0 12px;}
.acc-body ul{list-style:none; margin:0 0 12px; padding:0;}
.acc-body li{padding-left:16px; position:relative; margin-bottom:6px;}
.acc-body li:before{content:"✓"; position:absolute; left:0; color:var(--star-green,#3f9e6d); font-weight:700;}
.acc-body .tier-list li{font-size:14px; line-height:21px; padding:9px 0;}
.acc-body .tier-list li:before{content:none;}
.acc-body .viewspec{font-weight:700; display:inline-block;}
@media (max-width:1023px){
  /* the flat row/body structure means .acc-row:last-child no longer closes
     the list; keep the measured rule that finishes it with a line */
  .accordion{border-bottom:1px solid var(--line,#e7e2da);}
  .acc-row{cursor:pointer;}
}

/* --- header CTA is a link now (same box as the button it replaced) ----- */
a.btn-black{display:inline-block; text-decoration:none; text-align:center; line-height:normal;}

/* --- modal: the prefill note ------------------------------------------ */
.fnl-prefill{
  font-size:11.5px; line-height:1.45; color:var(--muted,#6f6f68);
  background:#fff; border:1px solid var(--line,#e7e2da); border-radius:6px;
  padding:8px 10px; margin:0 0 10px;
}