/* ===== Bloom Skip Bins · Suburb page template C · "Field log" =====
   Every class is prefixed .fl- and scoped under main.fl. Same data fields as templates A and B. */

.fl{
  --forest:#1F3B26; --forest-2:#2A4D33; --forest-ink:#13281A; --forest-deep:#0E2014;
  --yellow:#F5C400; --yellow-ink:#8A6D00;
  --cream:#FAF6EC; --cream-2:#F2EBDA; --cream-3:#E7DEC8;
  --char:#2B2B2B; --stone:#5C584E;
  --line:rgba(31,59,38,.16); --line-dark:rgba(250,246,236,.16);
  --f-head:"Poppins",system-ui,sans-serif;
  --f-body:"Inter",system-ui,sans-serif;
  --f-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r:6px;
}
.fl{
  display:block; padding-top:100px; background:var(--cream); color:var(--char);
  font:400 1rem/1.65 var(--f-body); overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
.fl *,.fl *::before,.fl *::after{box-sizing:border-box}
.fl img{display:block; max-width:100%; height:auto}
.fl h1,.fl h2,.fl h3{font-family:var(--f-head); margin:0; color:inherit; text-wrap:balance}
:where(.fl) p{margin:0}
:where(.fl) a{color:inherit}
.fl :focus-visible{outline:3px solid var(--forest); outline-offset:3px; border-radius:4px}
.fl .is-dark :focus-visible,.fl .fl-hero__panel :focus-visible,.fl-lightbox :focus-visible{outline-color:var(--yellow)}
.fl-wrap{width:min(100% - 32px, 1280px); margin-inline:auto}
.fl-kicker{display:inline-flex; align-items:center; gap:10px; font:600 .75rem/1.2 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--forest)}
.fl-kicker::before{content:""; width:22px; height:2px; background:currentColor}
.is-dark .fl-kicker{color:var(--yellow)}
.fl-h2{font-size:clamp(1.85rem,4.4vw,3.25rem); font-weight:800; line-height:1.05; letter-spacing:-.02em}
.fl-lede{font-size:1.0625rem; color:var(--stone); max-width:56ch}
.is-dark .fl-lede{color:rgba(250,246,236,.8)}
.fl section{scroll-margin-top:110px}

/* Buttons */
.fl-btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 22px; border-radius:var(--r); font:700 1rem/1 var(--f-body); text-decoration:none; transition:transform .2s ease; border:2px solid transparent; white-space:nowrap}
.fl-btn svg{width:18px; height:18px; flex:none}
.fl-btn:hover{transform:translateY(-2px)}
.fl-btn--yellow{background:var(--yellow); color:var(--char)}
.fl-btn--ghost{border-color:rgba(250,246,236,.55); color:var(--cream)}
.fl-btn--forest{background:var(--forest); color:var(--cream)}
.fl-btn--line{border-color:var(--forest); color:var(--forest)}
.fl-actions{display:flex; flex-wrap:wrap; gap:12px}

/* Viewfinder corners: the page's photo motif */
.fl-vf{position:relative}
.fl-vf::after{content:""; position:absolute; inset:12px; pointer-events:none;
  --c:var(--yellow); --l:26px; --t:3px;
  background:
   linear-gradient(var(--c),var(--c)) top left/var(--l) var(--t),
   linear-gradient(var(--c),var(--c)) top left/var(--t) var(--l),
   linear-gradient(var(--c),var(--c)) top right/var(--l) var(--t),
   linear-gradient(var(--c),var(--c)) top right/var(--t) var(--l),
   linear-gradient(var(--c),var(--c)) bottom left/var(--l) var(--t),
   linear-gradient(var(--c),var(--c)) bottom left/var(--t) var(--l),
   linear-gradient(var(--c),var(--c)) bottom right/var(--l) var(--t),
   linear-gradient(var(--c),var(--c)) bottom right/var(--t) var(--l);
  background-repeat:no-repeat}
.fl-tag{position:absolute; z-index:2; font:600 .72rem/1 var(--f-mono); letter-spacing:.12em; text-transform:uppercase; background:rgba(14,32,20,.86); color:var(--cream); padding:8px 10px; border-radius:3px}
.fl-tag b{color:var(--yellow); font-weight:600}

/* ===== 1. Hero ===== */
.fl-hero{padding:20px 0 72px}
.fl-crumbs ol{list-style:none; margin:0 0 18px; padding:0; display:flex; flex-wrap:wrap; gap:6px; font:500 .8125rem/1.4 var(--f-mono); color:var(--stone)}
.fl-crumbs li+li::before{content:"/"; margin-right:6px; color:var(--cream-3)}
.fl-crumbs a{text-decoration:none; border-bottom:1px solid var(--line)}
.fl-crumbs a:hover{color:var(--forest); border-color:var(--forest)}
.fl-crumbs [aria-current]{color:var(--forest); font-weight:700}
.fl-hero__grid{display:grid}
.fl-hero__media{margin:0; border-radius:var(--r); overflow:hidden; background:var(--cream-3)}
.fl-hero__media img{width:100%; aspect-ratio:4/3; object-fit:cover}
.fl-hero__media .fl-tag{left:24px; bottom:24px}
.fl-hero__panel{position:relative; z-index:3; margin:-56px 12px 0; background:var(--forest); color:var(--cream); border-radius:var(--r); padding:30px 24px 28px; box-shadow:0 30px 60px -30px rgba(14,32,20,.55)}
.fl-hero__panel .fl-kicker{color:var(--yellow)}
.fl-h1{margin-top:16px !important; font-size:clamp(2.5rem,8.4vw,5.25rem); font-weight:800; line-height:1.02; letter-spacing:-.03em}
.fl-h1 em{font-style:normal; color:var(--yellow); display:block}
.fl-hero__intro{margin-top:24px; font-size:1.0625rem; color:rgba(250,246,236,.86); max-width:52ch}
.fl-hero__panel .fl-actions{margin-top:26px}
.fl-facts{margin:28px 0 0; padding-top:22px; border-top:1px solid var(--line-dark); display:grid; grid-template-columns:1fr 1fr; gap:16px 20px}
.fl-facts dt{font:600 .7rem/1.2 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--yellow)}
.fl-facts dd{margin:6px 0 0; font-size:.9375rem; font-weight:600; line-height:1.35}
.fl-route{margin:20px 12px 0; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; font:600 .8125rem/1.3 var(--f-mono); color:var(--forest)}
.fl-route__end small{display:block; font-weight:400; color:var(--stone); letter-spacing:.04em}
.fl-route__track{position:relative; height:14px}
.fl-route__track::before{content:""; position:absolute; left:0; right:0; top:6px; border-top:2px dashed rgba(31,59,38,.45)}
.fl-route__dot{position:absolute; top:1px; left:0; width:12px; height:12px; border-radius:50%; background:var(--yellow); box-shadow:0 0 0 3px var(--forest); animation:flDrive 5s cubic-bezier(.6,0,.4,1) infinite}
@keyframes flDrive{0%,8%{transform:translateX(0)}60%,100%{transform:translateX(var(--w,180px))}}
.fl-route__note{grid-column:1/-1; font:400 .8125rem/1.4 var(--f-body); color:var(--stone)}

@media (min-width:1024px){
  .fl-hero{padding:28px 0 104px}
  .fl-hero__grid{grid-template-columns:repeat(12,minmax(0,1fr)); grid-template-rows:auto auto; column-gap:24px}
  .fl-crumbs{grid-column:1/-1}
  .fl-hero__media{grid-column:5/13; grid-row:2/4}
  .fl-hero__media img{aspect-ratio:auto; height:660px}
  .fl-hero__media .fl-tag{left:auto; right:28px; bottom:28px}
  .fl-hero__panel{grid-column:1/8; grid-row:2; margin:56px 0 0; padding:52px 52px 44px; align-self:start}
  .fl-facts{grid-template-columns:repeat(4,1fr)}
  .fl-route{grid-column:1/5; grid-row:3; margin:28px 0 0; align-self:start}
}

/* ===== 2. Field log (jobs gallery) ===== */
.fl-log{position:relative; background:var(--forest-ink); color:var(--cream); padding:88px 0 96px}
.fl-log::before,.fl-log::after{content:""; position:absolute; left:0; right:0; height:10px;
  background:repeating-linear-gradient(90deg,transparent 0 16px,rgba(250,246,236,.13) 16px 30px)}
.fl-log::before{top:16px} .fl-log::after{bottom:16px}
.fl-log__head{display:grid; gap:20px; margin-bottom:40px}
.fl-log__head .fl-h2{margin-top:14px}
.fl-count{display:inline-flex; gap:10px; align-items:baseline; font:600 .8125rem/1 var(--f-mono); letter-spacing:.1em; text-transform:uppercase; color:rgba(250,246,236,.7)}
.fl-count b{font:800 2.5rem/1 var(--f-head); color:var(--yellow); letter-spacing:0}
.fl-sheet{list-style:none; margin:0; padding:0 0 12px; display:grid; grid-auto-flow:column; grid-auto-columns:84%; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:var(--forest-2) transparent}
.fl-frame{scroll-snap-align:start; display:flex; flex-direction:column; background:var(--forest-deep); border:1px solid var(--line-dark); border-radius:var(--r); padding:10px}
.fl-frame__photo{position:relative; display:block; overflow:hidden; border-radius:3px; flex:1 1 auto; min-height:0}
.fl-frame__photo img{width:100%; height:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.fl-frame__photo:hover img{transform:scale(1.04)}
.fl-frame__photo .fl-tag{top:12px; left:12px}
.fl-frame__zoom{position:absolute; right:12px; bottom:12px; z-index:2; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:var(--yellow); color:var(--char); transform:scale(.9); opacity:.92; transition:transform .25s ease, opacity .25s ease}
.fl-frame__photo:hover .fl-frame__zoom,.fl-frame__photo:focus-visible .fl-frame__zoom{transform:scale(1); opacity:1}
.fl-frame__zoom svg{width:18px; height:18px}
.fl-frame__meta{display:grid; grid-template-columns:auto 1fr; gap:4px 14px; align-items:center; padding:14px 6px 6px}
.fl-size{grid-row:span 2; font:800 1.25rem/1 var(--f-head); background:var(--yellow); color:var(--char); padding:12px 12px; border-radius:4px; text-align:center; min-width:64px}
.fl-size small{display:block; font:600 .6rem/1.2 var(--f-mono); letter-spacing:.1em; text-transform:uppercase; margin-top:4px}
.fl-frame__job{font:700 1.0625rem/1.3 var(--f-head)}
.fl-frame__area{font:500 .78rem/1.3 var(--f-mono); letter-spacing:.06em; color:rgba(250,246,236,.74)}
.fl-frame--cta{justify-content:center; gap:14px; padding:32px 24px; border:2px dashed rgba(245,196,0,.55); background:transparent}
.fl-frame--cta .fl-tag{position:static; align-self:flex-start; background:transparent; border:1px solid rgba(245,196,0,.55)}
.fl-frame--cta p{font:800 1.5rem/1.15 var(--f-head); color:var(--cream)}
.fl-frame--cta .fl-frame__sub{font-size:.9375rem; color:rgba(250,246,236,.78)}
.fl-log__hint{margin-top:16px; font:500 .78rem/1.4 var(--f-mono); color:rgba(250,246,236,.6)}
@media (min-width:900px){
  .fl-log{padding:120px 0 128px}
  .fl-log__head{grid-template-columns:7fr 5fr; align-items:end; margin-bottom:52px}
  .fl-sheet{grid-auto-flow:row; grid-template-columns:repeat(12,minmax(0,1fr)); overflow:visible; gap:20px; padding:0}
  .fl-frame:nth-child(1){grid-column:1/8; grid-row:1/3}
  .fl-frame:nth-child(1) .fl-frame__photo img{aspect-ratio:auto; min-height:420px}
  .fl-frame:nth-child(2),.fl-frame:nth-child(3){grid-column:8/13}
  .fl-frame--cta{grid-column:1/-1 !important; flex-direction:row; align-items:center; justify-content:space-between; flex-wrap:wrap; padding:26px 30px}
  .fl-log__hint{display:none}
}

/* Lightbox */
.fl-lightbox{width:min(1120px, 100vw - 24px); max-height:calc(100dvh - 24px); padding:0; border:0; border-radius:var(--r); background:var(--forest-deep); color:var(--cream); overflow:hidden}
.fl-lightbox::backdrop{background:rgba(8,18,11,.88)}
.fl-lightbox__fig{margin:0; position:relative}
.fl-lightbox__fig img{width:100%; max-height:calc(100dvh - 180px); object-fit:contain; background:#000}
.fl-lightbox__cap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; align-items:center; padding:16px 20px; font:500 .875rem/1.4 var(--f-mono)}
.fl-lightbox__nav{display:flex; gap:8px}
.fl-icon-btn{width:48px; height:48px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--line-dark); background:rgba(14,32,20,.8); color:var(--cream); cursor:pointer}
.fl-icon-btn:hover{background:var(--forest-2)}
.fl-icon-btn svg{width:20px; height:20px}
.fl-lightbox__close{position:absolute; top:12px; right:12px; z-index:3}

/* ===== 3. Local notes ===== */
.fl-local{padding:96px 0}
.fl-local__grid{display:grid; gap:40px}
.fl-local__fig{margin:0; border-radius:var(--r); overflow:hidden; background:var(--cream-3)}
.fl-local__fig img{width:100%; aspect-ratio:4/5; object-fit:cover}
.fl-local__fig .fl-tag{left:24px; top:24px}
.fl-local .fl-h2{margin:14px 0 18px}
.fl-notes{list-style:none; margin:36px 0 0; padding:0; display:grid; gap:0; counter-reset:n}
.fl-notes li{counter-increment:n; display:grid; grid-template-columns:56px 1fr; gap:4px 16px; padding:22px 0; border-top:1px solid var(--line)}
.fl-notes li:last-child{border-bottom:1px solid var(--line)}
.fl-notes li::before{content:"0" counter(n); grid-row:span 2; font:800 1.75rem/1 var(--f-head); color:var(--forest); opacity:.35}
.fl-notes h3{font-size:1.125rem; font-weight:700}
.fl-notes p{color:var(--stone)}
@media (min-width:960px){
  .fl-local{padding:136px 0}
  .fl-local__grid{grid-template-columns:5fr 7fr; gap:72px; align-items:start}
  .fl-local__fig{position:sticky; top:120px}
}

/* ===== 4. Permit ===== */
.fl-permit{padding:96px 0; background:var(--cream-2)}
.fl-permit__grid{display:grid; gap:40px}
.fl-permit .fl-h2{margin:14px 0 18px}
.fl-permit__body p+p{margin-top:14px}
.fl-permit__body p{color:var(--stone)}
.fl-permit__body strong{color:var(--char)}
.fl-permit__local{margin-top:22px !important; padding:18px 20px; background:var(--cream); border-radius:var(--r); font-size:.9375rem}
.fl-permit__local b{display:block; font:600 .7rem/1.2 var(--f-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--forest); margin-bottom:6px}
.fl-plan{list-style:none; margin:0; padding:0; display:grid; border-radius:var(--r); overflow:hidden; border:1px solid var(--line)}
.fl-plan li{position:relative; padding:24px 22px; display:grid; gap:8px; align-content:start; min-height:150px}
.fl-plan__zone{font:600 .72rem/1.2 var(--f-mono); letter-spacing:.14em; text-transform:uppercase}
.fl-plan h3{font-size:1.125rem; font-weight:700}
.fl-plan__verdict{justify-self:start; font:700 .8125rem/1 var(--f-body); padding:8px 12px; border-radius:999px}
.fl-plan__prop{background:var(--cream)}
.fl-plan__prop .fl-plan__verdict{background:var(--forest); color:var(--cream)}
.fl-plan__strip{background:#DCE6D3}
.fl-plan__road{background:#383A36; color:var(--cream)}
.fl-plan__road::after{content:""; position:absolute; left:22px; right:22px; bottom:16px; border-top:3px dashed rgba(245,196,0,.7)}
.fl-plan__strip .fl-plan__verdict,.fl-plan__road .fl-plan__verdict{background:var(--yellow); color:var(--char)}
.fl-plan__bin{width:68px; height:auto; color:var(--forest)}
@media (min-width:720px){ .fl-plan{grid-template-columns:1.3fr 1fr 1fr} .fl-plan li{min-height:260px} }
@media (min-width:1024px){
  .fl-permit{padding:136px 0}
  .fl-permit__grid{grid-template-columns:5fr 7fr; gap:72px; align-items:center}
}

/* ===== 5. Nearby suburbs ===== */
.fl-near{background:var(--forest); color:var(--cream); padding:96px 0}
.fl-near .fl-h2{margin:14px 0 18px; max-width:20ch}
.fl-line{list-style:none; margin:44px 0 0; padding:0; position:relative; display:grid; gap:0}
.fl-line::before{content:""; position:absolute; left:15px; top:16px; bottom:16px; width:3px; background:rgba(245,196,0,.45)}
.fl-stop{position:relative; display:flex; align-items:center; gap:18px; min-height:56px}
.fl-stop__dot{position:relative; z-index:1; width:33px; height:33px; flex:none; border-radius:50%; background:var(--forest); border:3px solid var(--yellow)}
.fl-stop--here .fl-stop__dot{background:var(--yellow); box-shadow:0 0 0 6px rgba(245,196,0,.22)}
.fl-stop a,.fl-stop .fl-stop__name{font:700 1.125rem/1.2 var(--f-head); text-decoration:none; color:var(--cream); padding:12px 0}
.fl-stop a{border-bottom:2px solid transparent}
.fl-stop a:hover{border-color:var(--yellow)}
.fl-stop small{font:500 .72rem/1.2 var(--f-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--yellow)}
.fl-near__foot{margin-top:40px; display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center}
@media (min-width:900px){
  .fl-near{padding:128px 0}
  .fl-line{grid-auto-flow:column; grid-auto-columns:1fr; margin-top:64px}
  .fl-line::before{left:16px; right:16px; top:15px; bottom:auto; width:auto; height:3px}
  .fl-stop{flex-direction:column; align-items:flex-start; gap:14px}
  .fl-stop a,.fl-stop .fl-stop__name{padding:4px 0}
}

/* ===== 6. Local FAQs ===== */
.fl-faq{padding:96px 0}
.fl-faq__grid{display:grid; gap:36px}
.fl-faq .fl-h2{margin:14px 0 18px}
.fl-qa{margin:0; padding:0; list-style:none; counter-reset:q}
.fl-qa__item{counter-increment:q; padding:26px 0; border-top:1px solid var(--line); display:grid; gap:10px}
.fl-qa__item:last-child{border-bottom:1px solid var(--line)}
.fl-qa__item h3{position:relative; padding-left:64px; font-size:1.1875rem; font-weight:700; line-height:1.3}
.fl-qa__item h3::before{content:"Q." counter(q); position:absolute; left:0; top:.2em; font:600 .78rem/1.6 var(--f-mono); letter-spacing:.1em; color:var(--yellow-ink)}
.fl-qa__item p{padding-left:64px; color:var(--stone)}
@media (max-width:480px){ .fl-qa__item p{padding-left:0} .fl-qa__item h3{padding-left:0; padding-top:24px} .fl-qa__item h3::before{top:0} }
@media (min-width:960px){
  .fl-faq{padding:136px 0}
  .fl-faq__grid{grid-template-columns:4fr 8fr; gap:72px}
  .fl-faq__aside{position:sticky; top:120px; align-self:start}
}


/* tokens used by the shared quick-quote section */
.fl { --flq-ink: #1B2E22; --flq-paper-hi: #FAF6EC; --flq-yellow: #F5C400; --flq-mute: #5F5E53; --flq-line: rgba(27,46,34,.16); --flq-rust: #8A3A2A;
  --flq-head: "Poppins", system-ui, sans-serif; --flq-body: "Inter", system-ui, sans-serif; --flq-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace; --flq-pad: clamp(1rem, 4vw, 4rem); --flq-snap: cubic-bezier(.19, 1, .22, 1); }
.fl .tbc{background:rgba(245,196,0,.3); outline:1px dashed #7A6100; outline-offset:1px; padding:0 .15em}
.fl .fl-qbtn { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 52px; padding: 0 1.5rem; border-radius: 999px; font: 700 .95rem/1 var(--flq-head); text-decoration: none; border: 2px solid transparent; transition: transform .2s var(--flq-snap), background .2s, color .2s; }
.fl .fl-qbtn svg { width: 16px; height: 16px; flex: none; }
.fl .fl-qbtn--ink { background: var(--flq-ink); color: var(--flq-paper-hi); }
.fl .fl-qbtn--ink:hover { background: var(--flq-paper-hi); color: var(--flq-ink); border-color: var(--flq-ink); }
.fl .fl-qf::before, .fl .fl-qf::after { content: ''; position: absolute; width: 18px; height: 18px; border: 2px solid var(--flq-ink); }
.fl .fl-qf::before { top: -2px; left: -2px; border-right: none; border-bottom: none; }
.fl .fl-qf::after { bottom: -2px; right: -2px; border-left: none; border-top: none; }
/* ── 7. Quick quote (shared with every suburb template) ────────── */
.fl-qq { position: relative; overflow: hidden; background: var(--flq-yellow); color: var(--flq-ink); padding: clamp(3.5rem, 7vw, 6rem) var(--flq-pad); }
.fl-qq::before, .fl-qq::after { content: ''; position: absolute; border: 3px solid var(--flq-ink); border-radius: 50%; pointer-events: none; }
.fl-qq::before { top: -100px; right: -100px; width: 320px; height: 320px; opacity: .1; }
.fl-qq::after { bottom: -140px; left: -80px; width: 400px; height: 400px; opacity: .08; }
.fl-qq__in { position: relative; z-index: 1; max-width: 1300px; margin: 0 auto; display: grid; gap: 2.5rem; align-items: center; }
.fl-qq__kick { display: inline-flex; align-items: center; gap: .5rem; margin-bottom: 1rem; font: 700 .68rem/1.2 var(--flq-mono); letter-spacing: .2em; text-transform: uppercase; }
.fl-qq__kick::before { content: ''; width: 8px; height: 8px; background: var(--flq-ink); }
.fl .fl-qq__h { font-size: clamp(2rem, 4.5vw, 3.75rem); font-weight: 800; line-height: 1.1; letter-spacing: -.04em; margin-bottom: 1.25rem; }
.fl-qq__h em { font-style: normal; display: inline-block; line-height: 1; margin-top: .08em; padding: .02em .14em .06em; background: var(--flq-ink); color: var(--flq-yellow); }
.fl-qq__p { max-width: 46ch; margin-bottom: 1.75rem; font-weight: 600; line-height: 1.55; color: rgba(27,46,34,.85); }
.fl-qf { position: relative; padding: 1.75rem 1.5rem 1.5rem; background: var(--flq-paper-hi); border: 2px solid var(--flq-ink); box-shadow: 0 30px 60px -30px rgba(27,46,34,.5); }
.fl-qf__head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding-bottom: .85rem; margin-bottom: 1.25rem; border-bottom: 1px solid var(--flq-ink); font: 700 .62rem/1.2 var(--flq-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--flq-mute); }
.fl-qf__head b { font: 800 .95rem/1.2 var(--flq-head); letter-spacing: -.01em; text-transform: none; color: var(--flq-ink); }
.fl-qf__field { display: flex; flex-direction: column; gap: .45rem; margin-bottom: 1rem; }
.fl-qf__field label { font: 600 .62rem/1.2 var(--flq-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--flq-mute); }
.fl-qf__field input, .fl-qf__field select { width: 100%; padding: .95rem 1rem; border: 1.5px solid var(--flq-line); border-radius: 0; background: #F3EEE2; font: 600 .95rem/1.2 var(--flq-body); color: var(--flq-ink); -webkit-appearance: none; appearance: none; }
.fl-qf__field input::placeholder { color: #8A867B; }
.fl-qf__field input:focus, .fl-qf__field select:focus { outline: none; border-color: var(--flq-ink); background: #FFFBF0; }
.fl-qf__field select { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%231B2E22' d='M6 8L0 0h12z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center; padding-right: 2.5rem; }
.fl-qf__field input[readonly] { background: #E9E1CF; font-family: var(--flq-mono); font-weight: 700; }
.fl-qf__field [aria-invalid="true"] { border-color: #A3341F; background: #FFF4F1; }
.fl-qf__err { font-size: .8rem; font-weight: 600; color: #A3341F; }
.fl-qf__err:empty { display: none; }
.fl-qf__pair { display: grid; gap: 0 .85rem; }
.fl-qf__submit { width: 100%; margin-top: .5rem; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 54px; padding: 0 1.5rem; border: none; border-radius: 999px; background: var(--flq-ink); color: var(--flq-paper-hi); font: 700 .95rem/1 var(--flq-head); cursor: pointer; transition: background .2s, transform .2s; }
.fl-qf__submit:hover { background: var(--flq-rust); transform: translateY(-1px); }
.fl-qf__submit[disabled] { opacity: .7; cursor: wait; }
.fl-qf__submit svg { width: 14px; height: 14px; }
.fl-qf__note { margin-top: .85rem; display: flex; align-items: center; justify-content: center; gap: .5rem; font: 500 .66rem/1.3 var(--flq-mono); letter-spacing: .06em; color: var(--flq-mute); text-align: center; }
.fl-qf__note svg { width: 12px; height: 12px; flex: none; }
.fl-qf__done { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: center; gap: .9rem; padding: 2rem; background: var(--flq-paper-hi); }
.fl-qf__done[hidden] { display: none; }
.fl-qf__done b { font: 800 1.35rem/1.2 var(--flq-head); color: var(--flq-ink); }
.fl-qf__done p { color: var(--flq-mute); }
.fl-qf__done a { color: var(--flq-ink); font-weight: 700; }
.fl-qf__again { align-self: flex-start; min-height: 46px; padding: 0 1.2rem; border-radius: 999px; border: 2px solid var(--flq-ink); background: transparent; font: 700 .9rem/1 var(--flq-body); color: var(--flq-ink); cursor: pointer; }
.fl-qf__again:hover { background: var(--flq-ink); color: var(--flq-paper-hi); }
@media (min-width: 560px) { .fl-qf__pair { grid-template-columns: 1fr 1fr; } .fl-qf { padding: 1.75rem; } }
@media (min-width: 960px) { .fl-qq__in { grid-template-columns: 1.1fr 1fr; gap: 4rem; } }


/* Reveal (JS only) */
.fl.js .fl-reveal{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1)}
.fl.js .fl-reveal.is-in{opacity:1; transform:none}

@media (prefers-reduced-motion:reduce){
  .fl *,.fl *::before,.fl *::after{animation:none !important; transition:none !important}
  .fl.js .fl-reveal{opacity:1; transform:none}
  .fl-btn:hover,.fl-frame__photo:hover img{transform:none}
}

.fl-hero__panel .fl-kicker{display:flex; flex-wrap:wrap; gap:4px 8px}
.fl-hero__panel .fl-kicker::before{align-self:center}
.fl-hero__note{margin-top:12px; font-size:1rem; color:rgba(250,246,236,.74)}
/* Production */
body.admin-bar .site-header{top:32px}
@media (max-width:782px){body.admin-bar .site-header{top:46px}}
