/* ══════════════════════════════════════════════════════════════
   AminoCore Research — Complete CSS v3
   Zero frameworks. Pure CSS. Mobile-first responsive.
   ══════════════════════════════════════════════════════════════ */

/* ── Custom Properties ──────────────────────────────────── */
:root {
    --color-bg: #ffffff;
    --color-text: #1a1a2e;
    --color-text-muted: #64748b;
    --color-text-light: #94a3b8;
    --color-primary: #0D2137;
    --color-primary-light: #1B8A7A;
    --color-primary-dark: #15705F;
    --color-accent: #38B8A5;
    --color-border: #e2e8f0;
    --color-surface: #f8fafc;
    --color-success: #16a34a;
    --color-success-bg: #f0fdf4;
    --color-error: #dc2626;
    --color-error-bg: #fef2f2;
    --color-warning: #d97706;
    --color-warning-bg: #fffbeb;
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-mono: 'SF Mono', Monaco, Consolas, monospace;
    --max-width: 1200px;
    --header-height: 64px;
    --radius: 6px;
    --radius-lg: 10px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.07);
    --shadow-lg: 0 10px 25px rgba(0,0,0,0.08);
    --transition: 150ms ease;
}

/* ── Reset ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { font-family: var(--font-sans); font-size: 16px; line-height: 1.6; color: var(--color-text); background: var(--color-bg); -webkit-font-smoothing: antialiased; }
img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--color-primary-light); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--color-accent); }
ul, ol { list-style: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; border: none; background: none; }

/* ── Accessibility ─────────────────────────────────────── */
.skip-link { position: absolute; top: -100%; left: 50%; transform: translateX(-50%); background: var(--color-primary); color: #fff; padding: 0.5rem 1.5rem; border-radius: 0 0 var(--radius) var(--radius); z-index: 9999; font-size: 0.85rem; font-weight: 600; }
.skip-link:focus { top: 0; color: #fff; }
:focus-visible { outline: 2px solid var(--color-primary-light); outline-offset: 2px; }

/* ── Layout ─────────────────────────────────────────────── */
.container { width: 100%; max-width: var(--max-width); margin: 0 auto; padding: 0 1.25rem; }
.section { padding: 3rem 0; }

/* ── Buttons ────────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content: center; padding: 0.625rem 1.5rem; font-size: 0.9rem; font-weight: 600; border-radius: var(--radius); transition: all var(--transition); border: 2px solid transparent; cursor: pointer; text-decoration: none; }
.btn--primary { background: var(--color-primary-light); color: #fff; border-color: var(--color-primary-light); }
.btn--primary:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff; }
.btn--outline { background: transparent; color: var(--color-primary-light); border-color: var(--color-primary-light); }
.btn--outline:hover { background: var(--color-primary-light); color: #fff; }
.btn--lg { padding: 0.8rem 2rem; font-size: 1rem; }

/* ── Header ─────────────────────────────────────────────── */
.site-header { border-bottom: 1px solid var(--color-border); background: var(--color-bg); position: sticky; top: 0; z-index: 100; }
.site-header__disclaimer { background: var(--color-primary); color: #fff; text-align: center; font-size: 0.7rem; padding: 5px 0; letter-spacing: 0.08em; text-transform: uppercase; }
.site-header__inner { max-width: var(--max-width); margin: 0 auto; padding: 0 1.25rem; display: flex; align-items: center; justify-content: space-between; height: var(--header-height); }
.site-header__logo { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.site-header__logo-icon { border-radius: 6px; }
.site-header__logo-text { font-size: 1.15rem; font-weight: 400; color: var(--color-primary); letter-spacing: -0.01em; line-height: 1.2; }
.site-header__logo-text strong { font-weight: 700; }
.site-header__logo-sub { display: block; font-size: 0.7rem; color: var(--color-primary-light); letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600; }
.site-nav__list { display: flex; gap: 1.5rem; }
.site-nav__list a { color: var(--color-text); font-size: 0.875rem; font-weight: 500; }
.site-nav__list a:hover { color: var(--color-primary-light); }
.site-header__actions { display: flex; gap: 1.25rem; align-items: center; font-size: 0.875rem; font-weight: 500; }
.site-header__actions a { color: var(--color-text); }
.site-header__cart-badge { background: var(--color-primary-light); color: #fff; font-size: 0.65rem; font-weight: 700; padding: 1px 6px; border-radius: 10px; margin-left: 4px; }

/* ── Breadcrumb ─────────────────────────────────────────── */
.breadcrumb { font-size: 0.8rem; color: var(--color-text-muted); margin-bottom: 1.5rem; padding-top: 1.5rem; }
.breadcrumb a { color: var(--color-text-muted); }
.breadcrumb a:hover { color: var(--color-primary-light); }
.breadcrumb__sep { margin: 0 0.4rem; opacity: 0.5; }

/* ── Flash Messages ─────────────────────────────────────── */
.flash { max-width: var(--max-width); margin: 1rem auto; padding: 0.75rem 1rem; border-radius: var(--radius); font-size: 0.875rem; }
.flash--error { background: var(--color-error-bg); color: var(--color-error); border: 1px solid #fecaca; }
.flash--success { background: var(--color-success-bg); color: var(--color-success); border: 1px solid #bbf7d0; }

/* ── Hero ───────────────────────────────────────────────── */
.hero { background: linear-gradient(135deg, #0D2137 0%, #0F3D35 50%, #1B8A7A 100%); color: #fff; padding: 5rem 0 4.5rem; }
.hero__content { max-width: 640px; }
.hero__title { font-size: 2.75rem; font-weight: 800; line-height: 1.15; margin-bottom: 1rem; letter-spacing: -0.02em; }
.hero__subtitle { font-size: 1.1rem; color: rgba(255,255,255,0.8); line-height: 1.6; margin-bottom: 2rem; }
.hero__actions { display: flex; gap: 1rem; flex-wrap: wrap; }
.hero__actions .btn--primary { background: #fff; color: var(--color-primary); border-color: #fff; }
.hero__actions .btn--primary:hover { background: rgba(255,255,255,0.9); }
.hero__actions .btn--outline { color: #fff; border-color: rgba(255,255,255,0.4); }
.hero__actions .btn--outline:hover { background: rgba(255,255,255,0.1); border-color: #fff; }

/* ── Trust Bar ──────────────────────────────────────────── */
.trust-bar { background: var(--color-surface); border-bottom: 1px solid var(--color-border); padding: 1.25rem 0; }
.trust-bar__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; text-align: center; }
.trust-bar__item strong { display: block; font-size: 0.85rem; color: var(--color-primary); }
.trust-bar__item span { font-size: 0.75rem; color: var(--color-text-muted); }

/* ── Section Headers ────────────────────────────────────── */
.section__header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 1.5rem; }
.section__header h2 { font-size: 1.5rem; font-weight: 700; }
.section__link { font-size: 0.875rem; color: var(--color-primary-light); font-weight: 500; }

/* ── Product Grid ───────────────────────────────────────── */
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.product-grid--4 { grid-template-columns: repeat(4, 1fr); }

/* ── Product Card ───────────────────────────────────────── */
.product-card { background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; transition: box-shadow var(--transition), transform var(--transition); }
.product-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }
.product-card__link { display: block; text-decoration: none; color: var(--color-text); }
.product-card__image { position: relative; aspect-ratio: 1; background: var(--color-surface); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.product-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 300ms ease; }
.product-card:hover .product-card__image img { transform: scale(1.03); }
.product-card__badge { position: absolute; top: 0.75rem; left: 0.75rem; background: var(--color-primary-light); color: #fff; font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; padding: 3px 8px; border-radius: 4px; }
.product-card__body { padding: 1rem; }
.product-card__category { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-text-muted); margin-bottom: 0.25rem; display: block; }
.product-card__name { font-size: 0.95rem; font-weight: 600; margin-bottom: 0.25rem; line-height: 1.3; }
.product-card__purity { font-size: 0.75rem; color: var(--color-text-muted); display: block; margin-bottom: 0.4rem; }
.product-card__price { font-size: 1rem; font-weight: 700; color: var(--color-primary); }

/* ── Category Grid ──────────────────────────────────────── */
.category-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; margin-top: 1.25rem; }
.category-card { display: block; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem; text-decoration: none; color: var(--color-text); transition: all var(--transition); }
.category-card:hover { border-color: var(--color-primary-light); box-shadow: var(--shadow-md); color: var(--color-text); }
.category-card h3 { font-size: 1rem; font-weight: 600; margin-bottom: 0.25rem; }
.category-card__count { font-size: 0.8rem; color: var(--color-text-muted); }

/* ── CTA Box ────────────────────────────────────────────── */
.cta-box { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 3rem; text-align: center; }
.cta-box h2 { font-size: 1.5rem; margin-bottom: 1rem; }
.cta-box p { max-width: 640px; margin: 0 auto 1.5rem; color: var(--color-text-muted); font-size: 0.9rem; }

/* ── Catalog Page ───────────────────────────────────────── */
.catalog__title { font-size: 1.75rem; margin-bottom: 0.5rem; }
.catalog__desc { color: var(--color-text-muted); font-size: 0.9rem; margin-bottom: 2rem; max-width: 640px; }
.catalog__layout { display: grid; grid-template-columns: 220px 1fr; gap: 2rem; }
.catalog__toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid var(--color-border); }
.catalog__count { font-size: 0.85rem; color: var(--color-text-muted); }
.catalog__sort { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; }
.catalog__sort select { padding: 0.35rem 0.6rem; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 0.8rem; background: var(--color-bg); }
.catalog__empty { text-align: center; padding: 3rem; color: var(--color-text-muted); }
.catalog .product-grid { grid-template-columns: repeat(3, 1fr); }

/* ── Sidebar ────────────────────────────────────────────── */
.sidebar__title { font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-text-muted); margin-bottom: 0.75rem; }
.sidebar__categories li { margin-bottom: 0.25rem; }
.sidebar__categories a { display: flex; justify-content: space-between; padding: 0.4rem 0.6rem; font-size: 0.85rem; color: var(--color-text); border-radius: var(--radius); transition: background var(--transition); }
.sidebar__categories a:hover { background: var(--color-surface); color: var(--color-primary-light); }
.sidebar__categories a.active { background: var(--color-primary-light); color: #fff; font-weight: 600; }
.sidebar__categories a.active .sidebar__count { color: rgba(255,255,255,0.7); }
.sidebar__count { font-size: 0.75rem; color: var(--color-text-light); }

/* ── Product Detail ─────────────────────────────────────── */
.product-detail { padding-bottom: 2rem; }
.product-detail__layout { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; margin-bottom: 3rem; }
.product-detail__image-main { aspect-ratio: 1; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; display: flex; align-items: center; justify-content: center; }
.product-detail__image-main img { width: 100%; height: 100%; object-fit: cover; }
.product-detail__name { font-size: 1.75rem; font-weight: 700; margin-bottom: 0.75rem; line-height: 1.25; }
.product-detail__short-desc { color: var(--color-text-muted); font-size: 0.9rem; margin-bottom: 1.25rem; line-height: 1.6; }

/* Price */
.product-detail__price { margin-bottom: 1.5rem; }
.price-current { font-size: 1.5rem; font-weight: 700; color: var(--color-primary); }
.price-compare { font-size: 1rem; color: var(--color-text-light); text-decoration: line-through; margin-left: 0.5rem; }

/* Variants */
.product-detail__variants { margin-bottom: 1.5rem; }
.variant-label { display: block; font-size: 0.8rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.5rem; }
.variant-options { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.variant-btn { padding: 0.5rem 1rem; border: 2px solid var(--color-border); border-radius: var(--radius); font-size: 0.85rem; font-weight: 500; background: var(--color-bg); cursor: pointer; transition: all var(--transition); }
.variant-btn:hover { border-color: var(--color-primary-light); }
.variant-btn--active { border-color: var(--color-primary-light); background: rgba(37, 99, 235, 0.05); color: var(--color-primary-light); font-weight: 600; }

/* Cart controls */
.product-detail__cart { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; }
.quantity-selector { display: flex; align-items: center; border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
.qty-btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; font-weight: 500; background: var(--color-surface); border: none; cursor: pointer; transition: background var(--transition); }
.qty-btn:hover { background: var(--color-border); }
.quantity-selector input { width: 48px; height: 40px; text-align: center; border: none; border-left: 1px solid var(--color-border); border-right: 1px solid var(--color-border); font-size: 0.9rem; -moz-appearance: textfield; }
.quantity-selector input::-webkit-inner-spin-button { -webkit-appearance: none; }
.product-detail__cart-msg { font-size: 0.85rem; padding: 0.5rem 0.75rem; border-radius: var(--radius); }
.cart-msg--success { background: var(--color-success-bg); color: var(--color-success); }
.cart-msg--error { background: var(--color-error-bg); color: var(--color-error); }

/* Specs table */
.product-detail__specs { margin-top: 1.5rem; }
.specs-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.specs-table th { text-align: left; font-weight: 600; padding: 0.5rem 1rem 0.5rem 0; color: var(--color-text-muted); width: 35%; border-bottom: 1px solid var(--color-border); vertical-align: top; }
.specs-table td { padding: 0.5rem 0; border-bottom: 1px solid var(--color-border); }
.specs-sequence { font-family: var(--font-mono); font-size: 0.8rem; word-break: break-all; }

/* Documents */
.product-detail__docs { margin-top: 1.5rem; }
.product-detail__docs h3 { font-size: 0.9rem; font-weight: 600; margin-bottom: 0.5rem; }
.doc-list li { margin-bottom: 0.3rem; }
.doc-list a { font-size: 0.85rem; color: var(--color-primary-light); }
.doc-lot { font-size: 0.75rem; color: var(--color-text-muted); }

/* Description */
.product-detail__description { max-width: 800px; border-top: 1px solid var(--color-border); padding-top: 2rem; }
.product-detail__description h2 { font-size: 1.25rem; margin-bottom: 1rem; }
.product-detail__disclaimer { margin-top: 1.5rem; font-size: 0.8rem; color: var(--color-text-muted); padding: 0.75rem; background: var(--color-warning-bg); border-radius: var(--radius); border: 1px solid #fde68a; }

/* ── Prose (for long text content) ──────────────────────── */
.prose { font-size: 0.95rem; line-height: 1.7; color: var(--color-text); }
.prose h1 { font-size: 1.75rem; margin-bottom: 1rem; }
.prose h2 { font-size: 1.3rem; margin-top: 2rem; margin-bottom: 0.75rem; }
.prose h3 { font-size: 1.1rem; margin-top: 1.5rem; margin-bottom: 0.5rem; }
.prose p { margin-bottom: 1rem; }
.prose ul, .prose ol { margin-bottom: 1rem; padding-left: 1.5rem; }
.prose li { margin-bottom: 0.4rem; list-style: disc; }

/* ── Search Page ────────────────────────────────────────── */
.search-page { padding: 2rem 0 3rem; }
.search-page__title { font-size: 1.5rem; margin-bottom: 1.5rem; }
.search-form { margin-bottom: 2rem; }
.search-form__inner { display: flex; gap: 0.75rem; max-width: 600px; }
.search-form__inner input { flex: 1; padding: 0.6rem 1rem; border: 2px solid var(--color-border); border-radius: var(--radius); font-size: 0.9rem; transition: border-color var(--transition); }
.search-form__inner input:focus { border-color: var(--color-primary-light); outline: none; }
.search-page__count { font-size: 0.85rem; color: var(--color-text-muted); margin-bottom: 1.5rem; }
.search-page__empty { text-align: center; padding: 3rem; }
.search-page__empty p { color: var(--color-text-muted); margin-bottom: 1.5rem; }

/* ── Pagination ─────────────────────────────────────────── */
.pagination { display: flex; align-items: center; justify-content: center; gap: 0.5rem; margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid var(--color-border); }
.pagination__pages { display: flex; gap: 0.25rem; }
.pagination__page, .pagination__prev, .pagination__next { padding: 0.4rem 0.75rem; font-size: 0.85rem; border: 1px solid var(--color-border); border-radius: var(--radius); color: var(--color-text); transition: all var(--transition); }
.pagination__page:hover, .pagination__prev:hover, .pagination__next:hover { border-color: var(--color-primary-light); color: var(--color-primary-light); }
.pagination__current { background: var(--color-primary-light); color: #fff; border-color: var(--color-primary-light); }
.pagination__disabled { opacity: 0.4; pointer-events: none; }
.pagination__ellipsis { padding: 0.4rem 0.3rem; color: var(--color-text-muted); }

/* ── Forms ───────────────────────────────────────────────── */
.form__group { margin-bottom: 1.25rem; }
.form__label { display: block; font-size: 0.85rem; font-weight: 600; margin-bottom: 0.35rem; }
.form__label .required { color: var(--color-error); }
.form__input { width: 100%; padding: 0.6rem 0.8rem; border: 1.5px solid var(--color-border); border-radius: var(--radius); font-size: 0.9rem; transition: border-color var(--transition); background: var(--color-bg); }
.form__input:focus { border-color: var(--color-primary-light); outline: none; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1); }
textarea.form__input { resize: vertical; min-height: 100px; }

/* ── Contact Page ───────────────────────────────────────── */
.contact-page h1 { font-size: 1.75rem; margin-bottom: 1.5rem; }
.contact-page__layout { display: grid; grid-template-columns: 1fr 320px; gap: 3rem; }
.contact-page__form > p { color: var(--color-text-muted); font-size: 0.9rem; margin-bottom: 1.5rem; }
.contact-info-box { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem; }
.contact-info-box h3 { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; }
.contact-info-box p { font-size: 0.85rem; margin-bottom: 0.75rem; color: var(--color-text); line-height: 1.5; }

/* ── FAQ Page ───────────────────────────────────────────── */
.faq-page h1 { font-size: 1.75rem; margin-bottom: 2rem; }
.faq-section { margin-bottom: 2rem; }
.faq-section h2 { font-size: 1.15rem; font-weight: 700; margin-bottom: 0.75rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--color-primary-light); display: inline-block; }
.faq-item { border: 1px solid var(--color-border); border-radius: var(--radius); margin-bottom: 0.5rem; overflow: hidden; }
.faq-item__question { padding: 0.85rem 1rem; font-weight: 600; font-size: 0.9rem; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; transition: background var(--transition); }
.faq-item__question::-webkit-details-marker { display: none; }
.faq-item__question::after { content: '+'; font-size: 1.2rem; color: var(--color-text-muted); font-weight: 300; flex-shrink: 0; margin-left: 1rem; }
.faq-item[open] .faq-item__question { background: var(--color-surface); }
.faq-item[open] .faq-item__question::after { content: '−'; }
.faq-item__answer { padding: 0 1rem 1rem; font-size: 0.875rem; color: var(--color-text-muted); line-height: 1.6; }
.faq-cta { margin-top: 2rem; padding: 1.5rem; background: var(--color-surface); border-radius: var(--radius-lg); text-align: center; font-size: 0.9rem; }

/* ── Static Pages ───────────────────────────────────────── */
.static-page { padding: 0 0 3rem; }
.static-page__content { max-width: 800px; }

/* ── Related Products ───────────────────────────────────── */
.related-section { border-top: 1px solid var(--color-border); }
.related-section h2 { font-size: 1.25rem; margin-bottom: 1.5rem; }

/* ── Error Pages ────────────────────────────────────────── */
.error-page { text-align: center; padding: 5rem 1rem; }
.error-page h1 { font-size: 2rem; margin-bottom: 1rem; }
.error-page p { color: var(--color-text-muted); margin-bottom: 2rem; }
.error-page a { display: inline-block; margin: 0 0.5rem; padding: 0.5rem 1.5rem; border: 1px solid var(--color-border); border-radius: var(--radius); color: var(--color-primary-light); transition: all var(--transition); }
.error-page a:hover { background: var(--color-primary-light); color: #fff; }

/* ── Footer ─────────────────────────────────────────────── */
.site-footer { background: var(--color-surface); border-top: 1px solid var(--color-border); margin-top: 4rem; padding: 3rem 0 1.5rem; }
.site-footer__inner { max-width: var(--max-width); margin: 0 auto; padding: 0 1.25rem; }
.site-footer__cols { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 2rem; margin-bottom: 2rem; }
.site-footer h3 { font-size: 0.8rem; font-weight: 700; margin-bottom: 0.75rem; text-transform: uppercase; letter-spacing: 0.06em; }
.site-footer p { font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.5; }
.site-footer ul li { margin-bottom: 0.35rem; }
.site-footer ul a { color: var(--color-text-muted); font-size: 0.85rem; }
.site-footer ul a:hover { color: var(--color-primary-light); }
.site-footer__disclaimer { background: var(--color-warning-bg); border: 1px solid #fde68a; border-radius: var(--radius); padding: 1rem; margin-bottom: 2rem; font-size: 0.78rem; color: var(--color-text-muted); line-height: 1.5; }
.site-footer__bottom { text-align: center; font-size: 0.78rem; color: var(--color-text-light); border-top: 1px solid var(--color-border); padding-top: 1.5rem; }

/* ── Auth Pages ──────────────────────────────────────────── */
.auth-page { padding: 3rem 0; }
.auth-box { max-width: 440px; margin: 0 auto; background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 2.5rem; }
.auth-box h1 { font-size: 1.5rem; margin-bottom: 0.25rem; }
.auth-box__subtitle { color: var(--color-text-muted); font-size: 0.9rem; margin-bottom: 1.75rem; }
.auth-box__submit { width: 100%; margin-top: 0.5rem; }
.auth-box__links { text-align: center; margin-top: 1.5rem; font-size: 0.85rem; color: var(--color-text-muted); }
.auth-box__sep { margin: 0 0.5rem; }
.auth-box__terms { font-size: 0.8rem; color: var(--color-text-muted); margin-bottom: 1rem; line-height: 1.5; }

/* ── Checkout Page ──────────────────────────────────────── */
.checkout-page h1 { font-size: 1.5rem; margin-bottom: 1.5rem; }
.checkout-page__layout { display: grid; grid-template-columns: 1fr 360px; gap: 2.5rem; }
.checkout-fieldset { border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem; margin-bottom: 1.5rem; }
.checkout-fieldset legend { font-weight: 700; font-size: 0.9rem; padding: 0 0.5rem; }
.form__row { display: flex; gap: 1rem; }
.form__half { flex: 1; }
.form__third { flex: 1; }
.form__checkbox { display: flex; gap: 0.5rem; align-items: flex-start; font-size: 0.85rem; cursor: pointer; }
.form__checkbox input[type="checkbox"] { margin-top: 3px; flex-shrink: 0; }
.checkout-diff-ship { margin-bottom: 1rem; }
.checkout-coupon { margin-bottom: 1.5rem; }
.checkout-coupon__row { display: flex; gap: 0.75rem; }
.checkout-disclaimer { margin-bottom: 1.5rem; padding: 1rem; background: var(--color-warning-bg); border: 1px solid #fde68a; border-radius: var(--radius); }
.checkout-submit-btn { width: 100%; }
.stripe-card-element { padding: 12px; border: 1.5px solid var(--color-border); border-radius: var(--radius); background: var(--color-bg); min-height: 44px; }
.stripe-card-errors { color: var(--color-error); font-size: 0.8rem; margin-top: 0.5rem; min-height: 1.2em; }

/* Checkout Summary */
.checkout-summary { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem; position: sticky; top: calc(var(--header-height) + 2rem); }
.checkout-summary h2 { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; }
.checkout-summary__items { margin-bottom: 1rem; }
.checkout-summary__item { display: flex; justify-content: space-between; align-items: flex-start; font-size: 0.85rem; margin-bottom: 0.6rem; }
.checkout-summary__item-info { flex: 1; }
.checkout-summary__item-name { display: block; font-weight: 500; }
.checkout-summary__item-variant { font-size: 0.75rem; color: var(--color-text-muted); }
.checkout-summary__item-qty { font-size: 0.75rem; color: var(--color-text-muted); }
.checkout-summary__item-price { font-weight: 500; flex-shrink: 0; margin-left: 1rem; }

/* ── Confirmation Page ──────────────────────────────────── */
.confirmation-page { padding: 2rem 0 3rem; }
.confirmation-box { text-align: center; padding: 2.5rem; border: 1px solid #bbf7d0; background: var(--color-success-bg); border-radius: var(--radius-lg); margin-bottom: 2rem; }
.confirmation-box__icon { width: 56px; height: 56px; background: var(--color-success); color: #fff; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 28px; margin-bottom: 1rem; }
.confirmation-box h1 { font-size: 1.75rem; margin-bottom: 0.5rem; }
.confirmation-box__number { font-size: 1rem; margin-bottom: 0.25rem; }
.confirmation-box__sub { font-size: 0.9rem; color: var(--color-text-muted); }
.confirmation-details { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-bottom: 2rem; }
.confirmation-details h3 { font-size: 0.9rem; margin-bottom: 0.75rem; }
.confirmation-address { font-style: normal; font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.6; }
.confirmation-items { margin-bottom: 2rem; }
.confirmation-items h3 { font-size: 1rem; margin-bottom: 1rem; }
.confirmation-actions { display: flex; gap: 1rem; justify-content: center; }

/* ── Account Page ───────────────────────────────────────── */
.account-page { padding: 2rem 0 3rem; }
.account-page__layout { display: grid; grid-template-columns: 200px 1fr; gap: 2.5rem; }
.account-nav { display: flex; flex-direction: column; gap: 0.25rem; }
.account-nav a { display: block; padding: 0.5rem 0.75rem; font-size: 0.875rem; font-weight: 500; color: var(--color-text); border-radius: var(--radius); transition: all var(--transition); }
.account-nav a:hover { background: var(--color-surface); color: var(--color-primary-light); }
.account-nav a.active { background: var(--color-primary-light); color: #fff; }
.account-nav__logout { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--color-border); }
.account-nav__logout-btn { display: block; width: 100%; text-align: left; padding: 0.5rem 0.75rem; font-size: 0.85rem; color: var(--color-text-muted); background: none; border: none; cursor: pointer; border-radius: var(--radius); }
.account-nav__logout-btn:hover { color: var(--color-error); background: var(--color-error-bg); }
.account-page__content h1 { font-size: 1.5rem; margin-bottom: 0.25rem; }
.account-stats { display: flex; gap: 2rem; margin: 1.5rem 0; }
.account-stat { padding: 1rem 1.5rem; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius); }
.account-stat__value { display: block; font-weight: 700; font-size: 1rem; }
.account-stat__label { font-size: 0.75rem; color: var(--color-text-muted); }
.account-section { margin-top: 2rem; }
.account-section h2 { font-size: 1.1rem; margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--color-border); }
.account-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
.account-table th { text-align: left; font-weight: 600; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-text-muted); padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--color-border); }
.account-table td { padding: 0.75rem; border-bottom: 1px solid var(--color-border); vertical-align: middle; }
.account-table tfoot td { border-bottom: none; padding: 0.4rem 0.75rem; font-size: 0.85rem; }

/* Status Badges */
.status-badge { display: inline-block; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; padding: 2px 8px; border-radius: 10px; }
.status-badge--pending { background: var(--color-warning-bg); color: var(--color-warning); }
.status-badge--processing { background: #dbeafe; color: #1d4ed8; }
.status-badge--shipped { background: #e0e7ff; color: #4338ca; }
.status-badge--delivered, .status-badge--paid { background: var(--color-success-bg); color: var(--color-success); }
.status-badge--cancelled, .status-badge--failed { background: var(--color-error-bg); color: var(--color-error); }
.status-badge--refunded { background: #f3e8ff; color: #7c3aed; }

/* Utility */
.text-muted { color: var(--color-text-muted); }
.text-right { text-align: right; }
.back-link { display: inline-block; font-size: 0.85rem; color: var(--color-text-muted); margin-bottom: 1rem; }
.back-link:hover { color: var(--color-primary-light); }
.order-detail-meta { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; font-size: 0.85rem; color: var(--color-text-muted); }
.order-tracking { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius); padding: 0.75rem 1rem; margin-bottom: 1rem; font-size: 0.9rem; }

/* ── Auth Pages ──────────────────────────────────────────── */
.auth-page { padding: 3rem 0; display: flex; align-items: flex-start; justify-content: center; min-height: 60vh; }
.auth-box { width: 100%; max-width: 440px; margin: 0 auto; }
.auth-box h1 { font-size: 1.5rem; margin-bottom: 0.5rem; }
.auth-box__sub { color: var(--color-text-muted); font-size: 0.9rem; margin-bottom: 1.5rem; }
.auth-btn { width: 100%; margin-top: 0.5rem; }
.auth-box__links { text-align: center; margin-top: 1.25rem; font-size: 0.85rem; color: var(--color-text-muted); }
.auth-box__sep { margin: 0 0.5rem; }
.form__hint { font-size: 0.75rem; color: var(--color-text-light); margin-top: 0.25rem; display: block; }

/* ── Checkout Page ──────────────────────────────────────── */
.checkout-page h1 { font-size: 1.5rem; margin-bottom: 1.5rem; }
.checkout-layout { display: grid; grid-template-columns: 1fr 380px; gap: 2.5rem; }
.checkout-section { border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem; margin-bottom: 1.5rem; }
.checkout-section legend { font-size: 1rem; font-weight: 700; padding: 0 0.5rem; }
.form__row { display: flex; gap: 1rem; }
.form__half { flex: 1; }
.form__third { flex: 1; }
.checkout-same-addr { margin-bottom: 1rem; font-size: 0.9rem; }
.checkout-same-addr label { display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.stripe-card-element { padding: 0.75rem; border: 1.5px solid var(--color-border); border-radius: var(--radius); background: var(--color-bg); }
.checkout-card-errors { color: var(--color-error); font-size: 0.8rem; margin-top: 0.5rem; min-height: 1.2em; }
.checkout-submit { width: 100%; margin-top: 1rem; }
.checkout-summary { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem; position: sticky; top: calc(var(--header-height) + 2rem); }
.checkout-summary h2 { font-size: 1rem; font-weight: 700; margin-bottom: 1rem; }
.checkout-summary__items { margin-bottom: 1rem; }
.checkout-summary__item { display: flex; justify-content: space-between; font-size: 0.85rem; padding: 0.35rem 0; border-bottom: 1px solid var(--color-border); }
.checkout-summary__item small { color: var(--color-text-muted); display: block; }
.checkout-summary__coupon { margin-bottom: 1rem; }
.coupon-form { display: flex; gap: 0.5rem; }
.coupon-form input { flex: 1; font-size: 0.85rem; }
.coupon-form .btn { font-size: 0.8rem; padding: 0.5rem 1rem; }
.coupon-msg { font-size: 0.8rem; margin-top: 0.5rem; padding: 0.35rem 0.5rem; border-radius: var(--radius); }
.coupon-msg--success { color: var(--color-success); background: var(--color-success-bg); }
.coupon-msg--error { color: var(--color-error); background: var(--color-error-bg); }
.checkout-summary__row { display: flex; justify-content: space-between; font-size: 0.85rem; margin-bottom: 0.4rem; }
.checkout-summary__total { font-weight: 700; font-size: 1rem; }
.checkout-summary__divider { border-top: 1px solid var(--color-border); margin: 0.75rem 0; }
.checkout-summary__disclaimer { font-size: 0.7rem; color: var(--color-text-light); text-align: center; margin-top: 1rem; }

/* ── Confirmation Page ──────────────────────────────────── */
.confirmation-page { padding: 2rem 0 3rem; }
.confirmation-box { text-align: center; padding: 2rem; margin-bottom: 2rem; }
.confirmation-box__icon { width: 56px; height: 56px; background: var(--color-success-bg); color: var(--color-success); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; font-weight: 700; margin: 0 auto 1rem; }
.confirmation-box h1 { font-size: 1.5rem; margin-bottom: 0.5rem; }
.confirmation-box__number { font-size: 1.1rem; font-weight: 700; color: var(--color-primary); margin-bottom: 0.5rem; }
.confirmation-box__msg { color: var(--color-text-muted); font-size: 0.9rem; }
.confirmation-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; margin-bottom: 1.5rem; }
.confirmation-table th { text-align: left; font-size: 0.75rem; text-transform: uppercase; color: var(--color-text-muted); padding: 0.5rem 0; border-bottom: 2px solid var(--color-border); }
.confirmation-table td { padding: 0.6rem 0; border-bottom: 1px solid var(--color-border); }
.confirmation-table td:nth-child(2) { text-align: center; }
.confirmation-table td:nth-child(3) { text-align: right; }
.confirmation-totals__row { display: flex; justify-content: space-between; font-size: 0.9rem; padding: 0.3rem 0; }
.confirmation-totals__total { font-weight: 700; font-size: 1.05rem; border-top: 2px solid var(--color-primary); padding-top: 0.5rem; margin-top: 0.25rem; }
.confirmation-addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin: 2rem 0; }
.confirmation-section h2, .confirmation-section h3 { font-size: 0.95rem; margin-bottom: 0.5rem; }
.confirmation-section p { font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.6; }
.confirmation-actions { display: flex; gap: 1rem; justify-content: center; margin-top: 2rem; }

/* ── Account Pages ──────────────────────────────────────── */
.account-page { padding: 2rem 0 3rem; }
.account-layout { display: grid; grid-template-columns: 200px 1fr; gap: 2.5rem; }
.account-sidebar { position: sticky; top: calc(var(--header-height) + 2rem); }
.account-nav { display: flex; flex-direction: column; gap: 0.25rem; }
.account-nav a, .account-nav button { display: block; padding: 0.6rem 0.75rem; font-size: 0.85rem; color: var(--color-text); border-radius: var(--radius); text-decoration: none; text-align: left; transition: background var(--transition); }
.account-nav a:hover, .account-nav button:hover { background: var(--color-surface); }
.account-nav a.active { background: var(--color-primary-light); color: #fff; font-weight: 600; }
.account-nav__logout { margin-top: 1rem; }
.account-nav__logout button { color: var(--color-text-muted); width: 100%; }
.account-main h1 { font-size: 1.5rem; margin-bottom: 0.5rem; }
.account-main__sub { color: var(--color-text-muted); font-size: 0.9rem; margin-bottom: 1.5rem; }
.account-stats { display: flex; gap: 1.5rem; margin-bottom: 2rem; }
.account-stat-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.25rem; flex: 1; }
.account-stat-card__num { display: block; font-size: 1.1rem; font-weight: 700; color: var(--color-primary); margin-bottom: 0.25rem; word-break: break-all; }
.account-stat-card__label { font-size: 0.75rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.account-table { width: 100%; border-collapse: collapse; font-size: 0.85rem; margin-bottom: 1.5rem; }
.account-table thead th { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-text-muted); padding: 0.5rem 0.5rem 0.5rem 0; text-align: left; border-bottom: 2px solid var(--color-border); }
.account-table td { padding: 0.75rem 0.5rem 0.75rem 0; border-bottom: 1px solid var(--color-border); vertical-align: middle; }
.account-table a { font-size: 0.8rem; }
.account-link { font-size: 0.85rem; color: var(--color-primary-light); }
.account-empty { color: var(--color-text-muted); font-size: 0.9rem; }
.account-back { font-size: 0.85rem; color: var(--color-text-muted); display: inline-block; margin-bottom: 1rem; }
.status-badge { display: inline-block; font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; padding: 3px 8px; border-radius: 4px; }
.status-badge--pending { background: var(--color-warning-bg); color: var(--color-warning); }
.status-badge--processing { background: #f0fdfa; color: #1B8A7A; }
.status-badge--shipped { background: #ecfdf5; color: #059669; }
.status-badge--delivered { background: var(--color-success-bg); color: var(--color-success); }
.status-badge--cancelled, .status-badge--refunded { background: var(--color-error-bg); color: var(--color-error); }
.order-meta { display: flex; gap: 1rem; align-items: center; color: var(--color-text-muted); font-size: 0.85rem; margin-bottom: 1.5rem; }
.order-totals-detail { max-width: 300px; margin-left: auto; }
.order-totals-detail > div { display: flex; justify-content: space-between; font-size: 0.9rem; padding: 0.3rem 0; }
.order-totals-detail__total { font-weight: 700; font-size: 1.05rem; border-top: 2px solid var(--color-primary); padding-top: 0.5rem; margin-top: 0.25rem; }
.order-addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: 2rem; }
.order-address-block h3 { font-size: 0.85rem; font-weight: 700; margin-bottom: 0.4rem; }
.order-address-block p { font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.6; }
.settings-section { margin-bottom: 2.5rem; padding-bottom: 2rem; border-bottom: 1px solid var(--color-border); }
.settings-section h2 { font-size: 1.1rem; margin-bottom: 1rem; }

/* ── Cart Page ───────────────────────────────────────────── */
.cart-page h1 { font-size: 1.5rem; margin-bottom: 1.5rem; }
.cart-page__empty { text-align: center; padding: 3rem; }
.cart-page__empty p { color: var(--color-text-muted); margin-bottom: 1.5rem; font-size: 1rem; }
.cart-page__layout { display: grid; grid-template-columns: 1fr 340px; gap: 2.5rem; }
.cart-table { width: 100%; border-collapse: collapse; }
.cart-table thead th { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--color-text-muted); padding: 0 0 0.75rem; text-align: left; border-bottom: 1px solid var(--color-border); }
.cart-table tbody td { padding: 1rem 0.5rem 1rem 0; border-bottom: 1px solid var(--color-border); vertical-align: middle; font-size: 0.9rem; }
.cart-item { display: flex; gap: 0.75rem; align-items: center; }
.cart-item__img { width: 64px; height: 64px; border-radius: var(--radius); object-fit: cover; border: 1px solid var(--color-border); flex-shrink: 0; }
.cart-item__name { font-weight: 600; font-size: 0.9rem; color: var(--color-text); display: block; }
.cart-item__variant { font-size: 0.8rem; color: var(--color-text-muted); }
.cart-qty-form select { padding: 0.3rem 0.5rem; border: 1px solid var(--color-border); border-radius: var(--radius); font-size: 0.85rem; }
.cart-remove-btn { font-size: 1.3rem; color: var(--color-text-light); background: none; border: none; cursor: pointer; padding: 0.25rem 0.5rem; border-radius: var(--radius); transition: all var(--transition); }
.cart-remove-btn:hover { color: var(--color-error); background: var(--color-error-bg); }

/* Cart Summary */
.cart-summary { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem; position: sticky; top: calc(var(--header-height) + 2rem); }
.cart-summary h2 { font-size: 1rem; font-weight: 700; margin-bottom: 1.25rem; }
.cart-summary__row { display: flex; justify-content: space-between; font-size: 0.9rem; margin-bottom: 0.5rem; }
.cart-summary__total { font-weight: 700; font-size: 1.05rem; }
.cart-summary__divider { border-top: 1px solid var(--color-border); margin: 0.75rem 0; }
.cart-summary__shipping-note { font-size: 0.8rem; color: var(--color-warning); background: var(--color-warning-bg); padding: 0.4rem 0.6rem; border-radius: var(--radius); margin: 0.5rem 0; }
.cart-summary__checkout { width: 100%; margin-top: 1.25rem; }
.cart-summary__continue { display: block; text-align: center; margin-top: 0.75rem; font-size: 0.85rem; color: var(--color-text-muted); }

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
    .product-grid { grid-template-columns: repeat(3, 1fr); }
    .catalog .product-grid { grid-template-columns: repeat(2, 1fr); }
    .product-detail__layout { gap: 2rem; }
}

@media (max-width: 768px) {
    .hero { padding: 3rem 0 2.5rem; }
    .hero__title { font-size: 2rem; }
    .hero__subtitle { font-size: 0.95rem; }

    .trust-bar__grid { grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }

    .product-grid, .product-grid--4 { grid-template-columns: repeat(2, 1fr); gap: 1rem; }

    .catalog__layout { grid-template-columns: 1fr; }
    .catalog__sidebar { display: none; }
    .catalog .product-grid { grid-template-columns: repeat(2, 1fr); }

    .product-detail__layout { grid-template-columns: 1fr; gap: 1.5rem; }

    .contact-page__layout { grid-template-columns: 1fr; gap: 2rem; }

    .cart-page__layout { grid-template-columns: 1fr; }
    .cart-table__price, .cart-table__total { display: none; }

    .checkout-page__layout, .checkout-layout { grid-template-columns: 1fr; }
    .form__row { flex-direction: column; gap: 0; }
    .confirmation-details, .confirmation-addresses { grid-template-columns: 1fr; }

    .account-page__layout, .account-layout { grid-template-columns: 1fr; }
    .account-sidebar { position: static; }
    .account-nav { flex-direction: row; flex-wrap: wrap; gap: 0.5rem; }
    .account-nav__logout { margin-top: 0; padding-top: 0; border-top: none; }
    .account-stats { flex-direction: column; }
    .order-addresses { grid-template-columns: 1fr; }

    .site-footer__cols { grid-template-columns: 1fr; gap: 1.5rem; }

    .section__header { flex-direction: column; gap: 0.5rem; }
}

@media (max-width: 480px) {
    .hero__title { font-size: 1.65rem; }
    .hero__actions { flex-direction: column; }
    .hero__actions .btn { width: 100%; }

    .trust-bar__grid { grid-template-columns: 1fr 1fr; }
    .trust-bar__item { padding: 0.3rem 0; }

    .product-grid { grid-template-columns: 1fr 1fr; gap: 0.75rem; }
    .product-card__body { padding: 0.75rem; }
    .product-card__name { font-size: 0.85rem; }

    .product-detail__cart { flex-direction: column; align-items: stretch; }
    .product-detail__cart .btn { width: 100%; }

    .variant-options { flex-direction: column; }
    .variant-btn { width: 100%; text-align: center; }

    .site-nav__list { gap: 1rem; }
    .site-header__inner { gap: 0.5rem; }
}

/* ── Research Content Sections ──────────────────────────── */
.research-toc { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 1.5rem 2rem; margin: 3rem 0 2rem; }
.research-toc__title { font-size: 1.25rem; font-weight: 700; margin-bottom: 1rem; color: var(--color-primary); }
.research-toc__list { display: flex; flex-direction: column; gap: 0.4rem; }
.research-toc__list li { font-size: 0.9rem; }
.research-toc__list a { color: var(--color-primary-light); font-weight: 500; }
.research-toc__list a:hover { color: var(--color-accent); }
.research-toc__list ul { margin-left: 1.25rem; margin-top: 0.3rem; }
.research-toc__list ul li { font-size: 0.85rem; }
.research-toc__list ul li a { font-weight: 400; }

.research-section { margin: 2.5rem 0; padding-top: 1rem; }
.research-section h2 { font-size: 1.5rem; font-weight: 700; color: var(--color-primary); margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--color-primary-light); }
.research-section h3 { font-size: 1.15rem; font-weight: 600; color: var(--color-text); margin: 1.5rem 0 0.75rem; }
.research-section .prose { font-size: 0.95rem; line-height: 1.75; color: var(--color-text); }
.research-section .prose p { margin-bottom: 1rem; }
.research-section .prose strong { color: var(--color-primary); }

.research-study { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--color-border); }
.research-study:last-child { border-bottom: none; }

.research-refs { margin-top: 1rem; padding: 1rem; background: var(--color-surface); border-radius: var(--radius); border-left: 3px solid var(--color-primary-light); }
.research-ref { font-size: 0.8rem; color: var(--color-text-muted); line-height: 1.5; margin-bottom: 0.4rem; }
.research-ref:last-child { margin-bottom: 0; }
.ref-num { font-weight: 700; color: var(--color-primary-light); margin-right: 0.3rem; }
.research-ref a { color: var(--color-primary-light); font-weight: 500; font-size: 0.75rem; margin-left: 0.3rem; }

.research-table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: 0.9rem; }
.research-table th, .research-table td { padding: 0.6rem 1rem; text-align: left; border-bottom: 1px solid var(--color-border); }
.research-table th { font-weight: 600; color: var(--color-text-muted); width: 40%; background: var(--color-surface); }
.research-table td { color: var(--color-text); }
.research-table tr:last-child th, .research-table tr:last-child td { border-bottom: none; }

.research-disclaimer { background: var(--color-warning-bg); border: 1px solid #fde68a; border-radius: var(--radius); padding: 1.25rem 1.5rem; margin: 2rem 0; font-size: 0.85rem; color: var(--color-text-muted); line-height: 1.6; }

/* ── FAQ Section ────────────────────────────────────────── */
.faq-list { display: flex; flex-direction: column; gap: 0.5rem; }
.faq-item { border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
.faq-question { font-size: 0.95rem; font-weight: 600; padding: 1rem 1.25rem; cursor: pointer; color: var(--color-text); transition: background var(--transition), color var(--transition); list-style: none; display: flex; justify-content: space-between; align-items: center; }
.faq-question::-webkit-details-marker { display: none; }
.faq-question::after { content: '+'; font-size: 1.2rem; font-weight: 300; color: var(--color-primary-light); transition: transform 200ms ease; }
.faq-item[open] .faq-question::after { content: '−'; }
.faq-item[open] .faq-question { background: var(--color-surface); color: var(--color-primary); }
.faq-answer { padding: 0 1.25rem 1rem; font-size: 0.9rem; line-height: 1.7; color: var(--color-text-muted); }

/* ── Trust Badges (Product Page) ───────────────────────── */
.product-trust-badges { display: flex; justify-content: center; gap: 1.5rem; margin-top: 1rem; padding: 0.75rem; background: var(--color-surface); border-radius: var(--radius); border: 1px solid var(--color-border); }
.trust-badge-item { text-align: center; }
.trust-badge-item strong { display: block; font-size: 0.9rem; color: var(--color-primary-light); }
.trust-badge-item span { font-size: 0.7rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }

/* ── Mobile Research ───────────────────────────────────── */
@media (max-width: 768px) {
    .research-toc { padding: 1rem 1.25rem; }
    .research-section h2 { font-size: 1.25rem; }
    .research-table th { width: 35%; }
    .product-trust-badges { gap: 0.75rem; }
}

.product-structure img { max-width: 100%; height: auto; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }

/* Research header: TOC + Structure side by side */
.research-header--with-structure { display: flex; gap: 2rem; align-items: flex-start; margin: 3rem 0 2rem; }
.research-header--with-structure .research-toc { flex: 1; margin: 0; }
.research-header--with-structure .product-structure { flex: 1; margin: 0; }
.product-structure img { max-width: 100%; height: auto; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
@media (max-width: 768px) {
    .research-header--with-structure { flex-direction: column; }
}

/* Research header: TOC + Structure side by side */
.research-header--with-structure { display: flex; gap: 2rem; align-items: flex-start; margin: 3rem 0 2rem; }
.research-header--with-structure .research-toc { flex: 1; margin: 0; }
.research-header--with-structure .product-structure { flex: 1; margin: 0; }
.product-structure img { max-width: 100%; height: auto; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
@media (max-width: 768px) {
    .research-header--with-structure { flex-direction: column; }
}

/* Research header: TOC + Structure side by side */
.research-header { margin: 3rem 0 2rem; }
.research-header--with-structure { display: flex; gap: 2rem; align-items: flex-start; }
.research-header--with-structure .research-toc { flex: 0 0 45%; margin: 0; }
.research-header--with-structure .product-structure { flex: 0 0 52%; margin: 0; }
.product-structure img { max-width: 100%; height: auto; border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
@media (max-width: 768px) { .research-header--with-structure { flex-direction: column; } .research-header--with-structure .research-toc, .research-header--with-structure .product-structure { flex: 1 1 100%; } }
