/* 
   Theme: Warm Orange — อบอุ่น ดูแลเหมือนญาติ
   Primary: #D9480F (Orange) | Secondary: #FFF4E6 (Peach) | Accent: #CAF0F8 (Ice)
*/
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700&family=Sarabun:wght@300;400;500;600&display=swap');

:root {
    --primary-color: #D9480F;
    --primary-light: #F76B1C;
    --primary-dark: #A83200;
    --secondary-color: #FFF4E6;
    --accent-ice: #CAF0F8;
    --accent-warm: #FFE8CC;
    --text-dark: #3D1A08;
    --text-muted: #7A5540;
    --text-light: #ffffff;
    --bg-main: #FFFBF7;
    --bg-peach: #FFF4E6;
    --shadow-warm: 0 4px 20px rgba(217,72,15,0.12);
    --shadow-hover: 0 8px 30px rgba(217,72,15,0.22);
    --transition: 0.3s ease;
}

* { box-sizing: border-box; }
body { font-family:'Kanit','Sarabun',sans-serif; color:var(--text-dark); background:var(--bg-main); line-height:1.7; }
h1,h2,h3,h4,h5,h6 { font-weight:600; color:var(--primary-dark); line-height:1.4; }
a { transition:all var(--transition); }
.text-primary-deep { color:var(--primary-dark) !important; }
.bg-primary-deep { background-color:var(--primary-dark) !important; color:#fff; }
.bg-secondary-ice { background-color:var(--accent-ice) !important; }

/* ===== NAVBAR ===== */
.navbar { background:rgba(255,255,255,.97); box-shadow:0 2px 20px rgba(217,72,15,.1); padding:12px 0; }
.navbar-brand { font-weight:700; font-size:1.3rem; color:var(--primary-color) !important; }
.navbar-brand i { color:var(--primary-light); }
.nav-link { color:var(--text-dark) !important; font-weight:500; padding:8px 16px !important; border-radius:8px; transition:all var(--transition); }
.nav-link:hover,.nav-link.active { color:var(--primary-color) !important; background:var(--secondary-color); }

/* ===== BUTTONS ===== */
.btn-primary-deep { background:linear-gradient(135deg,var(--primary-dark),var(--primary-color)); color:#fff; border:none; border-radius:50px; font-weight:600; transition:all var(--transition); box-shadow:0 4px 15px rgba(217,72,15,.3); }
.btn-primary-deep:hover { background:linear-gradient(135deg,var(--primary-color),var(--primary-light)); color:#fff; transform:translateY(-2px); box-shadow:0 6px 20px rgba(217,72,15,.45); }
.btn-line { background:linear-gradient(135deg,#00B900,#00d100); color:#fff; border:none; border-radius:50px; font-weight:600; box-shadow:0 4px 15px rgba(0,185,0,.3); }
.btn-line:hover { background:linear-gradient(135deg,#009900,#00B900); color:#fff; transform:translateY(-2px); }
.btn-warm { background:linear-gradient(135deg,var(--primary-color),#F76B1C); color:#fff; border:none; border-radius:50px; font-weight:700; font-size:1.1rem; padding:14px 36px; box-shadow:0 6px 25px rgba(217,72,15,.4); transition:all .3s; }
.btn-warm:hover { transform:translateY(-3px); box-shadow:0 10px 35px rgba(217,72,15,.55); color:#fff; }

/* ===== HERO SECTION ===== */
.hero-section { position:relative; background:linear-gradient(135deg,#A83200 0%,#D9480F 45%,#F76B1C 75%,#FFD8A8 100%); color:#fff; padding:110px 0 90px; text-align:center; overflow:hidden; }
.hero-section::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 70% 30%,rgba(255,255,255,.12) 0%,transparent 60%); }
.hero-section::after { content:''; position:absolute; bottom:-2px; left:0; right:0; height:60px; background:var(--bg-main); clip-path:ellipse(55% 100% at 50% 100%); }
.hero-section .container { position:relative; z-index:2; }
.hero-section h1 { color:#fff; font-weight:800; font-size:clamp(1.8rem,4vw,3rem); text-shadow:0 2px 20px rgba(0,0,0,.2); }
.hero-subtitle { font-size:1.2rem; font-weight:300; color:rgba(255,255,255,.93); margin-bottom:35px; }

/* ===== PROMO BADGE ===== */
.promo-badge { background:linear-gradient(135deg,#fff,#FFF4E6); color:var(--primary-dark); padding:8px 24px; border-radius:50px; font-weight:700; display:inline-block; margin-bottom:24px; box-shadow:0 4px 15px rgba(0,0,0,.2); animation:warmPulse 2s ease-in-out infinite; }
@keyframes warmPulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.04)} }

.campaign-hero { background:rgba(255,255,255,.15); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.25); border-radius:20px; padding:28px 36px; margin-bottom:28px; }
.campaign-price-box { background:linear-gradient(135deg,#A83200,#D9480F); border-radius:16px; padding:24px; text-align:center; box-shadow:0 8px 30px rgba(0,0,0,.25); }
.campaign-price { font-size:3.5rem; font-weight:800; color:#FFD700; line-height:1; text-shadow:0 2px 10px rgba(0,0,0,.2); }
.flash-badge { background:linear-gradient(135deg,#FFD700,#FFA500); color:#333; font-size:.7rem; font-weight:800; padding:4px 12px; border-radius:20px; letter-spacing:1px; display:inline-block; margin-bottom:8px; }

/* ===== SECTIONS ===== */
.section-padding { padding:80px 0; }
.section-title { text-align:center; margin-bottom:50px; position:relative; padding-bottom:18px; font-size:clamp(1.4rem,3vw,2rem); }
.section-title::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:60px; height:4px; background:linear-gradient(90deg,var(--primary-light),var(--primary-dark)); border-radius:4px; }

/* Section backgrounds */
.bg-peach { background-color:var(--bg-peach); }
.bg-ice { background-color:var(--accent-ice); }
.bg-warm-card { background-color:var(--accent-warm); }

/* ===== FEATURE CARDS ===== */
.feature-card { background:#fff; padding:32px; border-radius:16px; box-shadow:var(--shadow-warm); transition:all var(--transition); height:100%; text-align:center; border:1px solid rgba(217,72,15,.08); }
.feature-card:hover { transform:translateY(-8px); box-shadow:var(--shadow-hover); border-color:var(--primary-light); }
.feature-icon { font-size:2.8rem; color:var(--primary-color); margin-bottom:18px; }

.problem-card { background:#fff5f0; padding:22px 24px; border-left:4px solid var(--primary-color); border-radius:0 12px 12px 0; margin-bottom:16px; transition:all .3s; }
.problem-card:hover { transform:translateX(8px); background:var(--secondary-color); }
.problem-card h5 { color:var(--primary-dark); font-size:1rem; margin-bottom:6px; }
.problem-card p { color:var(--text-muted); margin:0; font-size:.9rem; }

.service-card { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.25); border-radius:16px; padding:28px; transition:all .3s; height:100%; }
.service-card:hover { background:rgba(255,255,255,.18); transform:translateY(-6px); box-shadow:0 10px 30px rgba(0,0,0,.15); }
.service-card h5 { color:#fff; }
.service-card p { color:rgba(255,255,255,.8); font-size:.92rem; }

.stat-box { text-align:center; padding:30px 20px; background:rgba(255,255,255,.1); border-radius:16px; transition:all .3s; }
.stat-box:hover { background:rgba(255,255,255,.18); transform:scale(1.03); }
.stat-number { font-size:2.8rem; font-weight:800; color:#FFD700; display:block; text-shadow:0 2px 10px rgba(0,0,0,.2); }
.stat-label { color:rgba(255,255,255,.8); font-size:.9rem; margin-top:4px; }

.timeline-item { display:flex; align-items:flex-start; gap:16px; padding:20px; background:#fff; border-radius:12px; box-shadow:var(--shadow-warm); margin-bottom:16px; border-left:4px solid var(--primary-color); transition:all .3s; }
.timeline-item:hover { transform:translateX(8px); box-shadow:var(--shadow-hover); }
.timeline-icon { width:48px; height:48px; background:linear-gradient(135deg,var(--primary-light),var(--primary-color)); border-radius:10px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.2rem; flex-shrink:0; }

.cta-section { background:linear-gradient(135deg,var(--primary-dark),var(--primary-color),#F76B1C); position:relative; overflow:hidden; }

/* ===== FLOATING ===== */
.floating-contact { position:fixed; bottom:24px; right:24px; display:flex; flex-direction:column; gap:12px; z-index:9999; }
.floating-btn { width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:22px; box-shadow:0 4px 16px rgba(0,0,0,.25); transition:all .3s; text-decoration:none; }
.floating-btn:hover { transform:scale(1.15); color:#fff; }
.float-line { background:linear-gradient(135deg,#00B900,#00d100); }
.float-phone { background:linear-gradient(135deg,var(--primary-color),var(--primary-dark)); }

/* ===== FOOTER ===== */
footer { background:linear-gradient(135deg,var(--primary-dark),#7A2400); color:#fff; padding:60px 0 24px; }
footer a { color:var(--accent-ice); text-decoration:none; }
footer a:hover { color:#fff; text-decoration:underline; }

/* ===== FAQ ===== */
.accordion-button { font-weight:600; color:var(--primary-dark); background:transparent; }
.accordion-button:not(.collapsed) { color:var(--primary-color); background:var(--secondary-color); }
.accordion-button:focus { box-shadow:0 0 0 3px rgba(217,72,15,.2); }

/* ===== LOCATION CARD ===== */
.location-card { background:#fff; border:1px solid rgba(217,72,15,.12); border-radius:10px; padding:14px; text-align:center; transition:all .3s; text-decoration:none; color:var(--text-dark); display:block; }
.location-card:hover { background:var(--secondary-color); border-color:var(--primary-color); transform:translateY(-4px); box-shadow:var(--shadow-warm); color:var(--primary-dark); }

/* ===== ADMIN ===== */
.admin-sidebar { background:linear-gradient(180deg,var(--primary-dark),#7A2400); min-height:100vh; padding:20px 0; }
.admin-sidebar .nav-link { color:rgba(255,255,255,.8) !important; padding:12px 20px !important; border-left:3px solid transparent; }
.admin-sidebar .nav-link:hover,.admin-sidebar .nav-link.active { color:#fff !important; background:rgba(255,255,255,.1) !important; border-left-color:#FFD700 !important; }

/* ===== KEYWORD TAGS ===== */
.keyword-tag { display:inline-block; background:var(--secondary-color); color:var(--primary-dark); padding:5px 14px; border-radius:20px; font-size:.85rem; margin:4px; border:1px solid rgba(217,72,15,.2); transition:all .3s; }
.keyword-tag:hover { background:var(--primary-color); color:#fff; transform:translateY(-2px); }

/* ===== WARM SPECIFIC ===== */
.heart-icon { color:var(--primary-color); }
.testimonial-card { background:#fff; border-radius:16px; padding:28px; box-shadow:var(--shadow-warm); border-top:4px solid var(--primary-color); }
.care-box { background:linear-gradient(135deg,#FFF4E6,#FFE8CC); border-radius:16px; padding:28px; border:1px solid rgba(217,72,15,.15); }

.tracking-btn { cursor:pointer; }

@media(max-width:768px){.hero-section{padding:80px 0 70px;}.section-padding{padding:50px 0;}.campaign-hero{padding:18px;}.campaign-price{font-size:2.5rem;}.floating-btn{width:52px;height:52px;font-size:20px;}}