/* ==========================================================================
   FOR CREATORS — ROUND 2 (2026-10-29)
   1) Customizable Options re-laid out: one feature image + copy column on top,
      the remaining five options as a five-up strip underneath.
   2) New section: "Is the 50-pair route right for you?" — two decision cards.
   Loaded after style.css; all rules scoped to .page-fc.
   ========================================================================== */

.page-fc .fc-opt .container,
.page-fc .fc-fit .container{max-width:1380px;padding-left:24px;padding-right:24px;}

/* ---------------------- 1. CUSTOMIZABLE OPTIONS ---------------------- */
.page-fc .fc-opt__top{
  display:grid;
  grid-template-columns:minmax(0,clamp(340px,36%,500px)) minmax(0,1fr);
  gap:56px;
  align-items:center;
}

.fc-opt__feature{margin:0;display:flex;flex-direction:column;min-width:0;}
.fc-opt__feature-media{border-radius:8px;overflow:hidden;background:var(--white);}
.fc-opt__feature-media img{
  width:100%;aspect-ratio:1/1;object-fit:cover;
}
.fc-opt__feature figcaption{
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  padding-top:18px;
}
.fc-opt__feature b{
  font-family:var(--font-ui);font-size:17px;font-weight:700;
  color:var(--ink);letter-spacing:0;
}
.fc-opt__feature span{font-size:13px;line-height:1.5;color:var(--mocha);}

.fc-opt__side{
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  min-width:0;padding:6px 0;
}
.page-fc .fc-opt__side .eyebrow{margin-bottom:16px;}
.page-fc .fc-opt__side .fc-opt__title{max-width:560px;font-size:clamp(27px,2.7vw,38px);}
.page-fc .fc-opt__side .fc-opt__sub{
  max-width:560px;margin-top:18px;font-size:16px;line-height:1.75;
}
.page-fc .fc-opt__side .fc-opt__cta{margin-top:32px;text-align:left;}
.fc-opt__note{
  max-width:440px;margin-top:16px;
  font-size:12.5px;line-height:1.65;color:#9A9084;
}

/* the five remaining options */
.page-fc .fc-opt__grid{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:22px;
  margin-top:56px;
}
.page-fc .fc-opt__card{aspect-ratio:1/1;border-radius:8px;background:var(--white);}
.page-fc .fc-opt__cap{padding:16px 4px 0;}
.page-fc .fc-opt__cap b{font-size:14px;}
.page-fc .fc-opt__cap span{font-size:11.5px;}

/* ------------------- 2. IS THE 50-PAIR ROUTE RIGHT? ------------------ */
.page-fc .fc-fit{background:var(--ivory);padding:16px 0 28px;}
.fc-fit__title{
  margin:0 0 30px;
  font-family:var(--font-display);
  font-size:clamp(23px,2.4vw,34px);
  font-weight:700;letter-spacing:-.02em;line-height:1.2;
  color:var(--ink);
}
.fc-fit__grid{
  display:grid;grid-template-columns:1fr 1fr;gap:24px;
  align-items:stretch;
}
.fc-fit__card{
  display:flex;flex-direction:column;min-width:0;
  background:var(--white);
  border:1px solid rgba(28,28,28,.09);
  border-radius:6px;
  padding:38px 38px 34px;
}
.fc-fit__head{display:flex;align-items:center;gap:14px;}
.fc-fit__ico{display:grid;place-items:center;flex:0 0 auto;color:var(--ink);}
.fc-fit__ico svg{width:34px;height:34px;display:block;}
.fc-fit__head h3{
  margin:0;
  font-family:var(--font-ui);font-size:18.5px;font-weight:600;
  line-height:1.4;letter-spacing:0;color:var(--ink);
}
.fc-fit__list{margin:20px 0 26px;display:grid;gap:0;}
.fc-fit__list li{
  position:relative;
  padding:9px 0 9px 30px;
  font-size:14.5px;line-height:1.62;color:#5F574E;
}
.fc-fit__list li::before{
  content:"";
  position:absolute;left:2px;top:14px;
  width:12px;height:7px;
  border-left:1.5px solid #B08D57;
  border-bottom:1.5px solid #B08D57;
  transform:rotate(-45deg);
}
.fc-fit__btn{
  margin-top:auto;align-self:flex-end;
  display:inline-flex;align-items:center;gap:12px;
  padding:14px 24px;
  border:1px solid rgba(17,17,17,.26);
  border-radius:2px;
  font-family:var(--font-ui);font-size:11.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink);
  transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease);
}
.fc-fit__btn span{color:var(--gold);transition:transform .3s var(--ease);}
.fc-fit__btn:hover{background:var(--ink);border-color:var(--ink);color:var(--ivory);}
.fc-fit__btn:hover span{transform:translateX(4px);}

/* ---------------------------- RESPONSIVE ---------------------------- */
@media (max-width:1180px){
  .page-fc .fc-opt__top{grid-template-columns:minmax(0,clamp(320px,36%,500px)) minmax(0,1fr);gap:44px;}
  .page-fc .fc-opt__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:44px;}
}

@media (max-width:900px){
  .page-fc .fc-opt__top{grid-template-columns:minmax(0,1fr);gap:32px;}
  .fc-opt__feature-media img{aspect-ratio:4/3;}
  .fc-opt__side{padding:0;}
  .fc-fit__grid{grid-template-columns:minmax(0,1fr);gap:16px;}
  .fc-fit__card{padding:32px 28px 28px;}
}

@media (max-width:640px){
  .page-fc .fc-opt__side .fc-opt__cta a{font-size:11px;letter-spacing:.06em;}
  .page-fc .fc-opt__side .fc-opt__cta svg{width:15px;height:15px;flex:0 0 15px;}
  .page-fc .fc-opt__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
  .fc-fit__title{margin-bottom:22px;}
  .fc-fit__card{padding:26px 20px 24px;}
  .fc-fit__head h3{font-size:16.5px;}
  .fc-fit__list li{font-size:13.5px;}
  .fc-fit__btn{width:100%;justify-content:center;align-self:stretch;padding:14px 18px;font-size:10.5px;}
}

/* ==========================================================================
   ROUND 3 (2026-10-29)
   1) Featured style cards rebuilt: full-bleed image, MOQ pill, minimal
      two-line caption, text CTA link — no card border, no black button.
   2) The section itself now sits BELOW "Is the 50-pair route right for you?".
   3) Journey flow rewritten for the low-MOQ route (select -> setup -> PP
      sample -> bulk), arrows separated from the copy.
   ========================================================================== */

/* ----------------------- 1. FEATURED STYLE CARDS ---------------------- */
.page-fc .fc-feat{background:var(--ivory);}
.page-fc .fc-feat__grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:26px;
  align-items:stretch;
}

.page-fc .fc-style{
  display:flex;flex-direction:column;
  padding:0;
  background:transparent;
  border:0;border-radius:0;
  box-shadow:none;overflow:visible;
  transition:transform .45s var(--ease);
}
.page-fc .fc-style:hover{transform:translateY(-6px);box-shadow:none;}

.page-fc .fc-style__media{
  position:relative;
  aspect-ratio:1/1;
  overflow:hidden;
  background:var(--white);
  border:0;border-radius:6px;
}
.page-fc .fc-style__media img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease);
}
.page-fc .fc-style:hover .fc-style__media img{transform:scale(1.045);}

.fc-style__moq{
  position:absolute;top:12px;left:12px;z-index:2;
  padding:6px 10px 5px;
  border-radius:2px;
  background:rgba(17,17,17,.8);
  color:var(--gold);
  font-family:var(--font-ui);
  font-size:9.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;line-height:1;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}

.page-fc .fc-style__body{
  display:flex;flex-direction:column;align-items:stretch;
  margin-top:auto;
  padding:15px 2px 0;
}
.fc-style__txt{min-width:0;}
.page-fc .fc-style__name{
  display:block;
  font-family:var(--font-ui);
  font-size:16px;font-weight:700;
  line-height:1.3;letter-spacing:-.005em;
  color:var(--ink);
}
.page-fc .fc-style__meta{
  display:block;margin-top:7px;
  font-family:var(--font-ui);
  font-size:11.5px;font-weight:400;line-height:1.45;
  letter-spacing:.02em;color:#A2968A;
  text-transform:none;
}
.page-fc .fc-style__link{
  display:inline-flex;align-items:center;gap:6px;
  align-self:flex-end;margin-top:12px;
  padding-bottom:4px;
  border-bottom:1px solid rgba(184,148,95,.42);
  font-family:var(--font-ui);
  font-size:10.5px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold-deep);
  white-space:nowrap;
  transition:color .3s var(--ease),border-color .3s var(--ease);
}
.page-fc .fc-style__link span{display:inline-block;transition:transform .3s var(--ease);}
.page-fc .fc-style:hover .fc-style__link{color:var(--ink);border-bottom-color:var(--ink);}
.page-fc .fc-style:hover .fc-style__link span{transform:translateX(4px);}

/* -------------------------- 2. JOURNEY FLOW -------------------------- */
.page-fc .fc-journey__flow{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:12px 18px;
}
.page-fc .fc-journey__step{
  font-size:14.5px;font-weight:600;letter-spacing:.02em;
  color:var(--ivory);
}
.page-fc .fc-journey__step em{
  font-style:normal;font-weight:400;
  color:rgba(184,148,95,.92);
}
.page-fc .fc-journey__arrow{
  color:rgba(245,243,239,.42);
  font-size:14px;line-height:1;
  transform:translateY(-1px);
}

/* ---------------------------- RESPONSIVE ---------------------------- */
@media (max-width:1080px){
  .page-fc .fc-feat__grid{grid-template-columns:1fr 1fr;gap:22px;}
  .page-fc .fc-style__name{font-size:15px;}
}
@media (max-width:760px){
  .page-fc .fc-journey__flow{flex-direction:column;gap:10px;}
  .page-fc .fc-journey__arrow{transform:rotate(90deg);font-size:14px;}
  .page-fc .fc-journey__step{font-size:13.5px;text-align:center;}
}
@media (max-width:560px){
  .page-fc .fc-feat__grid{gap:16px;}
  .page-fc .fc-style__body{padding-top:12px;gap:6px;}
  .page-fc .fc-style__name{font-size:13.5px;}
  .page-fc .fc-style__meta{font-size:10.5px;margin-top:5px;letter-spacing:.01em;}
  .page-fc .fc-style__link{font-size:9px;letter-spacing:.1em;margin-top:10px;}
  .fc-style__moq{top:9px;left:9px;font-size:8.5px;padding:5px 8px 4px;}
}
