/*
Theme Name: Skye Organic — Redesign
Theme URI: https://www.skyeorganic.com
Description: A brand-new, premium redesign concept for Skye Organic Hair & Scalp Wellness — built with the real content and images. Standalone demo theme: the design lives entirely in template files and writes NOTHING to the database, so you can activate it to preview and switch back to the old theme at any time with zero changes to your content, pages or plugins.
Author: Astrova
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: skye-redesign
*/

:root{
  --sage:#4A5D3A; --sage-dark:#2F3D24; --olive:#8BA06E; --olive-soft:#C3D0AE;
  --cream:#F6F2E9; --cream-2:#FBF8F1; --sand:#E7DFCF; --bark:#2A261F; --muted:#6E675B;
  --gold:#B08D57; --gold-soft:#EADFCB; --white:#fff;
  --maxw:1240px; --radius:18px; --radius-sm:10px;
  --shadow:0 30px 70px -34px rgba(42,38,31,.5); --shadow-sm:0 14px 34px -18px rgba(42,38,31,.32);
  --ff-head:"Cormorant Garamond",Georgia,serif; --ff-body:"Inter",-apple-system,sans-serif;
  --ease:cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--ff-body);color:var(--bark);background:var(--cream);font-size:17px;line-height:1.75;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--sage);text-decoration:none}
h1,h2,h3,h4{font-family:var(--ff-head);font-weight:600;color:var(--sage-dark);line-height:1.06;margin:0 0 .4em;letter-spacing:.004em}
h1{font-size:clamp(3rem,6.5vw,5.6rem);font-weight:600}
h2{font-size:clamp(2.2rem,4vw,3.4rem)}
h3{font-size:1.5rem}
p{margin:0 0 1.15rem}
.container{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:30px}
.section{padding-block:clamp(72px,9vw,130px)}
.eyebrow{display:inline-flex;align-items:center;gap:.7em;font-family:var(--ff-body);font-size:.78rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:0 0 1.1rem}
.eyebrow::before{content:"";width:30px;height:1.5px;background:currentColor;opacity:.7}
.lead{font-size:1.2rem;color:var(--muted);line-height:1.7}
.btn{display:inline-flex;align-items:center;gap:.6em;font-family:var(--ff-body);font-weight:600;font-size:.96rem;letter-spacing:.02em;padding:16px 34px;border-radius:100px;background:var(--sage);color:#fff;border:2px solid var(--sage);cursor:pointer;transition:.28s var(--ease)}
.btn:hover{background:var(--sage-dark);border-color:var(--sage-dark);transform:translateY(-2px);box-shadow:0 16px 30px -16px rgba(74,93,58,.7);color:#fff}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn--ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}
.btn--dark{background:var(--bark);border-color:var(--bark)}

/* ---------- header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:60;transition:.35s var(--ease)}
.site-header .container{display:flex;align-items:center;gap:30px;padding-block:20px}
.site-header.solid,.site-header.is-inner{background:rgba(246,242,233,.95);backdrop-filter:blur(12px);box-shadow:0 10px 40px -28px rgba(42,38,31,.5)}
/* inner pages: always a readable (dark-text on cream) header, regardless of scroll */
.site-header.is-inner .brand__txt{color:var(--sage-dark)}
.site-header.is-inner .brand__txt small{color:var(--gold)}
.site-header.is-inner .nav .menu > li > a{color:var(--bark)}
.site-header.is-inner .nav .menu a:hover{color:var(--sage)}
.site-header.is-inner .nav-toggle{color:var(--sage-dark)}
.brand{display:flex;align-items:center;gap:12px;margin-right:auto}
.brand img{height:52px;width:auto;border-radius:50%}
.brand__txt{font-family:var(--ff-head);font-size:1.6rem;font-weight:600;color:#fff;line-height:1}
.brand__txt small{display:block;font-family:var(--ff-body);font-size:.6rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft);margin-top:3px}
.solid .brand__txt{color:var(--sage-dark)} .solid .brand__txt small{color:var(--gold)}
.nav{margin-left:auto}
.nav .menu{display:flex;align-items:center;gap:24px;list-style:none;margin:0;padding:0}
.nav .menu li{position:relative;list-style:none}
.nav .menu a{font-size:.92rem;font-weight:500;color:#fff;white-space:nowrap;display:block;padding:6px 0;transition:color .2s}
.solid .nav .menu > li > a{color:var(--bark)}
.nav .menu a:hover{color:var(--gold-soft)} .solid .nav .menu a:hover{color:var(--sage)}
/* dropdowns */
.nav .sub-menu{position:absolute;top:100%;left:-14px;min-width:210px;background:#FBF8F1;list-style:none;margin:0;padding:8px 0;border-radius:12px;box-shadow:0 24px 50px -22px rgba(42,38,31,.55);border:1px solid var(--sand);opacity:0;visibility:hidden;transform:translateY(10px);transition:.22s var(--ease);z-index:70}
.nav .menu li:hover > .sub-menu{opacity:1;visibility:visible;transform:none}
.nav .sub-menu a{color:var(--bark) !important;padding:9px 18px;font-size:.9rem}
.nav .sub-menu a:hover{color:var(--sage) !important;background:var(--cream)}
.nav .menu-item-has-children > a::after{content:"▾";font-size:.7em;margin-left:5px;opacity:.7}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;color:#fff;padding:6px}
.solid .nav-toggle{color:var(--sage-dark)} .nav-toggle svg{width:30px;height:30px}

/* ---------- hero ---------- */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;background:var(--sage-dark)}
.hero__bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(30,40,22,.86) 0%,rgba(30,40,22,.62) 42%,rgba(30,40,22,.22) 72%,transparent 100%)}
/* top scrim — keeps the white menu readable over the lighter (right) part of the hero */
.hero__bg::before{content:"";position:absolute;top:0;left:0;right:0;height:170px;z-index:1;background:linear-gradient(to bottom,rgba(18,26,12,.62),transparent)}
.hero .container{position:relative;z-index:2;padding-block:140px}
.hero__inner{max-width:680px}
.hero .eyebrow{color:var(--gold-soft)}
.hero h1{color:#FCFBF6}
.hero h1 em{font-style:italic;color:var(--olive-soft);font-weight:500}
.hero p{color:#EAF0E0;font-size:1.28rem;max-width:540px;margin-top:.6em}
.hero__actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:38px}
.hero__badges{position:absolute;right:clamp(24px,4vw,60px);bottom:48px;z-index:2;display:flex;gap:14px}
.hero-pill{display:flex;flex-direction:column;gap:2px;background:rgba(251,248,241,.94);border-radius:16px;padding:16px 22px;box-shadow:var(--shadow-sm)}
.hero-pill b{font-family:var(--ff-head);font-size:1.7rem;color:var(--sage-dark);line-height:1}
.hero-pill span{font-size:.76rem;color:var(--muted)}
@media(max-width:820px){.hero__badges{display:none}}

/* ---------- intro / editorial split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,90px);align-items:center}
.split--reverse .split__media{order:2}
.split__media{position:relative}
.split__media img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow);aspect-ratio:4/5}
.split__media .tag{position:absolute;left:-24px;bottom:34px;background:var(--sage);color:#fff;padding:20px 26px;border-radius:16px;box-shadow:var(--shadow);max-width:220px}
.split__media .tag b{font-family:var(--ff-head);font-size:2.4rem;display:block;line-height:1}
.split__media .tag span{font-size:.85rem;color:var(--gold-soft)}
.checklist{list-style:none;margin:1.4rem 0 0;padding:0;display:grid;gap:14px}
.checklist li{position:relative;padding-left:38px;color:var(--bark)}
.checklist li::before{content:"";position:absolute;left:0;top:2px;width:24px;height:24px;border-radius:50%;background:var(--gold-soft);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234A5D3A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:13px}

/* ---------- services ---------- */
.section--cream2{background:var(--cream-2)}
.head{max-width:660px;margin:0 auto 60px;text-align:center}
.head .eyebrow{justify-content:center}
.head p{color:var(--muted);font-size:1.12rem;margin-bottom:0}
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.svc{background:var(--cream);border:1px solid var(--sand);border-radius:var(--radius);padding:40px 34px;transition:.32s var(--ease)}
.svc:hover{transform:translateY(-8px);box-shadow:var(--shadow);border-color:var(--olive-soft);background:#fff}
.svc__ic{width:62px;height:62px;border-radius:16px;background:var(--gold-soft);color:var(--sage);display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.svc__ic svg{width:32px;height:32px}
.svc h3{margin-bottom:.35em}
.svc p{color:var(--muted);margin-bottom:1em;font-size:.98rem}
.svc a{font-weight:600;font-size:.9rem;letter-spacing:.02em;display:inline-flex;gap:.4em;align-items:center}
.svc a::after{content:"→";transition:.2s} .svc:hover a::after{transform:translateX(4px)}

/* ---------- awards strip ---------- */
.awards{background:var(--sage-dark);color:#E9EFE0}
.awards .container{padding-block:56px}
.awards__head{text-align:center;font-family:var(--ff-body);font-size:.8rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:34px}
.awards__row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(28px,5vw,64px)}
.awards__row span{font-family:var(--ff-head);font-size:clamp(1.2rem,2vw,1.7rem);color:#DCE6CD;opacity:.9;font-style:italic}

/* ---------- feature band ---------- */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.feature{text-align:center;padding:14px}
.feature__ic{width:70px;height:70px;margin:0 auto 22px;border-radius:50%;background:var(--cream-2);border:1px solid var(--sand);display:flex;align-items:center;justify-content:center;color:var(--sage)}
.feature__ic svg{width:32px;height:32px}
.feature h3{font-size:1.35rem}.feature p{color:var(--muted);margin-bottom:0}

/* ---------- testimonials ---------- */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.testi{background:var(--cream-2);border:1px solid var(--sand);border-radius:var(--radius);padding:34px 32px;display:flex;flex-direction:column;gap:16px}
.testi__stars{color:var(--gold);letter-spacing:3px}
.testi__q{font-family:var(--ff-head);font-size:1.3rem;font-style:italic;color:var(--sage-dark);line-height:1.5;margin:0}
.testi__by{display:flex;align-items:center;gap:13px}
.testi__by .av{width:46px;height:46px;border-radius:50%;background:var(--sage);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600}
.testi__by b{display:block;color:var(--bark)} .testi__by span{font-size:.85rem;color:var(--muted)}

/* ---------- CTA ---------- */
.cta{position:relative;overflow:hidden;background:var(--sage-dark)}
.cta__bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.25;z-index:0}
.cta .container{position:relative;z-index:2;text-align:center;padding-block:clamp(70px,9vw,120px)}
.cta h2{color:#fff;max-width:720px;margin-inline:auto}
.cta p{color:#DCE6CD;max-width:520px;margin:0 auto 30px;font-size:1.15rem}

/* ---------- footer ---------- */
.site-footer{background:var(--bark);color:#C7C0B2;padding-top:80px}
.site-footer .container{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:44px;padding-bottom:56px}
.site-footer h4{color:#F3EEE4;font-family:var(--ff-body);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;margin-bottom:22px}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;font-size:.95rem}
.site-footer a{color:#C7C0B2}.site-footer a:hover{color:#fff}
.foot-name{font-family:var(--ff-head);font-size:1.8rem;color:#F3EEE4;margin-bottom:14px}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1)}
.foot-bottom .container{display:flex;justify-content:space-between;grid-template-columns:none;padding-block:26px;font-size:.85rem}

/* ---------- generic inner pages ---------- */
.page-hero{position:relative;background:var(--sage-dark);color:#fff;padding-top:150px;overflow:hidden}
.page-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 84% 15%,rgba(139,160,110,.4),transparent 55%)}
.page-hero .container{position:relative;z-index:1;padding-block:56px}
.page-hero h1{color:#fff;font-size:clamp(2.6rem,5vw,4.4rem)}
.page-body{padding-block:clamp(50px,6vw,80px)}
.page-body .container{max-width:860px}
/* real (extracted) page content styled into the new look */
.legacy{font-size:1.05rem}
.legacy h1,.legacy h2,.legacy h3,.legacy h4{margin:1.7em 0 .5em;color:var(--sage-dark)}
.legacy h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.legacy h3{font-size:1.5rem}
.legacy p{margin:0 0 1.15rem;color:var(--bark);line-height:1.78}
.legacy a{color:var(--sage);text-decoration:underline;text-underline-offset:2px}
.legacy strong,.legacy b{color:var(--sage-dark)}
.legacy img{border-radius:var(--radius);margin:1.8rem auto;box-shadow:var(--shadow-sm);display:block}
.legacy ul,.legacy ol{margin:0 0 1.3rem 1.3rem;padding:0;display:grid;gap:.55rem}
.legacy li{color:var(--bark)}
.legacy .blurb{margin:0 0 1.4rem}
.legacy .blurb h3{margin-top:0}
.legacy [style*="color: #fff"],.legacy [style*="color:#fff"],.legacy [style*="color: #ffffff"],.legacy [style*="color:#ffffff"],.legacy [style*="color: white"]{color:var(--bark) !important}
.legacy [style*="background"]{background-color:transparent !important}
.legacy [style*="text-align: center"]{text-align:left !important}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:.7s var(--ease)}
.reveal.in{opacity:1;transform:none}

@media(max-width:900px){
  .split,.svc-grid,.features,.testi-grid{grid-template-columns:1fr}
  .split--reverse .split__media{order:0}
  .site-footer .container{grid-template-columns:1fr 1fr}
  .nav,.header-cta{display:none}.nav-toggle{display:inline-flex}
  .hero{min-height:auto}.hero .container{padding-block:130px 90px}
}
@media(max-width:560px){.svc-grid,.features,.testi-grid,.site-footer .container{grid-template-columns:1fr}.foot-bottom .container{flex-direction:column;gap:8px}}