/* TARING NAGA — Eye-friendly readability overrides
   Di-load setelah inline <style> di setiap halaman, jadi rules di sini
   menang via source-order cascade (specificity sama).

   Fokus:
   - Body weight 300 → 400 (Inter terlalu tipis di maroon gelap)
   - Min font-size 15px untuk body, 16px untuk form input (anti iOS zoom)
   - Naikkan opacity teks tertiary supaya tetap >=4.5:1 contrast
   - Brighten gold untuk teks (--gold default ~4.4:1 di maroon, borderline)
   - Letter-spacing uppercase max 0.15em (lebih ramah disleksia)
   - :focus-visible ring tebal & visible
   - prefers-reduced-motion: disable animations
   - prefers-contrast: more / forced-colors: tambah kontras lagi */

:root {
  /* Gold yang lebih terang khusus untuk teks kecil di maroon */
  --gold-text: #d8bb78;
  --cotton-mute: rgba(245, 239, 230, 0.88);
}

/* === Base body — solid weight, smooth render === */
body {
  font-weight: 400 !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Strong/bold tetap distinguishable */
b, strong { font-weight: 600; }

/* Italic serif tetap terbaca — Cormorant 300 terlalu kurus juga */
em, i { font-weight: 400; }

/* === Paragraph & list body text — naikkan baseline === */
p, li, dd, dt, blockquote, label, .product-desc, .process-desc,
.footer-tagline, .footer-col a, .hero-desc, .export-ship-note,
.collab-desc {
  font-weight: 400;
}

/* Tertiary text yang pakai opacity rendah — bump ke 0.88 */
.hero-desc, .process-desc, .collab-desc, .export-ship-note,
.footer-tagline, .footer-col a {
  opacity: 0.92;
}

/* === Min font-size enforcement === */
.product-desc, .process-desc, .footer-tagline, .footer-col a,
.fallen-byline, .flavor, .form-row label, .section-label {
  font-size: max(13px, 1em);
}

.product-desc { font-size: 15px; line-height: 1.7; }
.process-desc { font-size: 15px; line-height: 1.75; }
.hero-desc { font-size: clamp(15px, 1.5vw, 17px); line-height: 1.75; }

/* === Form inputs — 16px minimum (anti iOS zoom on focus) === */
input, select, textarea, button {
  font-size: max(16px, 1rem);
  font-family: inherit;
}

.form-row input, .form-row select, .form-row textarea,
.collab-signup input {
  font-size: 16px !important;
  font-weight: 400;
}

/* Border input lebih tebal & lebih terang supaya jelas */
.form-row input, .form-row select, .form-row textarea {
  border-bottom-width: 1.5px;
  border-bottom-color: rgba(245, 239, 230, 0.45);
}

.form-row input::placeholder,
.form-row textarea::placeholder,
.collab-signup input::placeholder {
  color: rgba(245, 239, 230, 0.55);
  opacity: 1;
}

/* === Gold untuk teks — pakai gold-text yang lebih terang === */
.section-label,
.section-label::before,
.section-label::after,
.fallen-byline,
.scroll-cue,
.hero-meta,
.form-row label,
.export-info h3,
.export-info li span,
.product-num,
.product-meta {
  color: var(--gold-text);
}

.section-label::before,
.section-label::after,
.scroll-cue::after {
  background: var(--gold-text);
}

/* Nav CTA & cart icon — boost contrast border + text */
.tn-nav-cta,
.tn-cart-icon,
.tn-login-icon {
  color: var(--gold-text) !important;
  border-color: var(--gold-text) !important;
}
.tn-nav-cta:hover,
.tn-cart-icon:hover,
.tn-login-icon:hover {
  background: var(--gold-text) !important;
  color: var(--maroon-deep, #3d0810) !important;
}

.tn-nav-links a:hover,
.tn-nav-links a.active { color: var(--gold-text); }
.tn-nav-links a {
  opacity: 0.85;
  font-weight: 500;
}
.tn-nav-links a::after { background: var(--gold-text); }

/* Nav versi light (background terang) — pakai maroon yang sudah cukup kontras */
.tn-nav.light .tn-nav-cta,
.tn-nav.light .tn-cart-icon,
.tn-nav.light .tn-login-icon {
  color: var(--maroon, #5a0f1a) !important;
  border-color: var(--maroon, #5a0f1a) !important;
  background: transparent !important;
}
.tn-nav.light .tn-nav-cta:hover,
.tn-nav.light .tn-cart-icon:hover,
.tn-nav.light .tn-login-icon:hover {
  background: var(--maroon, #5a0f1a) !important;
  color: var(--cotton, #f5efe6) !important;
  border-color: var(--maroon, #5a0f1a) !important;
}
.tn-nav.light .tn-nav-links a:hover,
.tn-nav.light .tn-nav-links a.active { color: var(--maroon, #5a0f1a) !important; }
.tn-nav.light .tn-nav-links a::after { background: var(--maroon, #5a0f1a) !important; }
.tn-nav.light .tn-nav-links a { color: var(--black, #0a0606); opacity: 0.85; }

/* === Letter-spacing softening — uppercase mono labels === */
.section-label,
.fallen-byline,
.hero-meta,
.scroll-cue,
.form-row label,
.export-info h3,
.export-info li span,
.product-meta,
.flavor,
.tn-nav-links,
.tn-nav-cta,
.collab-status,
.collab-signup button,
.form-submit {
  letter-spacing: 0.12em;
}

/* === Gold-soft yang dipakai untuk teks tagline — naikkan saturasi === */
.hero-tagline,
.fallen-desc {
  color: var(--gold-text);
  opacity: 0.95;
}

/* === Headline display — pastikan weight cukup (Cormorant kurus default) === */
.section-title,
.product-name,
.fallen-title,
.collab-title,
.export-title,
.process-name,
.process-num,
.hero-word {
  font-weight: 400;
}

/* === Link underline yang tetap visible — pakai underline-offset === */
a:not(.tn-nav-links a):not(.tn-nav-cta):not(.tn-logo):not(.tn-cart-icon):not(.tn-login-icon):not(.product-item) {
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
}

/* === Focus visible — ring tebal, kontras tinggi, tidak menggeser layout === */
*:focus { outline: none; }
*:focus-visible {
  outline: 3px solid var(--gold-text, #d8bb78);
  outline-offset: 3px;
  border-radius: 2px;
}
/* Form input — focus pakai underline gold tebal */
.form-row input:focus-visible,
.form-row select:focus-visible,
.form-row textarea:focus-visible,
.collab-signup input:focus-visible {
  outline: none;
  border-bottom-color: var(--gold-text);
  border-bottom-width: 2px;
}

/* === Selection — keep brand colors but ensure contrast === */
::selection { background: var(--gold-text, #d8bb78); color: #2a050b; }

/* === prefers-reduced-motion: disable transitions/animations === */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  html { scroll-behavior: auto !important; scroll-snap-type: none !important; }
  .hero-word-inner { transform: translateY(0) !important; }
  .hero-meta, .hero-tagline, .hero-bottom { opacity: 1 !important; }
}

/* === prefers-contrast: more — pump up contrast everywhere === */
@media (prefers-contrast: more) {
  :root {
    --gold-text: #ffd97a;
    --cotton-mute: rgba(245, 239, 230, 1);
  }
  body { color: #fff8ed; }
  .hero-desc, .process-desc, .collab-desc, .export-ship-note,
  .footer-tagline, .footer-col a, .product-desc {
    opacity: 1 !important;
  }
  .hero-tagline, .fallen-desc { color: #ffd97a; opacity: 1 !important; }
  .form-row input, .form-row select, .form-row textarea {
    border-bottom-color: rgba(245, 239, 230, 0.85);
  }
  .tn-nav-links a { opacity: 1; }
}

/* === forced-colors (Windows High Contrast Mode) === */
@media (forced-colors: active) {
  .tn-nav-cta, .form-submit, .tn-cart-icon, .tn-login-icon {
    border: 1px solid CanvasText;
    color: CanvasText;
    background: Canvas;
  }
  *:focus-visible { outline: 3px solid Highlight; }
}

/* === Article / blog reading body — extra comfortable === */
.article-body p,
.blog-content p,
article p {
  font-size: clamp(16px, 1.2vw, 18px);
  line-height: 1.8;
  font-weight: 400;
}
.article-body, .blog-content, article {
  max-width: 70ch;
}

/* === Tombol minimum tap target 44x44 === */
button, .tn-nav-cta, .form-submit, a.button {
  min-height: 44px;
}

/* === Disable text-shadow on small text supaya tidak blur === */
.product-meta, .fallen-byline, .form-row label, .flavor,
.scroll-cue, .hero-meta, .product-num, .footer-col li {
  text-shadow: none;
}