/*
Theme Name: Lien Dai Nong San
Theme URI: https://liendaivietnam.com
Author: Cong ty TNHH Thuong mai Xuat nhap khau Lien Dai
Author URI: https://liendaivietnam.com
Description: Theme WordPress mot trang (one-page) cho cong ty nong san / ngu coc Lien Dai - bot mi, bot bap, duong, tinh bot va dich vu phoi tron theo yeu cau. Ho tro 3 ngon ngu (Tieng Viet, English, Trung van), responsive dien thoai/tablet, nut WhatsApp va nhac nen tuy chon.
Version: 1.4.1
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lien-dai-nong-san
*/

    * { box-sizing: border-box; }
    body { margin: 0; }
    .ld-root {
      --gold: #C08A2E;
      --green: #5F7A4E;
      --ink: #3B2A1A;
      font-family: "Work Sans", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
      background: #F7F2E9;
      color: #2B2013;
      line-height: 1.5;
      -webkit-font-smoothing: antialiased;
    }
    .ld-root h1, .ld-root h2, .ld-root h3 {
      font-family: "Lora", "Noto Sans SC", Georgia, "Times New Roman", serif;
      margin: 0;
      color: #2B2013;
      text-wrap: pretty;
    }
    .ld-root a { color: var(--gold); text-decoration: none; }
    .ld-root a:hover { color: var(--ink); }
    .ld-container {
      max-width: 1180px;
      margin: 0 auto;
      padding: 0 32px;
    }
    .ld-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: var(--gold);
    }
    .ld-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 14px 26px;
      border-radius: 4px;
      font-weight: 600;
      font-size: 15px;
      cursor: pointer;
      border: 1.5px solid transparent;
      white-space: nowrap;
    }
    .ld-btn-primary { background: var(--ink); color: #F7F2E9; }
    .ld-btn-primary:hover { background: #241a10; color: #F7F2E9; }
    .ld-btn-outline { background: transparent; color: var(--ink); border-color: #C9BBA0; }
    .ld-btn-outline:hover { border-color: var(--ink); color: var(--ink); }
    .ld-btn-on-dark { background: var(--gold); color: #241a10; }
    .ld-btn-on-dark:hover { background: #d6ac55; }

    /* ---------- header ---------- */
    .ld-header {
      background: #F7F2E9;
      border-bottom: 1px solid #E4D8BE;
      position: relative;
    }
    .ld-header-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 18px 0;
      gap: 24px;
    }
    .ld-logo { display: flex; align-items: center; gap: 12px; }
    .ld-logo-mark {
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .ld-logo-mark img { display: block; height: 40px; width: auto; }
    .ld-logo-text h1 { font-size: 21px; font-weight: 700; letter-spacing: 0.02em; }
    .ld-logo-text span {
      display: block; font-size: 10.5px; font-weight: 600; letter-spacing: 0.16em;
      text-transform: uppercase; color: #8A7A5E; margin-top: 2px;
    }
    .ld-nav { display: flex; align-items: center; gap: 34px; }
    .ld-nav a { font-size: 14.5px; font-weight: 500; color: #4A3D28; }
    .ld-nav a:hover { color: var(--ink); }
    .ld-header-actions { display: flex; align-items: center; gap: 18px; }
    .ld-phone { font-size: 13.5px; color: #6B5D4B; }
    .ld-phone strong { color: #2B2013; }
    .ld-lang-toggle {
      display: flex; align-items: center;
      border: 1px solid #C9BBA0; border-radius: 20px; overflow: hidden;
    }
    .ld-lang-toggle button {
      border: none; background: transparent; padding: 6px 13px;
      font-size: 12.5px; cursor: pointer; font-family: "Work Sans", "Noto Sans SC", sans-serif;
    }
    .ld-lang-divider { width: 1px; align-self: stretch; background: #C9BBA0; }

    /* ---------- hero ---------- */
    .ld-hero {
      position: relative;
      overflow: hidden;
      background: linear-gradient(180deg, #FBF7EE 0%, #F1E7D0 100%);
      border-bottom: 1px solid #E4D8BE;
    }
    .ld-hero-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
      gap: 48px;
      align-items: center;
      padding: 88px 0 80px;
      position: relative;
      z-index: 1;
    }
    .ld-hero h2 {
      font-size: 44px;
      font-weight: 600;
      line-height: 1.16;
      margin: 18px 0 22px;
    }
    .ld-hero-sub { font-size: 17px; color: #55452F; max-width: 520px; margin: 0 0 34px; }
    .ld-hero-ctas { display: flex; gap: 14px; flex-wrap: wrap; }
    .ld-hero-art { position: relative; }

    /* ---------- stats ---------- */
    .ld-stats { background: var(--ink); }
    .ld-stats-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 8px;
      padding: 36px 0;
    }
    .ld-stat { text-align: center; padding: 8px 12px; border-left: 1px solid rgba(247,242,233,0.14); }
    .ld-stat:first-child { border-left: none; }
    .ld-stat-num { font-family: "Lora", Georgia, serif; font-size: 27px; font-weight: 600; color: #F7F2E9; }
    .ld-stat-label { font-size: 12.5px; color: #C9BBA0; margin-top: 4px; }

    /* ---------- section heading ---------- */
    .ld-section { padding: 88px 0; }
    .ld-section-alt { background: #EFE6D3; }
    .ld-section-head { max-width: 620px; margin: 0 0 48px; }
    .ld-section-head h2 { font-size: 32px; font-weight: 600; margin-top: 12px; }
    .ld-section-head p { font-size: 16px; color: #6B5D4B; margin-top: 14px; }

    /* ---------- products ---------- */
    .ld-products-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 22px;
    }
    .ld-product-card {
      background: #FBF7EE;
      border: 1px solid #E4D8BE;
      border-radius: 8px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
    }
    .ld-product-art {
      height: 132px;
      display: flex; align-items: center; justify-content: center;
      position: relative;
    }
    .ld-product-body {
      padding: 22px 24px 26px;
      display: flex;
      flex-direction: column;
      gap: 14px;
      flex-grow: 1;
    }
    .ld-product-card h3 { font-size: 19px; font-weight: 600; }
    .ld-product-card p { font-size: 14.5px; color: #6B5D4B; margin: 0; flex-grow: 1; }
    .ld-product-link { font-size: 14px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }

    /* ---------- gallery / slider ---------- */
    .ld-slider {
      position: relative;
      border-radius: 10px;
      overflow: hidden;
      background: #E4D8BE;
      aspect-ratio: 21 / 8;
    }
    .ld-slider-track {
      display: flex;
      height: 100%;
      transition: transform 0.55s cubic-bezier(0.65, 0, 0.35, 1);
    }
    .ld-slide {
      flex: 0 0 100%;
      height: 100%;
      position: relative;
    }
    .ld-slide img {
      width: 100%; height: 100%;
      object-fit: cover;
      display: block;
    }
    .ld-slide-placeholder {
      width: 100%; height: 100%;
      display: none;
      flex-direction: column;
      align-items: center; justify-content: center;
      gap: 10px;
      background:
        radial-gradient(circle at 30% 20%, rgba(198,150,90,0.35) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(95,122,78,0.22) 0%, transparent 55%),
        linear-gradient(165deg, #cdbb98 0%, #7a6a52 100%);
      color: #F7F2E9;
    }
    .ld-slide-placeholder span { font-size: 12.5px; letter-spacing: 0.04em; opacity: 0.85; }
    .ld-slider-nav {
      position: absolute; top: 50%; transform: translateY(-50%);
      width: 40px; height: 40px; border-radius: 50%;
      background: rgba(43,32,19,0.55);
      color: #F7F2E9;
      border: none; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      z-index: 2;
    }
    .ld-slider-nav:hover { background: rgba(43,32,19,0.8); }
    .ld-slider-prev { left: 16px; }
    .ld-slider-next { right: 16px; }
    .ld-slider-dots {
      position: absolute; left: 0; right: 0; bottom: 16px;
      display: flex; align-items: center; justify-content: center; gap: 8px;
      z-index: 2;
    }
    .ld-slider-dots button {
      width: 8px; height: 8px; border-radius: 50%;
      border: none; padding: 0; cursor: pointer;
      background: rgba(247,242,233,0.55);
    }
    .ld-slider-dots button.is-active { background: #F7F2E9; width: 20px; border-radius: 4px; }

    /* ---------- blending ---------- */
    .ld-blend { background: var(--ink); color: #F7F2E9; position: relative; overflow: hidden; }
    .ld-blend-inner { position: relative; z-index: 1; }
    .ld-blend .ld-section-head h2 { color: #F7F2E9; }
    .ld-blend .ld-section-head p { color: #C9BBA0; }
    .ld-blend .ld-eyebrow { color: var(--gold); }
    .ld-steps {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 22px;
      margin-top: 8px;
    }
    .ld-step {
      background: rgba(247,242,233,0.06);
      border: 1px solid rgba(247,242,233,0.14);
      border-radius: 6px;
      padding: 26px 22px;
    }
    .ld-step-num {
      font-family: "Lora", Georgia, serif;
      font-size: 15px;
      font-weight: 700;
      color: #241a10;
      background: var(--gold);
      width: 30px; height: 30px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 16px;
    }
    .ld-step h3 { font-size: 16.5px; font-weight: 600; color: #F7F2E9; margin-bottom: 8px; }
    .ld-step p { font-size: 13.5px; color: #C9BBA0; margin: 0; }
    .ld-blend-cta { margin-top: 44px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }

    /* ---------- why choose ---------- */
    .ld-features-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 22px;
    }
    .ld-feature-icon {
      width: 48px; height: 48px; border-radius: 10px;
      background: #F1E7D0;
      display: flex; align-items: center; justify-content: center;
      color: var(--green);
      margin-bottom: 18px;
    }
    .ld-feature h3 { font-size: 17px; font-weight: 600; margin-bottom: 8px; }
    .ld-feature p { font-size: 14px; color: #6B5D4B; margin: 0; }

    /* ---------- CTA banner (warm blurred-field tone, matches liendaivietnam.com) ---------- */
    .ld-cta-band {
      position: relative;
      overflow: hidden;
      padding: 76px 0;
      background:
        radial-gradient(circle at 15% 25%, rgba(198,150,90,0.55) 0%, transparent 42%),
        radial-gradient(circle at 85% 75%, rgba(120,84,48,0.6) 0%, transparent 48%),
        linear-gradient(135deg, #6b4c30 0%, #3b2a1a 100%);
    }
    .ld-cta-band-inner { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
    .ld-cta-band h2 { font-size: 28px; font-weight: 700; color: #F7EFD9; max-width: 560px; }
    .ld-cta-band p { font-size: 15px; color: #D9C7A4; margin: 10px 0 0; max-width: 520px; }
    .ld-cta-band .ld-btn-primary { background: var(--gold); color: #2B2013; }
    .ld-cta-band .ld-btn-primary:hover { background: #d6ac55; }
    .ld-cta-badge {
      position: absolute; right: 64px; top: 50%; transform: translateY(-50%);
      width: 76px; height: 76px; border-radius: 50%;
      border: 1.5px solid rgba(247,239,217,0.35);
      display: flex; align-items: center; justify-content: center;
    }
    .ld-cta-badge span { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }

    /* ---------- people / team (full-bleed card, matches liendaivietnam.com team cards) ---------- */
    .ld-eyebrow-pill {
      display: inline-flex; align-items: center;
      padding: 6px 16px;
      border: 1px solid #B79B6B;
      border-radius: 20px;
      font-size: 11.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase;
      color: #7A6A46;
    }
    .ld-people-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 20px;
    }
    .ld-people-card {
      position: relative;
      aspect-ratio: 3 / 4;
      border-radius: 8px;
      overflow: hidden;
      display: flex; align-items: flex-end;
      background:
        radial-gradient(circle at 30% 15%, rgba(198,150,90,0.55) 0%, transparent 50%),
        radial-gradient(circle at 80% 30%, rgba(95,122,78,0.3) 0%, transparent 55%),
        linear-gradient(165deg, #9a7a54 0%, #4a3420 100%);
    }
    .ld-people-card.is-placeholder { background:
        radial-gradient(circle at 30% 15%, rgba(198,150,90,0.35) 0%, transparent 50%),
        radial-gradient(circle at 80% 30%, rgba(95,122,78,0.22) 0%, transparent 55%),
        linear-gradient(165deg, #b3ab9a 0%, #6b6456 100%);
    }
    .ld-people-avatar {
      position: absolute; top: 20px; left: 20px;
      width: 34px; height: 34px; border-radius: 50%;
      border: 1.5px solid rgba(247,242,233,0.5);
      display: flex; align-items: center; justify-content: center;
    }
    .ld-people-overlay {
      position: relative; z-index: 1; width: 100%;
      padding: 20px 18px;
      background: linear-gradient(0deg, rgba(20,14,8,0.75) 0%, rgba(20,14,8,0.15) 65%, transparent 100%);
    }
    .ld-people-name { font-size: 17px; font-weight: 700; color: #F7EFD9; font-family: "Lora", "Noto Sans SC", Georgia, serif; }
    .ld-people-role { font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #E4D8BE; margin-top: 4px; }
    .ld-people-note {
      font-size: 10px; color: #F1E7D0; opacity: 0.8; margin-top: 6px;
    }

    /* ---------- footer ---------- */
    .ld-footer { background: #241a10; color: #C9BBA0; padding: 64px 0 28px; }
    .ld-footer-grid {
      display: grid;
      grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
      gap: 40px;
      padding-bottom: 40px;
      border-bottom: 1px solid rgba(247,242,233,0.1);
    }
    .ld-footer-brand h3 { color: #F7F2E9; font-size: 17px; font-weight: 700; margin-bottom: 12px; }
    .ld-footer-brand p { font-size: 13.5px; line-height: 1.6; color: #A8987A; max-width: 300px; margin: 0; }
    .ld-footer-col h4 {
      font-size: 12.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
      color: #F7F2E9; margin: 0 0 16px;
    }
    .ld-footer-col a, .ld-footer-col li {
      display: block; font-size: 14px; color: #A8987A; margin-bottom: 10px; list-style: none;
    }
    .ld-footer-col a:hover { color: var(--gold); }
    .ld-footer-bottom {
      display: flex; align-items: center; justify-content: space-between;
      padding-top: 24px; font-size: 12.5px; color: #8A7A5E; flex-wrap: wrap; gap: 12px;
    }

    /* ---------- seasons ---------- */
    .ld-seasons-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 22px;
    }
    .ld-season-card {
      background: #FBF7EE;
      border: 1px solid #E4D8BE;
      border-radius: 6px;
      padding: 26px 22px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .ld-season-icon {
      width: 44px; height: 44px; border-radius: 50%;
      background: #F1E7D0;
      display: flex; align-items: center; justify-content: center;
      color: var(--gold);
    }
    .ld-season-card h3 { font-size: 17px; font-weight: 600; }
    .ld-season-card p { font-size: 13.5px; color: #6B5D4B; margin: 0; }

    /* ---------- floating contact / music widgets ---------- */
    .ld-float-stack {
      position: fixed;
      right: 22px;
      bottom: 22px;
      z-index: 40;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 12px;
    }
    .ld-float-btn {
      width: 52px; height: 52px; border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 8px 20px rgba(43,32,19,0.25);
      border: none; cursor: pointer;
    }
    .ld-float-btn.ld-whatsapp { background: #25D366; }
    .ld-float-btn.ld-music { background: var(--ink); }
    .ld-float-btn.ld-music.is-playing { background: var(--gold); }

    /* ---------- responsive ---------- */
    @media (max-width: 960px) {
      .ld-header-bar { flex-wrap: wrap; row-gap: 12px; }
      .ld-nav { order: 3; width: 100%; flex-wrap: wrap; gap: 12px 22px; }
      .ld-hero-grid { grid-template-columns: 1fr; }
      .ld-hero-art { max-width: 360px; margin: 0 auto; order: -1; }
      .ld-hero h2 { font-size: 34px; }
      .ld-stat { border-left: none; }
      .ld-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 24px; }
      .ld-products-grid,
      .ld-steps,
      .ld-features-grid,
      .ld-people-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .ld-seasons-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .ld-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
      .ld-cta-badge { display: none; }
      .ld-cta-band-inner { flex-direction: column; align-items: flex-start; }
    }
    @media (max-width: 640px) {
      .ld-container { padding: 0 20px; }
      .ld-section { padding: 56px 0; }
      .ld-hero-grid { padding: 56px 0 48px; }
      .ld-hero h2 { font-size: 27px; }
      .ld-hero-ctas { flex-direction: column; align-items: stretch; }
      .ld-hero-ctas .ld-btn { width: 100%; }
      .ld-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .ld-products-grid,
      .ld-steps,
      .ld-features-grid,
      .ld-people-grid,
      .ld-seasons-grid,
      .ld-footer-grid { grid-template-columns: 1fr; }
      .ld-header-actions { flex-wrap: wrap; gap: 10px; justify-content: flex-start; width: 100%; }
      .ld-phone { display: none; }
      .ld-cta-band-inner .ld-btn { width: 100%; }
      .ld-float-stack { right: 14px; bottom: 14px; }
      .ld-float-btn { width: 46px; height: 46px; }
      .ld-slider { aspect-ratio: 4 / 5; }
      .ld-slider-nav { width: 34px; height: 34px; }
      .ld-slider-prev { left: 10px; }
      .ld-slider-next { right: 10px; }
    }

/* ---------- theme-integration extras (not present in the original mockup) ---------- */
.ld-logo-link {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: inherit;
}
.ld-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 34px; flex-wrap: wrap; }
.ld-lang-toggle button.is-active { color: #2B2013; font-weight: 700; }
.ld-lang-toggle button:not(.is-active) { color: #8A7A5E; font-weight: 600; }
.ld-people-note[data-i18n=""] { display: none; }
@media (max-width: 960px) {
  .ld-nav ul { gap: 12px 22px; }
}
