/* ════════════════════════════════════════════════
   BOOKED BRIDAL — Reserve Your Area funnel
   Three editorial directions, one shared form.
   dir-a  Atelier   — light photographic rail + form
   dir-b  Editorial — centered stationery column
   dir-c  Boudoir   — floating card on full-bleed photo
   ════════════════════════════════════════════════ */

.apply-body{
  --accent:var(--gold);
  background:var(--paper);
  min-height:100vh;
}

.exit-link{
  position:fixed;top:22px;right:26px;z-index:40;
  font-family:var(--sans);font-size:10.5px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--ink-55);display:inline-flex;align-items:center;gap:8px;
  padding:9px 15px;background:rgba(252,250,246,0.7);border:1px solid var(--line-soft);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:color .25s,border-color .25s;
}
.exit-link:hover{color:var(--ink);border-color:var(--line);}

/* ── shared shell ── */
.apply-backdrop{display:none;}
.apply-shell{display:grid;min-height:100vh;}
.apply-main{display:flex;align-items:center;justify-content:center;padding:clamp(40px,6vw,80px) clamp(22px,4vw,64px);}
.apply-card{width:100%;max-width:580px;}

/* ── editorial card header ── */
.card-top{margin-bottom:clamp(30px,4vw,46px);}
.card-brand{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:0.01em;color:var(--ink);display:inline-block;margin-bottom:26px;}
.card-brand i{font-style:italic;font-weight:500;color:var(--taupe-deep);}

/* horizontal step rail (dir-b / dir-c) */
.flow-steps{list-style:none;display:flex;gap:0;counter-reset:fs;}
.flow-steps li{flex:1;display:flex;flex-direction:column;gap:9px;position:relative;padding-top:16px;color:var(--ink-40);transition:color .35s ease;}
.flow-steps li::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--line-soft);transition:background .35s ease;}
.flow-steps li.active::before,.flow-steps li.done::before{background:var(--accent);}
.flow-steps li .fs-n{font-family:var(--mono);font-size:10.5px;letter-spacing:0.14em;}
.flow-steps li .fs-t{font-family:var(--sans);font-size:11px;letter-spacing:0.1em;line-height:1.3;}
.flow-steps li.active{color:var(--ink);}
.flow-steps li.done{color:var(--taupe-deep);}
.flow-steps li.done .fs-n::before{content:"\2713  ";color:var(--accent);}

/* ── form ── */
#apply-form{position:relative;}
.fstep{display:none;}
.fstep.show{display:block;animation:fstep-in .5s cubic-bezier(.2,.7,.2,1);}
/* entrance animates TRANSFORM ONLY so a throttled/backgrounded tab that freezes
   the animation at frame 0 still shows the content (never opacity:0). */
@keyframes fstep-in{from{transform:translateY(15px);}to{transform:none;}}
@keyframes soft-in{from{transform:translateY(10px);}to{transform:none;}}
@media (prefers-reduced-motion:reduce){.fstep.show{animation:none;}}

.fstep-kicker{font-family:var(--sans);font-size:10.5px;letter-spacing:0.26em;text-transform:uppercase;color:var(--accent);margin-bottom:18px;}
.fstep h2{font-size:clamp(28px,3.6vw,44px);line-height:1.04;margin-bottom:14px;}
.fstep h2 .serif-i{color:var(--taupe-deep);}
.fstep-sub{color:var(--ink-55);font-size:15px;margin-bottom:32px;max-width:42ch;}

/* availability ribbon — calm, instant, no fake spinner */
.ribbon{display:none;align-items:flex-start;gap:13px;padding:15px 18px;margin-bottom:30px;
  background:color-mix(in srgb,var(--accent) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 38%,transparent);}
.ribbon.show{display:flex;animation:soft-in .5s ease;}
.ribbon .seal{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--accent);position:relative;margin-top:1px;}
.ribbon .seal::after{content:"";position:absolute;inset:0;margin:auto;width:9px;height:5px;border-left:1.6px solid #fff;border-bottom:1.6px solid #fff;transform:rotate(-45deg);top:-1px;}
.ribbon .rb-t{font-size:13px;line-height:1.45;color:var(--ink);}
.ribbon .rb-t b{font-weight:600;}
.ribbon .rb-t span{display:block;color:var(--ink-55);font-size:12px;margin-top:2px;}

/* fields */
.field{margin-bottom:22px;}
.field label{display:block;font-family:var(--sans);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--taupe);margin-bottom:10px;}
.field .opt{text-transform:none;letter-spacing:0;color:var(--ink-40);font-size:12px;}
.finput{width:100%;height:54px;background:var(--white);border:1px solid var(--line);padding:0 17px;
  font-family:var(--sans);font-size:15.5px;font-weight:400;color:var(--ink);outline:none;
  transition:border-color .25s,box-shadow .25s,background .25s;}
textarea.finput{height:auto;padding:14px 17px;resize:vertical;min-height:96px;line-height:1.55;}
.finput::placeholder{color:var(--ink-40);}
.finput:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent);}
.finput.err{border-color:#b45f4d;}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:15px;}
@media(max-width:540px){.row2{grid-template-columns:1fr;}}

/* lined field variant (editorial) */
.apply-body.field-lined .finput{background:transparent;border:0;border-bottom:1px solid var(--line);padding-left:0;padding-right:0;height:50px;}
.apply-body.field-lined textarea.finput{padding-left:0;padding-right:0;}
.apply-body.field-lined .finput:focus{box-shadow:none;border-bottom-color:var(--accent);}
.apply-body.field-lined .finput.err{border-bottom-color:#b45f4d;}

/* choice cards */
.choices{display:grid;gap:11px;}
.choices.c2{grid-template-columns:1fr 1fr;}
@media(max-width:540px){.choices.c2{grid-template-columns:1fr;}}
.choice{border:1px solid var(--line);background:var(--white);padding:15px 17px;cursor:pointer;
  display:flex;align-items:center;gap:13px;transition:border-color .2s,background .2s,transform .12s;
  font-size:14.5px;color:var(--ink-72);user-select:none;}
.choice:hover{border-color:var(--taupe-deep);transform:translateY(-1px);}
.choice .mk{width:17px;height:17px;border:1px solid var(--taupe);border-radius:50%;flex-shrink:0;position:relative;transition:.2s;}
.choice.multi .mk{border-radius:4px;}
.choice.sel{border-color:var(--ink);background:var(--paper);color:var(--ink);}
.choice.sel .mk{background:var(--accent);border-color:var(--accent);}
.choice.sel .mk::after{content:"";position:absolute;inset:0;margin:auto;width:5px;height:5px;border-radius:50%;background:#fff;}
.choice.multi.sel .mk::after{width:8px;height:4px;border-radius:0;background:none;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(-45deg);top:-1px;}

.err-msg{color:#b45f4d;font-size:12.5px;margin-top:8px;display:none;}
.err-msg.show{display:block;}

/* consent */
.consent{display:flex;gap:12px;align-items:flex-start;margin-top:10px;cursor:pointer;}
.consent .mk2{width:18px;height:18px;border:1px solid var(--taupe);flex-shrink:0;margin-top:2px;position:relative;transition:.2s;border-radius:3px;}
.consent.on .mk2{background:var(--accent);border-color:var(--accent);}
.consent.on .mk2::after{content:"";position:absolute;inset:0;margin:auto;width:9px;height:5px;border-left:1.6px solid #fff;border-bottom:1.6px solid #fff;transform:rotate(-45deg);top:-1px;}
.consent span{font-size:12px;color:var(--ink-55);line-height:1.5;}

/* actions */
.actions{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:38px;}
.btn-back2{background:none;border:0;cursor:pointer;font-family:var(--sans);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--taupe);transition:color .2s;}
.btn-back2:hover{color:var(--ink);}
.btn-back2[disabled]{opacity:0;pointer-events:none;}
.btn-next{margin-left:auto;background:var(--ink);}
.btn-next:hover{background:var(--espresso);}

/* ── success ── */
.success{display:none;text-align:center;animation:soft-in .6s ease;}
.success.show{display:block;}
.success .seal-lg{width:70px;height:70px;border:1px solid var(--accent);border-radius:50%;margin:0 auto 28px;display:flex;align-items:center;justify-content:center;}
.success .seal-lg::after{content:"";width:25px;height:13px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg);margin-top:-6px;}
.success h2{margin-bottom:14px;}
.success p{max-width:44ch;margin:0 auto 14px;color:var(--ink-72);font-size:15px;}
.success .next{margin:32px auto 0;text-align:left;max-width:420px;border-top:1px solid var(--line);padding-top:24px;}
.success .next .ni{display:flex;gap:16px;padding:12px 0;font-size:14px;color:var(--ink-72);}
.success .next .ni b{font-family:var(--mono);font-size:11px;color:var(--accent);padding-top:3px;}

/* ════════════════════════════════════════════════
   DIRECTION A — ATELIER (photographic rail)
   ════════════════════════════════════════════════ */
.apply-body.dir-a .apply-shell{grid-template-columns:0.92fr 1.08fr;}
.apply-body.dir-a .apply-aside{position:relative;overflow:hidden;min-height:100vh;}
.apply-body.dir-a .aside-photo{position:absolute;inset:0;
  background:#221d17;
  background-image:
    radial-gradient(circle at 32% 30%,rgba(176,147,106,0.18),transparent 55%),
    repeating-linear-gradient(135deg,rgba(176,147,106,0.10) 0 1px,transparent 1px 16px);}
.apply-body.dir-a .aside-photo::after{color:rgba(236,230,220,0.5);border-color:rgba(176,147,106,0.3);background:rgba(34,29,23,0.55);}
.apply-body.dir-a .aside-photo::before{content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(20,17,13,0.30) 0%,rgba(20,17,13,0.12) 38%,rgba(20,17,13,0.30) 70%,rgba(20,17,13,0.70) 100%);}
.apply-body.dir-a .aside-content{position:relative;z-index:3;height:100%;min-height:100vh;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(32px,4vw,58px) clamp(28px,3.4vw,56px);color:var(--cream);}
.apply-body.dir-a .aside-brand{font-family:var(--serif);font-style:italic;font-weight:500;font-size:28px;color:var(--cream);}
.apply-body.dir-a .aside-mid{margin-top:auto;margin-bottom:36px;}
.apply-body.dir-a .aside-mid h1{color:var(--cream);font-size:clamp(34px,3.6vw,54px);line-height:1.02;margin-bottom:18px;}
.apply-body.dir-a .aside-mid h1 em{font-style:italic;color:var(--accent);}
.apply-body.dir-a .aside-mid p{color:rgba(236,230,220,0.82);max-width:34ch;font-size:15px;}
.apply-body.dir-a .aside-steps .flow-steps{flex-direction:column;gap:1px;}
.apply-body.dir-a .aside-steps .flow-steps li{flex:none;flex-direction:row;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid rgba(236,230,220,0.14);color:rgba(236,230,220,0.5);}
.apply-body.dir-a .aside-steps .flow-steps li::before{display:none;}
.apply-body.dir-a .aside-steps .flow-steps li .fs-t{font-size:12.5px;letter-spacing:0.06em;}
.apply-body.dir-a .aside-steps .flow-steps li.active{color:var(--cream);}
.apply-body.dir-a .aside-steps .flow-steps li.active .fs-n{color:var(--accent);}
.apply-body.dir-a .aside-steps .flow-steps li.done{color:rgba(236,230,220,0.72);}
.apply-body.dir-a .aside-foot{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:0.06em;color:rgba(236,230,220,0.6);margin-top:26px;}
.apply-body.dir-a .aside-foot .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);}
.apply-body.dir-a .card-top{display:none;}      /* steps live in the rail */
.apply-body.dir-a .apply-main{background:var(--white);}

/* ════════════════════════════════════════════════
   DIRECTION B — EDITORIAL (centered stationery)
   ════════════════════════════════════════════════ */
.apply-body.dir-b{background:var(--paper);}
.apply-body.dir-b .apply-aside{display:none;}
.apply-body.dir-b .apply-shell{grid-template-columns:1fr;}
.apply-body.dir-b .apply-main{padding-top:clamp(52px,7vw,96px);align-items:flex-start;}
.apply-body.dir-b .apply-card{max-width:600px;}
.apply-body.dir-b .card-top{text-align:center;}
.apply-body.dir-b .card-brand{display:block;margin-bottom:30px;font-style:italic;font-weight:500;font-size:26px;}
.apply-body.dir-b .flow-steps{max-width:480px;margin-inline:auto;}
.apply-body.dir-b .fstep h2,.apply-body.dir-b .fstep-kicker{text-align:center;}
.apply-body.dir-b .fstep-sub{text-align:center;margin-inline:auto;}
.apply-body.dir-b .fstep h2{font-family:var(--serif);}

/* ════════════════════════════════════════════════
   DIRECTION C — BOUDOIR (card on full-bleed photo)
   ════════════════════════════════════════════════ */
.apply-body.dir-c{background:var(--espresso);}
.apply-body.dir-c .apply-aside{display:none;}
.apply-body.dir-c .apply-shell{grid-template-columns:1fr;}
.apply-body.dir-c .apply-backdrop{display:block;position:fixed;inset:0;z-index:0;}
.apply-body.dir-c .apply-backdrop .ph{position:absolute;inset:0;z-index:0;}
.apply-body.dir-c .apply-backdrop .bd-scrim{position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(36,31,25,0.64),rgba(28,24,19,0.82));}
.apply-body.dir-c .apply-main{position:relative;z-index:2;padding-block:clamp(48px,6vw,88px);}
.apply-body.dir-c .apply-card{max-width:600px;background:var(--white);position:relative;
  padding:clamp(30px,3.4vw,52px);box-shadow:0 60px 120px -50px rgba(0,0,0,0.7);}
.apply-body.dir-c .apply-card::before{content:"";position:absolute;inset:11px;border:1px solid var(--line-soft);pointer-events:none;z-index:1;}
.apply-body.dir-c #apply-form,.apply-body.dir-c .success,.apply-body.dir-c .card-top{position:relative;z-index:2;}
.apply-body.dir-c .card-top{text-align:center;}
.apply-body.dir-c .card-brand{display:block;margin-bottom:26px;}
.apply-body.dir-c .exit-link{background:rgba(36,31,25,0.4);border-color:rgba(236,230,220,0.2);color:rgba(236,230,220,0.85);}
.apply-body.dir-c .exit-link:hover{color:#fff;}

/* ── responsive ── */
@media(max-width:900px){
  .apply-body.dir-a .apply-shell{grid-template-columns:1fr;}
  .apply-body.dir-a .apply-aside{min-height:auto;}
  .apply-body.dir-a .aside-content{min-height:auto;padding-block:clamp(40px,8vw,64px);}
  .apply-body.dir-a .aside-photo{position:absolute;}
  .apply-body.dir-a .aside-mid{margin-top:80px;}
}
@media(max-width:560px){
  .exit-link{top:14px;right:14px;padding:7px 12px;font-size:10px;}
  .apply-main{padding:34px 20px 54px;}
  .apply-body.dir-a .aside-content{padding:30px 22px;}
  .apply-body.dir-a .aside-mid{margin-top:60px;margin-bottom:26px;}
  .apply-body.dir-a .aside-brand{font-size:24px;}
  .fstep h2{font-size:clamp(26px,8vw,34px);}
  .fstep-sub{margin-bottom:24px;}
  .field{margin-bottom:18px;}
  .finput{height:52px;}
  .actions{margin-top:30px;}
  .btn-next{padding:16px 24px;}
  /* keep the horizontal step rail legible if the user switches direction */
  .flow-steps li .fs-t{font-size:10px;letter-spacing:0.03em;}
  .apply-body.dir-b .apply-card,.apply-body.dir-c .apply-card{padding:26px 20px;}
  .apply-body.dir-c .apply-card::before{inset:8px;}
}

/* ── mobile: form-first, photo rail hidden so the form is reachable without scrolling ── */
@media(max-width:900px){
  .apply-body.dir-a .apply-aside{display:none;}
  .apply-body.dir-a .apply-shell{grid-template-columns:1fr;}
  .apply-body.dir-a .apply-main{align-items:flex-start;background:var(--white);padding-top:clamp(38px,9vw,60px);}
  .apply-body.dir-a .exit-link{color:var(--ink);background:transparent;border-color:var(--line);}
  .apply-body.dir-a .card-top{display:block;margin-bottom:24px;}
  .apply-body.dir-a .card-top .card-brand{display:block;margin-bottom:20px;font-style:italic;font-weight:500;font-size:24px;color:var(--ink);}
  .apply-body.dir-a .card-top .flow-steps{display:flex;gap:6px;}
}