/* ============================================================
   FERTYmind — Design System v1.0
   ------------------------------------------------------------
   Globalni CSS sistem koji se primenjuje na sve FM redizajnirane
   stranice. Importuje se u resources/views/fixed/head_fm.blade.php.

   Fonts:    Questrial (sans/display), Montserrat (italic accents + meta)
   Palette:  warm ivory + rose-beige + espresso ink
   Lines:    sharp by default — only CTAs are pill-rounded
   ============================================================ */

/* ============================================================
   TOKENS
   ============================================================ */
:root {
  /* ---------- Color tokens ---------- */
  --fm-canvas:     #F8F7F2;
  --fm-ivory:      #FDFAF0;
  --fm-sand:       #EEEBE2;
  --fm-rose:       #D0B2AF;
  --fm-rose-soft:  oklch(0.86 0.025 25);
  --fm-rose-deep:  oklch(0.66 0.06 25);
  --fm-espresso:   #2C2422;
  --fm-graphite:   #3A3A3A;
  --fm-line:       oklch(0.86 0.008 80);
  --fm-sand-deep:  oklch(0.88 0.012 80);

  /* Semantic */
  --bg:            var(--fm-canvas);
  --bg-alt:        var(--fm-ivory);
  --bg-muted:      var(--fm-sand);
  --bg-inverse:    var(--fm-espresso);
  --fg1:           var(--fm-espresso);
  --fg2:           var(--fm-graphite);
  --fg3:           oklch(0.55 0.01 60);
  --fg-on-dark:    var(--fm-canvas);
  --accent:        var(--fm-rose);
  --accent-hover:  var(--fm-rose-deep);
  --border:        var(--fm-line);
  --border-strong: var(--fm-sand-deep);
  --rule:          var(--fm-rose);

  /* ---------- Typography ---------- */
  --font-sans:   'Questrial', 'Helvetica Neue', system-ui, sans-serif;
  --font-serif:  'Montserrat', 'Helvetica Neue', system-ui, sans-serif; /* italic-only role */
  --font-meta:   'Montserrat', 'Helvetica Neue', system-ui, sans-serif;

  --fs-display: clamp(56px, 8vw, 112px);
  --fs-h1:      clamp(36px, 5vw, 64px);
  --fs-h2:      clamp(28px, 3.6vw, 44px);
  --fs-h3:      clamp(22px, 2.2vw, 28px);
  --fs-h4:      18px;
  --fs-lead:    20px;
  --fs-body:    16px;
  --fs-small:   13px;
  --fs-micro:   11px;

  --lh-tight:   1.05;
  --lh-snug:    1.2;
  --lh-normal:  1.5;
  --lh-loose:   1.75;

  --ls-wide:    0.18em;
  --ls-wider:   0.30em;
  --ls-tight:  -0.01em;

  /* ---------- Spacing ---------- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --space-9: 96px; --space-10: 128px;

  /* ---------- Radii ---------- */
  --radius-sharp: 0px;     /* DEFAULT — cards, photos, sections */
  --radius-cta:   999px;   /* CTAs only */
  --radius-blob:  62% 38% 55% 45% / 50% 60% 40% 50%;

  /* ---------- Shadows ---------- */
  --shadow-xs: 0 1px 2px  rgba(44, 36, 34, 0.04);
  --shadow-sm: 0 4px 12px rgba(44, 36, 34, 0.05);
  --shadow-md: 0 12px 32px rgba(44, 36, 34, 0.07);
  --shadow-lg: 0 24px 60px rgba(44, 36, 34, 0.08);

  /* ---------- Motion ---------- */
  --ease:     cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 180ms;  --dur-base: 320ms;  --dur-slow: 600ms;

  /* ---------- Layout ---------- */
  --container:        1280px;
  --container-narrow: 1040px;
  --container-text:   720px;
  --gutter-x:         8vw;
  --gutter-x-snug:    5vw;
}

/* ============================================================
   RESET / BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; padding: 0;
  background: var(--bg); color: var(--fg1);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: var(--lh-loose);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img, svg, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
ul { list-style: none; padding: 0; margin: 0; }

/* ============================================================
   TYPE CLASSES
   ============================================================ */
.fm-display    { font-family: var(--font-sans); font-size: var(--fs-display); font-weight: 400; letter-spacing: var(--ls-wide); line-height: var(--lh-tight); text-transform: uppercase; color: var(--fg1); margin: 0; }
.fm-h1-caps    { font-family: var(--font-sans); font-size: var(--fs-h1); font-weight: 400; letter-spacing: var(--ls-wide); line-height: var(--lh-tight); text-transform: uppercase; color: var(--fg1); margin: 0; }
.fm-headline   { font-family: var(--font-serif); font-weight: 300; line-height: 1.1; letter-spacing: -0.01em; color: var(--fg1); margin: 0; font-size: var(--fs-h1); }
.fm-headline em{ font-style: italic; color: var(--fm-rose-deep); font-weight: 300; }
.fm-h2-script  { font-family: var(--font-serif); font-style: italic; font-weight: 300; font-size: var(--fs-h2); color: var(--fm-rose-deep); margin: 0; }
.fm-h3         { font-family: var(--font-sans); font-size: var(--fs-h3); font-weight: 400; letter-spacing: 0.04em; line-height: var(--lh-snug); color: var(--fg1); margin: 0; }
.fm-h4         { font-family: var(--font-sans); font-size: var(--fs-h4); font-weight: 400; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg1); margin: 0; }
.fm-eyebrow    { font-family: var(--font-meta); font-size: var(--fs-micro); font-weight: 500; letter-spacing: var(--ls-wider); text-transform: uppercase; color: var(--fg2); display: inline-flex; align-items: center; gap: 14px; }
.fm-eyebrow--center { justify-content: center; }
.fm-lead       { font-family: var(--font-sans); font-size: var(--fs-lead); line-height: var(--lh-loose); color: var(--fg2); margin: 0; }
.fm-body       { font-family: var(--font-sans); font-size: var(--fs-body); line-height: var(--lh-loose); color: var(--fg2); margin: 0; }
.fm-script     { font-family: var(--font-serif); font-style: italic; font-weight: 300; color: var(--fg2); }
.fm-small      { font-family: var(--font-meta); font-size: var(--fs-small); font-weight: 400; letter-spacing: 0.02em; line-height: var(--lh-normal); color: var(--fg3); margin: 0; }
.fm-micro      { font-family: var(--font-meta); font-size: var(--fs-micro); font-weight: 500; letter-spacing: var(--ls-wider); text-transform: uppercase; color: var(--fg3); }

/* Signature thin rose rule */
.fm-rule { display: inline-block; width: 56px; height: 1px; background: var(--rule); vertical-align: middle; flex-shrink: 0; }

/* Color helpers */
.fm-c-rose      { color: var(--fm-rose); }
.fm-c-rose-deep { color: var(--fm-rose-deep); }
.fm-c-espresso  { color: var(--fm-espresso); }
.fm-c-graphite  { color: var(--fm-graphite); }
.fm-c-on-dark   { color: var(--fg-on-dark); }

/* ============================================================
   CTA BUTTONS
   ============================================================ */
.fm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--font-sans); font-size: 11px; font-weight: 400;
  letter-spacing: 0.24em; text-transform: uppercase;
  padding: 16px 32px; border: none; cursor: pointer;
  border-radius: var(--radius-cta);
  transition: all 200ms var(--ease-out);
  white-space: nowrap;
  text-decoration: none;
}
.fm-btn--rose  { background: var(--fm-rose); color: var(--fg1); }
.fm-btn--rose:hover  { background: var(--fm-rose-deep); color: #fff; }
.fm-btn--dark  { background: var(--fm-espresso); color: var(--fg-on-dark); }
.fm-btn--dark:hover  { background: #000; }
.fm-btn--ghost { background: transparent; color: var(--fg1); border: 1px solid var(--fg1); padding: 15px 31px; }
.fm-btn--ghost:hover { background: var(--fg1); color: var(--fm-canvas); }
.fm-btn--ghost-light { background: transparent; color: var(--fg-on-dark); border: 1px solid var(--fg-on-dark); padding: 15px 31px; }
.fm-btn--ghost-light:hover { background: var(--fg-on-dark); color: var(--fg1); }
.fm-btn--lg    { padding: 20px 40px; font-size: 12px; }

.fm-link {
  font-family: var(--font-sans); font-size: 11px;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--fg1); cursor: pointer; padding-bottom: 4px;
  border-bottom: 1px solid var(--fm-rose);
  display: inline-block; transition: border-color 200ms var(--ease-out);
}
.fm-link:hover { border-bottom-color: var(--fg1); }
.fm-link--light { color: var(--fg-on-dark); border-bottom-color: rgba(255,255,255,0.4); }
.fm-link--light:hover { border-bottom-color: var(--fg-on-dark); }

/* ============================================================
   FORMS
   ============================================================ */
.fm-input {
  width: 100%; padding: 16px 20px;
  background: var(--fm-canvas);
  border: 1px solid var(--border-strong);
  border-radius: 0;
  font-family: var(--font-sans); font-size: 15px;
  color: var(--fg1); outline: none;
  transition: border-color 200ms var(--ease-out);
}
.fm-input:focus { border-color: var(--fm-rose-deep); }
.fm-label { display: block; font-family: var(--font-meta); font-size: var(--fs-micro); letter-spacing: 0.26em; text-transform: uppercase; color: var(--fg3); margin-bottom: 10px; }

/* ============================================================
   CARDS
   ============================================================ */
.fm-card        { background: var(--fm-ivory); border: 1px solid var(--border); padding: 40px; transition: background 320ms var(--ease-out); }
.fm-card:hover  { background: var(--fm-sand); }
.fm-card--dark  { background: var(--fm-espresso); color: var(--fg-on-dark); border-color: transparent; }
.fm-card--dark:hover { background: #1a1413; }
.fm-quote-card  { border: 1px solid var(--border); padding: 40px 36px; background: var(--fm-canvas); }

/* ============================================================
   BADGES
   ============================================================ */
.fm-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase;
  padding: 8px 14px; border: 1px solid var(--border-strong); background: var(--fm-canvas); color: var(--fg2);
}
.fm-badge--rose { background: var(--fm-rose); border-color: transparent; color: var(--fg1); }
.fm-dot { display: inline-block; width: 6px; height: 6px; border-radius: 999px; background: var(--fm-rose); margin: 0 8px; vertical-align: middle; }

/* ============================================================
   FAQ
   ============================================================ */
.fm-faq-item { border-bottom: 1px solid var(--border); }
.fm-faq-item:first-child { border-top: 1px solid var(--border); }
.fm-faq-q {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  padding: 28px 0; background: transparent; border: none; cursor: pointer;
  font-family: var(--font-serif); font-size: 22px; font-weight: 300; font-style: italic;
  color: var(--fg1); text-align: left; transition: color 200ms var(--ease-out);
}
.fm-faq-q:hover { color: var(--fm-rose-deep); }
.fm-faq-toggle { font-family: var(--font-sans); font-size: 24px; color: var(--fm-rose-deep); transition: transform 320ms var(--ease-out); flex-shrink: 0; margin-left: 24px; }
.fm-faq-item.open .fm-faq-toggle { transform: rotate(45deg); }
.fm-faq-a { max-height: 0; overflow: hidden; transition: max-height 400ms var(--ease-out); }
.fm-faq-item.open .fm-faq-a { max-height: 600px; }
.fm-faq-a-inner { padding: 0 0 32px 0; font-family: var(--font-sans); font-size: 16px; line-height: 1.85; color: var(--fg2); max-width: 720px; }

/* ============================================================
   LAYOUT HELPERS
   ============================================================ */
.fm-section {
  padding: 120px var(--gutter-x);
  background: var(--bg);
}
.fm-section--snug    { padding: 80px var(--gutter-x); }
.fm-section--xl      { padding: 140px var(--gutter-x); }
.fm-section--alt     { background: var(--bg-alt); }
.fm-section--muted   { background: var(--bg-muted); }
.fm-section--dark    { background: var(--bg-inverse); color: var(--fg-on-dark); }
.fm-section--rose    { background: var(--fm-rose-soft); }

.fm-container        { max-width: var(--container);        margin: 0 auto; }
.fm-container--narrow{ max-width: var(--container-narrow); margin: 0 auto; }
.fm-container--text  { max-width: var(--container-text);   margin: 0 auto; }

.fm-grid     { display: grid; gap: 32px; }
.fm-grid--2  { grid-template-columns: repeat(2, 1fr); }
.fm-grid--3  { grid-template-columns: repeat(3, 1fr); }
.fm-grid--4  { grid-template-columns: repeat(4, 1fr); }
.fm-grid--12 { grid-template-columns: repeat(12, 1fr); }

.fm-stack-1 > * + * { margin-top: var(--space-2); }
.fm-stack-2 > * + * { margin-top: var(--space-3); }
.fm-stack-3 > * + * { margin-top: var(--space-4); }
.fm-stack-4 > * + * { margin-top: var(--space-5); }
.fm-stack-5 > * + * { margin-top: var(--space-6); }
.fm-stack-6 > * + * { margin-top: var(--space-7); }
.fm-stack-7 > * + * { margin-top: var(--space-8); }

.fm-text-center { text-align: center; }
.fm-flex { display: flex; }
.fm-flex-center { display: flex; align-items: center; justify-content: center; }
.fm-flex-between { display: flex; align-items: center; justify-content: space-between; }
.fm-gap-2 { gap: var(--space-3); }
.fm-gap-3 { gap: var(--space-4); }
.fm-gap-4 { gap: var(--space-5); }
.fm-gap-5 { gap: var(--space-6); }

/* ============================================================
   HEADER
   ============================================================ */
.fm-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(248, 247, 242, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  transition: background 200ms var(--ease-out), border-color 200ms var(--ease-out);
}
.fm-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px var(--gutter-x);
  max-width: var(--container); margin: 0 auto;
  gap: var(--space-6);
}
.fm-logo {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 26px; color: var(--fg1); letter-spacing: -0.01em;
  display: inline-flex; align-items: center;
}
.fm-logo img { max-height: 44px; width: auto; display: block; }
.fm-nav { display: flex; align-items: center; gap: var(--space-6); }
.fm-nav__link {
  font-family: var(--font-sans); font-size: 11px;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--fg1); padding: 8px 0;
  position: relative; transition: color 200ms var(--ease-out);
}
.fm-nav__link::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0;
  height: 1px; background: var(--fm-rose);
  transform: scaleX(0); transform-origin: center;
  transition: transform 220ms var(--ease-out);
}
.fm-nav__link:hover { color: var(--fm-rose-deep); }
.fm-nav__link:hover::after,
.fm-nav__link.is-active::after { transform: scaleX(1); }

.fm-burger {
  display: none;
  background: transparent; border: none; cursor: pointer;
  padding: 10px; gap: 4px; flex-direction: column;
}
.fm-burger span { display: block; width: 22px; height: 1px; background: var(--fg1); transition: transform 220ms var(--ease-out), opacity 220ms; }
.fm-burger.is-open span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.fm-burger.is-open span:nth-child(2) { opacity: 0; }
.fm-burger.is-open span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

.fm-mobile-nav {
  display: none; position: fixed; inset: 64px 0 0 0;
  background: var(--fm-canvas); z-index: 99;
  padding: var(--space-7) var(--gutter-x);
  flex-direction: column; gap: var(--space-5);
}
.fm-mobile-nav.is-open { display: flex; }
.fm-mobile-nav .fm-nav__link { font-size: 15px; letter-spacing: 0.2em; padding: var(--space-4) 0; border-bottom: 1px solid var(--border); }

@media (max-width: 880px) {
  .fm-header__inner { padding: 14px var(--gutter-x-snug); }
  .fm-nav { display: none; }
  .fm-burger { display: inline-flex; }
  .fm-header__cta { display: none; }
}

/* ============================================================
   FOOTER
   ============================================================ */
.fm-footer {
  background: var(--fm-espresso); color: var(--fg-on-dark);
  padding: 96px var(--gutter-x) 32px;
}
.fm-footer__grid {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--space-7);
  max-width: var(--container); margin: 0 auto;
}
.fm-footer__col h4 { font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--fm-rose); margin: 0 0 var(--space-5); font-weight: 400; }
.fm-footer__col ul { display: flex; flex-direction: column; gap: var(--space-3); }
.fm-footer__col a { color: rgba(248, 247, 242, 0.7); font-size: 14px; transition: color 200ms; }
.fm-footer__col a:hover { color: var(--fm-rose); }
.fm-footer__brand p { color: rgba(248, 247, 242, 0.6); font-size: 14px; line-height: 1.7; margin: var(--space-4) 0 0; max-width: 320px; }
.fm-footer__brand .fm-logo { color: var(--fg-on-dark); font-size: 30px; }
.fm-footer__bottom {
  margin-top: 64px; padding-top: 24px;
  border-top: 1px solid rgba(248, 247, 242, 0.12);
  display: flex; justify-content: space-between; align-items: center;
  max-width: var(--container); margin-left: auto; margin-right: auto;
  font-size: 12px; letter-spacing: 0.1em; color: rgba(248, 247, 242, 0.5);
}
.fm-footer__social { display: flex; gap: var(--space-4); }
.fm-footer__social a { width: 36px; height: 36px; border: 1px solid rgba(248, 247, 242, 0.15); display: inline-flex; align-items: center; justify-content: center; transition: all 200ms; }
.fm-footer__social a:hover { background: var(--fm-rose); border-color: var(--fm-rose); color: var(--fg1); }
@media (max-width: 880px) {
  .fm-footer__grid { grid-template-columns: 1fr 1fr; gap: var(--space-6); }
  .fm-footer__bottom { flex-direction: column; gap: var(--space-3); text-align: center; }
}

/* ============================================================
   HERO (Variant A — italic + rose emphasis)
   ============================================================ */
.fm-hero {
  position: relative; min-height: 88vh;
  display: flex; align-items: center; justify-content: center;
  padding: 96px var(--gutter-x);
  overflow: hidden;
  background: var(--fm-rose-soft);
  text-align: center;
}
.fm-hero__photo {
  position: absolute; inset: 0; z-index: 0;
}
.fm-hero__photo img {
  width: 100%; height: 100%; object-fit: cover;
  object-position: center 30%;
}
.fm-hero__photo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(248,247,242,0.10) 0%, rgba(248,247,242,0.45) 60%, rgba(248,247,242,0.78) 100%);
}
.fm-hero__inner {
  position: relative; z-index: 1;
  max-width: 880px; margin: 0 auto;
}
.fm-hero__eyebrow { margin-bottom: var(--space-6); justify-content: center; }
.fm-hero__title {
  font-family: var(--font-serif); font-weight: 300;
  font-size: clamp(48px, 7vw, 96px);
  line-height: 1.05; letter-spacing: -0.015em;
  color: var(--fg1); margin: 0;
}
.fm-hero__title em { font-style: italic; color: var(--fm-rose-deep); font-weight: 300; }
.fm-hero__script {
  margin-top: var(--space-5);
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: clamp(22px, 2.5vw, 30px);
  color: var(--fm-rose-deep);
}
.fm-hero__lead {
  margin: var(--space-6) auto 0; max-width: 620px;
  font-family: var(--font-sans); font-size: var(--fs-lead);
  line-height: 1.7; color: var(--fg2);
}
.fm-hero__cta {
  margin-top: var(--space-7);
  display: inline-flex; gap: var(--space-5); flex-wrap: wrap; justify-content: center; align-items: center;
}
@media (max-width: 720px) {
  .fm-hero { min-height: 80vh; padding: 72px var(--gutter-x-snug); }
  .fm-hero__photo img { object-position: center 25%; }
}

/* ============================================================
   ABOUT preview
   ============================================================ */
.fm-about__grid {
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 96px;
  align-items: center;
}
.fm-about__photo {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
}
.fm-about__photo img { width: 100%; height: 100%; object-fit: cover; }
.fm-about__photo::before {
  content: ''; position: absolute;
  width: 80%; height: 80%;
  background: var(--fm-rose); opacity: 0.18;
  top: -8%; left: -8%; z-index: -1;
  border-radius: var(--radius-blob);
}
.fm-about__content { display: flex; flex-direction: column; gap: var(--space-5); }
.fm-about__title { font-family: var(--font-serif); font-weight: 300; font-size: clamp(32px, 4vw, 52px); line-height: 1.12; color: var(--fg1); margin: 0; }
.fm-about__title em { font-style: italic; color: var(--fm-rose-deep); }
.fm-about__body p { font-size: 17px; line-height: 1.85; color: var(--fg2); margin: 0 0 var(--space-4); }
.fm-about__body p:last-child { margin-bottom: 0; }
.fm-about__cta { margin-top: var(--space-5); }
@media (max-width: 880px) {
  .fm-about__grid { grid-template-columns: 1fr; gap: var(--space-7); }
}

/* ============================================================
   COURSES carousel
   ============================================================ */
.fm-courses__head {
  display: flex; justify-content: space-between; align-items: end;
  gap: var(--space-6); margin-bottom: var(--space-8);
}
.fm-courses__title { font-family: var(--font-serif); font-weight: 300; font-size: clamp(32px, 4vw, 52px); line-height: 1.12; margin: 0 0 var(--space-3); }
.fm-courses__title em { font-style: italic; color: var(--fm-rose-deep); }
.fm-courses__viewport { overflow: hidden; position: relative; }
.fm-courses__track {
  display: flex; gap: 24px;
  transition: transform 480ms var(--ease-out);
  will-change: transform;
}
.fm-course-card {
  flex: 0 0 calc((100% - 72px) / 4);
  min-width: 0;
  background: var(--fm-ivory); border: 1px solid var(--border);
  display: flex; flex-direction: column;
  text-decoration: none; color: inherit;
  transition: background 320ms var(--ease-out), transform 320ms var(--ease-out);
}
.fm-course-card:hover { background: var(--fm-sand); transform: translateY(-2px); }
.fm-course-card__photo { aspect-ratio: 4 / 3; overflow: hidden; background: var(--fm-sand); }
.fm-course-card__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease-out); }
.fm-course-card:hover .fm-course-card__photo img { transform: scale(1.04); }
.fm-course-card__body { padding: 28px 28px 32px; display: flex; flex-direction: column; gap: var(--space-3); flex: 1; }
.fm-course-card__title { font-family: var(--font-sans); font-size: 19px; line-height: 1.3; color: var(--fg1); margin: 0; min-height: 48px; }
.fm-course-card__excerpt { font-size: 14px; line-height: 1.6; color: var(--fg2); margin: 0; flex: 1; }
.fm-course-card__price {
  display: flex; align-items: baseline; gap: var(--space-3);
  margin-top: var(--space-3); padding-top: var(--space-4);
  border-top: 1px solid var(--border);
}
.fm-course-card__price-now { font-family: var(--font-sans); font-size: 18px; color: var(--fg1); }
.fm-course-card__price-old { font-family: var(--font-meta); font-size: 13px; color: var(--fg3); text-decoration: line-through; }
.fm-course-card__more {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: var(--space-3);
  font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--fg1); padding-bottom: 4px;
  border-bottom: 1px solid var(--fm-rose); align-self: flex-start;
  transition: border-color 200ms;
}
.fm-course-card:hover .fm-course-card__more { border-bottom-color: var(--fg1); }

.fm-courses__nav { display: inline-flex; gap: var(--space-3); }
.fm-courses__btn {
  width: 48px; height: 48px;
  border-radius: 999px;
  border: 1px solid var(--border-strong);
  background: var(--fm-canvas);
  font-size: 20px; color: var(--fg1);
  cursor: pointer;
  transition: all 200ms var(--ease-out);
  display: inline-flex; align-items: center; justify-content: center;
}
.fm-courses__btn:hover:not(:disabled) { background: var(--fm-rose); border-color: var(--fm-rose); }
.fm-courses__btn:disabled { opacity: 0.35; cursor: not-allowed; }

@media (max-width: 1080px) {
  .fm-course-card { flex: 0 0 calc((100% - 48px) / 3); }
}
@media (max-width: 760px) {
  .fm-course-card { flex: 0 0 calc((100% - 24px) / 2); }
  .fm-courses__head { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 540px) {
  .fm-course-card { flex: 0 0 85%; }
}

/* ============================================================
   HOW IT WORKS — three steps
   ============================================================ */
.fm-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--border); border: 1px solid var(--border); }
.fm-step { background: var(--bg); padding: 56px 44px; display: flex; flex-direction: column; gap: var(--space-4); }
.fm-step__num {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 56px; color: var(--fm-rose-deep);
  line-height: 1; letter-spacing: -0.02em;
}
.fm-step__title { font-family: var(--font-sans); font-size: 22px; line-height: 1.25; color: var(--fg1); margin: 0; }
.fm-step__body { font-size: 15px; line-height: 1.75; color: var(--fg2); margin: 0; }
@media (max-width: 880px) {
  .fm-steps { grid-template-columns: 1fr; }
}

/* ============================================================
   TESTIMONIALS carousel
   ============================================================ */
.fm-testimonials { text-align: center; }
.fm-testimonials__head { margin-bottom: var(--space-8); }
.fm-testimonials__title { font-family: var(--font-serif); font-weight: 300; font-size: clamp(32px, 4vw, 52px); line-height: 1.12; margin: var(--space-3) 0 0; }
.fm-testimonials__title em { font-style: italic; color: var(--fm-rose-deep); }
.fm-testimonials__viewport { overflow: hidden; max-width: var(--container-narrow); margin: 0 auto; }
.fm-testimonials__track { display: flex; transition: transform 600ms var(--ease-out); }
.fm-testimonial {
  flex: 0 0 100%; padding: 0 24px;
  display: flex; flex-direction: column; align-items: center; gap: var(--space-5);
}
.fm-testimonial__mark {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 80px; color: var(--fm-rose); line-height: 0.5;
  display: inline-block; height: 30px;
}
.fm-testimonial__text {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: clamp(22px, 2.4vw, 32px); line-height: 1.45;
  color: var(--fg1); max-width: 800px; margin: 0;
}
.fm-testimonial__author {
  display: inline-flex; flex-direction: column; align-items: center; gap: 4px;
  margin-top: var(--space-4);
}
.fm-testimonial__author-name { font-family: var(--font-sans); font-size: 14px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--fg1); }
.fm-testimonial__author-pos { font-family: var(--font-meta); font-size: 12px; letter-spacing: 0.06em; color: var(--fg3); font-style: italic; }
.fm-testimonials__dots { display: inline-flex; gap: var(--space-3); margin-top: var(--space-7); }
.fm-testimonials__dot {
  width: 8px; height: 8px; border-radius: 999px;
  background: var(--border-strong); border: none; cursor: pointer;
  transition: all 200ms var(--ease-out); padding: 0;
}
.fm-testimonials__dot.is-active { background: var(--fm-rose); width: 32px; border-radius: 4px; }

/* ============================================================
   BLOG latest
   ============================================================ */
.fm-blog__head {
  display: flex; justify-content: space-between; align-items: end;
  gap: var(--space-6); margin-bottom: var(--space-8);
}
.fm-blog__title { font-family: var(--font-serif); font-weight: 300; font-size: clamp(32px, 4vw, 52px); line-height: 1.12; margin: var(--space-3) 0 0; }
.fm-blog__title em { font-style: italic; color: var(--fm-rose-deep); }
.fm-blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.fm-blog-card { display: flex; flex-direction: column; gap: var(--space-4); text-decoration: none; color: inherit; }
.fm-blog-card__photo { aspect-ratio: 16 / 11; overflow: hidden; background: var(--fm-sand); }
.fm-blog-card__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease-out); }
.fm-blog-card:hover .fm-blog-card__photo img { transform: scale(1.04); }
.fm-blog-card__meta { font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--fg3); }
.fm-blog-card__title {
  font-family: var(--font-serif); font-weight: 300; font-size: 24px; line-height: 1.3;
  color: var(--fg1); margin: 0;
  transition: color 200ms;
}
.fm-blog-card:hover .fm-blog-card__title { color: var(--fm-rose-deep); }
.fm-blog-card__excerpt { font-size: 15px; line-height: 1.7; color: var(--fg2); margin: 0; }
.fm-blog-card__more {
  margin-top: 8px; align-self: flex-start;
  font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--fg1); padding-bottom: 4px; border-bottom: 1px solid var(--fm-rose);
}
@media (max-width: 880px) {
  .fm-blog__grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .fm-blog__head { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   FINAL CTA — "Niste same"
   ============================================================ */
.fm-cta-final {
  background: var(--fm-espresso); color: var(--fg-on-dark);
  padding: 140px var(--gutter-x);
  text-align: center;
  position: relative; overflow: hidden;
}
.fm-cta-final::before {
  content: ''; position: absolute;
  width: 600px; height: 600px;
  top: -300px; right: -200px;
  background: var(--fm-rose); opacity: 0.08;
  border-radius: var(--radius-blob);
  pointer-events: none;
}
.fm-cta-final__inner { position: relative; max-width: 720px; margin: 0 auto; }
.fm-cta-final .fm-eyebrow { color: var(--fm-rose); justify-content: center; margin-bottom: var(--space-5); }
.fm-cta-final .fm-rule { background: var(--fm-rose); }
.fm-cta-final__title {
  font-family: var(--font-serif); font-weight: 300;
  font-size: clamp(40px, 5.5vw, 72px); line-height: 1.08; letter-spacing: -0.01em;
  margin: 0;
}
.fm-cta-final__title em { font-style: italic; color: var(--fm-rose); }
.fm-cta-final__lead {
  margin: var(--space-6) auto 0; max-width: 560px;
  font-family: var(--font-sans); font-size: 18px; line-height: 1.75;
  color: rgba(248, 247, 242, 0.75);
}
.fm-cta-final__btn { margin-top: var(--space-7); }

/* ============================================================
   REVEAL animations (intersection observer hook)
   ============================================================ */
.fm-reveal { opacity: 0; transform: translateY(24px); transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out); }
.fm-reveal.is-visible { opacity: 1; transform: translateY(0); }
.fm-reveal--delay-1 { transition-delay: 80ms; }
.fm-reveal--delay-2 { transition-delay: 160ms; }
.fm-reveal--delay-3 { transition-delay: 240ms; }

/* ============================================================
   UTILITIES
   ============================================================ */
.fm-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.fm-mt-0 { margin-top: 0; }
.fm-mt-3 { margin-top: var(--space-4); }
.fm-mt-5 { margin-top: var(--space-6); }
.fm-mt-7 { margin-top: var(--space-8); }
.fm-mb-3 { margin-bottom: var(--space-4); }
.fm-mb-5 { margin-bottom: var(--space-6); }
.fm-mb-7 { margin-bottom: var(--space-8); }

/* ============================================================
   EXTRAS — partial-specific helpers
   ============================================================ */
.fm-skip {
  position: absolute; left: -9999px; top: 0; z-index: 200;
  background: var(--fm-espresso); color: var(--fg-on-dark);
  padding: 12px 18px; font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
}
.fm-skip:focus { left: 12px; top: 12px; }

.fm-course-card__placeholder {
  width: 100%; aspect-ratio: 4 / 3; background: var(--fm-sand);
  background-image: linear-gradient(135deg, var(--fm-sand) 0%, var(--fm-rose-soft) 100%);
}
.fm-course-card__photo { position: relative; }
.fm-course-card__badge { position: absolute; top: 14px; left: 14px; z-index: 2; }

.fm-courses__dots { display: inline-flex; gap: 8px; align-items: center; }
.fm-courses__dot {
  width: 8px; height: 8px; border-radius: 999px;
  background: var(--border-strong); border: none; cursor: pointer; padding: 0;
  transition: all 200ms var(--ease-out);
}
.fm-courses__dot.is-active { background: var(--fm-rose); width: 28px; border-radius: 4px; }
.fm-courses__nav {
  display: flex; align-items: center; justify-content: center;
  gap: var(--space-4); margin-top: var(--space-7);
}

.fm-section__head {
  display: flex; justify-content: space-between; align-items: end;
  gap: var(--space-6); margin-bottom: var(--space-8);
  flex-wrap: wrap;
}
.fm-section__head--center {
  flex-direction: column; align-items: center; text-align: center;
  gap: var(--space-4);
}
.fm-section__foot { margin-top: var(--space-8); display: flex; justify-content: center; }
@media (max-width: 760px) {
  .fm-section__head { flex-direction: column; align-items: flex-start; }
}

/* Quote-card slide variant used in testimonials carousel */
.fm-quote-card[data-fm-slide] {
  display: none;
  border: none; padding: 0; background: transparent; text-align: center;
}
.fm-quote-card[data-fm-slide].is-active { display: block; }
.fm-quote-card__mark {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 80px; color: var(--fm-rose); line-height: 0.5; height: 30px;
  display: inline-block;
}
.fm-quote-card__text {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: clamp(22px, 2.4vw, 32px); line-height: 1.45;
  color: var(--fg1); max-width: 800px; margin: var(--space-5) auto 0;
}
.fm-quote-card__byline { display: flex; flex-direction: column; gap: 4px; margin-top: var(--space-5); }
.fm-quote-card__byline strong { font-family: var(--font-sans); font-weight: 400; font-size: 14px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--fg1); }
.fm-quote-card__byline span { font-family: var(--font-meta); font-style: italic; font-size: 13px; color: var(--fg3); }

.fm-testimonials__nav {
  display: flex; align-items: center; justify-content: center;
  gap: var(--space-4); margin-top: var(--space-7);
}

.fm-blog-card__date {
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--fg3);
}

.fm-cta-final__actions {
  margin-top: var(--space-7);
  display: inline-flex; gap: var(--space-4); flex-wrap: wrap; justify-content: center;
}
.fm-cta-final__headline { color: var(--fg-on-dark); margin: 0;
  font-family: var(--font-serif); font-weight: 300;
  font-size: clamp(40px, 5.5vw, 72px); line-height: 1.08; letter-spacing: -0.01em; }
.fm-cta-final__headline em { color: var(--fm-rose); font-style: italic; font-weight: 300; }

.fm-hero__meta {
  display: inline-flex; gap: var(--space-7); margin-top: var(--space-7);
  list-style: none; padding: 0;
}
.fm-hero__meta li { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.fm-hero__meta strong { font-family: var(--font-serif); font-style: italic; font-weight: 300; font-size: 32px; color: var(--fm-rose-deep); line-height: 1; }
.fm-hero__meta span { font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--fg3); }
@media (max-width: 540px) {
  .fm-hero__meta { gap: var(--space-5); flex-wrap: wrap; justify-content: center; }
  .fm-hero__meta strong { font-size: 24px; }
}

.fm-blob {
  position: absolute; pointer-events: none;
  width: 320px; height: 320px;
  background: var(--fm-rose); opacity: 0.18;
  border-radius: var(--radius-blob);
  filter: blur(2px);
}
.fm-blob--soft { background: var(--fm-rose-soft); opacity: 0.6; }
.fm-hero__blob { right: -120px; bottom: -120px; }

.fm-header--scrolled { background: rgba(248, 247, 242, 0.98); box-shadow: var(--shadow-sm); }

/* Responsive section padding tightening */
@media (max-width: 720px) {
  .fm-section { padding: 80px var(--gutter-x-snug); }
  .fm-section--snug { padding: 56px var(--gutter-x-snug); }
  .fm-cta-final { padding: 96px var(--gutter-x-snug); }
}

/* ============================================================
   STANDALONE-ALIGNED OVERRIDES & ADDITIONS (v1.1)
   Pattern reference: /projectPlan/Fertymind Homepage Standalone.html
   ============================================================ */

@keyframes fmFadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---------- HERO Variant A — espresso + photo + light overlay text ---------- */
.fm-hero {
  position: relative; overflow: hidden;
  min-height: min(92vh, 880px);
  background: var(--fm-espresso);
  display: flex; flex-direction: column; padding: 0;
  text-align: center;
}
.fm-hero__photo { position: absolute; inset: 0; z-index: 0; }
.fm-hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.fm-hero__photo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(44,36,34,0.22) 0%, rgba(44,36,34,0.38) 55%, rgba(44,36,34,0.58) 100%);
}
.fm-hero__blobs { position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.fm-hero__blob-1, .fm-hero__blob-2, .fm-hero__blob-3 {
  position: absolute; border-radius: 62% 38% 55% 45% / 50% 60% 40% 50%;
  filter: blur(2px);
}
.fm-hero__blob-1 { width: 360px; height: 360px; top: 8%; left: -6%; background: var(--fm-rose); opacity: 0.32; mix-blend-mode: overlay; }
.fm-hero__blob-2 { width: 460px; height: 460px; bottom: -8%; right: -8%; background: var(--fm-rose-soft); opacity: 0.42; mix-blend-mode: soft-light; border-radius: 55% 45% 62% 38% / 60% 40% 50% 50%; }
.fm-hero__blob-3 { width: 220px; height: 220px; top: 40%; right: 12%; background: var(--fm-rose); opacity: 0.22; mix-blend-mode: overlay; filter: blur(1px); border-radius: 50% 50% 38% 62% / 55% 45% 55% 45%; }

.fm-hero__inner {
  position: relative; z-index: 2; flex: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 120px 6vw 80px;
  max-width: none;
}
.fm-hero__eyebrow {
  margin-bottom: 36px;
  color: rgba(255,255,255,0.85); justify-content: center; gap: 14px;
}
.fm-hero__eyebrow .fm-rule { width: 40px; background: var(--fm-rose); }
.fm-hero__title {
  font-family: var(--font-serif); font-weight: 300; line-height: 1.05; letter-spacing: -0.015em;
  font-size: clamp(56px, 8.4vw, 132px);
  color: #fff;
  text-shadow: 0 2px 24px rgba(0,0,0,0.18);
  max-width: 1100px; margin: 0;
}
.fm-hero__title em { font-style: italic; color: #fff; font-weight: 300; }
.fm-hero__script {
  margin-top: 28px;
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: clamp(22px, 2.6vw, 32px);
  color: rgba(255,255,255,0.92);
}
.fm-hero__lead {
  margin: 36px auto 0; max-width: 580px;
  font-family: var(--font-sans); font-size: 17px; line-height: 1.8;
  color: rgba(255,255,255,0.88);
}
.fm-hero__cta {
  display: flex; gap: 18px; margin-top: 44px;
  align-items: center; justify-content: center; flex-wrap: wrap;
}
.fm-hero__cta-link {
  font-family: var(--font-sans); font-size: 11px;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: #fff; border-bottom: 1px solid rgba(255,255,255,0.6);
  padding-bottom: 4px;
}
.fm-hero__cta-link:hover { border-bottom-color: #fff; }

.fm-hero__highlights {
  position: relative; z-index: 2;
  border-top: 1px solid rgba(255,255,255,0.18);
  padding: 28px 6vw;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px;
}
.fm-hero__highlight { display: flex; align-items: flex-start; gap: 16px; padding: 4px 8px; }
.fm-hero__hl-icon {
  flex-shrink: 0; width: 40px; height: 40px; border-radius: 999px;
  background: var(--fm-rose);
  display: inline-flex; align-items: center; justify-content: center;
}
.fm-hero__hl-icon svg { width: 18px; height: 18px; }
.fm-hero__hl-title { font-family: var(--font-sans); font-size: 13px; letter-spacing: 0.04em; color: #fff; font-weight: 500; }
.fm-hero__hl-body  { font-family: var(--font-sans); font-size: 12px; line-height: 1.55; color: rgba(255,255,255,0.78); margin-top: 4px; }
@media (max-width: 760px) {
  .fm-hero__highlights { grid-template-columns: 1fr; gap: 18px; }
  .fm-hero__title { font-size: clamp(44px, 10vw, 72px); }
}

/* ---------- ABOUT preview — parallax shapes ---------- */
.fm-about { overflow: hidden; }
.fm-about__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 96px; align-items: center; }
.fm-about__media { position: relative; }
.fm-about__media .fm-about__photo { position: relative; z-index: 1; aspect-ratio: 4 / 5; overflow: hidden; }
.fm-about__media .fm-about__photo::before { content: none; }
.fm-about__shape-blob {
  position: absolute; width: 360px; height: 360px; top: -40px; left: -50px;
  background: var(--fm-rose); opacity: 0.32; filter: blur(1px);
  border-radius: 62% 38% 55% 45% / 50% 60% 40% 50%;
  z-index: 0; pointer-events: none;
}
.fm-about__shape-square {
  position: absolute; width: 88px; height: 88px; top: -24px; right: -24px;
  background: var(--fm-rose-deep); opacity: 0.85; z-index: 2; pointer-events: none;
}
.fm-about__shape-circle {
  position: absolute; width: 140px; height: 140px; bottom: -50px; left: -50px;
  background: var(--fm-rose-soft); border-radius: 50%; border: 1px solid var(--fm-rose);
  z-index: 0; pointer-events: none;
}
.fm-about__shape-frame {
  position: absolute; inset: 24px -24px -24px 24px;
  border: 1px solid var(--fm-rose); pointer-events: none; z-index: 0;
}
.fm-about__title em { font-weight: 600; }
.fm-about__quote {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 20px; line-height: 1.55; color: var(--fg1);
  border-left: 1px solid var(--fm-rose); padding-left: 24px;
  margin: 8px 0 0;
}
@media (max-width: 880px) {
  .fm-about__grid { grid-template-columns: 1fr; gap: 56px; }
  .fm-about__shape-square { width: 56px; height: 56px; }
  .fm-about__shape-circle { width: 88px; height: 88px; }
}

/* ---------- COURSES — single big slide carousel ---------- */
.fm-courses__intro { text-align: center; max-width: 880px; margin: 0 auto 56px; }
.fm-courses__intro .fm-eyebrow { margin-bottom: 22px; justify-content: center; }
.fm-courses__intro-script {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 22px; color: var(--fm-rose-deep); margin-top: 20px;
}
.fm-courses__intro-body {
  font-family: var(--font-sans); font-size: 17px; line-height: 1.85;
  color: var(--fg2); margin-top: 24px;
}

.fm-coursefeat {
  position: relative; max-width: 1280px; margin: 0 auto;
}
.fm-coursefeat__slide {
  display: grid; grid-template-columns: 1fr 1.3fr; gap: 0;
  border: 1px solid var(--border-strong); background: var(--fm-ivory); overflow: hidden;
}
.fm-coursefeat__media { position: relative; min-height: 460px; overflow: hidden; }
.fm-coursefeat__media-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; opacity: 0; transition: opacity 600ms var(--ease-out);
}
.fm-coursefeat__media-img.is-active { opacity: 1; }
.fm-coursefeat__tag {
  position: absolute; top: 24px; left: 24px; z-index: 2;
  background: var(--fm-canvas); padding: 10px 16px;
  font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--fg1);
}
.fm-coursefeat__count {
  position: absolute; bottom: 24px; left: 24px; z-index: 2;
  background: rgba(44,36,34,0.55); padding: 8px 14px; backdrop-filter: blur(8px);
  font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.3em;
  color: rgba(255,255,255,0.92);
}
.fm-coursefeat__body {
  padding: 56px 48px; display: flex; flex-direction: column; justify-content: center;
}
.fm-coursefeat__eyebrow {
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.3em;
  text-transform: uppercase; color: var(--fm-rose-deep); margin-bottom: 18px;
  animation: fmFadeUp 500ms var(--ease-out);
}
.fm-coursefeat__title {
  font-family: var(--font-serif); font-weight: 300;
  font-size: clamp(28px, 3vw, 40px); line-height: 1.15;
  margin: 0 0 18px; color: var(--fg1);
  animation: fmFadeUp 500ms var(--ease-out);
}
.fm-coursefeat__excerpt {
  font-family: var(--font-sans); font-size: 16px; line-height: 1.85;
  color: var(--fg2); margin: 0;
  animation: fmFadeUp 500ms var(--ease-out);
}
.fm-coursefeat__meta {
  display: flex; gap: 18px; margin-top: 32px; padding-top: 24px;
  border-top: 1px solid var(--border); flex-wrap: wrap;
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.22em;
  text-transform: uppercase; color: var(--fg2);
}
.fm-coursefeat__meta-sep { color: var(--fm-rose); }
.fm-coursefeat__foot {
  display: flex; align-items: baseline; justify-content: space-between;
  margin-top: 32px; gap: 24px; flex-wrap: wrap;
}
.fm-coursefeat__price-label { font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--fg3); }
.fm-coursefeat__price-now {
  font-family: var(--font-serif); font-weight: 300; font-size: 36px;
  color: var(--fg1); margin-top: 4px;
}
.fm-coursefeat__price-hint {
  font-family: var(--font-sans); font-style: italic; font-size: 13px; color: var(--fg3); margin-top: 2px;
}
.fm-coursefeat__price-old {
  text-decoration: line-through; font-family: var(--font-meta); font-size: 14px; color: var(--fg3); margin-right: 8px;
}
.fm-coursefeat__arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 56px; height: 56px; border-radius: 999px;
  background: var(--fm-canvas); border: 1px solid var(--border-strong);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  z-index: 3; transition: all 200ms var(--ease-out); color: var(--fg1);
}
.fm-coursefeat__arrow:hover { background: var(--fm-rose); border-color: var(--fm-rose); }
.fm-coursefeat__arrow--prev { left: -22px; }
.fm-coursefeat__arrow--next { right: -22px; }
.fm-coursefeat__dots {
  display: flex; justify-content: center; gap: 10px; margin-top: 32px;
}
.fm-coursefeat__dot {
  width: 8px; height: 8px; border-radius: 999px;
  background: var(--border-strong); border: none; cursor: pointer; padding: 0;
  transition: all 320ms var(--ease-out);
}
.fm-coursefeat__dot.is-active { background: var(--fm-rose); width: 32px; }
@media (max-width: 880px) {
  .fm-coursefeat__slide { grid-template-columns: 1fr; }
  .fm-coursefeat__media { min-height: 320px; aspect-ratio: 4/3; }
  .fm-coursefeat__body { padding: 40px 28px; }
  .fm-coursefeat__arrow--prev { left: 8px; }
  .fm-coursefeat__arrow--next { right: 8px; }
}

/* ---------- HOW IT WORKS — bordered 3-col grid + bottom CTA ---------- */
.fm-steps-wrap {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
  border: 1px solid var(--border-strong); background: var(--fm-canvas);
}
.fm-steps-wrap > .fm-step { padding: 48px; border-right: 1px solid var(--border-strong); height: 100%; background: transparent; display: block; }
.fm-steps-wrap > .fm-step:last-child { border-right: none; }
.fm-step-num,
.fm-step__num {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 56px; color: var(--fm-rose-deep);
  line-height: 1; letter-spacing: -0.02em;
}
.fm-steps-wrap .fm-step__title { font-family: var(--font-serif); font-weight: 300; font-size: 28px; line-height: 1.15; margin: 20px 0 14px; color: var(--fg1); }
.fm-steps-wrap .fm-step__body  { font-family: var(--font-sans); font-size: 15px; line-height: 1.85; color: var(--fg2); margin: 0; }
.fm-steps-cta { text-align: center; margin-top: 56px; }
@media (max-width: 880px) {
  .fm-steps-wrap { grid-template-columns: 1fr; }
  .fm-steps-wrap > .fm-step { border-right: none; border-bottom: 1px solid var(--border-strong); }
  .fm-steps-wrap > .fm-step:last-child { border-bottom: none; }
}

/* ---------- TESTIMONIALS — 3-up rotating window ---------- */
.fm-tests__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; position: relative;
}
.fm-tests__card {
  border: 1px solid var(--border); margin-left: -1px;
  padding: 36px; background: var(--fm-ivory);
  display: flex; flex-direction: column; min-height: 320px;
  animation: fmFadeUp 600ms var(--ease-out);
}
.fm-tests__card:first-child { margin-left: 0; }
.fm-tests__mark {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 40px; color: var(--fm-rose); line-height: 1; margin-bottom: 14px;
}
.fm-tests__quote {
  font-family: var(--font-serif); font-weight: 300; font-style: italic;
  font-size: 18px; line-height: 1.6; color: var(--fg1); margin: 0; flex: 1;
}
.fm-tests__byline {
  margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--border);
  display: flex; align-items: center; gap: 12px;
}
.fm-tests__avatar {
  width: 36px; height: 36px; border-radius: 999px;
  background: var(--fm-rose-soft);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-serif); font-weight: 300; font-size: 14px;
  color: var(--fm-rose-deep);
}
.fm-tests__name { font-family: var(--font-sans); font-size: 13px; letter-spacing: 0.06em; color: var(--fg1); }
.fm-tests__where { font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.24em; color: var(--fg3); margin-top: 2px; text-transform: uppercase; }
.fm-tests__dots { display: flex; justify-content: center; gap: 10px; margin-top: 40px; }
.fm-tests__dot {
  width: 8px; height: 8px; border-radius: 999px;
  background: var(--border-strong); border: none; cursor: pointer; padding: 0;
  transition: all 320ms var(--ease-out);
}
.fm-tests__dot.is-active { background: var(--fm-rose); width: 32px; }
@media (max-width: 880px) {
  .fm-tests__grid { grid-template-columns: 1fr; }
  .fm-tests__card { margin-left: 0; margin-top: -1px; }
}

/* ---------- BLOG — bordered 3-col grid ---------- */
.fm-blog__wrap {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
  border: 1px solid var(--border);
}
.fm-blog__cell {
  padding: 32px; border-right: 1px solid var(--border);
  cursor: pointer; height: 100%;
  display: flex; flex-direction: column;
  transition: background 320ms var(--ease-out);
  text-decoration: none; color: inherit;
}
.fm-blog__cell:last-child { border-right: none; }
.fm-blog__cell:hover { background: var(--fm-ivory); }
.fm-blog__photo { aspect-ratio: 4/3; overflow: hidden; background: var(--fm-sand); }
.fm-blog__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease-out); }
.fm-blog__cell:hover .fm-blog__photo img { transform: scale(1.04); }
.fm-blog__meta {
  font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--fg3); margin-top: 22px;
}
.fm-blog__title {
  font-family: var(--font-serif); font-weight: 300; font-size: 24px; line-height: 1.25;
  margin: 12px 0 10px; color: var(--fg1);
}
.fm-blog__cell:hover .fm-blog__title { color: var(--fm-rose-deep); }
.fm-blog__excerpt {
  font-family: var(--font-sans); font-size: 14px; line-height: 1.75;
  color: var(--fg2); margin: 0; flex: 1;
}
.fm-blog__more {
  margin-top: 20px; align-self: flex-start;
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--fg1);
  border-bottom: 1px solid var(--fm-rose); padding-bottom: 4px;
}
@media (max-width: 880px) {
  .fm-blog__wrap { grid-template-columns: 1fr; }
  .fm-blog__cell { border-right: none; border-bottom: 1px solid var(--border); }
  .fm-blog__cell:last-child { border-bottom: none; }
}

/* ---------- "Niste same" CTA + sand-colored footer ---------- */
.fm-niste-same {
  background: var(--fm-sand); border-top: 1px solid var(--border);
  padding: 120px 8vw 96px; text-align: center;
}
.fm-niste-same__inner { max-width: 880px; margin: 0 auto; border-bottom: 1px solid var(--border-strong); padding-bottom: 96px; }
.fm-niste-same__eyebrow { display: inline-flex; gap: 14px; align-items: center; margin-bottom: 24px; justify-content: center; }
.fm-niste-same__title { font-family: var(--font-serif); font-weight: 300; font-size: clamp(40px, 6vw, 80px); line-height: 1.08; margin: 0; color: var(--fg1); }
.fm-niste-same__title em { font-style: italic; color: var(--fm-rose-deep); font-weight: 300; }
.fm-niste-same__lead { font-family: var(--font-sans); font-size: 18px; line-height: 1.85; color: var(--fg2); margin: 28px auto 0; max-width: 560px; }
.fm-niste-same__btn { margin-top: 36px; }

.fm-footer {
  background: var(--fm-sand); color: var(--fg1);
  padding: 80px 8vw 36px;
  border-top: none;
}
.fm-footer__grid {
  display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 48px; align-items: flex-start;
  max-width: var(--container); margin: 0 auto;
}
.fm-footer__brand-tag {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 19px; line-height: 1.55; color: var(--fg1); margin: 28px 0 0; max-width: 380px;
}
.fm-footer__brand-tag em { color: var(--fm-rose-deep); }
.fm-footer__col h4 {
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--fg3); margin: 0 0 22px; font-weight: 500;
}
.fm-footer__col ul { display: flex; flex-direction: column; gap: 12px; padding: 0; margin: 0; list-style: none; }
.fm-footer__col a {
  font-family: var(--font-sans); font-size: 14px; color: var(--fg1);
  border-bottom: 1px solid transparent; padding-bottom: 2px;
  transition: border-color 180ms var(--ease-out);
}
.fm-footer__col a:hover { border-bottom-color: var(--fm-rose); color: var(--fg1); }
.fm-footer__bottom {
  border-top: 1px solid var(--border-strong);
  margin-top: 72px; padding-top: 24px;
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px;
  font-family: var(--font-meta); font-size: 11px; letter-spacing: 0.16em; color: var(--fg3);
  max-width: var(--container); margin-left: auto; margin-right: auto;
}
@media (max-width: 880px) {
  .fm-footer__grid { grid-template-columns: 1fr; gap: 32px; }
  .fm-niste-same { padding: 80px var(--gutter-x-snug) 64px; }
  .fm-niste-same__inner { padding-bottom: 64px; }
}

/* ---------- Section heads (left + right CTA) used in HowItWorks/Tests/Blog ---------- */
.fm-sec-head {
  display: grid; grid-template-columns: 1fr auto;
  align-items: flex-end; margin-bottom: 56px; gap: 40px;
}
.fm-sec-head__title { font-family: var(--font-serif); font-weight: 300; line-height: 1.12; font-size: clamp(40px, 5vw, 64px); margin: 16px 0 0; }
.fm-sec-head__title em { font-style: italic; color: var(--fm-rose-deep); font-weight: 600; }
.fm-sec-head__sub {
  font-family: var(--font-serif); font-style: italic; font-weight: 300;
  font-size: 20px; color: var(--fg2); margin-top: 16px;
}
@media (max-width: 760px) {
  .fm-sec-head { grid-template-columns: 1fr; }
}

/* ============================================================
   v1.2 ADDITIONS — testimonials arrows + global reveal
   ============================================================ */

/* Testimonials nav row: prev — dots — next */
.fm-tests__nav {
  display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 40px;
}
.fm-tests__nav .fm-tests__dots { margin-top: 0; }
.fm-tests__arrow {
  width: 44px; height: 44px; border-radius: 999px;
  background: var(--fm-canvas); border: 1px solid var(--border-strong);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--fg1);
  transition: background 200ms var(--ease-out), border-color 200ms var(--ease-out), color 200ms var(--ease-out);
  padding: 0;
}
.fm-tests__arrow:hover { background: var(--fm-rose); border-color: var(--fm-rose); color: #fff; }

/* Reveal: explicit "in-view" trigger driven by IntersectionObserver below */
.fm-reveal--up    { transform: translateY(28px); }
.fm-reveal--right { transform: translateX(-28px); }
.fm-reveal--left  { transform: translateX(28px); }
.fm-reveal--zoom  { transform: scale(0.96); }
.fm-reveal.is-visible { transform: none; }

/* Stagger child reveals when the parent has [data-fm-stagger] */
[data-fm-stagger] > .fm-reveal { transition-delay: 0ms; }
[data-fm-stagger] > .fm-reveal:nth-child(2) { transition-delay: 90ms; }
[data-fm-stagger] > .fm-reveal:nth-child(3) { transition-delay: 180ms; }
[data-fm-stagger] > .fm-reveal:nth-child(4) { transition-delay: 270ms; }
[data-fm-stagger] > .fm-reveal:nth-child(5) { transition-delay: 360ms; }
[data-fm-stagger] > .fm-reveal:nth-child(6) { transition-delay: 450ms; }
@media (prefers-reduced-motion: reduce) {
  .fm-reveal, .fm-reveal--up, .fm-reveal--right, .fm-reveal--left, .fm-reveal--zoom {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
}

/* ============================================================
   v1.3 ADDITIONS — Contact page
   ============================================================ */

/* Page hero (sand band, used for non-home page intros) */
.fm-pagehero {
  background: var(--fm-sand); border-bottom: 1px solid var(--border);
  padding: 96px 8vw 80px; text-align: center; position: relative; overflow: hidden;
}
.fm-pagehero__inner { max-width: 880px; margin: 0 auto; position: relative; z-index: 1; }
.fm-pagehero__eyebrow { display: inline-flex; gap: 14px; align-items: center; margin-bottom: 22px; justify-content: center; }
.fm-pagehero__title {
  font-family: var(--font-serif); font-weight: 300;
  font-size: clamp(40px, 6vw, 80px); line-height: 1.08; letter-spacing: -0.01em;
  margin: 0; color: var(--fg1);
}
.fm-pagehero__title em { font-style: italic; color: var(--fm-rose-deep); font-weight: 300; }
.fm-pagehero__lead {
  font-family: var(--font-sans); font-size: 18px; line-height: 1.85;
  color: var(--fg2); margin: 24px auto 0; max-width: 620px;
}
.fm-pagehero__blob {
  position: absolute; pointer-events: none; opacity: .35; filter: blur(2px);
  border-radius: 62% 38% 55% 45% / 50% 60% 40% 50%; background: var(--fm-rose-soft);
}
.fm-pagehero__blob--a { width: 360px; height: 360px; top: -120px; left: -120px; }
.fm-pagehero__blob--b { width: 280px; height: 280px; bottom: -140px; right: -100px; background: var(--fm-rose); opacity: .22; }

/* Contact grid: form left (1.4fr) + info card right (1fr) */
.fm-contact { background: var(--fm-canvas); padding: 96px 8vw; }
.fm-contact__grid {
  max-width: var(--container); margin: 0 auto;
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: stretch;
}
.fm-contact__form {
  background: var(--fm-ivory); border: 1px solid var(--border-strong);
  padding: 48px;
}
.fm-contact__form-head { margin-bottom: 32px; }
.fm-contact__form-head h2 {
  font-family: var(--font-serif); font-weight: 300; font-size: clamp(28px, 3vw, 36px);
  line-height: 1.2; margin: 12px 0 0; color: var(--fg1);
}
.fm-contact__form-head h2 em { font-style: italic; color: var(--fm-rose-deep); font-weight: 300; }
.fm-contact__form-head p {
  font-family: var(--font-sans); font-size: 15px; line-height: 1.7;
  color: var(--fg2); margin: 14px 0 0; max-width: 420px;
}

/* Form fields — minimal underlined editorial style */
.fm-field { display: block; margin-bottom: 24px; position: relative; }
.fm-field__row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.fm-field__label {
  display: block;
  font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--fg3); margin-bottom: 8px;
}
.fm-input, .fm-textarea {
  display: block; width: 100%;
  background: transparent; border: none; border-bottom: 1px solid var(--border-strong);
  padding: 12px 0; color: var(--fg1);
  font-family: var(--font-sans); font-size: 15px; line-height: 1.5;
  border-radius: 0; outline: none;
  transition: border-color 200ms var(--ease-out);
}
.fm-input:focus, .fm-textarea:focus { border-bottom-color: var(--fm-rose-deep); }
.fm-input::placeholder, .fm-textarea::placeholder { color: var(--fg3); }
.fm-textarea { resize: vertical; min-height: 120px; }
.fm-field__error { display: block; margin-top: 6px; font-family: var(--font-sans); font-size: 12px; color: #b94a48; }

.fm-checkbox {
  display: flex; align-items: flex-start; gap: 12px; margin: 24px 0 0;
  font-family: var(--font-sans); font-size: 13px; line-height: 1.6; color: var(--fg2);
}
.fm-checkbox input { margin-top: 4px; accent-color: var(--fm-rose-deep); }
.fm-checkbox a { color: var(--fm-rose-deep); border-bottom: 1px solid var(--fm-rose); }

.fm-form__alert {
  background: rgba(208, 178, 175, 0.18); border: 1px solid var(--fm-rose);
  padding: 16px 20px; margin-bottom: 24px;
  font-family: var(--font-sans); font-size: 14px; line-height: 1.6; color: var(--fg1);
}

/* Info card on right */
.fm-contact__info {
  background: var(--fm-espresso); color: #fff;
  padding: 48px; display: flex; flex-direction: column; justify-content: space-between;
  position: relative; overflow: hidden;
}
.fm-contact__info::before {
  content: ''; position: absolute; width: 280px; height: 280px;
  bottom: -120px; right: -100px; background: var(--fm-rose); opacity: .18;
  border-radius: 55% 45% 62% 38% / 60% 40% 50% 50%; pointer-events: none; filter: blur(2px);
}
.fm-contact__info > * { position: relative; z-index: 1; }
.fm-contact__info-head .fm-eyebrow { color: rgba(255,255,255,0.78); margin-bottom: 18px; justify-content: flex-start; }
.fm-contact__info-head .fm-rule { background: var(--fm-rose); width: 30px; }
.fm-contact__info-title {
  font-family: var(--font-serif); font-weight: 300; font-size: 32px; line-height: 1.2;
  margin: 0; color: #fff;
}
.fm-contact__info-title em { font-style: italic; color: var(--fm-rose); font-weight: 300; }
.fm-contact__info-list {
  list-style: none; padding: 0; margin: 36px 0 0;
  display: flex; flex-direction: column; gap: 18px;
}
.fm-contact__info-item {
  display: grid; grid-template-columns: 36px 1fr; gap: 14px; align-items: flex-start;
}
.fm-contact__info-icon {
  width: 36px; height: 36px; border-radius: 999px;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.18);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--fm-rose);
}
.fm-contact__info-icon svg { width: 16px; height: 16px; }
.fm-contact__info-label { font-family: var(--font-meta); font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase; color: rgba(255,255,255,0.6); }
.fm-contact__info-val   { font-family: var(--font-sans); font-size: 15px; line-height: 1.5; color: #fff; margin-top: 4px; }
.fm-contact__info-val a { color: #fff; border-bottom: 1px solid transparent; transition: border-color 180ms var(--ease-out); }
.fm-contact__info-val a:hover { border-bottom-color: var(--fm-rose); }

.fm-contact__social { display: flex; gap: 14px; margin-top: 36px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,0.18); }
.fm-contact__social a {
  width: 40px; height: 40px; border-radius: 999px;
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.18);
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; transition: background 200ms var(--ease-out), border-color 200ms var(--ease-out);
}
.fm-contact__social a:hover { background: var(--fm-rose); border-color: var(--fm-rose); }
.fm-contact__social svg { width: 16px; height: 16px; }

/* Map block */
.fm-map { background: var(--fm-sand); padding: 0; }
.fm-map__inner { max-width: var(--container); margin: 0 auto; }
.fm-map__head { padding: 80px 8vw 32px; text-align: center; }
.fm-map__frame {
  border: 1px solid var(--border-strong); margin: 0 8vw 96px;
  background: var(--fm-canvas); overflow: hidden;
}
.fm-map__frame iframe { display: block; width: 100%; height: 460px; border: 0; }

/* FAQ-ish quick-help strip below map */
.fm-quickhelp {
  background: var(--fm-canvas); border-top: 1px solid var(--border);
  padding: 96px 8vw;
}
.fm-quickhelp__grid {
  max-width: var(--container); margin: 0 auto;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0;
  border: 1px solid var(--border);
}
.fm-quickhelp__cell {
  padding: 36px; border-right: 1px solid var(--border);
  display: flex; flex-direction: column; gap: 12px;
}
.fm-quickhelp__cell:last-child { border-right: none; }
.fm-quickhelp__icon { color: var(--fm-rose-deep); }
.fm-quickhelp__icon svg { width: 28px; height: 28px; }
.fm-quickhelp__title { font-family: var(--font-serif); font-weight: 300; font-size: 22px; line-height: 1.25; margin: 0; color: var(--fg1); }
.fm-quickhelp__body  { font-family: var(--font-sans); font-size: 14px; line-height: 1.75; color: var(--fg2); margin: 0; }

@media (max-width: 880px) {
  .fm-contact__grid { grid-template-columns: 1fr; gap: 32px; }
  .fm-contact__form, .fm-contact__info { padding: 32px; }
  .fm-field__row { grid-template-columns: 1fr; gap: 16px; }
  .fm-quickhelp__grid { grid-template-columns: 1fr; }
  .fm-quickhelp__cell { border-right: none; border-bottom: 1px solid var(--border); }
  .fm-quickhelp__cell:last-child { border-bottom: none; }
  .fm-map__frame { margin: 0 var(--gutter-x-snug) 64px; }
  .fm-map__frame iframe { height: 320px; }
}

/* ============================================================
   v1.4 — CTA band section (after blog on home)
   ============================================================ */
.fm-ctaband {
  position: relative;
  overflow: hidden;
  padding: 120px 8vw;
  background: var(--fm-rose-soft, oklch(0.86 0.025 25));
  text-align: center;
}
.fm-ctaband__blob {
  position: absolute;
  background: var(--fm-rose);
  border-radius: 62% 38% 55% 45% / 50% 60% 40% 50%;
  opacity: 0.22;
  will-change: transform;
  animation: ctaBandFloat 14s var(--ease-out) infinite alternate;
  pointer-events: none;
}
.fm-ctaband__blob--1 { top: -200px; left: -100px; width: 460px; height: 460px; animation-delay: 0s; }
.fm-ctaband__blob--2 { bottom: -260px; right: -120px; width: 540px; height: 540px; animation-delay: -7s; animation-duration: 18s; }
.fm-ctaband__blob--3 { top: 50%; left: 50%; width: 220px; height: 220px; margin-left: -110px; margin-top: -110px; opacity: 0.12; animation-duration: 22s; animation-delay: -3s; }
@keyframes ctaBandFloat {
  0%   { transform: translate(0, 0) rotate(0deg) scale(1); }
  50%  { transform: translate(30px, -20px) rotate(8deg) scale(1.05); }
  100% { transform: translate(-20px, 30px) rotate(-6deg) scale(0.97); }
}
.fm-ctaband__line {
  position: absolute; height: 1px;
  background: var(--fm-rose);
  opacity: 0.4;
}
.fm-ctaband__line--top { top: 80px; left: 50%; width: 0; transform: translateX(-50%); animation: ctaBandLine 1400ms var(--ease-out) 200ms forwards; }
.fm-ctaband__line--bot { bottom: 80px; left: 50%; width: 0; transform: translateX(-50%); animation: ctaBandLine 1400ms var(--ease-out) 400ms forwards; }
@keyframes ctaBandLine { to { width: 80px; } }

.fm-ctaband__inner { position: relative; max-width: 880px; margin: 0 auto; z-index: 2; }

.fm-ctaband__eyebrow {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: var(--font-serif);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.30em;
  text-transform: uppercase;
  color: var(--fm-rose-deep);
  margin-bottom: 28px;
}
.fm-ctaband__eyebrow::before, .fm-ctaband__eyebrow::after {
  content: ""; display: inline-block;
  width: 32px; height: 1px;
  background: var(--fm-rose-deep);
}
.fm-ctaband__h {
  font-family: var(--font-serif);
  font-weight: 300;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--fg1);
  margin: 0;
}
.fm-ctaband__h em {
  font-style: italic;
  color: var(--fm-rose-deep);
  font-weight: 300;
  position: relative;
  display: inline-block;
}
.fm-ctaband__h em::after {
  content: ""; position: absolute;
  left: 0; right: 0; bottom: -6px;
  height: 1px;
  background: var(--fm-rose);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 900ms var(--ease-out) 800ms;
}
.fm-ctaband.in .fm-ctaband__h em::after { transform: scaleX(1); }
.fm-ctaband__lead {
  font-family: var(--font-sans);
  font-size: 18px;
  line-height: 1.85;
  color: var(--fg2);
  margin: 24px 0 0;
}
.fm-ctaband__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  padding: 20px 40px;
  margin-top: 40px;
  background: var(--fm-rose);
  color: var(--fg1);
  border: none;
  cursor: pointer;
  border-radius: 999px;
  transition: background 200ms var(--ease-out), color 200ms var(--ease-out), transform 200ms var(--ease-out);
  text-decoration: none;
}
.fm-ctaband__btn:hover {
  background: var(--fm-rose-deep);
  color: #fff;
  transform: translateY(-2px);
}
.fm-ctaband__btn .arrow { display: inline-block; transition: transform 240ms var(--ease-out); }
.fm-ctaband__btn:hover .arrow { transform: translateX(6px); }

@media (prefers-reduced-motion: reduce) {
  .fm-ctaband__blob { animation: none; }
  .fm-ctaband__h em::after { transition: none; transform: scaleX(1); }
  .fm-ctaband__line--top, .fm-ctaband__line--bot { animation: none; width: 80px; }
}
@media (max-width: 720px) {
  .fm-ctaband { padding: 80px 6vw; }
  .fm-ctaband__line--top { top: 48px; }
  .fm-ctaband__line--bot { bottom: 48px; }
}

/* ============================================================
   v1.5 — 4-col footer redesign + sticky contact sidebar
   ============================================================ */
.fm-footer--v2 { padding: 96px 8vw 32px; }
.fm-footer--v2 .fm-footer__grid--4 {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1.1fr 1.1fr;
  gap: 56px;
  max-width: 1320px;
  margin: 0 auto 64px;
  align-items: start;
}
.fm-footer--v2 .fm-footer__brand { max-width: none; }
.fm-footer--v2 .fm-footer__logo { height: 44px; width: auto; display: block; margin-bottom: 24px; }
.fm-footer--v2 .fm-footer__brand-tag { font-size: 14px; line-height: 1.7; color: rgba(248, 247, 242, 0.66); margin: 0 0 24px; max-width: 380px; }
.fm-footer--v2 .fm-footer__brand-tag em { color: var(--fm-rose); font-style: italic; }

.fm-footer__minimeta { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.fm-footer__minimeta li { font-size: 12px; color: rgba(248, 247, 242, 0.55); letter-spacing: 0.02em; }
.fm-footer__metalbl { font-family: var(--font-sans); text-transform: uppercase; letter-spacing: 0.18em; font-size: 10px; color: var(--fm-rose); margin-right: 6px; }

.fm-footer--v2 .fm-footer__col h4 { font-family: var(--font-sans); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--fm-rose); margin: 0 0 22px; font-weight: 500; }
.fm-footer--v2 .fm-footer__col ul { display: flex; flex-direction: column; gap: 12px; padding: 0; margin: 0; list-style: none; }
.fm-footer--v2 .fm-footer__col a { color: rgba(248, 247, 242, 0.72); font-size: 14px; transition: color 200ms; text-decoration: none; border-bottom: 1px solid transparent; padding-bottom: 1px; }
.fm-footer--v2 .fm-footer__col a:hover { color: var(--fm-rose); border-bottom-color: var(--fm-rose); }

.fm-footer__contacts a { font-family: var(--font-sans); }
.fm-footer__cards { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.fm-footer__cards img { height: 24px; width: auto; opacity: 0.86; background: rgba(255, 255, 255, 0.94); padding: 4px 6px; border-radius: 3px; }

.fm-footer__socials { display: flex; gap: 10px; margin-top: 24px; }
.fm-footer__socials a {
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(248, 247, 242, 0.18);
  color: rgba(248, 247, 242, 0.7);
  border-radius: 999px;
  transition: all 200ms var(--ease-out);
}
.fm-footer__socials a:hover { background: var(--fm-rose); border-color: var(--fm-rose); color: var(--fg1); transform: translateY(-2px); }
.fm-footer__socials svg { width: 16px; height: 16px; }

.fm-footer--v2 .fm-footer__bottom {
  border-top: 1px solid rgba(248, 247, 242, 0.12);
  padding-top: 24px;
  display: flex; justify-content: space-between; align-items: center;
  font-size: 11px;
  color: rgba(248, 247, 242, 0.5);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  max-width: 1320px;
  margin: 0 auto;
  gap: 16px;
  flex-wrap: wrap;
}
.fm-footer--v2 .fm-footer__bottom a { color: var(--fm-rose); border-bottom: 1px solid transparent; transition: border-color 200ms; }
.fm-footer--v2 .fm-footer__bottom a:hover { border-bottom-color: var(--fm-rose); }

@media (max-width: 1080px) {
  .fm-footer--v2 .fm-footer__grid--4 { grid-template-columns: 1fr 1fr; gap: 48px; }
}
@media (max-width: 640px) {
  .fm-footer--v2 { padding: 72px 6vw 28px; }
  .fm-footer--v2 .fm-footer__grid--4 { grid-template-columns: 1fr; gap: 40px; }
  .fm-footer--v2 .fm-footer__bottom { flex-direction: column; align-items: flex-start; }
}

/* Contact info sidebar — sticky on scroll */
@media (min-width: 980px) {
  .fm-contact__info {
    position: sticky;
    top: 96px;
    align-self: start;
  }
}

/* Mobile header tighten — v1.5 */
@media (max-width: 980px) {
  .fm-header__inner .fm-nav, .fm-header__inner .fm-header__cta { display: none; }
  .fm-burger { display: inline-flex !important; align-items: center; justify-content: center; }
  .fm-mobile-nav { padding: 24px 6vw 32px; gap: 6px; }
  .fm-mobile-nav .fm-nav__link { padding: 14px 0; }
  .fm-mobile-nav .fm-btn { margin-top: 16px; align-self: stretch; text-align: center; }
}
@media (max-width: 480px) {
  .fm-header__inner { padding: 14px 6vw; }
  .fm-header__inner .fm-logo img { height: 32px !important; }
}

/* ============================================================
   v1.6 — Testimonials redesign: side arrows, fixed height, internal scroll, drag
   ============================================================ */
.fm-tests { position: relative; }
.fm-tests__stage {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-top: 40px;
  position: relative;
}
.fm-tests__stage .fm-tests__grid {
  flex: 1;
  margin-top: 0 !important;
  user-select: none;
  cursor: grab;
}
.fm-tests__stage .fm-tests__grid.is-dragging { cursor: grabbing; }
.fm-tests__stage .fm-tests__card {
  height: 320px;
  display: flex;
  flex-direction: column;
  padding: 36px 32px 28px !important;
}
.fm-tests__quote-wrap {
  flex: 1;
  overflow-y: auto;
  margin: 0 -8px 16px;
  padding: 0 8px;
  scrollbar-width: thin;
  scrollbar-color: var(--fm-rose) transparent;
}
.fm-tests__quote-wrap::-webkit-scrollbar { width: 4px; }
.fm-tests__quote-wrap::-webkit-scrollbar-track { background: transparent; }
.fm-tests__quote-wrap::-webkit-scrollbar-thumb { background: var(--fm-rose); border-radius: 999px; }
.fm-tests__stage .fm-tests__quote {
  font-size: 15px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}
.fm-tests__stage .fm-tests__byline { margin-top: 0 !important; }

.fm-tests__arrow--left, .fm-tests__arrow--right {
  flex-shrink: 0;
  width: 48px; height: 48px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  background: var(--fm-canvas);
  color: var(--fm-rose-deep);
  border: 1px solid var(--fm-rose);
  cursor: pointer;
  transition: background 200ms var(--ease-out), color 200ms var(--ease-out), transform 200ms var(--ease-out);
  z-index: 2;
}
.fm-tests__arrow--left:hover, .fm-tests__arrow--right:hover {
  background: var(--fm-rose);
  color: #fff;
  transform: scale(1.05);
}
.fm-tests__dots { margin-top: 32px !important; }

@media (max-width: 880px) {
  .fm-tests__stage { gap: 8px; }
  .fm-tests__stage .fm-tests__card { height: 360px; padding: 28px 22px !important; }
  .fm-tests__arrow--left, .fm-tests__arrow--right { width: 40px; height: 40px; }
}

/* ============================================================
   v1.7 — Vesti list (cats pills) + Single blog article
   ============================================================ */
.fm-blog-cats {
  display: flex; flex-wrap: wrap; gap: 10px;
  justify-content: center;
  margin: 0 0 56px;
}
.fm-blog-cats__pill {
  display: inline-flex; align-items: center;
  padding: 10px 22px;
  font-family: var(--font-sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--fg2);
  border: 1px solid var(--border);
  border-radius: 999px;
  text-decoration: none;
  transition: all 200ms var(--ease-out);
  background: transparent;
}
.fm-blog-cats__pill:hover { color: var(--fm-rose-deep); border-color: var(--fm-rose); }
.fm-blog-cats__pill.is-active {
  background: var(--fm-rose);
  color: var(--fg1);
  border-color: var(--fm-rose);
}

/* Single article */
.fm-article { background: var(--fm-canvas); }
.fm-article__head {
  text-align: center;
  padding: 80px 8vw 40px;
  background: var(--fm-sand);
  position: relative;
}
.fm-article__head-inner { max-width: 880px; margin: 0 auto; }
.fm-article__title {
  font-family: var(--font-serif);
  font-weight: 300;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.12;
  letter-spacing: -0.01em;
  color: var(--fg1);
  margin: 22px 0 0;
}
.fm-article__date {
  margin-top: 18px;
  font-family: var(--font-sans);
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--fg3);
}
.fm-article__cover {
  max-width: 1100px;
  margin: 56px auto 0;
  padding: 0 8vw;
}
.fm-article__cover img {
  width: 100%;
  height: auto;
  max-height: 560px;
  object-fit: cover;
  display: block;
}

.fm-article__body {
  max-width: 760px;
  margin: 0 auto;
  padding: 80px 6vw 96px;
  font-family: var(--font-sans);
  color: var(--fg2);
}
.fm-article__lead {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 300;
  font-size: 22px;
  line-height: 1.55;
  color: var(--fg1);
  margin: 0 0 40px;
  padding-left: 20px;
  border-left: 2px solid var(--fm-rose);
}
.fm-article__content { font-size: 17px; line-height: 1.8; }
.fm-article__content p,
.fm-article__content ul,
.fm-article__content ol { margin: 0 0 22px; }
.fm-article__content h2 {
  font-family: var(--font-serif);
  font-weight: 300;
  font-size: clamp(26px, 3.5vw, 36px);
  color: var(--fg1);
  margin: 48px 0 18px;
  letter-spacing: -0.01em;
}
.fm-article__content h3 {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: clamp(20px, 2.6vw, 26px);
  color: var(--fg1);
  margin: 36px 0 14px;
}
.fm-article__content a { color: var(--fm-rose-deep); border-bottom: 1px solid var(--fm-rose); transition: opacity 200ms; }
.fm-article__content a:hover { opacity: 0.7; }
.fm-article__content img { max-width: 100%; height: auto; margin: 24px 0; }
.fm-article__content blockquote {
  margin: 32px 0;
  padding: 16px 24px;
  border-left: 2px solid var(--fm-rose);
  font-style: italic;
  color: var(--fg1);
}
.fm-article__back { margin-top: 64px; text-align: center; }

@media (max-width: 720px) {
  .fm-article__head { padding: 56px 6vw 32px; }
  .fm-article__cover { padding: 0 6vw; margin-top: 36px; }
  .fm-article__body { padding: 56px 6vw 72px; }
  .fm-article__lead { font-size: 18px; }
  .fm-article__content { font-size: 16px; }
}

/* ============================================================
   v1.8 — FAQ accordion
   ============================================================ */
.fm-faq { max-width: 880px; margin: 0 auto; }
.fm-faq__group { margin-bottom: 64px; }
.fm-faq__group:last-child { margin-bottom: 0; }
.fm-faq__group-title {
  font-family: var(--font-serif);
  font-weight: 300;
  font-size: clamp(24px, 3vw, 32px);
  color: var(--fg1);
  letter-spacing: -0.01em;
  margin: 0 0 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--border);
}
.fm-faq__list { display: flex; flex-direction: column; }
.fm-faq__item {
  border-bottom: 1px solid var(--border);
  transition: background 220ms var(--ease-out);
}
.fm-faq__item[open] { background: var(--fm-canvas); }
.fm-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 4px;
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.5;
  color: var(--fg1);
  list-style: none;
  user-select: none;
}
.fm-faq__q::-webkit-details-marker { display: none; }
.fm-faq__q-text { flex: 1; }
.fm-faq__plus {
  flex-shrink: 0;
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  background: var(--fm-canvas);
  color: var(--fm-rose-deep);
  border: 1px solid var(--fm-rose);
  transition: transform 280ms var(--ease-out), background 200ms, color 200ms;
}
.fm-faq__item[open] .fm-faq__plus {
  transform: rotate(45deg);
  background: var(--fm-rose);
  color: #fff;
  border-color: var(--fm-rose);
}
.fm-faq__item:hover .fm-faq__plus { background: var(--fm-rose); color: #fff; }
.fm-faq__a {
  padding: 4px 4px 28px;
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.75;
  color: var(--fg2);
  max-width: 720px;
  animation: fmFaqSlide 360ms var(--ease-out);
}
.fm-faq__a p { margin: 0; }
@keyframes fmFaqSlide {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 720px) {
  .fm-faq__group { margin-bottom: 48px; }
  .fm-faq__q { font-size: 15px; padding: 20px 4px; gap: 16px; }
  .fm-faq__plus { width: 32px; height: 32px; }
  .fm-faq__a { font-size: 14px; padding: 0 4px 24px; }
}

/* ============================================================
   v1.9 — Header width, mobile drawer, footer color fixes
   ============================================================ */

/* Header — widen inner to a comfortable container width and breathe */
.fm-header__inner {
  max-width: 1320px !important;
  padding: 18px 32px !important;
  gap: 32px;
}
.fm-header .fm-nav { gap: 28px; }
.fm-header .fm-nav__link { font-size: 11px; letter-spacing: 0.22em; }
@media (max-width: 1180px) {
  .fm-header .fm-nav { gap: 18px; }
  .fm-header .fm-nav__link { letter-spacing: 0.16em; font-size: 10.5px; }
}
@media (max-width: 980px) {
  .fm-header__inner { padding: 14px 22px !important; gap: 16px; }
}

/* Mobile drawer — solid background, full-screen, with header + close button */
.fm-mobile-backdrop {
  display: none;
  position: fixed; inset: 0;
  background: rgba(44, 36, 34, 0.55);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  z-index: 998;
}
.fm-mobile-backdrop.is-open { display: block; }

.fm-mobile-nav {
  display: flex !important;
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: min(420px, 88vw);
  height: 100vh;
  background: var(--fm-canvas) !important;
  box-shadow: -16px 0 48px rgba(44, 36, 34, 0.18);
  flex-direction: column;
  gap: 0 !important;
  padding: 0 !important;
  z-index: 999;
  transform: translateX(100%);
  transition: transform 320ms var(--ease-out);
  overflow-y: auto;
}
.fm-mobile-nav.is-open { transform: translateX(0); }

.fm-mobile-nav__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 28px;
  border-bottom: 1px solid var(--border);
  background: var(--fm-canvas);
}
.fm-mobile-nav__head .fm-logo img { max-height: 40px; width: auto; display: block; }
.fm-mobile-nav__close {
  background: transparent; border: 1px solid var(--border);
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  cursor: pointer;
  color: var(--fg1);
  transition: all 200ms var(--ease-out);
}
.fm-mobile-nav__close:hover { background: var(--fm-rose); border-color: var(--fm-rose); color: var(--fg1); }

.fm-mobile-nav__list {
  display: flex; flex-direction: column;
  padding: 16px 28px;
}
.fm-mobile-nav__list .fm-nav__link {
  font-size: 14px;
  letter-spacing: 0.2em;
  padding: 18px 0;
  border-bottom: 1px solid var(--border);
  color: var(--fg1);
}
.fm-mobile-nav__list .fm-nav__link:last-child { border-bottom: none; }

.fm-mobile-nav__cta {
  margin: 16px 28px 28px;
  text-align: center;
  align-self: stretch;
}

body.fm-no-scroll { overflow: hidden; }

/* Footer v2 — force espresso bg + light text (override sand-bg base rule) */
.fm-footer.fm-footer--v2 {
  background: var(--fm-espresso) !important;
  color: var(--fg-on-dark);
  border-top: none;
}
.fm-footer--v2 .fm-footer__brand-tag {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.6;
  color: rgba(248, 247, 242, 0.78);
  margin: 24px 0;
  max-width: 380px;
}
.fm-footer--v2 .fm-footer__brand-tag em { color: var(--fm-rose); font-style: italic; }

.fm-footer--v2 .fm-footer__minimeta li { color: rgba(248, 247, 242, 0.62); }
.fm-footer--v2 .fm-footer__metalbl { color: var(--fm-rose); }
.fm-footer--v2 .fm-footer__minimeta a {
  color: rgba(248, 247, 242, 0.85);
  border-bottom: 1px solid transparent;
}
.fm-footer--v2 .fm-footer__minimeta a:hover { color: var(--fm-rose); border-bottom-color: var(--fm-rose); }

.fm-footer--v2 .fm-footer__col h4 { color: var(--fm-rose); }
.fm-footer--v2 .fm-footer__col a { color: rgba(248, 247, 242, 0.78) !important; }
.fm-footer--v2 .fm-footer__col a:hover { color: var(--fm-rose) !important; border-bottom-color: var(--fm-rose) !important; }

.fm-footer--v2 .fm-footer__contacts li { color: rgba(248, 247, 242, 0.78); font-size: 14px; }

.fm-footer--v2 .fm-footer__cards {
  display: block;
  margin-top: 24px;
  padding: 0;
  background: transparent;
  border-radius: 0;
  width: 100%;
  max-width: 100%;
}
.fm-footer--v2 .fm-footer__cards img {
  display: block;
  height: auto;
  width: 100%;
  max-width: 360px;
  background: transparent;
  padding: 0;
  border-radius: 0;
  filter: brightness(1.05) drop-shadow(0 2px 6px rgba(0, 0, 0, 0.18));
}

.fm-footer--v2 .fm-footer__bottom {
  border-top: 1px solid rgba(248, 247, 242, 0.12);
  color: rgba(248, 247, 242, 0.5);
}
.fm-footer--v2 .fm-footer__logo { filter: none; opacity: 0.96; }


/* ========================================================================
   v2.0 — cart icon button in header_fm + mobile drawer link
   ======================================================================== */
.fm-cart-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-right: 12px;
  border-radius: 50%;
  background: var(--fm-rose-soft, #f6e2e1);
  color: var(--fm-espresso, #3b2a23);
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.fm-cart-btn:hover {
  background: var(--fm-rose, #d99fa1);
  color: #fff;
  transform: translateY(-1px);
}
.fm-cart-btn svg { width: 22px; height: 22px; }
.fm-cart-btn__count {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 10px;
  background: var(--fm-rose-deep, #b46c70);
  color: #fff;
  font: 600 11px/20px var(--fm-sans, system-ui, sans-serif);
  text-align: center;
  letter-spacing: 0.02em;
  border: 2px solid var(--fm-canvas, #fff);
  transition: transform 0.18s cubic-bezier(.2,.9,.3,1.4);
}
.fm-cart-btn__count:not(.is-active) {
  background: rgba(59, 42, 35, 0.4);
}
.fm-header--scrolled .fm-cart-btn { background: rgba(217, 159, 161, 0.18); }
.fm-header--scrolled .fm-cart-btn:hover { background: var(--fm-rose, #d99fa1); }

@media (max-width: 980px) {
  .fm-cart-btn { display: none; }
}

.fm-nav__link--cart {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  padding-top: 14px !important;
  border-top: 1px solid rgba(59, 42, 35, 0.08);
}
.fm-cart-badge {
  display: inline-block;
  min-width: 22px;
  height: 22px;
  margin-left: 4px;
  padding: 0 6px;
  border-radius: 11px;
  background: var(--fm-rose-deep, #b46c70);
  color: #fff;
  font: 600 12px/22px var(--fm-sans, system-ui, sans-serif);
  text-align: center;
}

/* ========================================================================
   v2.1 — About page: story, pillars, goals, stats, cta
   ======================================================================== */
.fm-about-story {
  padding: 96px 24px 64px;
  background: var(--fm-canvas, #f9f6f1);
}
.fm-about-story__inner {
  max-width: var(--container, 1320px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(300px, 1fr) 1.2fr;
  gap: 80px;
  align-items: center;
}
.fm-about-story__media {
  position: relative;
  border-radius: 32px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(59, 42, 35, 0.18);
  aspect-ratio: 4 / 5;
}
.fm-about-story__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 8s ease;
}
.fm-about-story__media:hover img { transform: scale(1.05); }
.fm-about-story__media-tag {
  position: absolute;
  bottom: 28px;
  left: 28px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  padding: 10px 18px;
  border-radius: 999px;
  font: 600 13px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--fm-espresso, #3b2a23);
}
.fm-about-story__copy h2 { margin: 22px 0 28px; }
.fm-about-story__copy p {
  font: 17px/1.7 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  margin-bottom: 18px;
}
.fm-about-story__copy em {
  font-style: italic;
  font-family: var(--fm-serif, "Montserrat", serif);
  color: var(--fm-rose-deep, #b46c70);
}

.fm-about-pillars {
  padding: 96px 24px;
  background: var(--fm-sand, #f3ede2);
}
.fm-about-pillars__grid {
  max-width: var(--container, 1320px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.fm-about-pillars__card {
  position: relative;
  background: #fff;
  border-radius: 24px;
  padding: 44px 36px 40px;
  box-shadow: 0 14px 40px rgba(59, 42, 35, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.fm-about-pillars__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 26px 60px rgba(59, 42, 35, 0.10);
}
.fm-about-pillars__num {
  position: absolute;
  top: 24px;
  right: 32px;
  font: 700 14px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.18em;
  color: var(--fm-rose-deep, #b46c70);
  opacity: 0.6;
}
.fm-about-pillars__icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--fm-rose-soft, #f6e2e1);
  color: var(--fm-rose-deep, #b46c70);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 26px;
}
.fm-about-pillars__icon svg { width: 30px; height: 30px; }
.fm-about-pillars__card h3 {
  font: 700 26px/1.2 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 16px;
}
.fm-about-pillars__card p {
  font: 16px/1.7 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  margin: 0;
}
.fm-about-pillars__card em {
  font-style: italic;
  font-family: var(--fm-serif, "Montserrat", serif);
  color: var(--fm-rose-deep, #b46c70);
}

.fm-about-goals {
  padding: 96px 24px;
  background: var(--fm-canvas, #f9f6f1);
}
.fm-about-goals__inner {
  max-width: var(--container, 1320px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 80px;
  align-items: start;
}
.fm-about-goals__head { position: sticky; top: 110px; }
.fm-about-goals__head h2 { margin: 22px 0 22px; }
.fm-about-goals__lead {
  font: 17px/1.7 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
}
.fm-about-goals__head em {
  font-style: italic;
  font-family: var(--fm-serif, "Montserrat", serif);
  color: var(--fm-rose-deep, #b46c70);
}
.fm-about-goals__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.fm-about-goals__list li {
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 26px;
  align-items: start;
  padding: 28px 32px;
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(59, 42, 35, 0.05);
  transition: border-color 0.2s ease, transform 0.2s ease;
}
.fm-about-goals__list li:hover {
  border-color: var(--fm-rose, #d99fa1);
  transform: translateX(6px);
}
.fm-about-goals__bullet {
  font: 700 28px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-rose-deep, #b46c70);
  letter-spacing: 0.05em;
}
.fm-about-goals__list h4 {
  font: 700 19px/1.3 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 8px;
}
.fm-about-goals__list p {
  font: 15px/1.6 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  margin: 0;
}

.fm-about-stats {
  padding: 96px 24px;
  background: var(--fm-rose-soft, #f6e2e1);
  position: relative;
  overflow: hidden;
}
.fm-about-stats::before, .fm-about-stats::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.4) 0%, transparent 70%);
  pointer-events: none;
}
.fm-about-stats::before { width: 480px; height: 480px; top: -180px; left: -180px; }
.fm-about-stats::after { width: 360px; height: 360px; bottom: -140px; right: -140px; }
.fm-about-stats__inner {
  position: relative;
  max-width: var(--container, 1320px);
  margin: 0 auto;
  text-align: center;
}
.fm-about-stats__title {
  font: 700 clamp(32px, 4vw, 48px)/1.1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 56px;
}
.fm-about-stats__title em {
  font-style: italic;
  font-family: var(--fm-serif, "Montserrat", serif);
  color: var(--fm-rose-deep, #b46c70);
}
.fm-about-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.fm-about-stats__cell {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(8px);
  border-radius: 24px;
  padding: 40px 24px;
  border: 1px solid rgba(255, 255, 255, 0.6);
}
.fm-about-stats__num {
  font: 700 clamp(40px, 4.5vw, 56px)/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-rose-deep, #b46c70);
  margin-bottom: 8px;
  letter-spacing: -0.02em;
}
.fm-about-stats__lbl {
  font: 600 13px/1.4 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--fm-espresso, #3b2a23);
  opacity: 0.78;
}

.fm-about-cta {
  padding: 100px 24px;
  background: var(--fm-espresso, #3b2a23);
  color: var(--fm-canvas, #f9f6f1);
  text-align: center;
  position: relative;
  overflow: hidden;
}
.fm-about-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(217, 159, 161, 0.20), transparent 70%);
  pointer-events: none;
}
.fm-about-cta__inner {
  position: relative;
  max-width: 720px;
  margin: 0 auto;
}
.fm-about-cta__inner .fm-eyebrow { color: var(--fm-rose, #d99fa1); }
.fm-about-cta__inner .fm-eyebrow .fm-rule { background: rgba(217, 159, 161, 0.5); }
.fm-about-cta__inner h2 {
  margin: 22px 0 24px;
  font: 700 clamp(34px, 4.5vw, 56px)/1.05 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-canvas, #f9f6f1);
}
.fm-about-cta__inner h2 em {
  font-style: italic;
  font-family: var(--fm-serif, "Montserrat", serif);
  color: var(--fm-rose, #d99fa1);
}
.fm-about-cta__inner p {
  font: 17px/1.7 var(--fm-sans, system-ui, sans-serif);
  color: rgba(248, 247, 242, 0.78);
  margin: 0 0 36px;
}
.fm-about-cta__btns {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
}
.fm-about-cta .fm-btn--ghost {
  background: transparent;
  color: var(--fm-canvas, #f9f6f1);
  border: 1px solid rgba(248, 247, 242, 0.3);
}
.fm-about-cta .fm-btn--ghost:hover {
  background: rgba(248, 247, 242, 0.08);
  border-color: rgba(248, 247, 242, 0.6);
}

@media (max-width: 980px) {
  .fm-about-story__inner,
  .fm-about-goals__inner { grid-template-columns: 1fr; gap: 48px; }
  .fm-about-goals__head { position: static; }
  .fm-about-pillars__grid { grid-template-columns: 1fr; gap: 20px; }
  .fm-about-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
  .fm-about-stats__cell { padding: 28px 16px; }
}
@media (max-width: 560px) {
  .fm-about-story, .fm-about-pillars, .fm-about-goals, .fm-about-stats, .fm-about-cta { padding: 64px 18px; }
  .fm-about-goals__list li { grid-template-columns: 44px 1fr; gap: 16px; padding: 22px 20px; }
  .fm-about-pillars__card { padding: 32px 24px; }
}

/* ========================================================================
   v2.2 — Shop list (shopNew) redesign
   ======================================================================== */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.fm-shop-cats {
  padding: 32px 24px 8px;
  background: var(--fm-canvas, #f9f6f1);
}
.fm-shop-cats__inner {
  max-width: var(--container, 1320px);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 12px;
}
.fm-shop-cats__pill {
  display: inline-flex;
  align-items: center;
  padding: 10px 18px;
  border-radius: 999px;
  background: #fff;
  color: var(--fm-espresso, #3b2a23);
  font: 600 13px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid rgba(59, 42, 35, 0.08);
  transition: all 0.18s ease;
}
.fm-shop-cats__pill:hover { border-color: var(--fm-rose, #d99fa1); transform: translateY(-1px); }
.fm-shop-cats__pill.is-active {
  background: var(--fm-espresso, #3b2a23);
  color: #fff;
  border-color: var(--fm-espresso, #3b2a23);
}

.fm-shop {
  padding: 56px 24px 96px;
  background: var(--fm-canvas, #f9f6f1);
  max-width: var(--container, 1320px);
  margin: 0 auto;
}
.fm-shop__alert {
  background: var(--fm-rose-soft, #f6e2e1);
  color: var(--fm-rose-deep, #b46c70);
  padding: 14px 20px;
  border-radius: 14px;
  margin-bottom: 32px;
  font: 600 14px/1.4 var(--fm-sans, system-ui, sans-serif);
  border: 1px solid rgba(180, 108, 112, 0.18);
}
.fm-shop__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.fm-shop__card {
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 28px rgba(59, 42, 35, 0.06);
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.fm-shop__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 50px rgba(59, 42, 35, 0.12);
}
.fm-shop__media {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  background: var(--fm-sand, #f3ede2);
  overflow: hidden;
}
.fm-shop__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 1.2s ease;
}
.fm-shop__card:hover .fm-shop__media img { transform: scale(1.06); }
.fm-shop__media-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: rgba(59, 42, 35, 0.18);
}
.fm-shop__media-placeholder svg { width: 64px; height: 64px; }
.fm-shop__badge {
  position: absolute;
  top: 16px;
  left: 16px;
  background: var(--fm-rose-deep, #b46c70);
  color: #fff;
  padding: 6px 12px;
  border-radius: 999px;
  font: 700 11px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.fm-shop__body {
  padding: 24px 26px 26px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.fm-shop__title {
  display: block;
  font: 700 19px/1.3 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  text-decoration: none;
  margin-bottom: 10px;
  transition: color 0.18s ease;
}
.fm-shop__title:hover { color: var(--fm-rose-deep, #b46c70); }
.fm-shop__excerpt {
  font: 14px/1.55 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  margin: 0 0 18px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fm-shop__foot {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid rgba(59, 42, 35, 0.06);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.fm-shop__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.fm-shop__price-old {
  font: 600 13px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  text-decoration: line-through;
  opacity: 0.7;
}
.fm-shop__price-new {
  font: 700 18px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-rose-deep, #b46c70);
  letter-spacing: -0.01em;
}
.fm-shop__more {
  font: 600 13px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  text-decoration: none;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  transition: color 0.18s ease, transform 0.18s ease;
}
.fm-shop__more:hover { color: var(--fm-rose-deep, #b46c70); transform: translateX(3px); }
.fm-shop__empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 72px 24px;
  background: #fff;
  border-radius: 24px;
}
.fm-shop__empty h3 { margin: 0 0 10px; font: 700 24px/1.2 var(--fm-sans, system-ui, sans-serif); color: var(--fm-espresso, #3b2a23); }
.fm-shop__empty p { color: var(--fg2, #6b5a52); margin: 0 0 24px; }

.fm-shop__pagination {
  margin-top: 56px;
  display: flex;
  justify-content: center;
}
.fm-shop__pagination .pagination {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0;
  margin: 0;
  list-style: none;
}
.fm-shop__pagination .page-item .page-link,
.fm-shop__pagination ul li a,
.fm-shop__pagination ul li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  background: #fff;
  color: var(--fm-espresso, #3b2a23);
  font: 600 14px/1 var(--fm-sans, system-ui, sans-serif);
  text-decoration: none;
  border: 1px solid rgba(59, 42, 35, 0.06);
  transition: all 0.18s ease;
}
.fm-shop__pagination .page-item.active .page-link,
.fm-shop__pagination .page-item .page-link:hover {
  background: var(--fm-rose-deep, #b46c70);
  color: #fff;
  border-color: var(--fm-rose-deep, #b46c70);
}
.fm-shop__pagination .page-item.disabled .page-link {
  opacity: 0.4;
  pointer-events: none;
}

.fm-shop-help {
  padding: 80px 24px 96px;
  background: var(--fm-sand, #f3ede2);
}
.fm-shop-help__inner {
  max-width: var(--container, 1320px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 48px;
  align-items: center;
}
.fm-shop-help__inner h2 {
  font: 700 clamp(28px, 3.6vw, 40px)/1.15 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  margin: 18px 0 14px;
}
.fm-shop-help__inner h2 em {
  font-style: italic;
  font-family: var(--fm-serif, "Montserrat", serif);
  color: var(--fm-rose-deep, #b46c70);
}
.fm-shop-help__inner p {
  font: 16px/1.7 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  max-width: 580px;
  margin: 0;
}
.fm-shop-help__cta {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.fm-shop-help .fm-btn--ghost {
  background: transparent;
  color: var(--fm-espresso, #3b2a23);
  border: 1px solid rgba(59, 42, 35, 0.18);
}
.fm-shop-help .fm-btn--ghost:hover {
  background: rgba(59, 42, 35, 0.05);
  border-color: var(--fm-espresso, #3b2a23);
}

@media (max-width: 980px) {
  .fm-shop__grid { grid-template-columns: repeat(2, 1fr); gap: 22px; }
  .fm-shop-help__inner { grid-template-columns: 1fr; gap: 28px; }
  .fm-shop-help__cta { flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 600px) {
  .fm-shop__grid { grid-template-columns: 1fr; }
  .fm-shop, .fm-shop-help { padding: 48px 18px; }
  .fm-shop-help__cta .fm-btn { flex: 1; min-width: 200px; }
}

/* ========================================================================
   v2.3 — Single product (pre-purchase) redesign
   ======================================================================== */
.fm-prod-hero {
  position: relative;
  min-height: 480px;
  padding: 140px 24px 80px;
  color: #fff;
  overflow: hidden;
}
.fm-prod-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.fm-prod-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.fm-prod-hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(59, 42, 35, 0.55) 0%, rgba(59, 42, 35, 0.85) 100%),
    radial-gradient(ellipse at 30% 20%, rgba(217, 159, 161, 0.30), transparent 60%);
}
.fm-prod-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 880px;
  margin: 0 auto;
  text-align: center;
}
.fm-prod-hero__eyebrow { color: var(--fm-rose, #d99fa1) !important; justify-content: center; display: inline-flex; gap: 14px; align-items: center; }
.fm-prod-hero__eyebrow .fm-rule { background: rgba(217, 159, 161, 0.5) !important; }
.fm-prod-hero__title {
  margin: 22px 0 18px;
  font: 700 clamp(34px, 5vw, 60px)/1.1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: -0.01em;
  color: #fff;
}
.fm-prod-hero__lead {
  font: 18px/1.65 var(--fm-sans, system-ui, sans-serif);
  color: rgba(255, 255, 255, 0.85);
  max-width: 620px;
  margin: 0 auto 28px;
}
.fm-prod-hero__meta {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}
.fm-prod-hero__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.18);
  font: 600 13px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.04em;
  color: #fff;
}
.fm-prod-hero__chip svg { opacity: 0.85; }

.fm-prod-main {
  padding: 80px 24px;
  background: var(--fm-canvas, #f9f6f1);
}
.fm-prod-main__inner {
  max-width: var(--container, 1320px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 64px;
  align-items: start;
}
.fm-prod-main__copy h2 { margin: 22px 0 28px; }
.fm-prod-main__copy h2 em {
  font-style: italic;
  font-family: var(--fm-serif, "Montserrat", serif);
  color: var(--fm-rose-deep, #b46c70);
}
.fm-prod-main__rich {
  font: 17px/1.75 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
}
.fm-prod-main__rich p { margin: 0 0 16px; }
.fm-prod-main__rich h3 {
  font: 700 22px/1.3 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  margin: 28px 0 12px;
}
.fm-prod-main__rich ul, .fm-prod-main__rich ol { padding-left: 22px; margin: 0 0 18px; }
.fm-prod-main__rich li { margin-bottom: 6px; }
.fm-prod-main__rich strong { color: var(--fm-espresso, #3b2a23); }
.fm-prod-main__rich a { color: var(--fm-rose-deep, #b46c70); text-decoration: underline; text-underline-offset: 3px; }

.fm-prod-video { margin-top: 56px; }
.fm-prod-video__frame {
  margin-top: 18px;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  background: #000;
  aspect-ratio: 16 / 9;
  box-shadow: 0 20px 60px rgba(59, 42, 35, 0.18);
}
.fm-prod-video__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.fm-prod-buy {
  position: sticky;
  top: 110px;
}
.fm-prod-buy__inner {
  background: #fff;
  border-radius: 24px;
  padding: 36px 32px 32px;
  box-shadow: 0 24px 60px rgba(59, 42, 35, 0.10);
  border: 1px solid rgba(59, 42, 35, 0.04);
}
.fm-prod-buy__lbl {
  font: 700 11px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--fg2, #6b5a52);
  margin-bottom: 12px;
}
.fm-prod-buy__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(59, 42, 35, 0.06);
}
.fm-prod-buy__price-old {
  font: 600 16px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  text-decoration: line-through;
  opacity: 0.7;
}
.fm-prod-buy__price-new {
  font: 800 36px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-rose-deep, #b46c70);
  letter-spacing: -0.02em;
}
.fm-prod-buy__badge {
  display: inline-block;
  background: var(--fm-rose-deep, #b46c70);
  color: #fff;
  padding: 5px 11px;
  border-radius: 999px;
  font: 700 11px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.fm-prod-buy__perks {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.fm-prod-buy__perks li {
  display: flex;
  align-items: center;
  gap: 12px;
  font: 15px/1.4 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
}
.fm-prod-buy__perks li svg {
  flex: 0 0 auto;
  color: var(--fm-rose-deep, #b46c70);
}
.fm-prod-buy__btn,
.fm-prod-buy__form button {
  width: 100%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.fm-prod-buy__form { margin: 0; }
.fm-prod-buy__note {
  margin: 14px 0 0;
  text-align: center;
  font: 13px/1.4 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
}
.fm-prod-buy__note a { color: var(--fm-rose-deep, #b46c70); text-decoration: underline; }

.fm-prod-curr {
  padding: 96px 24px;
  background: var(--fm-sand, #f3ede2);
}
.fm-prod-curr__inner {
  max-width: 920px;
  margin: 0 auto;
}
.fm-prod-curr__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 14px;
  counter-reset: none;
}
.fm-prod-curr__item {
  background: #fff;
  border-radius: 18px;
  padding: 24px 28px;
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 22px;
  align-items: center;
  border: 1px solid rgba(59, 42, 35, 0.05);
  transition: transform 0.18s ease, border-color 0.18s ease;
}
.fm-prod-curr__item:hover {
  transform: translateX(4px);
  border-color: var(--fm-rose, #d99fa1);
}
.fm-prod-curr__num {
  font: 700 22px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-rose-deep, #b46c70);
  letter-spacing: 0.04em;
}
.fm-prod-curr__body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}
.fm-prod-curr__body h3 {
  margin: 0;
  font: 600 17px/1.3 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
}
.fm-prod-curr__lock {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--fm-rose-soft, #f6e2e1);
  color: var(--fm-rose-deep, #b46c70);
  font: 600 11px/1 var(--fm-sans, system-ui, sans-serif);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.fm-prod-course-wrap {
  padding: 80px 24px;
  background: var(--fm-canvas, #f9f6f1);
}
.fm-prod-course-wrap__head { text-align: center; max-width: 720px; margin: 0 auto 48px; }
.fm-prod-course-wrap__sub {
  margin-top: 14px;
  color: var(--fm-rose-deep, #b46c70);
  font: 600 14px/1.4 var(--fm-sans, system-ui, sans-serif);
}

.fm-prod-reviews {
  padding: 96px 24px;
  background: var(--fm-canvas, #f9f6f1);
}
.fm-prod-reviews__inner {
  max-width: 920px;
  margin: 0 auto;
}
.fm-prod-reviews__list {
  display: grid;
  gap: 20px;
  margin-bottom: 28px;
}
.fm-prod-reviews__card {
  background: #fff;
  border-radius: 18px;
  padding: 24px 28px;
  border: 1px solid rgba(59, 42, 35, 0.05);
}
.fm-prod-reviews__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.fm-prod-reviews__head strong {
  font: 700 15px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
}
.fm-prod-reviews__head time {
  font: 12px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
  letter-spacing: 0.04em;
}
.fm-prod-reviews__card p {
  margin: 0;
  font: 15px/1.65 var(--fm-sans, system-ui, sans-serif);
  color: var(--fg2, #6b5a52);
}
.fm-prod-reviews__empty {
  text-align: center;
  padding: 32px 0;
  color: var(--fg2, #6b5a52);
}
.fm-prod-reviews__form-wrap {
  margin-top: 28px;
  background: #fff;
  border-radius: 18px;
  padding: 0 28px;
  border: 1px solid rgba(59, 42, 35, 0.06);
  overflow: hidden;
}
.fm-prod-reviews__form-wrap summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 0;
  font: 700 15px/1 var(--fm-sans, system-ui, sans-serif);
  color: var(--fm-espresso, #3b2a23);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.fm-prod-reviews__form-wrap summary::-webkit-details-marker { display: none; }
.fm-prod-reviews__form-wrap summary span {
  color: var(--fm-rose-deep, #b46c70);
  font-size: 22px;
  transition: transform 0.2s ease;
}
.fm-prod-reviews__form-wrap[open] summary span { transform: rotate(45deg); }
.fm-prod-reviews__form { padding: 8px 0 28px; display: flex; flex-direction: column; gap: 16px; }

@media (max-width: 980px) {
  .fm-prod-main__inner { grid-template-columns: 1fr; gap: 48px; }
  .fm-prod-buy { position: static; }
}
@media (max-width: 600px) {
  .fm-prod-hero { padding: 100px 18px 60px; min-height: 380px; }
  .fm-prod-main, .fm-prod-curr, .fm-prod-reviews, .fm-prod-course-wrap { padding: 60px 18px; }
  .fm-prod-buy__inner { padding: 28px 22px; }
  .fm-prod-buy__price-new { font-size: 30px; }
  .fm-prod-curr__item { grid-template-columns: 40px 1fr; gap: 14px; padding: 18px 20px; }
}

/* ========================================================================
   v2.4 — Footer social hover swap + mobile drawer desktop hide
   ======================================================================== */

/* Social icons in footer-v2: when hovered, swap to canvas/rose with
   icon color matching footer bg (espresso) */
.fm-footer--v2 .fm-footer__socials a {
  background: rgba(248, 247, 242, 0.06);
  border-color: rgba(248, 247, 242, 0.2);
  color: rgba(248, 247, 242, 0.78);
  transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}
.fm-footer--v2 .fm-footer__socials a:hover {
  background: var(--fm-rose, #d99fa1) !important;
  border-color: var(--fm-rose, #d99fa1) !important;
  color: var(--fm-espresso, #3b2a23) !important;
  transform: translateY(-2px);
}
.fm-footer--v2 .fm-footer__socials a:hover svg {
  stroke: var(--fm-espresso, #3b2a23);
}

/* Mobile drawer + backdrop must be HIDDEN on desktop (otherwise the
   off-screen drawer creates a horizontal scroll bar to the right) */
@media (min-width: 981px) {
  .fm-mobile-nav,
  .fm-mobile-backdrop {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  .fm-burger { display: none !important; }
}

/* Belt + braces: prevent horizontal page scroll caused by translated drawer.
   Use overflow-x: clip (not hidden) — `hidden` creates a scroll container that
   breaks `position: sticky` for ALL descendants. `clip` clips overflow without
   establishing a scroll container, so sticky still works. */
html, body { overflow-x: clip; }
/* Fallback for browsers that don't support overflow-x: clip (very old) — they
   get hidden, accepting that sticky won't work there. */
@supports not (overflow-x: clip) {
  html, body { overflow-x: hidden; }
}

/* ========================================================================
   v2.5 — Legal pages (Politika privatnosti + Uslovi korišćenja)
   ======================================================================== */

/* Page hero (shared by legal pages, contact and others using fm-pagehero) */
.fm-pagehero {
  position: relative;
  background: linear-gradient(180deg, #faf6ef 0%, var(--fm-canvas, #f8f7f2) 100%);
  padding: 130px 32px 80px;
  overflow: hidden;
}
.fm-pagehero__inner {
  position: relative;
  max-width: 880px;
  margin: 0 auto;
  text-align: center;
  z-index: 2;
}
.fm-pagehero__eyebrow {
  justify-content: center;
  margin: 0 auto 22px;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-pagehero__title {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: clamp(38px, 5vw, 64px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 22px;
  font-weight: 400;
}
.fm-pagehero__title em {
  font-family: 'Montserrat', serif;
  font-style: italic;
  font-weight: 400;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-pagehero__lead {
  max-width: 620px;
  margin: 0 auto;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(59, 42, 35, 0.78);
}
.fm-pagehero__blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.55;
  z-index: 1;
}
.fm-pagehero__blob--a {
  width: 360px; height: 360px;
  top: -120px; left: -90px;
  background: radial-gradient(circle, rgba(217, 159, 161, 0.5), transparent 70%);
}
.fm-pagehero__blob--b {
  width: 420px; height: 420px;
  bottom: -180px; right: -120px;
  background: radial-gradient(circle, rgba(217, 198, 168, 0.45), transparent 70%);
}

/* Legal layout */
.fm-legal {
  padding: 80px 32px 110px;
  background: var(--fm-canvas, #f8f7f2);
}
.fm-legal__inner {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 64px;
  align-items: start;
}

/* Sticky table of contents */
.fm-legal__toc {
  position: sticky;
  top: 110px;
  align-self: start;
}
.fm-legal__toc-inner {
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.08);
  border-radius: 16px;
  padding: 26px 24px;
  box-shadow: 0 6px 22px rgba(59, 42, 35, 0.06);
}
.fm-legal__toc .fm-eyebrow {
  margin-bottom: 16px;
  color: var(--fm-rose-deep, #b06d70);
  font-size: 11px;
}
.fm-legal__toc ol {
  list-style: none;
  counter-reset: tocItem;
  margin: 0;
  padding: 0;
}
.fm-legal__toc ol li {
  counter-increment: tocItem;
  padding: 9px 0;
  border-bottom: 1px dashed rgba(59, 42, 35, 0.12);
  font-size: 14px;
  line-height: 1.45;
}
.fm-legal__toc ol li:last-child { border-bottom: none; }
.fm-legal__toc ol li::before {
  content: counter(tocItem) ".";
  display: inline-block;
  width: 22px;
  color: var(--fm-rose-deep, #b06d70);
  font-weight: 600;
}
.fm-legal__toc ol li a {
  color: var(--fm-espresso, #3b2a23);
  text-decoration: none;
  transition: color 0.16s ease;
}
.fm-legal__toc ol li a:hover { color: var(--fm-rose-deep, #b06d70); }

.fm-legal__updated {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(59, 42, 35, 0.08);
  font-size: 12px;
  color: rgba(59, 42, 35, 0.6);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Article body */
.fm-legal__body {
  max-width: 760px;
  color: var(--fm-espresso, #3b2a23);
}
.fm-legal__body .fm-headline {
  font-family: 'Questrial', system-ui, sans-serif;
  letter-spacing: -0.01em;
  line-height: 1.15;
  color: var(--fm-espresso, #3b2a23);
  font-weight: 500;
}
.fm-legal__lead {
  font-size: 17px;
  line-height: 1.65;
  color: rgba(59, 42, 35, 0.85);
  padding: 18px 22px;
  background: linear-gradient(180deg, rgba(217, 159, 161, 0.12), rgba(217, 159, 161, 0.04));
  border-left: 3px solid var(--fm-rose, #d99fa1);
  border-radius: 4px;
  margin: 18px 0 36px;
}
.fm-legal__body section {
  margin: 32px 0;
  scroll-margin-top: 110px;
}
.fm-legal__body h3 {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 22px;
  line-height: 1.25;
  letter-spacing: -0.005em;
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 14px;
  font-weight: 500;
}
.fm-legal__body p {
  font-size: 16px;
  line-height: 1.7;
  color: rgba(59, 42, 35, 0.82);
  margin: 0 0 14px;
}
.fm-legal__body ul {
  margin: 12px 0 18px;
  padding-left: 0;
  list-style: none;
}
.fm-legal__body ul li {
  position: relative;
  padding: 6px 0 6px 26px;
  font-size: 16px;
  line-height: 1.65;
  color: rgba(59, 42, 35, 0.82);
}
.fm-legal__body ul li::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 16px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--fm-rose, #d99fa1);
}
.fm-legal__body strong { color: var(--fm-espresso, #3b2a23); font-weight: 600; }
.fm-legal__body em { font-style: italic; color: var(--fm-rose-deep, #b06d70); }
.fm-legal__body a {
  color: var(--fm-rose-deep, #b06d70);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 0.16s ease;
}
.fm-legal__body a:hover { color: var(--fm-espresso, #3b2a23); }

@media (max-width: 980px) {
  .fm-legal__inner { grid-template-columns: 1fr; gap: 36px; }
  .fm-legal__toc { position: static; }
}
@media (max-width: 600px) {
  .fm-pagehero { padding: 100px 18px 60px; }
  .fm-legal { padding: 50px 18px 80px; }
  .fm-legal__toc-inner { padding: 22px 20px; }
  .fm-legal__body h3 { font-size: 19px; }
}

/* ========================================================================
   v2.6 — Checkout / Cart redesign
   ======================================================================== */

.fm-checkout {
  padding: 70px 32px 110px;
  background: var(--fm-canvas, #f8f7f2);
}
.fm-checkout__inner {
  max-width: 1180px;
  margin: 0 auto;
}

.fm-checkout__alerts { margin-bottom: 28px; }
.fm-alert {
  border-radius: 10px;
  padding: 14px 18px;
  font-size: 14.5px;
  line-height: 1.55;
  margin-bottom: 12px;
}
.fm-alert--error {
  background: #fdecec;
  color: #8a2929;
  border-left: 3px solid #c14a4a;
}
.fm-alert--success {
  background: #ecf6ec;
  color: #2a6a2a;
  border-left: 3px solid #4caf50;
}
.fm-alert--warn {
  background: #fff5e1;
  color: #6b4a14;
  border-left: 3px solid #d99845;
  margin: 18px 0 22px;
}

.fm-checkout__empty {
  text-align: center;
  background: #fff;
  border-radius: 18px;
  padding: 70px 32px;
  box-shadow: 0 8px 30px rgba(59, 42, 35, 0.06);
}
.fm-checkout__empty .fm-eyebrow {
  justify-content: center;
  margin-bottom: 16px;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-checkout__empty .fm-headline {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: clamp(28px, 3.4vw, 40px);
  margin: 0 0 14px;
  color: var(--fm-espresso, #3b2a23);
}
.fm-checkout__empty .fm-headline em {
  font-family: 'Montserrat', serif;
  font-style: italic;
  color: var(--fm-rose-deep, #b06d70);
  font-weight: 400;
}
.fm-checkout__empty p {
  color: rgba(59, 42, 35, 0.72);
  margin: 0 0 26px;
}

.fm-checkout__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 36px;
  align-items: start;
}

/* ---- Summary (left) ---- */
.fm-checkout__summary {
  position: sticky;
  top: 110px;
}
.fm-checkout__summary-inner {
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.08);
  border-radius: 18px;
  padding: 28px 26px;
  box-shadow: 0 8px 30px rgba(59, 42, 35, 0.06);
}
.fm-checkout__summary .fm-eyebrow {
  color: var(--fm-rose-deep, #b06d70);
  margin-bottom: 12px;
}
.fm-checkout__panel-title {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 22px;
  letter-spacing: -0.005em;
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 18px;
  font-weight: 500;
}

.fm-checkout__items {
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
}
.fm-checkout__item {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px dashed rgba(59, 42, 35, 0.12);
}
.fm-checkout__item:last-child { border-bottom: none; }
.fm-checkout__item-img {
  width: 64px; height: 64px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--fm-sand, #ece6da);
}
.fm-checkout__item-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fm-checkout__item-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 4px;
  line-height: 1.35;
}
.fm-checkout__item-price { margin: 0; font-size: 13.5px; }
.fm-checkout__price-old {
  color: rgba(59, 42, 35, 0.5);
  text-decoration: line-through;
  margin-right: 8px;
  font-size: 12.5px;
}
.fm-checkout__price-new { color: var(--fm-rose-deep, #b06d70); font-weight: 600; }
.fm-checkout__item-del {
  width: 32px; height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(59, 42, 35, 0.05);
  color: rgba(59, 42, 35, 0.7);
  transition: background 0.16s ease, color 0.16s ease;
  text-decoration: none;
}
.fm-checkout__item-del:hover {
  background: var(--fm-rose, #d99fa1);
  color: #fff;
}

.fm-checkout__totals {
  border-top: 2px solid rgba(59, 42, 35, 0.12);
  padding-top: 16px;
  margin-top: 6px;
}
.fm-checkout__total-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 20px;
  color: var(--fm-espresso, #3b2a23);
  font-weight: 500;
}
.fm-checkout__total-row span:last-child { color: var(--fm-rose-deep, #b06d70); font-size: 22px; }
.fm-checkout__total-note {
  font-size: 12px;
  color: rgba(59, 42, 35, 0.55);
  margin-top: 4px;
}

.fm-checkout__perks {
  list-style: none;
  margin: 22px 0 0;
  padding: 18px 0 0;
  border-top: 1px solid rgba(59, 42, 35, 0.08);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.fm-checkout__perks li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13.5px;
  color: rgba(59, 42, 35, 0.78);
}
.fm-checkout__perks svg { color: var(--fm-rose-deep, #b06d70); flex-shrink: 0; }

/* ---- Payment (right) ---- */
.fm-checkout__payment {
  display: flex;
  flex-direction: column;
  gap: 26px;
}
.fm-checkout__panel {
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.08);
  border-radius: 18px;
  padding: 30px 30px;
  box-shadow: 0 8px 30px rgba(59, 42, 35, 0.06);
}
.fm-checkout__panel .fm-eyebrow {
  color: var(--fm-rose-deep, #b06d70);
  margin-bottom: 12px;
}

.fm-checkout__meta {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px 22px;
  margin: 0;
}
.fm-checkout__meta div { display: flex; flex-direction: column; gap: 4px; }
.fm-checkout__meta dt {
  font-size: 11.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(59, 42, 35, 0.55);
}
.fm-checkout__meta dd {
  margin: 0;
  font-size: 15px;
  color: var(--fm-espresso, #3b2a23);
  font-weight: 500;
  line-height: 1.4;
}
.fm-checkout__meta-total {
  color: var(--fm-rose-deep, #b06d70) !important;
  font-size: 18px !important;
  font-family: 'Questrial', system-ui, sans-serif;
}

.fm-checkout__method-card {
  display: block;
  border: 2px solid var(--fm-rose, #d99fa1);
  border-radius: 14px;
  padding: 20px 22px;
  cursor: default;
  background: linear-gradient(180deg, rgba(217, 159, 161, 0.08), rgba(217, 159, 161, 0.02));
  position: relative;
}
.fm-checkout__method-card input[type="radio"] {
  position: absolute;
  top: 22px; right: 22px;
  accent-color: var(--fm-rose-deep, #b06d70);
  width: 18px; height: 18px;
}
.fm-checkout__method-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  padding-right: 30px;
}
.fm-checkout__method-title {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 17px;
  color: var(--fm-espresso, #3b2a23);
  font-weight: 500;
}
.fm-checkout__method-badge {
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--fm-espresso, #3b2a23);
  color: #fff;
  padding: 3px 8px;
  border-radius: 999px;
}
.fm-checkout__method-desc {
  margin: 0 0 14px;
  font-size: 13.5px;
  line-height: 1.55;
  color: rgba(59, 42, 35, 0.7);
}
.fm-checkout__cards {
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.08);
  border-radius: 8px;
  padding: 8px 12px;
  display: inline-block;
}
.fm-checkout__cards img {
  display: block;
  height: 28px;
  width: auto;
}

.fm-checkout__consent {
  margin-top: 22px;
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  align-items: start;
}
.fm-checkout__check {
  width: 18px; height: 18px;
  margin-top: 2px;
  accent-color: var(--fm-rose-deep, #b06d70);
}
.fm-checkout__consent label {
  font-size: 13.5px;
  line-height: 1.55;
  color: rgba(59, 42, 35, 0.78);
  margin: 0;
}
.fm-checkout__consent label a {
  color: var(--fm-rose-deep, #b06d70);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fm-checkout__err {
  grid-column: 2;
  color: #c14a4a;
  font-size: 13px;
}

.fm-checkout__submit {
  margin-top: 22px;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 24px !important;
  font-size: 15px;
  letter-spacing: 0.04em;
}
.fm-checkout__secure {
  margin-top: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 12.5px;
  color: rgba(59, 42, 35, 0.55);
}

@media (max-width: 980px) {
  .fm-checkout__grid { grid-template-columns: 1fr; gap: 28px; }
  .fm-checkout__summary { position: static; }
}
@media (max-width: 600px) {
  .fm-checkout { padding: 50px 18px 80px; }
  .fm-checkout__panel { padding: 24px 22px; }
  .fm-checkout__summary-inner { padding: 24px 22px; }
  .fm-checkout__meta { grid-template-columns: 1fr; gap: 14px; }
  .fm-checkout__method-card { padding: 18px 18px; }
}

/* ========================================================================
   v2.7 — Single product polish: sticky buy card, centered curriculum head,
          bottom CTA2 (replaces reviews block)
   ======================================================================== */

/* Make sure the sticky buy card stays in view as user scrolls past
   the description column — needs a tall enough scroll runway and an
   align-self that doesn't collapse to grid stretch. */
.fm-prod-main__inner { align-items: start; }
.fm-prod-buy {
  position: sticky;
  top: 100px;
  align-self: start;
  /* limit height so very long sidebars still scroll on small viewports */
  max-height: calc(100vh - 120px);
  overflow-y: auto;
}
.fm-prod-buy::-webkit-scrollbar { width: 6px; }
.fm-prod-buy::-webkit-scrollbar-thumb { background: rgba(59, 42, 35, 0.18); border-radius: 4px; }

/* Centered head for curriculum section */
.fm-prod-curr__head {
  max-width: 720px;
  margin: 0 auto 56px;
  text-align: center;
}
.fm-prod-curr__eyebrow {
  justify-content: center;
  display: inline-flex;
  gap: 14px;
  align-items: center;
  color: var(--fm-rose-deep, #b06d70);
  margin-bottom: 18px;
}
.fm-prod-curr__title {
  margin: 0 0 14px;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: clamp(28px, 3.4vw, 42px);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--fm-espresso, #3b2a23);
  font-weight: 500;
}
.fm-prod-curr__title em {
  font-family: 'Montserrat', serif;
  font-style: italic;
  color: var(--fm-rose-deep, #b06d70);
  font-weight: 400;
}
.fm-prod-curr__lead {
  margin: 0 auto;
  max-width: 580px;
  color: rgba(59, 42, 35, 0.72);
  font: 16px/1.7 'Questrial', system-ui, sans-serif;
}

/* ------------------------------------------------------------------------
   Bottom CTA2 — appears at the end of the product page in place of reviews.
   ------------------------------------------------------------------------ */
.fm-prod-cta2 {
  padding: 90px 32px 110px;
  background:
    radial-gradient(ellipse at top right, rgba(217, 159, 161, 0.18), transparent 60%),
    radial-gradient(ellipse at bottom left, rgba(217, 198, 168, 0.18), transparent 60%),
    var(--fm-canvas, #f8f7f2);
}
.fm-prod-cta2__inner {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
  background: #fff;
  border-radius: 24px;
  padding: 60px 50px;
  box-shadow: 0 20px 60px rgba(59, 42, 35, 0.08);
  border: 1px solid rgba(59, 42, 35, 0.05);
}
.fm-prod-cta2__eyebrow {
  justify-content: center;
  display: inline-flex;
  gap: 14px;
  align-items: center;
  color: var(--fm-rose-deep, #b06d70);
  margin-bottom: 18px;
}
.fm-prod-cta2__title {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: clamp(28px, 3.6vw, 40px);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 18px;
  font-weight: 500;
}
.fm-prod-cta2__title em {
  font-family: 'Montserrat', serif;
  font-style: italic;
  color: var(--fm-rose-deep, #b06d70);
  font-weight: 400;
}
.fm-prod-cta2__lead {
  max-width: 520px;
  margin: 0 auto 28px;
  font-size: 16px;
  line-height: 1.7;
  color: rgba(59, 42, 35, 0.78);
}

.fm-prod-cta2__price {
  display: inline-flex;
  align-items: baseline;
  gap: 14px;
  padding: 14px 28px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(217, 159, 161, 0.15), rgba(217, 159, 161, 0.05));
  border: 1px solid rgba(217, 159, 161, 0.4);
  margin-bottom: 28px;
}
.fm-prod-cta2__price-old {
  color: rgba(59, 42, 35, 0.5);
  text-decoration: line-through;
  font-size: 16px;
}
.fm-prod-cta2__price-new {
  font-family: 'Questrial', system-ui, sans-serif;
  color: var(--fm-rose-deep, #b06d70);
  font-size: 28px;
  font-weight: 600;
}

.fm-prod-cta2__form { margin: 0 0 18px; }
.fm-prod-cta2__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-width: 240px;
  padding: 16px 32px !important;
  font-size: 15px;
  letter-spacing: 0.04em;
}
.fm-prod-cta2__note {
  margin: 0;
  font-size: 12.5px;
  color: rgba(59, 42, 35, 0.55);
  letter-spacing: 0.02em;
}

/* ------------------------------------------------------------------------
   Responsive polish for the entire single-product page
   ------------------------------------------------------------------------ */
@media (max-width: 1100px) {
  .fm-prod-main__inner { gap: 36px; }
  .fm-prod-buy__inner { padding: 28px 26px; }
}
@media (max-width: 980px) {
  /* On tablet/mobile sticky becomes static so the card stays in normal flow */
  .fm-prod-buy {
    position: static;
    max-height: none;
    overflow: visible;
  }
  .fm-prod-main__inner { grid-template-columns: 1fr; gap: 36px; }
  .fm-prod-curr__head { margin-bottom: 40px; }
}
@media (max-width: 720px) {
  .fm-prod-cta2 { padding: 60px 18px 80px; }
  .fm-prod-cta2__inner { padding: 44px 26px; border-radius: 18px; }
  .fm-prod-cta2__btn { width: 100%; min-width: 0; }
  .fm-prod-cta2__price { padding: 12px 22px; gap: 10px; }
  .fm-prod-cta2__price-new { font-size: 24px; }
}
@media (max-width: 480px) {
  .fm-prod-hero__meta { gap: 8px; }
  .fm-prod-hero__chip { font-size: 12px; padding: 6px 12px; }
  .fm-prod-buy__price-new { font-size: 28px; }
  .fm-prod-curr__title { font-size: 24px; }
  .fm-prod-cta2__title { font-size: 24px; }
}

/* ========================================================================
   v2.8 — Rich content font fix + sticky reinforcement
   ======================================================================== */

/* `.fm-prod-main__rich` originally referenced --fm-sans (typo) and --fg2
   in a way that fell back to system-ui because --fm-sans is not defined
   (the real token is --font-sans). Override to use the correct site font
   and color so the description matches the rest of the redesign. */
.fm-prod-main__rich {
  font-family: 'Questrial', 'Helvetica Neue', system-ui, sans-serif !important;
  font-size: 16px;
  line-height: 1.75;
  color: rgba(59, 42, 35, 0.82);
}
.fm-prod-main__rich p,
.fm-prod-main__rich li,
.fm-prod-main__rich span,
.fm-prod-main__rich div {
  font-family: 'Questrial', 'Helvetica Neue', system-ui, sans-serif !important;
  color: rgba(59, 42, 35, 0.82);
  font-size: 16px;
  line-height: 1.75;
}
.fm-prod-main__rich h2,
.fm-prod-main__rich h3,
.fm-prod-main__rich h4 {
  font-family: 'Questrial', 'Helvetica Neue', system-ui, sans-serif !important;
  color: var(--fm-espresso, #3b2a23);
  font-weight: 500;
  letter-spacing: -0.005em;
}
.fm-prod-main__rich h3 { font-size: 22px; line-height: 1.3; margin: 28px 0 12px; font-weight: 500; }
.fm-prod-main__rich h2 { font-size: 26px; line-height: 1.25; margin: 32px 0 14px; }
.fm-prod-main__rich strong { color: var(--fm-espresso, #3b2a23); font-weight: 600; }
.fm-prod-main__rich em { font-family: 'Montserrat', serif; font-style: italic; color: var(--fm-rose-deep, #b06d70); }
.fm-prod-main__rich a {
  color: var(--fm-rose-deep, #b06d70);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Reinforce sticky for legal TOC + product buy card now that the
   overflow-x: clip change actually allows sticky to fire */
.fm-legal__toc { position: sticky; top: 110px; align-self: start; }
.fm-prod-main__inner { align-items: start; }
.fm-prod-buy { position: sticky; top: 100px; align-self: start; }

/* ===========================================================
   v2.9 — Topic description (single product curriculum)
   =========================================================== */
.fm-prod-curr__body { flex-wrap: wrap; }
.fm-prod-curr__desc {
  flex: 1 0 100%;
  margin: 8px 0 0;
  font: 400 14px/1.55 'Questrial', system-ui, sans-serif;
  color: rgba(59, 42, 35, 0.72);
  letter-spacing: 0.005em;
}


/* ========================================================================
   v3.0 — Course player (single product, owned course view)
   Two-column layout: sticky module nav + content panels
   ======================================================================== */

/* --- Course hero (compact) --- */
.fm-course-hero {
  position: relative;
  padding: 130px 8vw 76px;
  background: var(--fm-canvas, #f8f7f2);
  border-bottom: 1px solid rgba(59, 42, 35, 0.08);
  overflow: hidden;
  isolation: isolate;
}
.fm-course-hero__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
}
.fm-course-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 38%;
  opacity: 0.35;
  filter: saturate(0.88);
}
.fm-course-hero__overlay {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at center, rgba(248, 247, 242, 0) 0%, rgba(248, 247, 242, 0.45) 55%, var(--fm-canvas, #f8f7f2) 100%),
    linear-gradient(180deg, rgba(248, 247, 242, 0.55) 0%, rgba(248, 247, 242, 0.82) 100%);
}
.fm-course-hero__inner {
  position: relative;
  max-width: 1320px;
  margin: 0 auto;
  text-align: center;
}
.fm-course-hero__chip-meta {
  margin-left: 4px;
  font-size: 12.5px;
  color: rgba(59, 42, 35, 0.55);
}
.fm-course-hero__title {
  margin: 22px 0 14px;
  font-family: 'Questrial', 'Helvetica Neue', system-ui, sans-serif;
  font-weight: 400;
  font-size: clamp(32px, 4.4vw, 54px);
  line-height: 1.12;
  letter-spacing: -0.01em;
  color: var(--fm-espresso, #3b2a23);
}
.fm-course-hero__title em {
  font-family: 'Montserrat', serif;
  font-style: italic;
  font-weight: 300;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-course-hero__lead {
  max-width: 640px;
  margin: 0 auto 28px;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  color: rgba(59, 42, 35, 0.72);
}
.fm-course-hero__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 18px;
}
.fm-course-hero__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(59, 42, 35, 0.08);
  color: var(--fm-espresso, #3b2a23);
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 13px;
  letter-spacing: 0.02em;
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}
.fm-course-hero__chip svg { color: var(--fm-rose-deep, #b06d70); }
.fm-course-hero__chip--link:hover {
  background: var(--fm-rose-soft, #f6e2e1);
  border-color: rgba(176, 109, 112, 0.3);
  transform: translateY(-1px);
}

/* --- Course player layout --- */
.fm-course-player {
  padding: 64px 8vw 110px;
  background: var(--fm-ivory, #fdfaf0);
}
.fm-course-player__inner {
  max-width: 1320px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 56px;
  align-items: start;
}

/* --- Left: module navigation --- */
.fm-course-nav {
  position: sticky;
  top: 100px;
  align-self: start;
  max-height: calc(100vh - 130px);
  overflow-y: auto;
  padding: 28px 22px;
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.08);
}
.fm-course-nav::-webkit-scrollbar { width: 6px; }
.fm-course-nav::-webkit-scrollbar-thumb { background: rgba(59, 42, 35, 0.18); border-radius: 4px; }

.fm-course-nav__head {
  padding-bottom: 18px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(59, 42, 35, 0.08);
}
.fm-course-nav__title {
  margin: 12px 0 16px;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: -0.005em;
  color: var(--fm-espresso, #3b2a23);
}
.fm-course-nav__progress {
  display: flex;
  align-items: center;
  gap: 12px;
}
.fm-course-nav__progress-num {
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.15em;
  color: var(--fm-rose-deep, #b06d70);
  white-space: nowrap;
}
.fm-course-nav__progress-bar {
  flex: 1;
  height: 2px;
  background: rgba(59, 42, 35, 0.08);
  overflow: hidden;
}
.fm-course-nav__progress-bar span {
  display: block;
  height: 100%;
  background: var(--fm-rose-deep, #b06d70);
  transition: width 0.4s cubic-bezier(.2,.9,.3,1);
}

.fm-course-nav__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fm-course-nav__item {
  position: relative;
  width: 100%;
  display: grid;
  grid-template-columns: 36px 1fr 18px;
  gap: 10px;
  align-items: center;
  padding: 12px 12px;
  background: transparent;
  border: none;
  border-left: 2px solid transparent;
  text-align: left;
  cursor: pointer;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  color: rgba(59, 42, 35, 0.72);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.fm-course-nav__item:hover {
  background: var(--fm-sand, #ece6da);
  color: var(--fm-espresso, #3b2a23);
}
.fm-course-nav__item.is-active {
  background: var(--fm-rose-soft, #f6e2e1);
  color: var(--fm-espresso, #3b2a23);
  border-left-color: var(--fm-rose-deep, #b06d70);
}
.fm-course-nav__num {
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-course-nav__item.is-active .fm-course-nav__num { color: var(--fm-rose-deep, #b06d70); }
.fm-course-nav__lbl { font-size: 13.5px; }
.fm-course-nav__chev { color: rgba(59, 42, 35, 0.35); display: flex; }
.fm-course-nav__item.is-active .fm-course-nav__chev { color: var(--fm-rose-deep, #b06d70); }

/* --- Right: content panel --- */
.fm-course-content { min-width: 0; }
.fm-course-panel {
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.08);
  padding: 44px 46px;
  animation: fmCourseFade 0.4s ease;
}
.fm-course-panel[hidden] { display: none; }

@keyframes fmCourseFade {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.fm-course-panel__head { margin-bottom: 28px; }
.fm-course-panel__title {
  margin: 14px 0 12px;
  font-family: 'Questrial', system-ui, sans-serif;
  font-weight: 400;
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1.18;
  letter-spacing: -0.005em;
  color: var(--fm-espresso, #3b2a23);
}
.fm-course-panel__lead {
  margin: 0;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.7;
  color: rgba(59, 42, 35, 0.78);
  white-space: pre-line;
}

.fm-course-panel__video {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  margin: 28px 0;
  background: #000;
  overflow: hidden;
}
.fm-course-panel__video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* --- Media row (audio + pdf) --- */
.fm-course-panel__media {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 24px 0 8px;
}
.fm-course-panel__media:has(> :only-child) { grid-template-columns: 1fr; }

.fm-course-panel__audio {
  padding: 18px 20px;
  background: var(--fm-sand, #ece6da);
  border: 1px solid rgba(59, 42, 35, 0.06);
}
.fm-course-panel__media-lbl {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-course-panel__audio audio {
  width: 100%;
  border-radius: 0;
}

.fm-course-panel__pdf {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  background: var(--fm-rose-soft, #f6e2e1);
  border: 1px solid rgba(176, 109, 112, 0.15);
  color: var(--fm-espresso, #3b2a23);
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.fm-course-panel__pdf:hover {
  background: #efd0cf;
  transform: translateY(-1px);
}
.fm-course-panel__pdf-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  background: #fff;
  color: var(--fm-rose-deep, #b06d70);
  flex: 0 0 38px;
}
.fm-course-panel__pdf-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.fm-course-panel__pdf-lbl {
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-course-panel__pdf-name {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 14px;
  color: var(--fm-espresso, #3b2a23);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fm-course-panel__pdf-arrow {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 20px;
  color: var(--fm-rose-deep, #b06d70);
}

/* --- Prev/Next nav --- */
.fm-course-panel__nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 36px;
  padding-top: 28px;
  border-top: 1px solid rgba(59, 42, 35, 0.08);
}
.fm-course-panel__nav-btn {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  background: transparent;
  border: 1px solid rgba(59, 42, 35, 0.1);
  cursor: pointer;
  text-align: left;
  color: var(--fm-espresso, #3b2a23);
  font-family: 'Questrial', system-ui, sans-serif;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}
.fm-course-panel__nav-btn:hover {
  background: var(--fm-sand, #ece6da);
  border-color: rgba(176, 109, 112, 0.3);
}
.fm-course-panel__nav-btn--next { grid-column: 2; justify-content: flex-end; text-align: right; }
.fm-course-panel__nav-btn--prev { grid-column: 1; }
.fm-course-panel__nav-lbl {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.fm-course-panel__nav-meta {
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-course-panel__nav-name {
  font-size: 14px;
  line-height: 1.3;
  color: var(--fm-espresso, #3b2a23);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 240px;
}
.fm-course-panel__nav-btn span[aria-hidden] {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 22px;
  color: var(--fm-rose-deep, #b06d70);
  flex: 0 0 auto;
}

/* --- Responsive --- */
@media (max-width: 1100px) {
  .fm-course-player__inner { grid-template-columns: 280px 1fr; gap: 36px; }
  .fm-course-panel { padding: 36px 32px; }
}
@media (max-width: 980px) {
  .fm-course-hero { padding: 96px 6vw 44px; }
  .fm-course-player { padding: 44px 6vw 80px; }
  .fm-course-player__inner { grid-template-columns: 1fr; gap: 24px; }
  .fm-course-nav {
    position: static;
    max-height: none;
    padding: 22px 18px;
  }
  .fm-course-nav__list {
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid rgba(59, 42, 35, 0.06);
  }
  .fm-course-panel { padding: 28px 22px; }
  .fm-course-panel__nav { grid-template-columns: 1fr; }
  .fm-course-panel__nav-btn--next,
  .fm-course-panel__nav-btn--prev { grid-column: 1; }
  .fm-course-panel__media { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .fm-course-hero__chip { font-size: 12px; padding: 7px 12px; }
  .fm-course-panel { padding: 22px 18px; }
  .fm-course-panel__title { font-size: 22px; }
  .fm-course-nav__item { grid-template-columns: 30px 1fr 14px; padding: 10px 8px; }
  .fm-course-nav__lbl { font-size: 13px; }
}


/* ========================================================================
   v3.1 — Auth icon button + dropdown in header_fm
   ======================================================================== */
.fm-auth-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-right: 14px;
  border-radius: 50%;
  background: var(--fm-rose-soft, #f6e2e1);
  color: var(--fm-espresso, #3b2a23);
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.2s ease;
}
.fm-auth-btn:hover { background: var(--fm-rose, #d99fa1); color: #fff; transform: translateY(-1px); }
.fm-header--scrolled .fm-auth-btn { background: rgba(217, 159, 161, 0.18); }
.fm-header--scrolled .fm-auth-btn:hover { background: var(--fm-rose, #d99fa1); }

.fm-auth-btn__trigger {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: transparent;
  color: inherit;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
}
.fm-auth-btn__trigger svg { width: 22px; height: 22px; }
.fm-auth-btn--guest svg { width: 22px; height: 22px; }

/* Active dot indicator on auth icon */
.fm-auth-btn__dot {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--fm-rose-deep, #b06d70);
  border: 2px solid var(--fm-canvas, #f8f7f2);
}
.fm-header--scrolled .fm-auth-btn__dot { border-color: #fff; }

/* Dropdown menu */
.fm-auth-menu {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 240px;
  padding: 6px;
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.1);
  box-shadow: 0 18px 50px -16px rgba(59, 42, 35, 0.25);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
  z-index: 120;
}
.fm-auth-btn.is-open .fm-auth-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.fm-auth-menu__head {
  padding: 14px 14px 12px;
  border-bottom: 1px solid rgba(59, 42, 35, 0.06);
  margin-bottom: 4px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.fm-auth-menu__hi {
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-auth-menu__name {
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 14px;
  color: var(--fm-espresso, #3b2a23);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 210px;
}
.fm-auth-menu__link {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 11px 14px;
  background: transparent;
  border: none;
  text-align: left;
  text-decoration: none;
  color: var(--fm-espresso, #3b2a23);
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 14px;
  cursor: pointer;
  transition: background-color 0.18s ease, color 0.18s ease;
}
.fm-auth-menu__link svg { color: var(--fm-rose-deep, #b06d70); flex: 0 0 16px; }
.fm-auth-menu__link:hover {
  background: var(--fm-sand, #ece6da);
  color: var(--fm-espresso, #3b2a23);
}
.fm-auth-menu__link--logout {
  border-top: 1px solid rgba(59, 42, 35, 0.06);
  margin-top: 4px;
  padding-top: 13px;
}
.fm-auth-menu__form { margin: 0; padding: 0; }

/* Hide desktop auth on tablet/mobile (drawer takes over) */
@media (max-width: 980px) {
  .fm-auth-btn { display: none; }
}

/* Mobile drawer auth links */
.fm-nav__link--auth {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  text-align: left;
  background: transparent;
  border: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  width: 100%;
}
.fm-nav__link--auth svg { color: var(--fm-rose-deep, #b06d70); flex: 0 0 18px; }
.fm-nav__link--auth.fm-nav__link--logout { color: var(--fm-rose-deep, #b06d70); }
.fm-mobile-nav__logout-form { margin: 0; padding: 0; width: 100%; }

/* Tighten spacing in header on narrower screens (cart + auth side by side) */
@media (max-width: 1180px) {
  .fm-cart-btn { margin-right: 8px; }
  .fm-auth-btn { margin-right: 10px; }
}

/* ==============================================================
   v3.2 — Login modal (fm-login-modal)
   ============================================================== */
.fm-login-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: none;
  align-items: flex-start;
  justify-content: center;
  padding: 6vh 16px 24px;
  overflow-y: auto;
}
.fm-login-modal.is-open {
  display: flex;
}
.fm-login-modal__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(59, 42, 35, 0.62);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: fmLoginFade 220ms ease-out;
}
.fm-login-modal__dialog {
  position: relative;
  width: 100%;
  max-width: 460px;
  background: var(--fm-ivory, #fdfaf0);
  border-radius: 22px;
  padding: 38px 36px 32px;
  box-shadow: 0 28px 68px -18px rgba(59, 42, 35, 0.38), 0 8px 18px -8px rgba(59, 42, 35, 0.18);
  animation: fmLoginRise 280ms cubic-bezier(.22,.94,.36,1);
  z-index: 1;
}
@keyframes fmLoginFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes fmLoginRise {
  from { opacity: 0; transform: translateY(14px) scale(.985); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.fm-login-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: rgba(176, 109, 112, 0.08);
  border: 1px solid rgba(176, 109, 112, 0.18);
  color: var(--fm-espresso, #3b2a23);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.fm-login-modal__close svg { width: 16px; height: 16px; }
.fm-login-modal__close:hover {
  background: var(--fm-rose-deep, #b06d70);
  color: #fff;
  transform: rotate(90deg);
}
.fm-login-modal__head {
  text-align: left;
  margin-bottom: 22px;
}
.fm-login-modal__head .fm-eyebrow {
  margin-bottom: 12px;
}
.fm-login-modal__title {
  font-family: 'Questrial', sans-serif;
  font-size: clamp(26px, 3vw, 32px);
  line-height: 1.15;
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 10px;
  letter-spacing: -0.01em;
}
.fm-login-modal__title em {
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: 400;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-login-modal__lead {
  font-size: 14.5px;
  line-height: 1.55;
  color: rgba(59, 42, 35, 0.72);
  margin: 0;
}
.fm-login-modal__alert {
  background: rgba(217, 95, 95, 0.08);
  border: 1px solid rgba(217, 95, 95, 0.22);
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 13.5px;
  line-height: 1.5;
  color: #8a2e2e;
  margin-bottom: 18px;
}
.fm-login-modal__alert.is-success {
  background: rgba(112, 158, 110, 0.10);
  border-color: rgba(112, 158, 110, 0.30);
  color: #3f6a3d;
}
.fm-login-modal__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.fm-login-modal__field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.fm-login-modal .fm-label,
.fm-login-modal__device-lbl {
  font-family: 'Questrial', sans-serif;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(59, 42, 35, 0.6);
  font-weight: 500;
}
.fm-login-modal .fm-input {
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1.5px solid rgba(59, 42, 35, 0.14);
  background: #fff;
  color: var(--fm-espresso, #3b2a23);
  font: 15px/1.4 'Questrial', sans-serif;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.fm-login-modal .fm-input::placeholder {
  color: rgba(59, 42, 35, 0.36);
}
.fm-login-modal .fm-input:focus {
  outline: none;
  border-color: var(--fm-rose-deep, #b06d70);
  box-shadow: 0 0 0 4px rgba(217, 159, 161, 0.18);
  background: #fff;
}
.fm-login-modal__device {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--fm-sand, #ece6da);
  border-radius: 12px;
  font-size: 13px;
  margin-top: 2px;
}
.fm-login-modal__device-lbl {
  flex: 0 0 auto;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-login-modal__device-val {
  flex: 1 1 auto;
  font-family: 'Questrial', sans-serif;
  color: var(--fm-espresso, #3b2a23);
  font-size: 12.5px;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: 0.86;
}
.fm-login-modal__submit {
  width: 100%;
  margin-top: 6px;
  justify-content: center;
}
.fm-login-modal__submit[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.fm-login-modal__alt {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  justify-content: center;
  margin-top: 4px;
  font-size: 13.5px;
}
.fm-login-modal__alt a {
  color: var(--fm-espresso, #3b2a23);
  text-decoration: none;
  border-bottom: 1px solid rgba(176, 109, 112, 0.35);
  transition: color .18s ease, border-color .18s ease;
}
.fm-login-modal__alt a:hover {
  color: var(--fm-rose-deep, #b06d70);
  border-color: var(--fm-rose-deep, #b06d70);
}
.fm-login-modal__alt-sep {
  color: rgba(59, 42, 35, 0.3);
}

/* Mobile tweaks */
@media (max-width: 560px) {
  .fm-login-modal {
    padding: 3vh 12px 16px;
  }
  .fm-login-modal__dialog {
    padding: 32px 22px 26px;
    border-radius: 18px;
  }
  .fm-login-modal__title {
    font-size: 24px;
  }
  .fm-login-modal__lead {
    font-size: 14px;
  }
  .fm-login-modal__alt {
    flex-direction: column;
    text-align: center;
    gap: 8px;
  }
  .fm-login-modal__alt-sep { display: none; }
}

/* ==============================================================
   v3.3 — Registration page (fm-register)
   ============================================================== */
.fm-register {
  background: linear-gradient(180deg, var(--fm-canvas, #f8f7f2) 0%, #f3eee7 100%);
  padding: 120px 6vw 90px;
  min-height: calc(100vh - 200px);
}
.fm-register__wrap {
  max-width: 1180px;
  margin: 0 auto;
}
.fm-register__success {
  text-align: center;
  background: #fff;
  border-radius: 22px;
  padding: 64px 32px;
  box-shadow: 0 18px 48px -22px rgba(59, 42, 35, 0.22);
  max-width: 620px;
  margin: 0 auto;
}
.fm-register__success-lead {
  font-size: 16px;
  color: rgba(59, 42, 35, 0.78);
  margin: 16px 0 28px;
  line-height: 1.6;
}
.fm-register__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 48px;
  align-items: start;
}
.fm-register__main {
  background: #fff;
  border-radius: 22px;
  padding: 44px 44px 40px;
  box-shadow: 0 18px 48px -22px rgba(59, 42, 35, 0.18);
}
.fm-register__intro {
  margin-bottom: 26px;
}
.fm-register__title {
  font-family: 'Questrial', sans-serif;
  font-size: clamp(28px, 3.4vw, 36px);
  line-height: 1.15;
  color: var(--fm-espresso, #3b2a23);
  margin: 12px 0 12px;
  letter-spacing: -0.01em;
}
.fm-register__title em {
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: 400;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-register__lead {
  font-size: 15px;
  line-height: 1.65;
  color: rgba(59, 42, 35, 0.72);
  margin: 0 0 8px;
}
.fm-register__alert {
  background: rgba(217, 95, 95, 0.08);
  border: 1px solid rgba(217, 95, 95, 0.22);
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 13.5px;
  line-height: 1.5;
  color: #8a2e2e;
  margin-bottom: 22px;
}
.fm-register__form {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.fm-register__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.fm-register__field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.fm-register .fm-label {
  font-family: 'Questrial', sans-serif;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(59, 42, 35, 0.6);
  font-weight: 500;
}
.fm-register .fm-input {
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1.5px solid rgba(59, 42, 35, 0.14);
  background: #fff;
  color: var(--fm-espresso, #3b2a23);
  font: 15px/1.4 'Questrial', sans-serif;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.fm-register .fm-input::placeholder {
  color: rgba(59, 42, 35, 0.34);
}
.fm-register .fm-input:focus {
  outline: none;
  border-color: var(--fm-rose-deep, #b06d70);
  box-shadow: 0 0 0 4px rgba(217, 159, 161, 0.18);
}
.fm-register__err {
  font-size: 12.5px;
  color: #8a2e2e;
  line-height: 1.4;
}
.fm-register__device {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--fm-sand, #ece6da);
  border-radius: 12px;
  font-size: 13px;
}
.fm-register__device-lbl {
  font-family: 'Questrial', sans-serif;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fm-rose-deep, #b06d70);
  font-weight: 500;
}
.fm-register__device-val {
  flex: 1 1 auto;
  font-size: 12.5px;
  color: var(--fm-espresso, #3b2a23);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: 0.86;
}
.fm-register__check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13.5px;
  line-height: 1.5;
  color: rgba(59, 42, 35, 0.78);
  cursor: pointer;
  padding: 4px 0;
}
.fm-register__check input[type=checkbox] {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  accent-color: var(--fm-rose-deep, #b06d70);
  cursor: pointer;
}
.fm-register__check a {
  color: var(--fm-rose-deep, #b06d70);
  border-bottom: 1px solid rgba(176, 109, 112, 0.4);
  text-decoration: none;
}
.fm-register__check a:hover {
  color: var(--fm-espresso, #3b2a23);
}
.fm-register__submit {
  align-self: flex-start;
  margin-top: 6px;
}
.fm-register__altline {
  font-size: 13.5px;
  color: rgba(59, 42, 35, 0.7);
  margin: 4px 0 0;
}
.fm-register__altline a {
  color: var(--fm-rose-deep, #b06d70);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(176, 109, 112, 0.4);
}
.fm-register__altline a:hover {
  color: var(--fm-espresso, #3b2a23);
}

/* aside */
.fm-register__aside {
  position: sticky;
  top: 110px;
}
.fm-register__aside-card {
  background: var(--fm-espresso, #3b2a23);
  color: #fff;
  border-radius: 22px;
  padding: 44px 36px 36px;
  box-shadow: 0 18px 48px -22px rgba(59, 42, 35, 0.32);
}
.fm-register__aside-card .fm-eyebrow {
  color: rgba(255, 255, 255, 0.75);
}
.fm-register__aside-card .fm-eyebrow .fm-rule {
  background: rgba(217, 159, 161, 0.6);
}
.fm-register__aside-title {
  font-family: 'Questrial', sans-serif;
  font-size: clamp(24px, 2.4vw, 28px);
  line-height: 1.2;
  margin: 14px 0 14px;
  color: #fff;
}
.fm-register__aside-title em {
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: 400;
  color: var(--fm-rose, #d99fa1);
}
.fm-register__aside-lead {
  font-size: 14.5px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.78);
  margin: 0 0 24px;
}
.fm-register__benefits {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.fm-register__benefits li {
  display: flex;
  gap: 12px;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.86);
}
.fm-register__benefits strong {
  color: #fff;
  font-weight: 600;
}
.fm-register__benefit-icon {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: rgba(217, 159, 161, 0.18);
  color: var(--fm-rose, #d99fa1);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.fm-register__benefit-icon svg {
  width: 14px;
  height: 14px;
}
.fm-register__aside-quote {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 22px;
  position: relative;
}
.fm-register__quote-mark {
  font-family: 'Montserrat', serif;
  font-style: italic;
  font-size: 56px;
  line-height: 0.6;
  color: var(--fm-rose, #d99fa1);
  position: absolute;
  top: 14px;
  left: -4px;
  opacity: 0.5;
}
.fm-register__aside-quote p {
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.92);
  margin: 0;
  padding-left: 24px;
}

/* Tablet */
@media (max-width: 980px) {
  .fm-register {
    padding: 100px 5vw 70px;
  }
  .fm-register__grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .fm-register__aside {
    position: static;
  }
  .fm-register__main {
    padding: 36px 30px 32px;
  }
}
/* Mobile */
@media (max-width: 560px) {
  .fm-register {
    padding: 88px 16px 56px;
  }
  .fm-register__main {
    padding: 28px 20px 26px;
    border-radius: 18px;
  }
  .fm-register__row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .fm-register__aside-card {
    padding: 32px 24px 28px;
    border-radius: 18px;
  }
  .fm-register__title {
    font-size: 26px;
  }
  .fm-register__submit {
    width: 100%;
    align-self: stretch;
    justify-content: center;
  }
}

/* ==============================================================
   v3.4 — Auth pages (verify, password reset, password email)
   Shared "single card" layout: .fm-authpage
   ============================================================== */
.fm-authpage {
  background: linear-gradient(180deg, var(--fm-canvas, #f8f7f2) 0%, #f3eee7 100%);
  padding: 120px 6vw 90px;
  min-height: calc(100vh - 200px);
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
.fm-authpage__wrap {
  width: 100%;
  max-width: 520px;
}
.fm-authpage__card {
  background: #fff;
  border-radius: 22px;
  padding: 48px 44px 40px;
  box-shadow: 0 18px 48px -22px rgba(59, 42, 35, 0.22);
  text-align: center;
}
.fm-authpage__card .fm-eyebrow {
  justify-content: center;
  display: inline-flex;
  margin: 14px 0 12px;
}
.fm-authpage__icon {
  width: 64px;
  height: 64px;
  border-radius: 999px;
  background: rgba(217, 159, 161, 0.16);
  color: var(--fm-rose-deep, #b06d70);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
}
.fm-authpage__icon svg {
  width: 28px;
  height: 28px;
}
.fm-authpage__icon--success {
  background: rgba(112, 158, 110, 0.15);
  color: #4d8a4a;
}
.fm-authpage__title {
  font-family: 'Questrial', sans-serif;
  font-size: clamp(26px, 3.2vw, 34px);
  line-height: 1.18;
  color: var(--fm-espresso, #3b2a23);
  margin: 0 0 14px;
  letter-spacing: -0.01em;
}
.fm-authpage__title em {
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: 400;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-authpage__lead {
  font-size: 15px;
  line-height: 1.65;
  color: rgba(59, 42, 35, 0.72);
  margin: 0 0 24px;
}
.fm-authpage__alert {
  background: rgba(217, 95, 95, 0.08);
  border: 1px solid rgba(217, 95, 95, 0.22);
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 13.5px;
  line-height: 1.5;
  color: #8a2e2e;
  margin: 0 0 22px;
  text-align: left;
}
.fm-authpage__alert--success {
  background: rgba(112, 158, 110, 0.10);
  border-color: rgba(112, 158, 110, 0.30);
  color: #3f6a3d;
}
.fm-authpage__note {
  background: var(--fm-sand, #ece6da);
  border-radius: 14px;
  padding: 18px 20px;
  margin: 0 0 24px;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(59, 42, 35, 0.78);
  text-align: left;
}
.fm-authpage__note p { margin: 0 0 8px; }
.fm-authpage__note p:last-child { margin: 0; }

.fm-authpage__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: left;
}
.fm-authpage__field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.fm-authpage .fm-label {
  font-family: 'Questrial', sans-serif;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(59, 42, 35, 0.6);
  font-weight: 500;
}
.fm-authpage .fm-input {
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1.5px solid rgba(59, 42, 35, 0.14);
  background: #fff;
  color: var(--fm-espresso, #3b2a23);
  font: 15px/1.4 'Questrial', sans-serif;
  transition: border-color .18s ease, box-shadow .18s ease;
  box-sizing: border-box;
}
.fm-authpage .fm-input::placeholder {
  color: rgba(59, 42, 35, 0.34);
}
.fm-authpage .fm-input:focus {
  outline: none;
  border-color: var(--fm-rose-deep, #b06d70);
  box-shadow: 0 0 0 4px rgba(217, 159, 161, 0.18);
}
.fm-authpage__submit {
  width: 100%;
  justify-content: center;
  margin-top: 4px;
}
.fm-authpage__altline {
  font-size: 13.5px;
  color: rgba(59, 42, 35, 0.7);
  margin: 18px 0 0;
  text-align: center;
}
.fm-authpage__altline a {
  color: var(--fm-rose-deep, #b06d70);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid rgba(176, 109, 112, 0.4);
}
.fm-authpage__altline a:hover {
  color: var(--fm-espresso, #3b2a23);
}
.fm-authpage__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 12px;
}

/* Mobile */
@media (max-width: 560px) {
  .fm-authpage {
    padding: 88px 16px 56px;
  }
  .fm-authpage__card {
    padding: 36px 22px 30px;
    border-radius: 18px;
  }
  .fm-authpage__title {
    font-size: 24px;
  }
  .fm-authpage__actions .fm-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ============================================================ */
/* v3.5 — Profile page + daily notification card                */
/* ============================================================ */

.fm-profile {
  background: var(--fm-canvas);
  padding: 120px 0 96px;
  min-height: 100vh;
}

.fm-profile__container {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 24px;
}

.fm-profile__hero {
  text-align: center;
  margin-bottom: 32px;
}

.fm-profile__title {
  font-family: 'Questrial', sans-serif;
  font-size: 44px;
  line-height: 1.1;
  color: var(--fm-espresso);
  margin: 12px 0 14px;
  letter-spacing: -0.5px;
}

.fm-profile__title em {
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-weight: 400;
  color: var(--fm-rose-deep);
}

.fm-profile__lead {
  font-family: 'Questrial', sans-serif;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(59, 42, 35, 0.72);
  max-width: 620px;
  margin: 0 auto;
}

/* ---- Notification card ---- */
.fm-notif {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  background: linear-gradient(135deg, #fdfaf0 0%, #f6e8e6 100%);
  border: 1px solid rgba(176, 109, 112, 0.22);
  border-radius: 18px;
  padding: 22px 24px;
  margin-bottom: 28px;
  position: relative;
  box-shadow: 0 10px 28px rgba(176, 109, 112, 0.08);
  transition: opacity 0.22s ease, transform 0.22s ease;
}

.fm-notif--dismissing {
  opacity: 0;
  transform: translateY(-6px);
}

.fm-notif__badge {
  flex: 0 0 auto;
  background: var(--fm-rose-deep);
  color: #fff;
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 999px;
  white-space: nowrap;
}

.fm-notif__body {
  flex: 1 1 auto;
  padding-right: 36px;
}

.fm-notif__title {
  font-family: 'Questrial', sans-serif;
  font-size: 19px;
  color: var(--fm-espresso);
  margin: 0 0 6px;
  line-height: 1.3;
}

.fm-notif__text {
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  color: rgba(59, 42, 35, 0.78);
  line-height: 1.55;
}

.fm-notif__close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(176, 109, 112, 0.18);
  border-radius: 999px;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--fm-espresso);
  cursor: pointer;
  transition: background 0.18s, color 0.18s, transform 0.18s;
}

.fm-notif__close:hover {
  background: var(--fm-rose-deep);
  color: #fff;
  transform: rotate(90deg);
}

/* ---- Tab menu ---- */
.fm-profile-menu {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  background: #fff;
  border: 1px solid rgba(59, 42, 35, 0.08);
  border-radius: 18px;
  padding: 10px;
  margin-bottom: 28px;
  box-shadow: 0 6px 18px rgba(59, 42, 35, 0.04);
}

.fm-profile-menu__item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 12px;
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  color: var(--fm-espresso);
  text-decoration: none;
  transition: background 0.18s, color 0.18s, transform 0.18s;
  border: 1px solid transparent;
  text-align: center;
}

.fm-profile-menu__item:hover {
  background: var(--fm-sand);
  color: var(--fm-rose-deep);
  text-decoration: none;
}

.fm-profile-menu__item--active {
  background: var(--fm-espresso);
  color: #fff;
}

.fm-profile-menu__item--active:hover {
  background: var(--fm-espresso);
  color: #fff;
}

.fm-profile-menu__icon {
  display: inline-flex;
  align-items: center;
}

/* ---- Flash messages ---- */
.fm-flash {
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 22px;
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  line-height: 1.5;
}

.fm-flash--success {
  background: #ecf6ec;
  border: 1px solid #b7d8b9;
  color: #2e5d36;
}

.fm-flash--error {
  background: #fbeaea;
  border: 1px solid #e6b9bb;
  color: #732427;
}

.fm-flash ul {
  margin: 8px 0 0 18px;
  padding: 0;
}

/* ---- Profile grid ---- */
.fm-profile-grid {
  display: grid;
  grid-template-columns: 1.7fr 1fr;
  gap: 22px;
  margin-bottom: 32px;
}

.fm-profile-card {
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(59, 42, 35, 0.08);
  padding: 28px;
  box-shadow: 0 6px 18px rgba(59, 42, 35, 0.04);
}

.fm-profile-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(59, 42, 35, 0.08);
}

.fm-profile-card__title {
  font-family: 'Questrial', sans-serif;
  font-size: 22px;
  color: var(--fm-espresso);
  margin: 0;
}

.fm-profile-card__edit {
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  color: var(--fm-rose-deep);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.18s;
}

.fm-profile-card__edit:hover {
  border-color: var(--fm-rose-deep);
  text-decoration: none;
}

.fm-profile-info {
  margin: 0;
  display: grid;
  gap: 10px;
}

.fm-profile-info__row {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px dashed rgba(59, 42, 35, 0.08);
}

.fm-profile-info__row:last-child {
  border-bottom: none;
}

.fm-profile-info__row dt {
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  color: rgba(59, 42, 35, 0.6);
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

.fm-profile-info__row dd {
  font-family: 'Questrial', sans-serif;
  font-size: 16px;
  color: var(--fm-espresso);
  margin: 0;
}

.fm-profile-note {
  margin-top: 22px;
  background: var(--fm-sand);
  border-radius: 12px;
  padding: 14px 18px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border: 1px solid rgba(59, 42, 35, 0.06);
}

.fm-profile-note__icon {
  color: var(--fm-rose-deep);
  flex: 0 0 auto;
  margin-top: 2px;
}

.fm-profile-note p {
  margin: 0;
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  line-height: 1.55;
  color: var(--fm-espresso);
}

.fm-profile-note a {
  color: var(--fm-rose-deep);
  font-weight: bold;
  text-decoration: none;
  border-bottom: 1px solid var(--fm-rose-deep);
}

.fm-profile-note a:hover {
  color: var(--fm-espresso);
  border-color: var(--fm-espresso);
  text-decoration: none;
}

/* ---- Side card ---- */
.fm-profile-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.fm-profile-status {
  background: var(--fm-espresso);
  border-radius: 18px;
  padding: 26px;
  color: #fff;
}

.fm-profile-status__eyebrow {
  font-family: 'Questrial', sans-serif;
  font-size: 12px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  display: block;
  margin-bottom: 14px;
}

.fm-profile-status__pill {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  border-radius: 999px;
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  margin-bottom: 14px;
}

.fm-profile-status__pill--ok {
  background: rgba(180, 220, 180, 0.22);
  color: #c6f0c6;
  border: 1px solid rgba(180, 220, 180, 0.35);
}

.fm-profile-status__pill--off {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.18);
}

.fm-profile-status__line {
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  margin: 0;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.55;
}

.fm-profile-status__line strong {
  color: #fff;
}

.fm-profile-side__cta {
  justify-content: center;
}

/* ---- Orders list ---- */
.fm-profile-orders {
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(59, 42, 35, 0.08);
  padding: 28px;
  box-shadow: 0 6px 18px rgba(59, 42, 35, 0.04);
}

.fm-profile-orders__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(59, 42, 35, 0.08);
}

.fm-profile-orders__title {
  font-family: 'Questrial', sans-serif;
  font-size: 22px;
  color: var(--fm-espresso);
  margin: 0;
}

.fm-profile-orders__meta {
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  background: var(--fm-sand);
  color: var(--fm-espresso);
  padding: 4px 10px;
  border-radius: 999px;
}

.fm-profile-orders__list {
  display: grid;
  gap: 8px;
}

.fm-profile-order {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fbfaf7;
  border: 1px solid rgba(59, 42, 35, 0.06);
  border-radius: 12px;
  padding: 14px 18px;
  text-decoration: none;
  color: var(--fm-espresso);
  transition: background 0.18s, border-color 0.18s, transform 0.18s;
}

.fm-profile-order:hover {
  background: #fff;
  border-color: rgba(176, 109, 112, 0.28);
  text-decoration: none;
  transform: translateY(-1px);
  color: var(--fm-espresso);
}

.fm-profile-order__main {
  display: flex;
  align-items: center;
  gap: 14px;
}

.fm-profile-order__id {
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: var(--fm-espresso);
}

.fm-profile-order__date {
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  color: rgba(59, 42, 35, 0.6);
}

.fm-profile-order__right {
  display: flex;
  align-items: center;
  gap: 12px;
  color: rgba(59, 42, 35, 0.5);
}

.fm-profile-order__status {
  font-family: 'Questrial', sans-serif;
  font-size: 12px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--fm-sand);
  color: var(--fm-espresso);
}

.fm-profile-order__status--kupljeno {
  background: rgba(180, 220, 180, 0.35);
  color: #2e5d36;
}

.fm-profile-order__status--porueno,
.fm-profile-order__status--narucheno,
.fm-profile-order__status--poruceno {
  background: rgba(245, 220, 180, 0.55);
  color: #7a4a18;
}

.fm-profile-order__status--neautorizovan {
  background: rgba(230, 185, 187, 0.5);
  color: #732427;
}

/* Mobile */
@media (max-width: 880px) {
  .fm-profile {
    padding: 100px 0 80px;
  }
  .fm-profile__title {
    font-size: 32px;
  }
  .fm-profile-menu {
    grid-template-columns: repeat(2, 1fr);
  }
  .fm-profile-grid {
    grid-template-columns: 1fr;
  }
  .fm-profile-info__row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .fm-notif {
    flex-direction: column;
    gap: 10px;
  }
  .fm-notif__body {
    padding-right: 0;
  }
}

@media (max-width: 520px) {
  .fm-profile-menu {
    grid-template-columns: 1fr;
  }
  .fm-profile-card,
  .fm-profile-orders {
    padding: 22px 18px;
  }
  .fm-profile-status {
    padding: 22px;
  }
  .fm-profile-order {
    flex-wrap: wrap;
    gap: 8px;
  }
}

/* ============================================================ */
/* v3.6 — Confirmation page (potvrda uplate)                    */
/* ============================================================ */

.fm-confirm {
  background: var(--fm-canvas);
  padding: 120px 0 96px;
  min-height: 100vh;
}

.fm-confirm__container {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 24px;
}

.fm-confirm__head {
  text-align: center;
  margin-bottom: 36px;
}

.fm-confirm__title {
  font-family: 'Questrial', sans-serif;
  font-size: 42px;
  line-height: 1.12;
  color: var(--fm-espresso);
  margin: 12px 0 14px;
  letter-spacing: -0.4px;
}

.fm-confirm__lead {
  font-family: 'Questrial', sans-serif;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(59, 42, 35, 0.72);
  max-width: 640px;
  margin: 0 auto;
}

.fm-confirm__grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 24px;
  align-items: start;
}

.fm-confirm-card {
  background: #fff;
  border-radius: 22px;
  border: 1px solid rgba(59, 42, 35, 0.08);
  padding: 36px;
  box-shadow: 0 10px 30px rgba(59, 42, 35, 0.06);
}

.fm-confirm-form {
  display: grid;
  gap: 18px;
}

.fm-confirm-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fm-confirm-field label {
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: rgba(59, 42, 35, 0.7);
}

.fm-confirm-field input[type="text"],
.fm-confirm-field input[type="email"],
.fm-confirm-field select {
  font-family: 'Questrial', sans-serif;
  font-size: 16px;
  color: var(--fm-espresso);
  background: #fbfaf7;
  border: 1px solid rgba(59, 42, 35, 0.14);
  border-radius: 12px;
  padding: 14px 16px;
  transition: border-color 0.18s, background 0.18s, box-shadow 0.18s;
  width: 100%;
}

.fm-confirm-field input[type="text"]:focus,
.fm-confirm-field input[type="email"]:focus,
.fm-confirm-field select:focus {
  outline: none;
  background: #fff;
  border-color: var(--fm-rose-deep);
  box-shadow: 0 0 0 4px rgba(217, 159, 161, 0.18);
}

.fm-confirm-field__err {
  color: #b3464a;
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
}

.fm-confirm-file {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 20px;
  border: 1.5px dashed rgba(176, 109, 112, 0.4);
  border-radius: 14px;
  background: #fdfaf0;
  cursor: pointer;
  transition: background 0.18s, border-color 0.18s;
}

.fm-confirm-file:hover {
  background: #f9efeb;
  border-color: var(--fm-rose-deep);
}

.fm-confirm-file--has {
  background: #ecf6ec;
  border-color: #8ab98e;
  border-style: solid;
}

.fm-confirm-file__icon {
  color: var(--fm-rose-deep);
  flex: 0 0 auto;
}

.fm-confirm-file--has .fm-confirm-file__icon {
  color: #2e5d36;
}

.fm-confirm-file__text {
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  color: var(--fm-espresso);
  flex: 1 1 auto;
  word-break: break-all;
}

.fm-confirm-file input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
}

.fm-confirm-actions {
  margin-top: 6px;
}

.fm-confirm-actions .fm-btn {
  width: 100%;
  justify-content: center;
}

/* Side ---- */
.fm-confirm-side {
  background: var(--fm-sand);
  border-radius: 22px;
  padding: 32px;
  border: 1px solid rgba(59, 42, 35, 0.06);
}

.fm-confirm-side__title {
  font-family: 'Questrial', sans-serif;
  font-size: 22px;
  color: var(--fm-espresso);
  margin: 0 0 16px;
}

.fm-confirm-side__steps {
  margin: 0 0 22px;
  padding-left: 20px;
  display: grid;
  gap: 10px;
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  color: var(--fm-espresso);
  line-height: 1.55;
}

.fm-confirm-side__steps li::marker {
  color: var(--fm-rose-deep);
  font-weight: bold;
}

.fm-confirm-side__contact {
  border-top: 1px solid rgba(59, 42, 35, 0.1);
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fm-confirm-side__contact-label {
  font-family: 'Questrial', sans-serif;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: rgba(59, 42, 35, 0.6);
}

.fm-confirm-side__contact a {
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  color: var(--fm-rose-deep);
  text-decoration: none;
}

.fm-confirm-side__contact a:hover {
  color: var(--fm-espresso);
  text-decoration: none;
}

@media (max-width: 880px) {
  .fm-confirm {
    padding: 100px 0 80px;
  }
  .fm-confirm__title {
    font-size: 30px;
  }
  .fm-confirm__grid {
    grid-template-columns: 1fr;
  }
  .fm-confirm-card,
  .fm-confirm-side {
    padding: 26px 22px;
  }
}

/* ============================================================ */
/* v3.7 — Profile subpages: products / devices / edit           */
/* ============================================================ */

/* ---- Empty state (shared) ---- */
.fm-profile-empty {
  background: #fff;
  border: 1px dashed rgba(176, 109, 112, 0.32);
  border-radius: 22px;
  padding: 60px 40px;
  text-align: center;
  box-shadow: 0 6px 20px rgba(59, 42, 35, 0.04);
}

.fm-profile-empty__icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--fm-sand);
  color: var(--fm-rose-deep);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
}

.fm-profile-empty__title {
  font-family: 'Questrial', sans-serif;
  font-size: 26px;
  color: var(--fm-espresso);
  margin: 0 0 10px;
}

.fm-profile-empty__text {
  font-family: 'Questrial', sans-serif;
  font-size: 16px;
  color: rgba(59, 42, 35, 0.7);
  margin: 0 0 22px;
}

/* ---- Products grid ---- */
.fm-products-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.fm-product-card {
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(59, 42, 35, 0.08);
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(59, 42, 35, 0.04);
  transition: transform 0.22s, box-shadow 0.22s, border-color 0.22s;
  display: flex;
  flex-direction: column;
}

.fm-product-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(59, 42, 35, 0.1);
  border-color: rgba(176, 109, 112, 0.3);
}

.fm-product-card__media {
  display: block;
  position: relative;
  background: var(--fm-sand);
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.fm-product-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s;
}

.fm-product-card:hover .fm-product-card__media img {
  transform: scale(1.04);
}

.fm-product-card__tag {
  position: absolute;
  top: 12px;
  left: 12px;
  background: var(--fm-rose-deep);
  color: #fff;
  font-family: 'Questrial', sans-serif;
  font-size: 12px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  padding: 5px 11px;
  border-radius: 999px;
}

.fm-product-card__owned {
  position: absolute;
  top: 12px;
  right: 12px;
  background: rgba(255, 255, 255, 0.92);
  color: #2e5d36;
  font-family: 'Questrial', sans-serif;
  font-size: 12px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  padding: 5px 11px;
  border-radius: 999px;
  border: 1px solid rgba(46, 93, 54, 0.18);
}

.fm-product-card__body {
  padding: 20px 22px 22px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.fm-product-card__title {
  font-family: 'Questrial', sans-serif;
  font-size: 19px;
  line-height: 1.3;
  margin: 0 0 10px;
}

.fm-product-card__title a {
  color: var(--fm-espresso);
  text-decoration: none;
}

.fm-product-card__title a:hover {
  color: var(--fm-rose-deep);
  text-decoration: none;
}

.fm-product-card__excerpt {
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  color: rgba(59, 42, 35, 0.7);
  line-height: 1.55;
  margin: 0 0 18px;
  flex: 1;
}

.fm-product-card__foot {
  margin-top: auto;
}

.fm-product-card__cta {
  width: 100%;
  justify-content: center;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

@media (max-width: 980px) {
  .fm-products-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
  .fm-products-grid { grid-template-columns: 1fr; }
}

/* ---- Device banner ---- */
.fm-device-banner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 22px;
  font-family: 'Questrial', sans-serif;
  font-size: 15px;
  line-height: 1.55;
}

.fm-device-banner p { margin: 0; }

.fm-device-banner__icon { flex: 0 0 auto; margin-top: 1px; }

.fm-device-banner--info {
  background: var(--fm-sand);
  color: var(--fm-espresso);
  border: 1px solid rgba(59, 42, 35, 0.08);
}

.fm-device-banner--info .fm-device-banner__icon { color: var(--fm-rose-deep); }

.fm-device-banner--warn {
  background: #fbeaea;
  color: #732427;
  border: 1px solid #e6b9bb;
}

/* ---- Devices grid ---- */
.fm-devices-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.fm-device-card {
  position: relative;
  background: #fff;
  border-radius: 18px;
  border: 1px solid rgba(59, 42, 35, 0.08);
  padding: 28px 24px 24px;
  text-align: center;
  box-shadow: 0 6px 18px rgba(59, 42, 35, 0.04);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

.fm-device-card--free {
  border-style: dashed;
  border-color: rgba(176, 109, 112, 0.28);
  background: #fdfaf0;
}

.fm-device-card__num {
  position: absolute;
  top: 16px;
  left: 16px;
  font-family: 'Montserrat', sans-serif;
  font-style: italic;
  font-size: 24px;
  color: rgba(59, 42, 35, 0.25);
  line-height: 1;
}

.fm-device-card__visual {
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 6px;
}

.fm-device-card__visual img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.fm-device-card__visual--free {
  color: rgba(176, 109, 112, 0.55);
}

.fm-device-card__body { display: flex; flex-direction: column; align-items: center; gap: 6px; }

.fm-device-card__status {
  font-family: 'Questrial', sans-serif;
  font-size: 11px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(180, 220, 180, 0.35);
  color: #2e5d36;
}

.fm-device-card__status--free {
  background: rgba(176, 109, 112, 0.12);
  color: var(--fm-rose-deep);
}

.fm-device-card__type {
  font-family: 'Questrial', sans-serif;
  font-size: 17px;
  color: var(--fm-espresso);
  margin: 4px 0 0;
}

.fm-device-card__code {
  font-family: 'Courier New', monospace;
  font-size: 13px;
  color: rgba(59, 42, 35, 0.55);
  margin: 0;
  word-break: break-all;
  background: var(--fm-canvas);
  padding: 4px 10px;
  border-radius: 8px;
}

.fm-device-card__hint {
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
  color: rgba(59, 42, 35, 0.55);
  margin: 0;
  max-width: 220px;
}

.fm-device-card__form { width: 100%; margin-top: 6px; }

.fm-device-card__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  border: 1px solid rgba(176, 109, 112, 0.4);
  background: #fff;
  color: var(--fm-rose-deep);
  font-family: 'Questrial', sans-serif;
  font-size: 14px;
  padding: 11px 16px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.18s, color 0.18s, border-color 0.18s;
}

.fm-device-card__btn:hover {
  background: var(--fm-rose-deep);
  color: #fff;
  border-color: var(--fm-rose-deep);
}

@media (max-width: 880px) {
  .fm-devices-grid { grid-template-columns: 1fr; }
}

/* ---- Edit profile form ---- */
.fm-edit-card {
  background: #fff;
  border-radius: 22px;
  border: 1px solid rgba(59, 42, 35, 0.08);
  padding: 36px;
  box-shadow: 0 10px 30px rgba(59, 42, 35, 0.06);
}

.fm-edit-form { display: grid; gap: 20px; }

.fm-edit-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.fm-edit-field { display: flex; flex-direction: column; gap: 8px; }

.fm-edit-field label {
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: rgba(59, 42, 35, 0.7);
}

.fm-edit-field input {
  font-family: 'Questrial', sans-serif;
  font-size: 16px;
  color: var(--fm-espresso);
  background: #fbfaf7;
  border: 1px solid rgba(59, 42, 35, 0.14);
  border-radius: 12px;
  padding: 14px 16px;
  transition: border-color 0.18s, background 0.18s, box-shadow 0.18s;
  width: 100%;
}

.fm-edit-field input:focus {
  outline: none;
  background: #fff;
  border-color: var(--fm-rose-deep);
  box-shadow: 0 0 0 4px rgba(217, 159, 161, 0.18);
}

.fm-edit-field__err {
  color: #b3464a;
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
}

.fm-edit-field__hint {
  font-family: 'Questrial', sans-serif;
  font-size: 12px;
  color: rgba(59, 42, 35, 0.5);
}

.fm-edit-form__actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}

.fm-edit-form__actions .fm-btn { min-width: 220px; justify-content: center; }

@media (max-width: 720px) {
  .fm-edit-form__row { grid-template-columns: 1fr; }
  .fm-edit-card { padding: 26px 22px; }
  .fm-edit-form__actions { justify-content: stretch; }
  .fm-edit-form__actions .fm-btn { width: 100%; }
}

/* v3.7b — Profile status extras (product title + more count) */
.fm-profile-status__product {
  font-family: 'Questrial', sans-serif;
  font-size: 16px;
  color: #fff;
  margin: 0 0 8px;
  line-height: 1.35;
  font-weight: 600;
}
.fm-profile-status__more {
  font-family: 'Questrial', sans-serif;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  margin: 8px 0 0;
  font-style: italic;
}

/* ============================================================
   v3.8 — Device icons (SVG) za /user-profile/device-edit
   ============================================================ */
.fm-device-card__visual svg {
  width: 78px;
  height: 78px;
  color: var(--fm-rose-deep, #b06d70);
  transition: transform 0.5s ease, color 0.3s ease;
}

.fm-device-card--used:hover .fm-device-card__visual svg {
  transform: translateY(-3px) scale(1.04);
  color: var(--fm-espresso, #3b2a23);
}

.fm-device-card__visual--mobile svg { width: 58px; height: 78px; }
.fm-device-card__visual--tablet svg { width: 66px; height: 78px; }
.fm-device-card__visual--laptop svg { width: 84px; height: 78px; }

/* ============================================================
   v3.9 — Testimonials mobile: 1-up swiper umesto stacka 3 kartice
   ============================================================ */
@media (max-width: 720px) {
  /* Prikaži samo prvu karticu (data-fm-tests-card="0"); JS rotira sadržaj kroz items[] */
  .fm-tests__card[data-fm-tests-card="1"],
  .fm-tests__card[data-fm-tests-card="2"] {
    display: none !important;
  }
  /* Single card pun viewport-width, sa swipe hint cursor-om */
  .fm-tests__grid { grid-template-columns: 1fr; }
  .fm-tests__card {
    margin-left: 0;
    margin-top: 0;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    touch-action: pan-y;
  }
  .fm-tests__grid.is-dragging .fm-tests__card { cursor: grabbing; }
  /* Strelice na mobile skrivene — dovoljno je swipe + dots */
  .fm-tests__arrow { display: none !important; }
  /* Centriraj dots ispod kartice sa malo vazduha */
  .fm-tests__dots { margin-top: 22px; justify-content: center; display: flex; gap: 8px; }
}

/* ========================================================================
   v3.10 — Single product description H2 ("Šta dobijaš ovom obukom?")
   Originally inherited .fm-headline (clamp 40px..68px) — too large to fit
   in one line on the description column. Make it product-description sized.
   ======================================================================== */
.fm-prod-desc__title {
  font-size: clamp(24px, 2.6vw, 34px) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap;
}
@media (max-width: 720px) {
  .fm-prod-desc__title {
    font-size: clamp(20px, 5.2vw, 26px) !important;
    white-space: normal;
  }
}

/* ========================================================================
   v3.11 — Pošalji fiskalni račun (admin tool, /posalji-racun)
   Redizajn 2026 — sendInvoice.blade.php prebačen sa layouts.app na
   layouts.fm. Inputi/banneri/preview kartica + 2-col grid sa aside-om.
   ======================================================================== */
.fm-invoice-hero { padding: 80px 0 28px; }
.fm-invoice { padding: 24px 0 100px; }
.fm-invoice__inner { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 24px; }

.fm-invoice__banner {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 16px 18px;
  border-radius: 12px;
  margin: 0 0 22px;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 15px; line-height: 1.5;
  border: 1px solid transparent;
}
.fm-invoice__banner svg { flex-shrink: 0; margin-top: 1px; }
.fm-invoice__banner strong { display: block; margin-bottom: 2px; }
.fm-invoice__banner code {
  background: rgba(59, 42, 35, 0.08);
  padding: 1px 6px; border-radius: 4px;
  font-size: 13px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  color: var(--fm-espresso, #3b2a23);
}
.fm-invoice__banner--warn {
  background: #fdf6ec;
  border-color: #e9d8b8;
  color: #6b4d1a;
}
.fm-invoice__banner--ok {
  background: #ecf6ee;
  border-color: #bcdcc3;
  color: #2d6238;
}
.fm-invoice__banner--err {
  background: #fbeded;
  border-color: #f0c7c7;
  color: #8a2c2c;
}
.fm-invoice__errlist { margin: 4px 0 0; padding-left: 18px; }
.fm-invoice__errlist li { margin: 2px 0; }

.fm-invoice__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
@media (max-width: 960px) {
  .fm-invoice__grid { grid-template-columns: 1fr; }
}

.fm-invoice__form {
  background: #fff;
  border: 1px solid var(--fm-sand, #ece6da);
  border-radius: 18px;
  padding: 28px;
  box-shadow: 0 1px 0 rgba(59, 42, 35, 0.02);
}
.fm-invoice__field { margin: 0 0 22px; }
.fm-invoice__label {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--fm-rose-deep, #b06d70);
  margin: 0 0 8px;
}
.fm-invoice__select-wrap {
  position: relative;
}
.fm-invoice__select {
  width: 100%;
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  background: var(--fm-canvas, #f8f7f2);
  border: 1px solid var(--fm-sand, #ece6da);
  border-radius: 12px;
  padding: 14px 42px 14px 16px;
  font-family: 'Questrial', system-ui, sans-serif;
  font-size: 16px; line-height: 1.3;
  color: var(--fm-espresso, #3b2a23);
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.fm-invoice__select:hover { background: #fff; }
.fm-invoice__select:focus {
  outline: none;
  border-color: var(--fm-rose, #d99fa1);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(217, 159, 161, 0.18);
}
.fm-invoice__select-chev {
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  pointer-events: none;
  color: var(--fm-rose-deep, #b06d70);
}
.fm-invoice__hint {
  margin: 6px 0 0;
  font-size: 13px; line-height: 1.5;
  color: rgba(59, 42, 35, 0.62);
}

.fm-invoice__preview {
  background: var(--fm-canvas, #f8f7f2);
  border: 1px dashed var(--fm-sand, #ece6da);
  border-radius: 12px;
  padding: 16px 18px;
  margin: 22px 0 24px;
  font-family: 'Questrial', system-ui, sans-serif;
}
.fm-invoice__preview-row {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 6px 0;
  font-size: 14px;
  border-bottom: 1px dotted rgba(59, 42, 35, 0.12);
}
.fm-invoice__preview-row:last-child { border-bottom: 0; }
.fm-invoice__preview-row span { color: rgba(59, 42, 35, 0.62); }
.fm-invoice__preview-row strong {
  font-weight: 500; color: var(--fm-espresso, #3b2a23);
  text-align: right; word-break: break-word;
}
.fm-invoice__preview-row--total {
  margin-top: 4px; padding-top: 12px;
  border-top: 1px solid var(--fm-sand, #ece6da);
  border-bottom: 0;
}
.fm-invoice__preview-row--total span { color: var(--fm-rose-deep, #b06d70); font-weight: 500; }
.fm-invoice__preview-row--total strong { font-size: 18px; color: var(--fm-rose-deep, #b06d70); }

.fm-invoice__submit {
  width: 100%;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
}

.fm-invoice__aside { display: flex; flex-direction: column; gap: 18px; }
.fm-invoice__card {
  background: #fff;
  border: 1px solid var(--fm-sand, #ece6da);
  border-radius: 18px;
  padding: 24px;
}
.fm-invoice__card--muted { background: var(--fm-canvas, #f8f7f2); }
.fm-invoice__card .fm-eyebrow { margin: 0 0 14px; }
.fm-invoice__steps { margin: 0; padding-left: 18px; font-family: 'Questrial', system-ui, sans-serif; font-size: 15px; line-height: 1.65; color: var(--fm-espresso, #3b2a23); }
.fm-invoice__steps li { margin: 8px 0; padding-left: 6px; }
.fm-invoice__steps li::marker { color: var(--fm-rose-deep, #b06d70); font-weight: 600; }
.fm-invoice__notes { margin: 0; padding-left: 18px; font-family: 'Questrial', system-ui, sans-serif; font-size: 14px; line-height: 1.65; color: rgba(59, 42, 35, 0.82); }
.fm-invoice__notes li { margin: 6px 0; }
.fm-invoice__notes code {
  background: rgba(59, 42, 35, 0.06);
  padding: 1px 6px; border-radius: 4px;
  font-size: 12.5px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  color: var(--fm-espresso, #3b2a23);
}

.fm-invoice__guard {
  text-align: center;
  padding: 48px 24px;
  color: var(--fm-espresso, #3b2a23);
  font-family: 'Questrial', system-ui, sans-serif;
}
.fm-invoice__guard svg { color: var(--fm-rose-deep, #b06d70); opacity: 0.7; margin-bottom: 14px; }
.fm-invoice__guard p { margin: 0 0 16px; font-size: 16px; }