/* ===== Moderncrest Style Quiz — Public CSS v1.1 ===== */
.mcq-app {
    --gold:#B07D4A; --gold-l:#D4A96A; --gold-pale:#F5EBD9; --gold-d:#7A4F1E;
    --cream:#FAF7F2; --ink:#1C1714; --ink-m:#4A3F35; --ink-s:#8C7D6A; --ink-f:#C4B8A8;
    --white:#FFFFFF; --bdr:rgba(180,160,130,.22); --bdr-s:rgba(180,160,130,.5);
    --r:12px; --rs:8px;
    font-family:'DM Sans',sans-serif; color:var(--ink); background:var(--cream);
    max-width:1000px; margin:0 auto; padding:0 0 3rem;
}
.mcq-app *,.mcq-app *::before,.mcq-app *::after{box-sizing:border-box;margin:0;padding:0;}

/* SCREENS */
.mcq-screen{display:none;}
.mcq-active{display:block;animation:mcqFadeUp .4s ease both;}
@keyframes mcqFadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* LANG TOGGLE */
.mcq-lang-toggle{display:inline-flex;border:1px solid var(--bdr-s);border-radius:99px;overflow:hidden;}
.mcq-lang-inline{margin-left:auto;margin-right:.5rem;}
.mcq-lang-btn{padding:5px 14px;font-size:12px;font-family:'DM Sans',sans-serif;border:none;background:transparent;color:var(--ink-s);cursor:pointer;transition:all .2s;letter-spacing:.04em;}
.mcq-lang-btn.active{background:var(--gold);color:#fff;}

/* INTRO */
.mcq-intro-wrap{text-align:center;padding:3.5rem 1.5rem;}
.mcq-eyebrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.25rem;}
.mcq-intro-title{font-family:'Cormorant Garamond',serif;font-size:clamp(34px,6vw,54px);font-weight:300;line-height:1.15;color:var(--ink);margin-bottom:1rem;}
.mcq-intro-title em{font-style:italic;color:var(--gold);}
.mcq-intro-desc{font-size:15px;color:var(--ink-m);line-height:1.75;max-width:500px;margin:0 auto 2rem;}
.mcq-intro-meta{display:flex;justify-content:center;gap:2.5rem;margin-bottom:2rem;}
.mcq-meta-item{text-align:center;}
.mcq-meta-num{font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:300;color:var(--gold);display:block;}
.mcq-meta-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-s);}
.mcq-btn-start{background:var(--gold);color:#fff;border:none;border-radius:99px;padding:13px 44px;font-family:'DM Sans',sans-serif;font-size:14px;letter-spacing:.06em;cursor:pointer;transition:background .2s,transform .15s;margin-bottom:1.5rem;display:block;margin-left:auto;margin-right:auto;}
.mcq-btn-start:hover{background:var(--gold-d);transform:translateY(-1px);}

/* QUIZ HEADER */
.mcq-quiz-header{padding:1.5rem 1.5rem .75rem;}
.mcq-progress-top{display:flex;align-items:center;margin-bottom:8px;}
.mcq-progress-label{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-s);margin-right:.5rem;}
.mcq-progress-frac{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:300;color:var(--gold);}
.mcq-progress-track{height:2px;background:var(--bdr);border-radius:2px;overflow:hidden;}
.mcq-progress-fill{height:100%;background:var(--gold);border-radius:2px;transition:width .5s cubic-bezier(.4,0,.2,1);width:10%;}

/* TWO-COLUMN QUIZ BODY */
.mcq-quiz-body{display:grid;grid-template-columns:1fr 240px;gap:1.25rem;padding:0 1.5rem;}
.mcq-quiz-main{min-width:0;}

/* QUESTION */
.mcq-question-wrap{margin-bottom:1rem;}
.mcq-q-eyebrow{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem;}
.mcq-q-text{font-family:'Cormorant Garamond',serif;font-size:clamp(20px,3.5vw,28px);font-weight:300;line-height:1.25;color:var(--ink);margin-bottom:.4rem;}
.mcq-q-sub{font-size:13px;color:var(--ink-s);margin-bottom:1.25rem;line-height:1.6;}

/* OPTIONS GRID */
.mcq-options-grid{display:grid;gap:10px;margin-bottom:1.25rem;}
.mcq-cols-2{grid-template-columns:repeat(2,1fr);}
.mcq-cols-3{grid-template-columns:repeat(3,1fr);}
.mcq-cols-4{grid-template-columns:repeat(4,1fr);}

.mcq-option{background:var(--white);border:.5px solid var(--bdr);border-radius:var(--r);overflow:hidden;cursor:pointer;transition:border-color .2s,transform .15s,box-shadow .2s;position:relative;}
.mcq-option:hover{border-color:var(--gold-l);transform:translateY(-2px);box-shadow:0 6px 18px rgba(176,125,74,.1);}
.mcq-option.selected{border:2px solid var(--gold);box-shadow:0 6px 18px rgba(176,125,74,.18);}
.mcq-option.selected::after{content:'✓';position:absolute;top:7px;right:7px;width:18px;height:18px;background:var(--gold);color:#fff;border-radius:50%;font-size:10px;display:flex;align-items:center;justify-content:center;}
.mcq-opt-img{width:100%;aspect-ratio:4/3;overflow:hidden;position:relative;background:var(--gold-pale);}
.mcq-opt-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s;display:block;}
.mcq-option:hover .mcq-opt-img img{transform:scale(1.04);}
.mcq-opt-img-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;}
.mcq-opt-img-loading::after{content:'';width:18px;height:18px;border:2px solid var(--bdr-s);border-top-color:var(--gold);border-radius:50%;animation:mcqSpin .7s linear infinite;}
@keyframes mcqSpin{to{transform:rotate(360deg)}}
.mcq-opt-body{padding:.65rem .875rem;}
.mcq-opt-title{font-size:12px;font-weight:500;color:var(--ink);margin-bottom:2px;}
.mcq-opt-desc{font-size:11px;color:var(--ink-s);line-height:1.45;}

/* NAV */
.mcq-nav-row{display:flex;justify-content:space-between;align-items:center;padding-bottom:1rem;}
.mcq-btn-back{font-size:13px;color:var(--ink-s);background:none;border:none;cursor:pointer;padding:8px 0;letter-spacing:.04em;transition:color .2s;}
.mcq-btn-back:hover{color:var(--ink);}
.mcq-btn-next{background:var(--gold);color:#fff;border:none;border-radius:99px;padding:10px 30px;font-family:'DM Sans',sans-serif;font-size:13px;letter-spacing:.06em;cursor:pointer;transition:background .2s,transform .15s,opacity .2s;}
.mcq-btn-next:hover{background:var(--gold-d);transform:translateY(-1px);}
.mcq-btn-next:disabled{opacity:.35;cursor:default;transform:none;}

/* ── RIGHT SIDEBAR ─────────────────────────────────────────────────────────── */
.mcq-quiz-sidebar{display:flex;flex-direction:column;gap:.875rem;}

.mcq-sb-block{background:var(--white);border:.5px solid var(--bdr);border-radius:var(--r);padding:1rem;}
.mcq-sb-label{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-s);margin-bottom:.75rem;}

/* Answers so far */
.mcq-sb-answer-row{display:flex;gap:.5rem;align-items:flex-start;padding:.375rem 0;border-bottom:.5px solid var(--bdr);}
.mcq-sb-answer-row:last-child{border-bottom:none;padding-bottom:0;}
.mcq-sb-q-num{font-size:11px;font-weight:500;color:var(--gold);min-width:20px;flex-shrink:0;margin-top:1px;}
.mcq-sb-q-ans{font-size:12px;color:var(--ink-m);line-height:1.4;}
.mcq-sb-q-pending{font-size:12px;color:var(--ink-f);font-style:italic;}

/* Trending — styles moved to expandable section below */



/* Tip */
.mcq-sb-tip{display:flex;gap:.625rem;align-items:flex-start;background:var(--gold-pale);}
.mcq-sb-tip-icon{font-size:16px;flex-shrink:0;margin-top:1px;}
#mcq-sb-tip-text{font-size:12px;color:var(--gold-d);line-height:1.6;}

/* BM colour swatches */
.mcq-sb-bm-row{display:flex;gap:5px;flex-wrap:wrap;margin-top:.5rem;}
.mcq-sb-bm-swatch{display:flex;flex-direction:column;align-items:center;width:32px;}
.mcq-sb-bm-dot{width:28px;height:28px;border-radius:50%;border:.5px solid rgba(0,0,0,.08);margin-bottom:3px;}
.mcq-sb-bm-code{font-size:8px;color:var(--ink-s);text-align:center;line-height:1.2;word-break:break-word;}

/* ── RESULT ─────────────────────────────────────────────────────────────────── */
.mcq-result-wrap{padding:0 1.5rem 1.5rem;}
.mcq-result-hero{border-radius:var(--r);overflow:hidden;margin-bottom:1.5rem;position:relative;height:240px;background:var(--gold-pale);}
.mcq-result-hero img{width:100%;height:100%;object-fit:cover;display:block;}
.mcq-hero-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(28,23,20,.75) 0%,transparent 55%);display:flex;flex-direction:column;justify-content:flex-end;padding:1.5rem;}
.mcq-result-badge{display:inline-block;background:var(--gold);color:#fff;font-size:10px;letter-spacing:.18em;text-transform:uppercase;padding:4px 12px;border-radius:99px;margin-bottom:.6rem;width:fit-content;}
.mcq-result-name{font-family:'Cormorant Garamond',serif;font-size:38px;font-weight:300;color:#fff;line-height:1.1;}
.mcq-result-name em{font-style:italic;}

.mcq-result-body{display:grid;grid-template-columns:1fr 300px;gap:1.25rem;margin-bottom:1.5rem;}
.mcq-desc-card,.mcq-palette-card,.mcq-suggest-card{background:var(--white);border:.5px solid var(--bdr);border-radius:var(--r);padding:1.25rem;}
.mcq-card-title{font-family:'Cormorant Garamond',serif;font-size:17px;font-weight:500;color:var(--ink);margin-bottom:.65rem;}
.mcq-card-label{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-s);margin-bottom:10px;}
.mcq-result-desc{font-size:13px;color:var(--ink-m);line-height:1.8;margin-bottom:1rem;}
.mcq-tags{display:flex;flex-wrap:wrap;gap:6px;}
.mcq-tag{background:var(--gold-pale);color:var(--gold-d);font-size:11px;padding:4px 11px;border-radius:99px;letter-spacing:.03em;}

/* BM note on result */
.mcq-bm-note{font-size:11px;color:var(--ink-s);line-height:1.5;margin-top:1rem;padding-top:.75rem;border-top:.5px solid var(--bdr);}
.mcq-bm-note strong{color:var(--gold-d);}

.mcq-palette-card{margin-bottom:1rem;}
.mcq-swatches{display:flex;gap:6px;}
.mcq-sw-wrap{flex:1;text-align:center;}
.mcq-sw{height:36px;border-radius:5px;margin-bottom:4px;border:.5px solid rgba(0,0,0,.06);}
.mcq-sw-name{font-size:9px;color:var(--ink-s);line-height:1.3;}

.mcq-suggest-item{display:flex;justify-content:space-between;align-items:flex-start;padding:7px 0;border-bottom:.5px solid var(--bdr);}
.mcq-suggest-item:last-child{border-bottom:none;padding-bottom:0;}
.mcq-suggest-room{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--gold);margin-bottom:2px;}
.mcq-suggest-mat{font-size:13px;color:var(--ink);font-weight:500;}
.mcq-suggest-price{font-size:12px;color:var(--ink-s);}
.mcq-roi-row{display:flex;justify-content:space-between;align-items:center;padding-top:10px;}
.mcq-roi-label{font-size:11px;color:var(--ink-s);text-transform:uppercase;letter-spacing:.08em;}
.mcq-roi-val{font-size:14px;font-weight:500;color:var(--gold);}

/* EMAIL */
.mcq-email-section{background:var(--white);border:.5px solid var(--bdr);border-radius:var(--r);padding:1.5rem;margin-bottom:1.25rem;}
.mcq-email-header{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.25rem;}
.mcq-email-icon{width:44px;height:44px;background:var(--gold-pale);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px;}
.mcq-email-title{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:400;color:var(--ink);margin-bottom:3px;}
.mcq-email-sub{font-size:13px;color:var(--ink-s);line-height:1.6;}
.mcq-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.mcq-form-group{display:flex;flex-direction:column;gap:4px;}
.mcq-form-group.full{grid-column:1/-1;}
.mcq-form-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-s);}
.mcq-form-input{padding:9px 12px;border:.5px solid var(--bdr-s);border-radius:var(--rs);font-family:'DM Sans',sans-serif;font-size:14px;color:var(--ink);background:var(--cream);outline:none;transition:border-color .2s;}
.mcq-form-input:focus{border-color:var(--gold);}
.mcq-form-input::placeholder{color:var(--ink-f);}
.mcq-btn-submit{grid-column:1/-1;background:var(--gold);color:#fff;border:none;border-radius:99px;padding:12px;font-family:'DM Sans',sans-serif;font-size:14px;letter-spacing:.06em;cursor:pointer;transition:background .2s;}
.mcq-btn-submit:hover{background:var(--gold-d);}
.mcq-form-privacy{grid-column:1/-1;font-size:11px;color:var(--ink-f);text-align:center;line-height:1.5;}
.mcq-form-success{text-align:center;padding:.75rem 0;display:none;}
.mcq-success-icon{font-size:28px;margin-bottom:.4rem;}
.mcq-success-title{font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--ink);margin-bottom:.2rem;}
.mcq-success-sub{font-size:13px;color:var(--ink-s);}

/* CTA */
.mcq-cta-bar{background:var(--ink);border-radius:var(--r);padding:1.5rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.25rem;}
.mcq-cta-title{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:300;color:#fff;margin-bottom:3px;}
.mcq-cta-title em{font-style:italic;color:var(--gold-l);}
.mcq-cta-sub{font-size:12px;color:rgba(255,255,255,.5);}
.mcq-btn-cta{background:var(--gold);color:#fff;border:none;border-radius:99px;padding:11px 28px;font-family:'DM Sans',sans-serif;font-size:13px;letter-spacing:.06em;cursor:pointer;white-space:nowrap;transition:background .2s;flex-shrink:0;}
.mcq-btn-cta:hover{background:var(--gold-l);}
.mcq-btn-restart{display:block;margin:.25rem auto 0;background:none;border:.5px solid var(--bdr-s);border-radius:99px;padding:8px 24px;font-family:'DM Sans',sans-serif;font-size:12px;letter-spacing:.08em;color:var(--ink-s);cursor:pointer;transition:color .2s,border-color .2s;}
.mcq-btn-restart:hover{color:var(--ink);border-color:var(--gold);}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — TABLET ≤900px
═══════════════════════════════════════════════════════════ */
@media(max-width:900px){
    .mcq-app{ max-width:100%; }
    .mcq-quiz-body{ grid-template-columns: 1fr 200px; gap:1rem; }
    .mcq-result-body{ grid-template-columns:1fr; }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE ≤700px
═══════════════════════════════════════════════════════════ */
@media(max-width:700px){

    /* ── Layout ── */
    .mcq-app{ padding:0 0 2rem; }
    .mcq-quiz-body{ grid-template-columns:1fr; }
    .mcq-quiz-sidebar{ display:none; }
    .mcq-result-body{ grid-template-columns:1fr; }
    .mcq-quiz-header{ padding:1rem 1rem .5rem; }

    /* ── Intro ── */
    .mcq-intro-wrap{ padding:2rem 1.25rem; }
    .mcq-intro-title{ font-size:clamp(28px,8vw,40px); }
    .mcq-intro-desc{ font-size:14px; }
    .mcq-intro-meta{ gap:1.5rem; }
    .mcq-meta-num{ font-size:26px; }
    .mcq-btn-start{ padding:13px 36px; font-size:14px; width:100%; max-width:280px; }

    /* ── Progress ── */
    .mcq-progress-top{ margin-bottom:6px; }
    .mcq-progress-frac{ font-size:17px; }
    .mcq-lang-inline{ display:none; } /* hide mid-quiz lang toggle — use intro one */

    /* ── Questions ── */
    .mcq-quiz-main{ padding:0 1rem; }
    .mcq-q-text{ font-size:clamp(18px,5.5vw,24px); }
    .mcq-q-sub{ font-size:13px; margin-bottom:1rem; }

    /* ── Options grid ── */
    .mcq-options-grid{ gap:8px; }
    .mcq-cols-2{ grid-template-columns:1fr 1fr; }
    .mcq-cols-3{ grid-template-columns:1fr 1fr; }
    .mcq-cols-4{ grid-template-columns:1fr 1fr; }
    .mcq-opt-img{ aspect-ratio:3/2; }
    .mcq-opt-body{ padding:.5rem .75rem; }
    .mcq-opt-title{ font-size:12px; }
    .mcq-opt-desc{ font-size:10px; line-height:1.35; }
    /* Checkmark smaller on mobile */
    .mcq-option.selected::after{ width:16px; height:16px; font-size:9px; top:5px; right:5px; }

    /* ── Nav buttons ── */
    .mcq-nav-row{ padding:1rem 0 .5rem; }
    .mcq-btn-next{ padding:10px 24px; font-size:13px; }
    .mcq-btn-back{ font-size:12px; }

    /* ── Result hero ── */
    .mcq-result-wrap{ padding:0 1rem 1rem; }
    .mcq-result-hero{ height:200px; margin-bottom:1.25rem; border-radius:10px; }
    .mcq-result-name{ font-size:clamp(22px,7vw,32px); }
    .mcq-result-tagline{ font-size:12px; }
    .mcq-hero-overlay{ padding:1rem; }
    .mcq-result-badge{ font-size:9px; padding:3px 10px; }
    .mcq-hero-lang .mcq-lang-btn{ padding:4px 11px; font-size:10px; }

    /* ── Result cards ── */
    .mcq-desc-card,
    .mcq-palette-card,
    .mcq-suggest-card{ padding:1rem; }
    .mcq-card-title{ font-size:15px; }
    .mcq-result-desc{ font-size:13px; }
    .mcq-tags{ gap:5px; }
    .mcq-tag{ font-size:10px; padding:3px 9px; }

    /* ── Palette swatches — horizontal scroll on very small screens ── */
    .mcq-swatches{ flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; gap:5px; }
    .mcq-sw-wrap{ flex:0 0 auto; min-width:44px; }
    .mcq-sw{ height:30px; border-radius:4px; }
    .mcq-sw-name{ font-size:8px; }

    /* ── Material suggestions ── */
    .mcq-suggest-item{ flex-wrap:wrap; gap:2px; }
    .mcq-suggest-mat{ font-size:12px; }
    .mcq-suggest-price{ font-size:11px; }

    /* ── Email form ── */
    .mcq-email-section{ padding:1.25rem; }
    .mcq-email-header{ flex-direction:column; gap:.75rem; }
    .mcq-email-title{ font-size:17px; }
    .mcq-email-sub{ font-size:12px; }
    .mcq-form-grid{ grid-template-columns:1fr; gap:8px; }
    .mcq-form-input{ padding:10px 12px; font-size:15px; } /* larger for iOS tap */
    .mcq-btn-submit{ padding:13px; font-size:14px; }

    /* ── CTA bar ── */
    .mcq-cta-bar{ flex-direction:column; text-align:center; gap:.75rem; padding:1.25rem; }
    .mcq-btn-cta{ width:100%; padding:13px; font-size:14px; }
    .mcq-cta-title{ font-size:17px; }

    /* ── Restart ── */
    .mcq-btn-restart{ width:100%; padding:10px; }

    /* ── BM expand ── */
    .mcq-bm-toggle{ font-size:12px; }
    .mcq-bm-row{ gap:.4rem; padding:.25rem 0; }
    .mcq-bm-colname{ font-size:11px; }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — SMALL MOBILE ≤420px
═══════════════════════════════════════════════════════════ */
@media(max-width:420px){
    .mcq-cols-2{ grid-template-columns:1fr; }   /* stack single column on tiny screens */
    .mcq-cols-3{ grid-template-columns:1fr; }
    .mcq-cols-4{ grid-template-columns:1fr 1fr; }
    .mcq-opt-img{ aspect-ratio:16/9; }
    .mcq-intro-meta{ justify-content:center; gap:1.25rem; }
    .mcq-result-hero{ height:180px; }
}

/* ── iOS input zoom fix — prevent auto-zoom on focus ── */
@media(max-width:700px){
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    select,
    textarea{
        font-size:16px !important; /* iOS won't zoom if font-size ≥ 16px */
    }
}


/* ── MULTI-SELECT BADGE ───────────────────────────────────────────────────── */
.mcq-multi-badge{font-size:10px;background:var(--gold-pale);color:var(--gold-d);padding:2px 8px;border-radius:99px;letter-spacing:.08em;margin-left:.5rem;vertical-align:middle;}
.mcq-multi .mcq-option.selected::after{content:'✓';width:20px;height:20px;font-size:11px;}

/* ── RESULT TAGLINE OVERLAY ───────────────────────────────────────────────── */
.mcq-result-tagline{font-size:13px;color:rgba(255,255,255,.75);margin-top:4px;letter-spacing:.04em;}

/* ── COLOUR FOOTNOTE (low-key) ────────────────────────────────────────────── */
.mcq-colour-footnote{font-size:10px;color:var(--ink-f);margin-top:.6rem;line-height:1.5;border-top:.5px solid var(--bdr);padding-top:.5rem;}

/* ── EXPANDABLE TRENDING CARDS — block layout, expands downward ───────────── */
.mcq-sb-trend-item{
    display:block;
    border-bottom:.5px solid var(--bdr);
    padding:.5rem 0;
}
.mcq-sb-trend-item:last-child{border-bottom:none;padding-bottom:0;}

/* Clickable header — block, full width */
.mcq-sb-trend-head{
    display:block;
    cursor:pointer;
    user-select:none;
    position:relative;
    padding-right:18px; /* space for arrow */
}
/* Title row: name + badge inline */
.mcq-sb-trend-name{
    display:inline;
    font-size:12px;
    font-weight:600;
    color:var(--ink);
    line-height:1.4;
    transition:color .2s;
}
.mcq-sb-trend-head:hover .mcq-sb-trend-name{color:var(--gold);}

.mcq-sb-trend-badge{
    display:inline-block;
    font-size:9px;
    background:var(--gold-pale);
    color:var(--gold-d);
    border-radius:3px;
    padding:1px 5px;
    white-space:nowrap;
    vertical-align:middle;
    margin-left:4px;
    line-height:1.5;
}
/* Subtitle on its own line */
.mcq-sb-trend-sub{
    display:block;
    font-size:10px;
    color:var(--ink-s);
    margin-top:2px;
    line-height:1.3;
}
/* Arrow — absolute top-right */
.mcq-sb-trend-arrow{
    position:absolute;
    top:1px;
    right:0;
    font-size:13px;
    color:var(--ink-f);
    line-height:1;
    transition:transform .25s;
}
.mcq-sb-trend-item.open .mcq-sb-trend-arrow{transform:rotate(90deg);}

/* Body — collapses/expands below the head */
.mcq-sb-trend-body{
    display:block;
    max-height:0;
    overflow:hidden;
    transition:max-height .4s ease;
}
.mcq-sb-trend-item.open .mcq-sb-trend-body{max-height:350px;}

.mcq-sb-trend-detail{
    font-size:11px;
    color:var(--ink-m);
    line-height:1.65;
    padding:.5rem 0 .4rem;
}
.mcq-sb-trend-palette{
    display:flex;
    gap:5px;
    flex-wrap:wrap;
    padding-bottom:.3rem;
}
.mcq-sb-trend-dot{
    width:20px;height:20px;
    border-radius:50%;
    border:.5px solid rgba(0,0,0,.08);
    flex-shrink:0;
    display:inline-block;
}

/* ── PALETTE BM COLOUR EXPAND (result page) ──────────────────────────────── */
.mcq-bm-expand{margin-top:.6rem;}
.mcq-bm-toggle{
    background:none;border:none;padding:0;
    font-family:'DM Sans',sans-serif;font-size:11px;
    color:var(--ink-s);cursor:pointer;letter-spacing:.05em;
    text-decoration:underline;text-underline-offset:2px;
    transition:color .2s;
}
.mcq-bm-toggle:hover{color:var(--gold);}
.mcq-bm-detail{margin-top:.5rem;padding-top:.5rem;border-top:.5px solid var(--bdr);}
.mcq-bm-row{
    display:flex;align-items:center;gap:.5rem;
    padding:.3rem 0;border-bottom:.5px solid var(--bdr);
}
.mcq-bm-row:last-child{border-bottom:none;}
.mcq-bm-dot{
    width:18px;height:18px;border-radius:50%;flex-shrink:0;
    border:.5px solid rgba(0,0,0,.08);display:inline-block;
}
.mcq-bm-code{
    font-size:10px;font-weight:600;color:var(--ink-s);
    min-width:48px;flex-shrink:0;letter-spacing:.04em;
}
.mcq-bm-colname{font-size:11px;color:var(--ink-m);line-height:1.3;}

/* ── RESULT HERO LANG TOGGLE (embedded top-right of hero image) ───────────── */
.mcq-hero-lang{
    position:absolute;
    top:1rem;
    right:1rem;
    display:inline-flex;
    border-radius:99px;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.35);
    background:rgba(0,0,0,.28);
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
}
.mcq-hero-lang .mcq-lang-btn{
    padding:5px 14px;
    font-size:11px;
    font-family:'DM Sans',sans-serif;
    border:none;
    background:transparent;
    color:rgba(255,255,255,.75);
    cursor:pointer;
    transition:all .2s;
    letter-spacing:.06em;
}
.mcq-hero-lang .mcq-lang-btn.active{
    background:rgba(255,255,255,.22);
    color:#fff;
}
.mcq-hero-lang .mcq-lang-btn:hover:not(.active){
    color:#fff;
    background:rgba(255,255,255,.1);
}