/*
Theme Name: Arrakkha TCM
Theme URI: https://wordpress.tjagent.site
Author: Thee / Zeno Software House
Description: Custom theme for อารักขา คลินิกการแพทย์แผนจีน (Arrakkha Traditional Chinese Medicine Clinic). Restrained, photo-led, sans-serif design. No page builder.
Version: 1.0.0
Requires PHP: 8.0
Text Domain: arrakkha
*/

:root{
  --forest:#1F3D2C; --forest-soft:#2c5240; --cream:#F6EEDC; --white:#FFFFFF;
  --gold:#BD9558; --sage:#93A488; --ink:#2A2620; --ink-soft:#6b6255; --line:#E4D9C0;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:"Noto Sans Thai","Noto Sans","Helvetica Neue",-apple-system,sans-serif;
  line-height:1.6;
}
img{max-width:100%;display:block;}
.wrap{max-width:1160px;margin:0 auto;padding:0 32px;}
a{color:inherit;}

/* Nav */
header.site-nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 32px; border-bottom:1px solid var(--line); background:var(--cream);
  position:sticky; top:0; z-index:10;
}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;color:var(--forest);text-decoration:none;}
.logo .mark{width:34px;height:34px;border-radius:4px;background:var(--forest);color:var(--cream);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex-shrink:0;}
nav.links{display:flex;gap:28px;font-size:14px;color:var(--ink-soft);flex-wrap:wrap;}
nav.links ul{list-style:none;display:flex;gap:28px;margin:0;padding:0;flex-wrap:wrap;}
nav.links a{text-decoration:none;}
nav.links a:hover{color:var(--forest);}
.nav-cta{
  font-size:13.5px;font-weight:600;color:var(--cream);background:var(--forest);
  text-decoration:none;white-space:nowrap;padding:10px 22px;border-radius:999px;
  display:inline-block;line-height:1;
}
.nav-toggle{display:none;}

@media(max-width:860px){
  header.site-nav{flex-wrap:wrap;gap:14px;}
  nav.links ul{gap:16px;font-size:13.5px;}
}

/* Hero */
.hero{padding:64px 0 56px;}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;}
@media(max-width:860px){.hero-grid{grid-template-columns:1fr;}}
.eyebrow{font-size:12.5px;letter-spacing:.08em;color:var(--gold);font-weight:700;text-transform:uppercase;margin-bottom:14px;}
h1{font-size:clamp(30px,4vw,42px);font-weight:700;color:var(--forest);margin:0 0 16px;line-height:1.3;}
.hero-sub{font-size:15.5px;color:var(--ink-soft);max-width:460px;margin:0 0 28px;}
.hero-cta-row{display:flex;gap:24px;align-items:center;flex-wrap:wrap;}
.btn-solid{background:var(--forest);color:var(--cream);padding:13px 26px;border-radius:3px;font-size:14.5px;font-weight:600;text-decoration:none;display:inline-block;}
.btn-line{font-size:14.5px;font-weight:600;color:var(--forest);text-decoration:none;border-bottom:1.5px solid var(--sage);padding-bottom:3px;}
.btn-outline{
  background:transparent;color:var(--forest);border:1.5px solid var(--forest);
  padding:8px 18px;border-radius:3px;font-size:13px;font-weight:600;
  text-decoration:none;display:inline-block;line-height:1.3;
}
.credential-line{font-size:12.5px;color:var(--ink-soft);margin-top:14px;}
.credential-line b{color:var(--forest);}
.hero-photo{
  aspect-ratio:4/3.1; border-radius:6px; overflow:hidden; position:relative;
  background:linear-gradient(135deg,var(--sage),var(--forest-soft));
  display:flex;align-items:center;justify-content:center;
}
.hero-photo img{width:100%;height:100%;object-fit:cover;}
.photo-label{color:rgba(255,255,255,.9);font-size:13px;text-align:center;padding:0 24px;}

/* Trust strip */
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;}
.trust-row{display:flex;gap:48px;flex-wrap:wrap;justify-content:space-between;font-size:13.5px;color:var(--ink-soft);}
.trust-row b{color:var(--forest);}

/* Section heading */
.section{padding:64px 0;}
.section-head{max-width:560px;margin:0 0 36px;}
.section-eyebrow{font-size:12px;letter-spacing:.08em;color:var(--gold);font-weight:700;text-transform:uppercase;margin-bottom:8px;}
.section h2{font-size:26px;color:var(--forest);margin:0 0 10px;font-weight:700;}
.section-desc{font-size:14.5px;color:var(--ink-soft);}
.section-border{border-top:1px solid var(--line);}

/* Services */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
@media(max-width:860px){.svc-grid{grid-template-columns:1fr;}}
.svc-photo{aspect-ratio:4/3;border-radius:6px;background:var(--sage);margin-bottom:16px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.svc-photo img{width:100%;height:100%;object-fit:cover;}
.svc-photo span{color:rgba(255,255,255,.85);font-size:12px;text-align:center;padding:0 16px;}
.svc-card h3{font-size:16.5px;color:var(--forest);margin:0 0 6px;}
.svc-card p{font-size:13.8px;color:var(--ink-soft);margin:0 0 10px;}
.svc-card .more{font-size:13.5px;font-weight:600;color:var(--forest);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:2px;}
.svc-card-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:2px;}

/* Practitioners */
.prac-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
@media(max-width:860px){.prac-grid{grid-template-columns:1fr;}}
.prac-grid-single{display:block;max-width:640px;}
.prac-card{text-align:left;}
.prac-photo{aspect-ratio:1/1.05;border-radius:6px;background:var(--forest-soft);margin-bottom:14px;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.prac-photo img{width:100%;height:100%;object-fit:cover;}
.prac-photo span{color:rgba(255,255,255,.75);font-size:12px;text-align:center;padding:0 14px;}
.prac-card h3{font-size:15.5px;color:var(--forest);margin:0 0 3px;}
.prac-card p{font-size:13px;color:var(--ink-soft);margin:0;}
.prac-card .prac-intro{margin:10px 0;font-size:13.5px;line-height:1.6;}
.prac-card .more{font-size:13.5px;font-weight:600;color:var(--forest);text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:2px;}

.prac-card-featured{display:flex;gap:28px;align-items:flex-start;}
.prac-card-featured .prac-photo{width:220px;flex-shrink:0;margin-bottom:0;}
.prac-card-featured .prac-body{flex:1;}
@media(max-width:640px){
  .prac-card-featured{flex-direction:column;}
  .prac-card-featured .prac-photo{width:100%;}
}
.section-cta{margin-top:32px;}

/* Testimonials placeholder */
.empty-note{
  border:1px dashed var(--sage); border-radius:6px; padding:28px; text-align:center;
  font-size:14px; color:var(--ink-soft); max-width:520px;
}
.coming-badge{display:inline-block;font-size:11px;letter-spacing:.06em;color:var(--forest);background:var(--gold);padding:4px 12px;border-radius:2px;font-weight:700;margin-bottom:10px;}

/* Location */
.loc-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:start;}
@media(max-width:860px){.loc-grid{grid-template-columns:1fr;}}
.loc-list{font-size:14.5px;margin:0;}
.loc-list dt{font-weight:700;color:var(--forest);margin-top:16px;font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;}
.loc-list dt:first-child{margin-top:0;}
.loc-list dd{margin:4px 0 0;color:var(--ink-soft);}
.loc-cta{margin-top:26px;}
.map-ph{aspect-ratio:16/10;border-radius:6px;border:1px dashed var(--sage);display:flex;align-items:center;justify-content:center;color:var(--ink-soft);font-size:13px;text-align:center;padding:24px;}

/* Pricing — card grid */
.price-group-label{
  font-size:17px; font-weight:700; color:var(--forest); margin:40px 0 16px;
  padding-bottom:8px; border-bottom:1px solid rgba(31,61,44,.15);
}
.price-group-label:first-of-type{margin-top:0;}

.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.price-grid-small{grid-template-columns:repeat(2,1fr);max-width:640px;}
@media(max-width:800px){
  .price-grid, .price-grid-small{grid-template-columns:1fr;}
}

.price-card{
  background:var(--white); border:1px solid rgba(31,61,44,.12); border-radius:10px;
  box-shadow:0 2px 8px rgba(31,61,44,.06); overflow:hidden;
}
.price-card h3{margin:0 0 4px;font-size:15px;line-height:1.35;color:var(--forest);font-weight:700;}
.price-dur{color:var(--sage);font-size:12.5px;margin:0 0 16px;}

.promo-photo{
  aspect-ratio:16/10; background:var(--sage); display:flex; align-items:center; justify-content:center;
}
.promo-photo span{color:rgba(255,255,255,.85);font-size:12px;text-align:center;padding:0 16px;}
.promo-body{padding:20px 24px 24px;}
.promo-subtitle{color:var(--ink-soft);font-size:12.5px;margin:0 0 10px;line-height:1.5;}
.promo-includes{color:var(--ink-soft);font-size:12.5px;margin:0 0 16px;line-height:1.5;}
.promo-body .price-dur{margin:0 0 16px;}

.price-tiers{
  display:grid; grid-template-columns:repeat(3,1fr); gap:8px;
  border-top:1px dashed rgba(31,61,44,.15); padding-top:14px;
}
.price-tiers-single{grid-template-columns:1fr;}
.price-tier{text-align:center;}
.price-tier .tier-n{font-size:11px;color:var(--sage);display:block;margin-bottom:2px;}
.price-tier .tier-p{font-weight:700;font-size:15px;color:var(--ink);}
.price-tier .tier-per{font-size:10.5px;color:var(--gold);display:block;margin-top:2px;}

.price-note{font-size:12.5px;color:var(--sage);margin-top:14px;}

/* Footer */
footer.site-footer{background:var(--forest);color:var(--cream);padding:40px 0;margin-top:16px;}
.footer-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;font-size:13px;}
.footer-row .fname{font-weight:600;font-size:14.5px;}
.footer-row .fmeta{color:var(--sage);font-size:12px;}

/* Generic pages (non-front) */
.page-content{padding:64px 0;min-height:40vh;}
.page-content h1{margin-bottom:18px;}
.page-content .placeholder-note{color:var(--ink-soft);font-size:14.5px;}

/* Practitioner full profile */
.practitioner-profile .more{display:inline-block;margin-bottom:32px;}
.prac-profile-grid{display:grid;grid-template-columns:320px 1fr;gap:44px;align-items:start;margin-bottom:48px;}
@media(max-width:720px){.prac-profile-grid{grid-template-columns:1fr;}}
.prac-photo-lg{aspect-ratio:4/4.6;}
.prac-specialty{color:var(--ink-soft);font-size:15px;margin:2px 0 20px;}
.prac-cta-row{margin-top:24px;}
.prac-bio{max-width:720px;border-top:1px solid var(--line);padding-top:32px;margin-bottom:48px;}
.prac-bio h2, .prac-gallery h2{font-size:20px;color:var(--forest);margin:0 0 16px;}
.prac-gallery{border-top:1px solid var(--line);padding-top:32px;}
.prac-gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:720px){.prac-gallery-grid{grid-template-columns:1fr;}}

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--forest);color:var(--cream);padding:10px 16px;z-index:100;}
.skip-link:focus{left:8px;top:8px;}

/* Mobile sticky booking bar */
.mobile-cta-bar{display:none;}
@media(max-width:860px){
  body{padding-bottom:72px;}
  .mobile-cta-bar{
    display:block; position:fixed; left:0; right:0; bottom:0; z-index:20;
    background:var(--forest); padding:12px 20px calc(12px + env(safe-area-inset-bottom));
    box-shadow:0 -2px 10px rgba(0,0,0,.12);
  }
  .mobile-cta-bar a{
    display:block; text-align:center; background:var(--gold); color:var(--forest);
    font-weight:700; font-size:15px; padding:12px; border-radius:4px; text-decoration:none;
  }
}
