:root{
  --green:#0a9f3f;
  --green-hover:#088834;
  --green-light:rgba(10,159,63,0.08);
  --light:#9acd32;
  --text:#1a1a1a;
  --text-muted:#555;
  --border:#e8e8e8;
  --radius:12px;
  --radius-lg:16px;
  --shadow:0 4px 20px rgba(0,0,0,0.06);
  --shadow-hover:0 8px 30px rgba(0,0,0,0.1);
  --transition:0.25s ease;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Kanit',system-ui,-apple-system,sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.65;
}

/* ===== HEADER ===== */
header{
  position:sticky;
  top:0;
  left:0;
  right:0;
  width:100%;
  background:rgba(255,255,255,0.98);
  backdrop-filter:blur(10px);
  box-shadow:0 4px 16px rgba(0,0,0,0.14);
  z-index:1000;
  transition:box-shadow var(--transition);
  display:block;
  min-height:72px;
  overflow:visible;
}
/* แถบสีซ้าย–ขวา: ชิดแถบสีขาว เหลือช่องไฟเล็ก (แบบรูปที่ 2) */
header::before,
header::after{
  content:'';
  position:absolute;
  top:0;
  bottom:0;
  width:max(60px, 50vw - 602px);
  background:linear-gradient(to bottom,
    #fff 0%,
    #fff 6%,
    var(--green) 6%,
    var(--green) 25%,
    #fff 25%,
    #fff 31%,
    var(--light) 31%,
    var(--light) 69%,
    #fff 69%,
    #fff 75%,
    var(--green) 75%,
    var(--green) 94%,
    #fff 94%,
    #fff 100%);
  z-index:0;
}
header::before{left:0;}
header::after{right:0;left:auto;}
header.scrolled{box-shadow:0 6px 24px rgba(0,0,0,0.18)}
header .nav{position:relative;z-index:1;}
.nav{
  max-width:1200px;
  margin:0 auto;
  padding:14px 20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.logo-link{
  display:flex;
  align-items:center;
  text-decoration:none;
  color:var(--text);
  font-weight:700;
  font-size:1.25rem;
}
.logo-link img{
  height:44px;
  margin-right:8px;
  object-fit:contain;
}
.nav-links{
  display:flex;
  align-items:center;
  gap:8px;
}
.nav-links a{
  padding:8px 14px;
  text-decoration:none;
  color:var(--text);
  font-weight:500;
  border-radius:8px;
  transition:background var(--transition),color var(--transition);
}
.nav-links a:hover{
  background:var(--green-light);
  color:var(--green);
}
.nav-links a.active{
  background:var(--green-light);
  color:var(--green);
}
/* Header ภาษาอังกฤษ = พิมพ์ใหญ่ */
html[lang="en"] .nav-links a{
  text-transform:uppercase;
}
.lang{
  display:flex;
  gap:4px;
  margin-left:16px;
}
.lang button{
  padding:8px 14px;
  border:1px solid var(--green);
  border-radius:8px;
  background:#fff;
  color:var(--green);
  font-family:inherit;
  font-weight:600;
  font-size:0.875rem;
  cursor:pointer;
  transition:background var(--transition),color var(--transition),transform 0.15s ease;
}
.lang button:hover{
  background:var(--green-light);
}
.lang button.active{
  background:var(--green);
  color:#fff;
  border-color:var(--green);
}
.lang button:active{transform:scale(0.97)}

/* ปุ่มแฮมเบอร์เกอร์ (แสดงบนมือถือเท่านั้น) */
.nav-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  padding:10px;
  border:none;
  border-radius:10px;
  background:transparent;
  cursor:pointer;
  transition:background 0.2s ease;
  z-index:2;
}
.nav-toggle:hover{background:var(--green-light)}
.nav-toggle-bar{
  display:block;
  width:22px;
  height:2.5px;
  border-radius:2px;
  background:var(--green);
  transition:transform 0.25s ease, opacity 0.25s ease;
}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){
  transform:translateY(7.5px) rotate(45deg);
}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){
  transform:translateY(-7.5px) rotate(-45deg);
}

/* ===== SECTION ===== */
section{
  max-width:1200px;
  margin:0 auto;
  padding:80px 20px;
}
main{min-height:60vh}
h1,h2,h3{margin-bottom:16px;font-weight:700}
h1{font-size:2rem}
h2{font-size:1.5rem}
p{margin-bottom:20px;color:var(--text-muted)}

/* ===== HERO ===== */
.hero{
  max-width:none;
  width:100%;
  margin-left:0;
  margin-right:0;
  position:relative;
  min-height:65vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:url("../image/good drug รูปปก.jpg") center/cover no-repeat;
  padding:80px 20px;
  box-sizing:border-box;
}
.hero::before{
  content:'';
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.45);
  z-index:0;
}
.hero-inner{
  position:relative;
  z-index:1;
  max-width:720px;
  width:100%;
  margin:0 auto;
  text-align:center;
}
.hero .hero-actions{
  justify-content:center;
}
.hero .trust{
  justify-content:center;
  color:rgba(255,255,255,0.9);
}
.hero h1{
  font-size:clamp(2rem,5vw,2.75rem);
  line-height:1.25;
  color:#fff;
  text-shadow:0 1px 3px rgba(0,0,0,0.3);
}
.hero p{
  color:rgba(255,255,255,0.95);
  text-shadow:0 1px 2px rgba(0,0,0,0.25);
}
.hero .trust span::before{color:var(--light)}
.hero .btn.hero-outline{
  border-color:rgba(255,255,255,0.9);
  color:#fff;
  background:transparent;
}
.hero .btn.hero-outline:hover{
  background:rgba(255,255,255,0.15);
  border-color:#fff;
  color:#fff;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:28px;
}
.btn{
  padding:14px 28px;
  border-radius:10px;
  text-decoration:none;
  font-family:inherit;
  font-weight:600;
  font-size:1rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:2px solid transparent;
  cursor:pointer;
  transition:background var(--transition),color var(--transition),border-color var(--transition),transform 0.15s ease,box-shadow var(--transition);
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn.primary{
  background:var(--green);
  color:#fff;
  border-color:var(--green);
}
.btn.primary:hover{
  background:var(--green-hover);
  border-color:var(--green-hover);
  box-shadow:0 6px 20px rgba(10,159,63,0.35);
}
.btn.outline{
  border-color:var(--green);
  color:var(--green);
  background:#fff;
}
.btn.outline:hover{
  background:var(--green-light);
  box-shadow:0 4px 14px rgba(10,159,63,0.15);
}
.trust{
  margin-top:28px;
  font-size:0.95rem;
  color:var(--text-muted);
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  align-items:center;
}
.trust span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.trust span::before{
  content:'✓';
  color:var(--green);
  font-weight:700;
  font-size:1.1rem;
}

/* ===== บริการของเราดีอย่างไร? (หลอดวิ่ง + Logo) — มืออาชีพ สมูท ===== */
.how-good-section{
  max-width:1200px;
  margin:0 auto;
  padding:72px 24px;
  background:linear-gradient(180deg, #fafbfc 0%, #fff 100%);
}
.how-good-wrap{
  display:grid;
  grid-template-columns:1fr 300px;
  gap:56px;
  align-items:center;
  max-width:960px;
  margin:0 auto;
}
.how-good-heading{
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  color:var(--green);
  margin-bottom:32px;
  display:flex;
  align-items:center;
  gap:14px;
  letter-spacing:0.02em;
  line-height:1.3;
}
.how-good-heading::before{
  content:'';
  width:4px;
  height:1.15em;
  background:linear-gradient(180deg,var(--green) 0%,var(--light) 100%);
  border-radius:2px;
  flex-shrink:0;
}
.how-good-list{
  list-style:none;
  padding:0;
  margin:0;
}
.how-good-item{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:12px;
  align-items:center;
  padding:14px 12px;
  margin:0 -12px;
  border-bottom:1px solid rgba(0,0,0,0.04);
  border-radius:10px;
  transition:background 0.3s ease, box-shadow 0.3s ease;
}
.how-good-item:last-child{border-bottom:none}
.how-good-item:hover{
  background:rgba(10,159,63,0.05);
  box-shadow:inset 0 0 0 1px rgba(10,159,63,0.12);
}
.how-good-label{
  font-size:0.9875rem;
  font-weight:600;
  color:#1a1a1a;
  white-space:nowrap;
  letter-spacing:0.01em;
  min-width:0;
}
.how-good-bar{
  height:10px;
  min-width:0;
  background:#e8eaed;
  border-radius:999px;
  overflow:hidden;
  box-shadow:inset 0 1px 2px rgba(0,0,0,0.04);
}
.how-good-fill{
  display:block;
  height:100%;
  width:0;
  background:linear-gradient(90deg, var(--green) 0%, var(--light) 100%);
  border-radius:999px;
  transition:width 1s cubic-bezier(0.4,0,0.2,1);
  box-shadow:0 0 0 1px rgba(255,255,255,0.2);
}
.how-good-section.in-view .how-good-fill{
  width:var(--pct)!important;
}
.how-good-pct{
  font-size:0.9375rem;
  font-weight:700;
  color:var(--green);
  min-width:36px;
  text-align:right;
  letter-spacing:0.02em;
}
.how-good-visual{
  display:flex;
  justify-content:center;
  align-items:center;
}
.how-good-logo-card{
  background:#fff;
  border-radius:20px;
  padding:36px 32px;
  box-shadow:0 4px 24px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
  border:1px solid rgba(0,0,0,0.06);
  text-align:center;
  transition:box-shadow 0.3s ease, transform 0.3s ease;
}
.how-good-logo-card:hover{
  box-shadow:0 12px 40px rgba(10,159,63,0.1), 0 4px 12px rgba(0,0,0,0.06);
  transform:translateY(-3px);
}
.how-good-logo-img{
  max-width:180px;
  height:auto;
  display:block;
  margin:0 auto 18px;
  object-fit:contain;
}
.how-good-logo-text{
  font-size:1.2rem;
  font-weight:700;
  color:var(--green);
  margin:0 0 6px 0;
  letter-spacing:0.02em;
}
.how-good-logo-sub{
  font-size:0.8125rem;
  color:var(--text-muted);
  margin:0;
  letter-spacing:0.03em;
}
@media (max-width:900px){
  .how-good-section{padding:56px 20px}
  .how-good-wrap{grid-template-columns:1fr;gap:40px;max-width:none}
  .how-good-visual{order:-1}
  .how-good-item{grid-template-columns:auto 1fr auto;gap:10px;padding:12px 10px;margin:0 -10px}
  .how-good-label{white-space:normal}
}

/* ===== WHY GOOD DRUG (การ์ด 4 ใบ พื้นอ่อน) ===== */
.why-section{
  max-width:none;
  width:100%;
  margin-left:0;
  margin-right:0;
  padding:56px 20px 64px;
  background:#f5f6f8;
  color:#333;
}
.why-wrap{
  max-width:1200px;
  margin:0 auto;
  text-align:center;
}
.why-header{
  margin-bottom:40px;
  padding-top:32px;
  padding-bottom:36px;
}
.why-heading{
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  color:var(--green);
  margin:0 0 12px 0;
  letter-spacing:0.02em;
}
.why-lead{
  font-size:1rem;
  color:#666;
  margin:0;
  line-height:1.5;
  font-weight:400;
}
.why-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
  margin-bottom:32px;
  text-align:center;
}
.why-card{
  background:#fff;
  border:1px solid rgba(10,159,63,0.4);
  border-radius:16px;
  padding:28px 20px;
  box-shadow:0 4px 20px rgba(0,0,0,0.06);
  transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition);
}
.why-card:hover{
  transform:translateY(-4px);
  border-color:var(--green);
  box-shadow:0 12px 32px rgba(0,0,0,0.1);
}
.why-card-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 16px;
  color:var(--green);
}
.why-card-icon svg{
  width:40px;
  height:40px;
}
.why-card-title{
  font-size:1.0625rem;
  font-weight:700;
  color:#1a1a1a;
  margin:0 0 10px 0;
  line-height:1.35;
}
.why-card-desc{
  font-size:0.9rem;
  color:#666;
  line-height:1.55;
  margin:0;
  max-width:260px;
  margin-left:auto;
  margin-right:auto;
}
@media (max-width:900px){
  .why-cards{grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:28px}
  .why-header{margin-bottom:32px}
}
@media (max-width:520px){
  .why-cards{grid-template-columns:1fr}
  .why-card{padding:24px 18px}
}

/* ===== FEATURES ===== */
.features-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:24px;
  margin-top:32px;
}
.feature{
  padding:28px 24px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  box-shadow:var(--shadow);
  transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition);
}
.feature:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow-hover);
  border-color:var(--green);
}

/* ===== CTA ===== */
.cta{
  max-width:none;
  width:100vw;
  margin-left:calc(-50vw + 50%);
  margin-right:0;
  padding-left:0;
  padding-right:0;
  box-sizing:border-box;
  background:linear-gradient(135deg, var(--green) 0%, var(--green-hover) 100%);
  text-align:center;
  border-radius:0;
  padding:56px 24px;
}
.cta h2{
  color:#fff;
  margin:0 0 16px 0;
  font-size:clamp(1.4rem,3vw,1.75rem);
  font-weight:700;
}
.cta .btn{
  margin-top:0;
  background:#fff;
  color:var(--green);
  border-color:#fff;
}
.cta .btn:hover{
  background:rgba(255,255,255,0.9);
  color:var(--green-hover);
  border-color:rgba(255,255,255,0.9);
}

/* ===== HOME PAGE SECTIONS (บริการ / รีวิว / ติดต่อเรา) ===== */
.home-section{
  padding-top:60px;
  padding-bottom:60px;
  border-top:1px solid var(--border);
}
.home-section:first-of-type{border-top:none}
.home-section .btn{margin-top:8px}

/* ===== แฟรนไชส์ Good Drug — ไฮเทค ===== */
.franchise-section{
  position:relative;
  border-top:none;
  padding-top:0;
  padding-bottom:0;
  overflow:hidden;
  max-width:none;
  width:100vw;
  margin-left:calc(-50vw + 50%);
  margin-right:0;
  padding-left:0;
  padding-right:0;
  box-sizing:border-box;
}
.franchise-bg{
  position:absolute;
  inset:0;
  background:url("../image/good drug รูปปก.jpg") center/cover no-repeat;
}
.franchise-bg::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.6) 100%);
  pointer-events:none;
}
.franchise-bg::after{
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(10,159,63,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(10,159,63,0.04) 1px, transparent 1px);
  background-size:32px 32px;
  pointer-events:none;
  opacity:0.8;
}
.franchise-wrap{
  position:relative;
  max-width:1100px;
  margin:0 auto;
  padding:56px 24px 64px;
  box-sizing:border-box;
}
.franchise-header{
  text-align:center;
  margin-bottom:40px;
  background:rgba(255,255,255,0.96);
  padding:28px 24px;
  border-radius:14px;
  box-shadow:0 4px 20px rgba(0,0,0,0.08);
}
.franchise-badge{
  display:inline-block;
  font-size:0.75rem;
  font-weight:600;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--green);
  padding:6px 14px;
  border:1px solid rgba(10,159,63,0.4);
  border-radius:999px;
  margin-bottom:16px;
  background:rgba(10,159,63,0.08);
}
.franchise-title{
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  color:var(--green);
  margin:0 0 10px 0;
  letter-spacing:0.02em;
  text-shadow:0 0 20px rgba(10,159,63,0.25);
}
.franchise-lead{
  font-size:1rem;
  color:#666;
  margin:0;
  font-weight:400;
  line-height:1.5;
}
.franchise-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  margin-bottom:44px;
}
.franchise-card{
  background:rgba(255,255,255,0.96);
  border:1px solid rgba(255,255,255,0.9);
  border-radius:16px;
  padding:24px 20px;
  text-align:center;
  box-shadow:0 4px 20px rgba(0,0,0,0.12);
  transition:transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.franchise-card:hover{
  transform:translateY(-6px);
  border-color:rgba(10,159,63,0.5);
  box-shadow:0 12px 32px rgba(0,0,0,0.18), 0 0 0 1px rgba(10,159,63,0.25);
}
.franchise-card-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 14px;
  color:var(--green);
  opacity:0.95;
}
.franchise-card-icon svg{
  width:32px;
  height:32px;
}
.franchise-card-title{
  font-size:0.9375rem;
  font-weight:600;
  color:#1a1a1a;
  margin:0;
  line-height:1.4;
}
.franchise-steps{
  background:rgba(255,255,255,0.96);
  border-radius:16px;
  padding:28px 32px;
  margin-bottom:32px;
  border:1px solid rgba(255,255,255,0.9);
  box-shadow:0 4px 20px rgba(0,0,0,0.12);
}
.franchise-steps-label{
  font-size:0.875rem;
  font-weight:600;
  color:#555;
  text-transform:uppercase;
  letter-spacing:0.08em;
  margin:0 0 20px 0;
  text-align:center;
}
.franchise-steps-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px 24px;
  list-style:none;
  padding:0;
  margin:0;
}
.franchise-step{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 20px;
  background:#fff;
  border-radius:10px;
  border:1px solid var(--border);
  transition:background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  box-shadow:0 2px 8px rgba(0,0,0,0.06);
}
.franchise-step:hover{
  background:rgba(10,159,63,0.06);
  border-color:rgba(10,159,63,0.4);
  box-shadow:0 4px 12px rgba(10,159,63,0.1);
}
.franchise-step-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  font-size:0.875rem;
  font-weight:700;
  color:#fff;
  background:var(--green);
  border-radius:50%;
  flex-shrink:0;
}
.franchise-step-text{
  font-size:0.9375rem;
  font-weight:500;
  color:#1a1a1a;
}
.franchise-cta{
  text-align:center;
  margin:0;
}
.franchise-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 28px;
  font-size:1rem;
  font-weight:600;
  color:#fff;
  background:var(--green);
  border:1px solid var(--green);
  border-radius:12px;
  text-decoration:none;
  transition:background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.franchise-btn:hover{
  background:var(--green-hover);
  border-color:var(--green-hover);
  box-shadow:0 8px 24px rgba(10,159,63,0.35);
  transform:translateY(-2px);
}
@media (max-width:900px){
  .franchise-cards{grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:36px}
  .franchise-steps-list{justify-content:center}
}
@media (max-width:520px){
  .franchise-cards{grid-template-columns:1fr}
  .franchise-wrap{padding:44px 20px 52px}
  .franchise-steps{padding:20px 16px}
  .franchise-step{flex:1 1 100%}
}

/* ===== เกี่ยวกับเรา (About Us) ===== */
.about-section{
  position:relative;
  border-top:none;
  padding-top:0;
  padding-bottom:0;
  overflow:hidden;
  max-width:none;
  width:100vw;
  margin-left:calc(-50vw + 50%);
  margin-right:0;
  padding-left:0;
  padding-right:0;
  box-sizing:border-box;
}
.about-bg{
  position:absolute;
  inset:0;
  background:#fff;
}
.about-bg::before{
  content:none;
}
.about-wrap{
  position:relative;
  max-width:1200px;
  margin:0 auto;
  padding:56px 24px 64px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:center;
}
.about-content{
  min-width:0;
}
.section-subtitle,
.about-subtitle{
  display:inline-block;
  font-size:0.75rem;
  font-weight:600;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--green);
  padding:6px 14px;
  border:1px solid rgba(10,159,63,0.4);
  border-radius:999px;
  background:rgba(10,159,63,0.08);
  margin:0 0 16px 0;
}
.reviews-section{
  text-align:center;
}
.reviews-section .reviews-grid{
  text-align:left;
}
.faq-section{
  text-align:center;
}
.faq-section .faq-list{
  text-align:left;
}
.about-title{
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  color:#1a1a1a;
  margin:0 0 16px 0;
  letter-spacing:0.02em;
}
.about-desc{
  font-size:1rem;
  line-height:1.65;
  color:#555;
  margin:0 0 20px 0;
}
.about-list{
  list-style:none;
  padding:0;
  margin:0 0 24px 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 24px;
}
.about-list li{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
  font-size:0.9375rem;
  color:#1a1a1a;
}
.about-check{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  flex-shrink:0;
  background:rgba(10,159,63,0.12);
  color:var(--green);
  border-radius:50%;
  font-size:0.75rem;
  font-weight:700;
}
.about-cta{
  margin:0;
}
.about-btn{
  display:inline-flex;
  align-items:center;
  padding:14px 28px;
  font-size:1rem;
  font-weight:600;
  color:#fff;
  background:var(--green);
  border:1px solid var(--green);
  border-radius:12px;
  text-decoration:none;
  transition:background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.about-btn:hover{
  background:var(--green-hover);
  border-color:var(--green-hover);
  box-shadow:0 8px 24px rgba(10,159,63,0.35);
  transform:translateY(-2px);
}
.about-stats{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.about-stat{
  background:#f8f9fa;
  border:1px solid var(--border);
  border-radius:14px;
  padding:24px 20px;
  text-align:center;
  transition:border-color 0.25s ease, box-shadow 0.25s ease;
}
.about-stat:hover{
  border-color:rgba(10,159,63,0.35);
  box-shadow:0 4px 16px rgba(10,159,63,0.08);
}
.about-stat-num{
  display:block;
  font-size:1.75rem;
  font-weight:700;
  color:var(--green);
  margin-bottom:6px;
  letter-spacing:0.02em;
}
.about-stat-label{
  display:block;
  font-size:0.875rem;
  font-weight:500;
  color:#555;
}
@media (max-width:900px){
  .about-wrap{grid-template-columns:1fr;gap:40px;padding:48px 24px 56px}
  .about-stats{order:-1;grid-template-columns:repeat(2,1fr);max-width:400px;margin:0 auto}
}
@media (max-width:520px){
  .about-list{grid-template-columns:1fr}
  .about-wrap{padding:40px 20px 48px}
}

/* ===== วิสัยทัศน์ และ พันธกิจ (เต็มจอ + แถบสีเหมือน ทำไมต้อง Good Drug) ===== */
.vision-mission-section{
  max-width:none;
  width:100vw;
  margin-left:calc(-50vw + 50%);
  margin-right:0;
  padding:56px 20px 64px;
  background:#f5f6f8;
  text-align:center;
  color:#333;
  box-sizing:border-box;
}
.vision-mission-wrap{
  max-width:1000px;
  margin:0 auto;
  position:relative;
}
.vision-mission-header{
  position:relative;
  margin-bottom:32px;
  padding:32px 24px 36px;
  text-align:center;
}
/* แถบสีเขียวซ้าย–ขวา เหมือนหัวข้อ ทำไมต้อง Good Drug */
.vision-mission-header::before,
.vision-mission-header::after{
  content:'';
  position:absolute;
  top:0;
  bottom:0;
  width:max(60px, 8vw);
  background:linear-gradient(to bottom,
    #f5f6f8 0%,
    #f5f6f8 6%,
    var(--green) 6%,
    var(--green) 25%,
    #f5f6f8 25%,
    #f5f6f8 31%,
    var(--light) 31%,
    var(--light) 69%,
    #f5f6f8 69%,
    #f5f6f8 75%,
    var(--green) 75%,
    var(--green) 94%,
    #f5f6f8 94%,
    #f5f6f8 100%);
  z-index:0;
}
.vision-mission-header::before{left:0;}
.vision-mission-header::after{right:0;left:auto;}
.vision-mission-header .section-subtitle,
.vision-mission-header .vision-mission-heading,
.vision-mission-header .vision-mission-lead{
  position:relative;
  z-index:1;
}
.vision-mission-heading{
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  color:var(--green);
  margin:0 0 10px 0;
  letter-spacing:0.02em;
}
.vision-mission-lead{
  font-size:1rem;
  color:#666;
  margin:0;
  font-weight:400;
  line-height:1.5;
  max-width:560px;
  margin-left:auto;
  margin-right:auto;
}
.vision-mission-header .section-subtitle{margin-bottom:16px}
.vision-mission-header .vision-mission-heading{margin-bottom:10px}
.vision-mission-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  text-align:left;
}
.vision-mission-card{
  background:#fff;
  border:1px solid rgba(10,159,63,0.35);
  border-radius:16px;
  padding:28px 24px;
  transition:border-color 0.25s ease, box-shadow 0.25s ease;
}
.vision-mission-card:hover{
  border-color:rgba(10,159,63,0.5);
  box-shadow:0 6px 20px rgba(10,159,63,0.1);
}
.vision-mission-card-title{
  font-size:1.125rem;
  font-weight:700;
  color:var(--green);
  margin:0 0 12px 0;
  letter-spacing:0.02em;
}
.vision-mission-card-text{
  font-size:1rem;
  line-height:1.65;
  color:#555;
  margin:0;
}
@media (max-width:640px){
  .vision-mission-grid{grid-template-columns:1fr;gap:20px}
  .vision-mission-section{padding:48px 20px 56px}
  /* โหมดมือถือ: ไม่แสดงแถบสีซ้าย–ขวา เพื่อไม่ทับข้อความ */
  .vision-mission-header::before,
  .vision-mission-header::after{width:0;display:none}
  .vision-mission-header{padding:24px 16px 28px}
  .vision-mission-heading{font-size:1.5rem}
  .vision-mission-lead{max-width:none;padding:0 8px}
}

/* ===== PRIVACY POLICY PAGE ===== */
.privacy-section{
  max-width:none;
  width:100vw;
  margin-left:calc(-50vw + 50%);
  margin-right:0;
  padding:80px 20px 96px;
  background:#f5f6f8;
  box-sizing:border-box;
}
.privacy-card{
  max-width:880px;
  margin:0 auto;
  background:#ffffff;
  border-radius:18px;
  box-shadow:0 14px 40px rgba(10,159,63,0.08);
  padding:40px 32px 44px;
}
.privacy-heading{
  font-size:clamp(1.8rem,3.2vw,2.2rem);
  font-weight:700;
  color:var(--green);
  margin:0 0 10px 0;
  letter-spacing:0.02em;
}
.privacy-intro{
  font-size:1rem;
  line-height:1.7;
  color:#555;
  margin:0 0 24px 0;
}
.privacy-card h2{
  font-size:1.2rem;
  font-weight:600;
  margin:32px 0 12px 0;
  color:#222;
}
.privacy-card h3{
  font-size:1.05rem;
  font-weight:600;
  margin:22px 0 8px 0;
  color:#333;
}
.privacy-card p{
  margin:0 0 12px 0;
  line-height:1.7;
  color:var(--text-muted);
}
.privacy-updated{
  margin-top:28px;
  font-size:0.95rem;
  color:#666;
}
.privacy-back{
  margin-top:20px;
}
@media (max-width:640px){
  .privacy-section{padding:72px 16px 80px}
  .privacy-card{padding:32px 20px 36px;border-radius:16px}
  .privacy-heading{font-size:1.6rem}
}

/* ===== SERVICES ===== */
ul,ol{
  padding-left:24px;
  margin-top:12px;
}
li{margin-bottom:10px;color:var(--text-muted)}

/* ===== REVIEWS (เสียงจากผู้ร่วมธุรกิจ — 3 ช่อง + อวาตาร์กลม) ===== */
.reviews-section .reviews-heading{
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  letter-spacing:0.02em;
  margin-bottom:12px;
  text-align:center;
  color:var(--green);
}
.reviews-lead{
  font-size:1rem;
  color:#666;
  margin:0 0 28px 0;
  line-height:1.5;
  font-weight:400;
  text-align:center;
}
.home-section .section-heading{
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  letter-spacing:0.02em;
  color:var(--green);
}
.reviews-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  max-width:1100px;
  margin:0 auto 28px;
}
/* หน้ารีวิว: แถวละ 3 การ์ด เหมือนหน้าแรก เรียงลงมา */
.reviews-page-grid{
  max-width:1100px;
  grid-template-columns:repeat(3,1fr);
}
@media (max-width:900px){
  .reviews-grid{grid-template-columns:1fr;gap:20px}
  .reviews-page-grid{grid-template-columns:1fr}
}
.review-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px 24px;
  text-align:center;
  box-shadow:var(--shadow);
  transition:box-shadow var(--transition), transform var(--transition);
}
.review-card:hover{
  box-shadow:var(--shadow-hover);
  transform:translateY(-4px);
}
.review-avatar{
  width:80px;
  height:80px;
  border-radius:50%;
  margin:0 auto 16px;
  background:linear-gradient(145deg, #f0f0f0 0%, #e5e5e5 100%);
  border:2px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.review-avatar-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:none;
}
.review-avatar-img[src]:not([src=""]){
  display:block;
}
.review-avatar-placeholder{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  inset:0;
  font-size:1.75rem;
  font-weight:600;
  color:#999;
  background:linear-gradient(145deg, #f5f5f5 0%, #ebebeb 100%);
}
.review-avatar:has(.review-avatar-img[src]:not([src=""])) .review-avatar-placeholder{
  display:none;
}
.review-card .stars{
  color:#f5a623;
  font-size:1.15rem;
  margin-bottom:8px;
  letter-spacing:2px;
}
.review-author{
  margin:0 0 12px 0;
  font-size:0.875rem;
  color:var(--text);
  font-weight:600;
}
.review-quote{
  font-size:0.9375rem;
  color:var(--text-muted);
  line-height:1.6;
  margin:0;
  min-height:2.5em;
}
.reviews-cta{
  text-align:center;
  margin:0;
}
.reviews-cta .btn{margin-top:0}

/* ===== คำถามที่พบบ่อย (FAQ) ===== */
.faq-section{
  border-top:1px solid var(--border);
}
.faq-heading{
  text-align:center;
  margin-bottom:36px;
  color:var(--green);
}
.faq-list{
  max-width:800px;
  margin:0 auto;
  padding:0;
}
.faq-item{
  border:1px solid var(--border);
  border-radius:12px;
  margin-bottom:12px;
  background:#fff;
  overflow:hidden;
  transition:border-color 0.25s ease, box-shadow 0.25s ease;
}
.faq-item:hover{
  border-color:rgba(10,159,63,0.3);
  box-shadow:0 4px 16px rgba(10,159,63,0.06);
}
.faq-item[open]{
  border-color:var(--green);
  box-shadow:0 4px 20px rgba(10,159,63,0.08);
}
.faq-item[open] .faq-question{
  color:var(--green);
  font-weight:700;
}
.faq-question{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:18px 20px;
  font-size:1rem;
  font-weight:600;
  color:#1a1a1a;
  text-align:left;
  cursor:pointer;
  list-style:none;
  background:none;
  border:none;
  font-family:inherit;
  line-height:1.4;
  transition:color 0.2s ease;
}
.faq-question::-webkit-details-marker{display:none}
.faq-question::after{
  content:'';
  flex-shrink:0;
  width:20px;
  height:20px;
  margin-left:12px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform 0.25s ease;
}
.faq-item[open] .faq-question::after{
  transform:rotate(180deg);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%230a9f3f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") center/contain no-repeat;
}
.faq-answer{
  padding:16px 20px 20px;
  margin:0;
  font-size:0.9375rem;
  line-height:1.65;
  color:#555;
  border-top:1px solid rgba(0,0,0,0.06);
}
.faq-item:last-child{
  margin-bottom:0;
}

/* รีวิวแบบเดิม (หน้า /reviews/ ฯลฯ) */
.review{
  border:1px solid var(--border);
  padding:28px;
  border-radius:var(--radius-lg);
  margin-top:20px;
  background:#fff;
  box-shadow:var(--shadow);
  transition:box-shadow var(--transition);
}
.review:hover{box-shadow:var(--shadow-hover)}
.review .stars{color:#f5a623;font-size:1.25rem;margin-bottom:8px;letter-spacing:2px}

/* ===== ติดต่อเรา (หน้าแรก) — แบบเดียวกับ ทำไมต้อง Good Drug ===== */
/* เลื่อนมาที่ติดต่อเรา: section ชิด viewport บน → padding 280px กันหัวข้อไม่โดนแถบ sticky ทับ */
#home-contact{
  scroll-margin-top:0;
}
.contact-section{
  max-width:none;
  width:100%;
  margin-left:0;
  margin-right:0;
  padding:0;
  background:transparent;
  position:relative;
  z-index:1;
}
.contact-section .contact-wrap{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
  text-align:center;
  box-sizing:border-box;
}
.contact-section .contact-header{
  margin:0 auto 40px;
  max-width:720px;
}
.contact-section .contact-header-box{
  text-align:center;
  background:rgba(255,255,255,0.96);
  padding:28px 24px;
  border-radius:14px;
  box-shadow:0 4px 20px rgba(0,0,0,0.08);
}
.contact-section .contact-header-box .franchise-badge{
  margin-bottom:16px;
}
.contact-section .contact-heading,
.contact-section .contact-header-title{
  display:block;
  font-size:clamp(1.6rem,3.5vw,2.1rem);
  font-weight:700;
  color:var(--green);
  margin:0 0 10px 0;
  letter-spacing:0.02em;
  line-height:1.3;
  text-shadow:0 0 20px rgba(10,159,63,0.25);
}
.contact-section .contact-lead,
.contact-section .contact-header-lead{
  font-size:1rem;
  color:#666;
  line-height:1.5;
  margin:0;
  font-weight:400;
  max-width:560px;
  margin-left:auto;
  margin-right:auto;
}
.contact-section .contact-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin:0 auto 32px;
  text-align:center;
  max-width:900px;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:32px;
}
.contact-section .contact-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:24px 16px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  text-decoration:none;
  color:inherit;
  transition:border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
  box-shadow:0 2px 12px rgba(0,0,0,0.05);
}
.contact-section .contact-card:hover{
  border-color:rgba(10,159,63,0.4);
  box-shadow:0 6px 20px rgba(10,159,63,0.1);
  transform:translateY(-2px);
}
.contact-section .contact-card-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:50%;
  background:rgba(10,159,63,0.08);
  color:var(--green);
}
.contact-section .contact-card-icon svg{
  width:24px;
  height:24px;
}
.contact-section .contact-card-label{
  font-size:0.75rem;
  font-weight:600;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:#666;
}
.contact-section .contact-card-value{
  font-size:0.9375rem;
  font-weight:600;
  color:#1a1a1a;
  line-height:1.3;
}
@media (max-width:768px){
  .contact-section .contact-cards{grid-template-columns:1fr;max-width:none;gap:16px}
}

/* ===== CONTACT (หน้า contact-us) ===== */
.contact-wrap{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start}
form{
  max-width:480px;
  flex:1;
  min-width:280px;
}
input,textarea{
  width:100%;
  padding:14px 16px;
  margin-bottom:14px;
  border:1px solid var(--border);
  border-radius:10px;
  font-family:inherit;
  font-size:1rem;
  transition:border-color var(--transition),box-shadow var(--transition);
}
input:focus,textarea:focus{
  outline:none;
  border-color:var(--green);
  box-shadow:0 0 0 3px var(--green-light);
}
textarea{height:120px;resize:vertical;min-height:100px}
form .btn{width:100%;margin-top:8px}
form .btn:disabled{opacity:0.7;cursor:not-allowed;transform:none}
.contact-info p{color:var(--text-muted);line-height:1.8}

/* ===== CONTACT PAGE (contact-us) ===== */
.contact-page{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px 80px;
}
.contact-hero{
  text-align:center;
  padding:48px 0 40px;
}
.contact-pretitle{
  display:inline-block;
  font-size:0.75rem;
  font-weight:600;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:var(--green);
  padding:6px 14px;
  border:1px solid rgba(10,159,63,0.4);
  border-radius:999px;
  background:rgba(10,159,63,0.08);
  margin:0 0 16px 0;
}
.contact-title{
  font-size:clamp(1.75rem,4vw,2.5rem);
  font-weight:700;
  color:var(--green);
  margin:0 0 12px 0;
}
.contact-lead{
  font-size:1rem;
  color:var(--text-muted);
  max-width:560px;
  margin:0 auto;
  line-height:1.6;
}
.contact-body{padding-bottom:56px}
.contact-body-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:start;
}
.contact-company-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:1.125rem;
  font-weight:700;
  color:var(--text);
  margin:0 0 20px 0;
}
.contact-company-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--green-light);
  color:var(--green);
}
.contact-card-list{display:flex;flex-direction:column;gap:14px}
.contact-info-card{
  display:flex;
  align-items:flex-start;
  gap:16px;
  padding:18px 20px;
  background:#f8faf8;
  border:1px solid var(--border);
  border-radius:var(--radius);
  text-decoration:none;
  color:inherit;
  transition:border-color var(--transition),box-shadow var(--transition);
}
.contact-info-card:hover{
  border-color:rgba(10,159,63,0.35);
  box-shadow:0 4px 16px rgba(10,159,63,0.08);
}
.contact-info-card-address{cursor:default;pointer-events:auto}
.contact-info-card-address:hover{border-color:var(--border);box-shadow:none}
.contact-info-card-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  min-width:44px;
  border-radius:50%;
  background:var(--green);
  color:#fff;
}
.contact-info-card-icon svg{flex-shrink:0}
.contact-info-card-text{display:flex;flex-direction:column;gap:4px;min-width:0}
.contact-info-card-label{
  font-size:0.8125rem;
  font-weight:600;
  color:var(--text-muted);
  letter-spacing:0.02em;
}
.contact-info-card-value{
  font-size:0.9375rem;
  font-weight:600;
  color:var(--green);
  word-break:break-word;
}
.contact-map-block{
  background:#f8faf8;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  overflow:hidden;
}
.contact-map-tabs{
  display:flex;
  padding:12px 16px;
  background:rgba(10,159,63,0.06);
  border-bottom:1px solid var(--border);
}
.contact-map-tab{
  font-size:0.875rem;
  font-weight:600;
  color:var(--text-muted);
  padding:6px 14px;
  border-radius:8px;
  transition:background var(--transition),color var(--transition);
}
.contact-map-tab.active{
  background:var(--green);
  color:#fff;
}
.contact-map-wrap{
  position:relative;
  width:100%;
  padding-bottom:56.25%;
  height:0;
  overflow:hidden;
}
.contact-map-iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border:0;
}
.contact-map-address{
  padding:14px 20px;
  font-size:0.9375rem;
  color:var(--text);
  line-height:1.6;
  margin:0;
  border-top:1px solid var(--border);
}
.contact-map-link{
  display:inline-block;
  padding:10px 20px;
  font-size:0.9375rem;
  font-weight:600;
  color:var(--green);
  text-decoration:none;
  transition:color var(--transition);
}
.contact-map-link:hover{color:var(--green-hover)}
.contact-form-section{
  padding:48px 0 0;
  border-top:1px solid var(--border);
}
.contact-form-wrap{
  max-width:480px;
  margin:0 auto;
}
.contact-form-title{
  font-size:1.25rem;
  font-weight:700;
  color:var(--text);
  margin:0 0 24px 0;
  text-align:center;
}
.contact-form-wrap input,
.contact-form-wrap textarea{
  margin-bottom:14px;
}
.contact-form-wrap .btn{margin-top:8px}

@media (max-width:900px){
  .contact-body-inner{grid-template-columns:1fr;gap:32px}
  .contact-map-block{order:2}
  .contact-company{order:1}
}
@media (max-width:768px){
  .contact-page{padding:0 16px 60px}
  .contact-hero{padding:36px 0 32px}
  .contact-form-section{padding:36px 0 0}
}

/* ===== TOAST ===== */
.toast{
  position:fixed;
  bottom:24px;
  left:50%;
  transform:translateX(-50%) translateY(100px);
  padding:16px 24px;
  border-radius:10px;
  background:var(--green);
  color:#fff;
  font-weight:500;
  box-shadow:var(--shadow-hover);
  z-index:9999;
  opacity:0;
  transition:transform 0.35s ease,opacity 0.35s ease;
}
.toast.show{
  transform:translateX(-50%) translateY(0);
  opacity:1;
}

/* ===== FOOTER ===== */
:root{
  --footer-bg:linear-gradient(180deg, #0d5c2e 0%, #0a3d20 100%);
  --footer-text:rgba(255,255,255,0.95);
  --footer-text-muted:rgba(255,255,255,0.75);
  --footer-border:rgba(255,255,255,0.2);
}
.site-footer{
  background:var(--footer-bg);
  color:var(--footer-text);
  text-align:center;
  padding:48px 20px 24px;
  border-top:3px solid var(--green);
}
.footer-inner{
  max-width:1200px;
  margin:0 auto;
}
.footer-social{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  margin-bottom:28px;
}
.footer-social-link{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:50%;
  background:rgba(255,255,255,0.12);
  color:var(--footer-text);
  transition:background var(--transition),color var(--transition),transform 0.2s ease;
}
.footer-social-link:hover{
  background:var(--green);
  color:#fff;
  transform:scale(1.08);
}
.footer-icon{
  width:22px;
  height:22px;
  flex-shrink:0;
}
.footer-nav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:8px 20px;
  margin-bottom:24px;
}
.footer-nav a{
  color:var(--footer-text-muted);
  text-decoration:none;
  font-size:0.95rem;
  font-weight:500;
  transition:color var(--transition);
}
.footer-nav a:hover{
  color:var(--green);
}
.footer-copy{
  padding-top:20px;
  border-top:1px solid var(--footer-border);
  font-size:0.875rem;
  color:var(--footer-text-muted);
  margin:0;
}
.footer-copy [data-i18n]{color:inherit}

/* ===== ANIMATION ===== */
.fade-up{
  opacity:0;
  transform:translateY(32px);
  transition:opacity 0.6s ease,transform 0.6s ease;
}
.fade-up.show{
  opacity:1;
  transform:translateY(0);
}

/* ===== MOBILE HEADER ===== */
@media (max-width:768px){
  header::before,
  header::after{width:0}
  header .nav{
    flex-wrap:wrap;
    padding:12px 16px;
    gap:0;
    align-items:center;
  }
  .logo-link{
    flex-shrink:0;
    min-width:0;
  }
  .logo-link img{
    height:38px;
    max-width:140px;
    object-fit:contain;
  }
  .nav-toggle{display:flex}
  .nav-links{
    order:4;
    width:100%;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:12px 0 8px;
    margin-top:4px;
    border-top:1px solid var(--border);
  }
  .nav-links.is-open{display:flex}
  .nav-links a{
    padding:14px 12px;
    font-size:1rem;
    border-radius:10px;
    margin-bottom:4px;
  }
  .nav-links a:last-child{margin-bottom:0}
  .lang{
    margin-left:auto;
    margin-right:0;
  }
  .lang button{padding:8px 12px;font-size:0.8125rem}
}

/* ===== MOBILE ===== */
@media (max-width:768px){
  .hero{padding-top:60px;padding-bottom:60px}
  section{padding:60px 16px}
  .contact-wrap{flex-direction:column}
  .site-footer{padding:40px 16px 20px}
  .footer-social{gap:10px;margin-bottom:24px}
  .footer-social-link{width:40px;height:40px}
  .footer-icon{width:20px;height:20px}
  .footer-nav{gap:6px 14px;margin-bottom:20px;font-size:0.9rem}
}