/* The Founding 100 — compact glass panel INSIDE the Coming Soon hero + registration modal (CSS-only placement,
   2026-10-30). The markup is still rendered after .stage (hook bm_coming_soon_after_stage); the hero template is not
   changed. Desktop: .stage/.frame/.ui become display:contents and <body> takes over the frame's grid, .media carries
   the rounded frame box, so header, heading block, panel and footer share one frame and can never overlap; the
   heading block and the panel are centred together. Portrait/narrow: the same flow as before (header, portrait,
   heading) with the panel before the footer. Uses the page tokens (--night, --night-2, --burgundy, --burgundy-2,
   --ivory, --ivory-dim, --champagne, --champagne-2, --hair, --gut, --pad, --r). */
.f100{position:relative;z-index:3;color:var(--ivory);padding:clamp(16px,1.35vw,20px) clamp(18px,1.6vw,24px);border-radius:clamp(16px,1.4vw,22px);background:rgba(52,13,23,.52);border:1px solid rgba(200,176,122,.3);-webkit-backdrop-filter:blur(16px) saturate(1.1);backdrop-filter:blur(16px) saturate(1.1);box-shadow:0 22px 60px -32px rgba(0,0,0,.7);scroll-margin:16px}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.f100{background:rgba(38,11,18,.92)}}
.f100__panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,.66fr);grid-template-areas:"title live" "lead live" "offer live" "cta live" "status status" "note note";column-gap:clamp(18px,2vw,30px);align-items:start}
.f100__intro{display:contents}
.f100__kicker{display:none}
.f100__title{grid-area:title;margin:0;font-weight:300;font-size:clamp(1.5rem,1.75vw,1.85rem);line-height:1.05;letter-spacing:-.01em;color:var(--ivory);text-wrap:balance}
.f100__lead{grid-area:lead;margin:4px 0 0;font-style:italic;font-weight:400;font-size:clamp(.98rem,1.05vw,1.08rem);line-height:1.32;color:var(--ivory-dim)}
.f100__offer{grid-area:offer;display:flex;flex-wrap:wrap;gap:8px 26px;margin:12px 0 0;padding:0}
.f100__offer div{margin:0}
.f100__offer dt{margin:0 0 3px;font-size:9.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:rgba(246,241,234,.56)}
.f100__offer dd{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(1.1rem,1.25vw,1.3rem);line-height:1.15;color:var(--champagne-2)}
.f100__actions{grid-area:cta;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.f100__cta{appearance:none;border:0;cursor:pointer;min-height:44px;padding:0 24px;border-radius:999px;background:var(--champagne-2);color:var(--night);font:500 11.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;transition:background .3s,transform .3s,opacity .3s}
.f100__cta:hover{background:#F6EBD2;transform:translateY(-1px)}
.f100__cta:focus-visible{outline:none;box-shadow:0 0 0 2px var(--night),0 0 0 4px var(--champagne)}
.f100__cta[disabled]{opacity:.45;cursor:default;transform:none}
.f100__note{grid-area:note;margin:12px 0 0;padding-top:10px;border-top:1px solid rgba(200,176,122,.16);font-size:10.5px;line-height:1.5;color:rgba(246,241,234,.58)}
.f100__status{grid-area:status;margin:16px 0 0;padding:16px 18px;border-radius:14px;background:rgba(20,8,9,.38);border:1px solid rgba(200,176,122,.26);outline:none}
.f100__status h3{margin:0 0 6px;font-family:"Cormorant Garamond",Georgia,serif;font-weight:300;font-size:1.55rem;line-height:1.05;color:var(--ivory)}
.f100__status p{margin:6px 0 0;font-size:13.5px;line-height:1.55;color:var(--ivory-dim)}
.f100__status .f100__ref{margin:12px 0 4px;font-family:"Cormorant Garamond",Georgia,serif;font-size:2.1rem;line-height:1;letter-spacing:.06em;color:var(--champagne-2)}
.f100__status .f100__reflabel{margin:0;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(246,241,234,.56)}
.f100__status dl{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:12px 0 0;font-size:13px}
.f100__status dt{color:rgba(246,241,234,.56)}.f100__status dd{margin:0;color:var(--ivory)}
.f100__otp{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 0;align-items:center}
.f100__otp input{width:9.5em!important;letter-spacing:.3em;text-align:center;font-size:1.3rem}
.f100__linkbtn{appearance:none;background:none;border:0;padding:0;color:var(--champagne-2);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font:inherit}
.f100__live{grid-area:live;display:flex;flex-direction:column;align-self:stretch;justify-content:center;margin:0;padding:0 0 0 clamp(18px,2vw,28px);border-left:1px solid rgba(200,176,122,.18)}
.f100__stats{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.f100__stats li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0;padding:0;border:0}
.f100__stats li[hidden]{display:none}
.f100__stats strong{order:2;font-family:"Cormorant Garamond",Georgia,serif;font-weight:400;font-size:clamp(1.35rem,1.6vw,1.7rem);line-height:1;color:var(--champagne-2);font-variant-numeric:tabular-nums;transition:opacity .4s}
.f100__stats strong.is-updating{opacity:.4}
.f100__stats span{font-size:9.5px;line-height:1.35;letter-spacing:.12em;text-transform:uppercase;color:rgba(246,241,234,.68)}
.f100__bar{position:relative;height:3px;margin:14px 0 8px;border-radius:999px;background:rgba(246,241,234,.14);overflow:hidden}
.f100__bar i{position:absolute;inset:0 auto 0 0;border-radius:999px;background:linear-gradient(90deg,var(--burgundy-2),var(--champagne));transition:width 1s cubic-bezier(.2,.7,.2,1)}
.f100__cap{margin:0;font-size:9.5px;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;color:rgba(246,241,234,.56)}
.f100__updated{white-space:nowrap}
.f100__privacy{margin:3px 0 0;font-size:10.5px;line-height:1.5;color:rgba(246,241,234,.5)}
.f100-footlink{display:none}
.f100 [hidden],.f100-modal [hidden]{display:none!important}
.f100-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* ---------- desktop / landscape: one frame, panel in the frame grid (complement of the template's portrait query) ---------- */
@media (min-width:901px) and (min-aspect-ratio:10001/10000){
 body{--f100-uipad:clamp(22px,2.6vw,44px);display:grid;grid-template-columns:minmax(var(--gut),1fr) var(--pad) minmax(0,calc(1840px - 2 * var(--pad))) var(--pad) minmax(var(--gut),1fr);grid-template-rows:var(--gut) var(--f100-uipad) auto minmax(0,1fr) auto auto minmax(0,1fr) auto var(--f100-uipad) var(--gut);min-height:max(100svh,calc(560px + 2 * var(--gut)))}
 .stage,.frame,.ui{display:contents}
 .frame:after{content:none}
 .media{position:relative;inset:auto;grid-column:2/5;grid-row:2/10;border-radius:var(--r);overflow:hidden;isolation:isolate;background:var(--night-2);box-shadow:0 40px 120px -40px rgba(0,0,0,.8)}
 .media picture{position:absolute;inset:0}
 .media:after{content:"";position:absolute;inset:0;z-index:5;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--hair);pointer-events:none}
 header{grid-column:3;grid-row:3;position:relative;z-index:3}
 main{grid-column:3;grid-row:5;position:relative;z-index:3;padding-top:clamp(12px,2.6vh,40px);padding-bottom:clamp(16px,2.4vh,26px)}
 .f100{grid-column:3;grid-row:6;justify-self:start;width:min(100%,max(54%,500px),700px);margin-bottom:14px}
 footer{grid-column:3;grid-row:8;position:relative;z-index:3}
}
/* short landscape screens (laptops, tablets): tighter panel so the frame keeps its height */
@media (min-width:901px) and (min-aspect-ratio:10001/10000) and (max-height:820px){
 main{padding-top:8px;padding-bottom:14px}
 .f100{padding:14px 20px;margin-bottom:10px}
 .f100__lead{font-size:.96rem}
 .f100__offer,.f100__actions{margin-top:10px}
 .f100__note{margin-top:10px;padding-top:8px;font-size:10px}
 .f100__privacy{font-size:10px}
 .f100__stats{gap:7px}
 .f100__bar{margin:10px 0 6px}
}

/* ---------- modal ---------- */
.f100-modal{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:var(--gut)}
.f100-modal[hidden]{display:none}
.f100-modal__backdrop{position:absolute;inset:0;background:rgba(20,8,9,.78);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.f100-modal__dialog{position:relative;width:min(640px,100%);max-height:calc(100svh - 2 * var(--gut));display:flex;flex-direction:column;border-radius:var(--r);background:linear-gradient(160deg,#241014 0%,#170a0d 100%);box-shadow:inset 0 0 0 1px var(--hair),0 50px 140px -40px rgba(0,0,0,.9);color:var(--ivory);outline:none;animation:f100in .45s cubic-bezier(.2,.7,.2,1)}
@keyframes f100in{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.f100-modal__head{position:relative;padding:22px 28px 0}
.f100-modal__step{margin:0 0 14px;font-size:10.5px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--champagne)}
.f100-modal__close{position:absolute;top:12px;right:14px;width:40px;height:40px;border:0;border-radius:50%;background:transparent;color:rgba(246,241,234,.7);font-size:26px;line-height:1;cursor:pointer}
.f100-modal__close:hover,.f100-modal__close:focus-visible{background:rgba(246,241,234,.08);color:var(--ivory);outline:none}
.f100-modal__progress{height:2px;background:rgba(246,241,234,.1);border-radius:999px;overflow:hidden}
.f100-modal__progress i{display:block;height:100%;width:25%;background:linear-gradient(90deg,var(--burgundy-2),var(--champagne));transition:width .5s cubic-bezier(.2,.7,.2,1)}
.f100-modal__body{flex:1;overflow:auto;padding:22px 28px 10px;-webkit-overflow-scrolling:touch}
.f100-modal__title{margin:0 0 6px;font-weight:300;font-size:clamp(1.8rem,3vw,2.4rem);line-height:1.05;letter-spacing:-.01em}
.f100-modal__help{margin:0 0 20px;font-size:13.5px;line-height:1.55;color:var(--ivory-dim)}
.f100-modal__error{margin:14px 0 0;padding:12px 14px;border-radius:12px;background:rgba(122,31,61,.35);border:1px solid rgba(200,176,122,.3);font-size:13.5px;color:var(--ivory)}
.f100-modal__foot{display:flex;justify-content:space-between;gap:12px;padding:14px 28px max(22px,env(safe-area-inset-bottom));border-top:1px solid rgba(200,176,122,.14)}
.f100-btn{appearance:none;cursor:pointer;min-height:48px;padding:0 26px;border-radius:999px;border:1px solid transparent;font:500 12.5px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;transition:background .25s,color .25s,opacity .25s}
.f100-btn--primary{background:var(--champagne-2);color:var(--night)}
.f100-btn--primary:hover{background:#F6EBD2}
.f100-btn--ghost{background:transparent;color:rgba(246,241,234,.72);border-color:rgba(246,241,234,.18)}
.f100-btn--ghost:hover{color:var(--ivory);border-color:var(--champagne)}
.f100-btn:focus-visible{outline:none;box-shadow:0 0 0 2px var(--night),0 0 0 4px var(--champagne)}
.f100-btn[disabled]{opacity:.45;cursor:default}
.f100-btn[hidden]{display:none}
/* choices */
.f100-choice{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.f100-choice label{display:grid;grid-template-columns:22px 1fr auto;gap:14px;align-items:start;padding:16px 18px;border-radius:14px;border:1px solid rgba(200,176,122,.2);background:rgba(246,241,234,.03);cursor:pointer;transition:border-color .25s,background .25s}
.f100-choice label:hover{border-color:rgba(200,176,122,.5)}
.f100-choice input{appearance:none;width:18px;height:18px;margin:3px 0 0;border-radius:50%;border:1px solid rgba(200,176,122,.6);background:transparent;display:grid;place-content:center}
.f100-choice input:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--champagne-2);transform:scale(0);transition:transform .2s}
.f100-choice input:checked:before{transform:scale(1)}
.f100-choice input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(200,176,122,.35)}
.f100-choice label:has(input:checked){border-color:var(--champagne);background:rgba(200,176,122,.08)}
.f100-choice b{display:block;font-weight:500;font-size:15.5px;color:var(--ivory)}
.f100-choice small{display:block;margin-top:3px;font-size:13px;line-height:1.5;color:var(--ivory-dim)}
.f100-choice em{font-style:normal;white-space:nowrap;font-family:"Cormorant Garamond",Georgia,serif;font-size:1.25rem;color:var(--champagne-2)}
/* fields */
.f100-field{display:block;margin:0 0 16px}
.f100-field .f100-label{display:block;margin:0 0 7px;font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:rgba(246,241,234,.62)}
.f100-field > input,.f100-phone input,.f100-field > select,.f100-phone select,.f100__otp input{width:100%;min-height:50px;padding:0 16px;border-radius:12px;border:1px solid rgba(200,176,122,.28);background:rgba(246,241,234,.05);color:var(--ivory);font:400 16px/1.3 Inter,system-ui,sans-serif;transition:border-color .25s,box-shadow .25s}
.f100-field > input:focus,.f100-phone input:focus,.f100-phone select:focus,.f100__otp input:focus{outline:none;border-color:var(--champagne);box-shadow:0 0 0 3px rgba(200,176,122,.18)}
.f100-field > input[aria-invalid=true],.f100-phone input[aria-invalid=true]{border-color:#D9868F}
.f100-phone select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C8B07A' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.f100-phone select option{color:#2B2024;background:#F6F1EA}
.f100-field .f100-hint{display:block;margin:6px 0 0;font-size:12.5px;line-height:1.5;color:rgba(246,241,234,.5)}
.f100-field .f100-err{display:block;margin:6px 0 0;font-size:12.5px;color:#E9A3AB}
.f100-phone{display:grid;grid-template-columns:minmax(140px,.55fr) 1fr;gap:10px}
.f100-or{display:flex;align-items:center;gap:14px;margin:4px 0 16px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(246,241,234,.4)}
.f100-or:before,.f100-or:after{content:"";flex:1;height:1px;background:rgba(200,176,122,.16)}
.f100-check{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;margin:14px 0 0;font-size:14px;line-height:1.55;color:var(--ivory-dim);cursor:pointer}
.f100-check input{appearance:none;width:18px;height:18px;margin:2px 0 0;border-radius:5px;border:1px solid rgba(200,176,122,.6);background:transparent;display:grid;place-content:center}
.f100-check input:before{content:"";width:10px;height:6px;border-left:2px solid var(--night);border-bottom:2px solid var(--night);transform:rotate(-45deg) scale(0);transition:transform .15s}
.f100-check input:checked{background:var(--champagne-2);border-color:var(--champagne-2)}
.f100-check input:checked:before{transform:rotate(-45deg) scale(1)}
.f100-check input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(200,176,122,.35)}
.f100-check[data-invalid=true]{color:#E9A3AB}
.f100-review{margin:0 0 18px;padding:0;display:grid;gap:0}
.f100-review div{display:grid;grid-template-columns:minmax(110px,.4fr) 1fr;gap:14px;padding:11px 0;border-bottom:1px solid rgba(200,176,122,.14)}
.f100-review dt{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(246,241,234,.5);padding-top:3px}
.f100-review dd{margin:0;font-size:15px;color:var(--ivory)}
.f100-terms{max-height:150px;overflow:auto;padding:14px 16px;border-radius:12px;background:rgba(246,241,234,.04);border:1px solid rgba(200,176,122,.16);font-size:13px;line-height:1.6;color:var(--ivory-dim)}
.f100-terms h4{margin:0 0 8px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--champagne)}
/* done state inside the modal is not used: the modal closes and the section shows the status (same page) */
@media (max-width:900px),(max-aspect-ratio:1/1){
 body{display:flex;flex-direction:column;min-height:100svh}
 .stage,.frame{display:contents}
 .f100{order:3;margin:0 16px 8px;padding:20px 18px 18px}
 .f100__panel{grid-template-columns:minmax(0,1fr);grid-template-areas:"title" "lead" "offer" "cta" "live" "status" "note"}
 .f100__live{margin:18px 0 0;padding:14px 0 0;border-left:0;border-top:1px solid rgba(200,176,122,.18)}
 .f100__stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px}
 .f100__stats li{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:6px}
 .f100__stats strong{order:-1;font-size:1.75rem}
 .f100__cta{width:100%;min-height:50px}
 .f100-modal{padding:0;align-items:stretch}
 .f100-modal__dialog{width:100%;max-height:none;height:100svh;border-radius:0;animation:f100up .45s cubic-bezier(.2,.7,.2,1)}
 @keyframes f100up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
 .f100-modal__head{padding:max(18px,env(safe-area-inset-top)) 22px 0}
 .f100-modal__body{padding:18px 22px 10px}
 .f100-modal__foot{padding:12px 22px max(18px,env(safe-area-inset-bottom))}
 .f100-phone{grid-template-columns:1fr}
 .f100-choice label{grid-template-columns:22px 1fr}.f100-choice em{grid-column:2;margin-top:4px;white-space:normal}
}
@media (min-width:600px) and (max-width:900px),(min-width:600px) and (max-aspect-ratio:1/1){
 .f100{align-self:center;width:min(calc(100% - 2 * var(--gut)),600px);margin:0 0 10px}
}
@media (max-width:370px){.f100{margin:0 12px 8px;padding:18px 16px 16px}.f100__stats strong{font-size:1.55rem}.f100-modal__body,.f100-modal__head,.f100-modal__foot{padding-left:18px;padding-right:18px}}
@media (prefers-reduced-motion:reduce){.f100-modal__dialog,.f100__bar i,.f100-modal__progress i,.f100__cta,.f100-btn{animation:none;transition:none}}
