/*
Theme Name: Vira Care
Theme URI: https://viracare.ch
Author: Bergluft Studio
Description: Ayurveda-Praxis-Theme im ruhigen, erdigen Stil. Block-Theme (FSE) mit globalen Tokens in theme.json und den Sektionen als Pattern.
Version: 0.2.3
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 7.4
Text Domain: viracare
*/

/* --- Schriften: für den Start via Google Fonts. Für den DSGVO-konformen Launch
   in der Schweiz/EU bitte selbst hosten (siehe assets/fonts + theme.json fontFace). --- */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500&family=Mulish:wght@300;400;500;600&display=swap');

:root{
  --sand:#EBE5D6;
  --cream:#F4F0E6;
  --ink:#262A20;
  --ink-soft:#5A604E;
  --sage:#586147;
  --sage-deep:#3B4232;
  --clay:#B0673E;
  --line:#D4CCB8;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--sand);color:var(--ink);
  font-family:'Mulish',sans-serif;font-weight:400;line-height:1.65;margin:0;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,h4{font-family:'Fraunces',serif;font-weight:400;line-height:1.04;letter-spacing:-.01em;margin:0}
.vc-wrap{max-width:var(--max);margin:0 auto;padding:0 32px}
.vc-eyebrow{font-family:'Mulish',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sage)}
a{color:inherit;text-decoration:none}

.vc-btn{display:inline-flex;align-items:center;gap:.55em;font-family:'Mulish',sans-serif;font-weight:600;font-size:.92rem;padding:.95em 1.6em;border-radius:100px;border:1px solid var(--sage);transition:transform .3s cubic-bezier(.22,1,.36,1),background .3s ease,color .3s ease;cursor:pointer}
.vc-btn-solid{background:var(--sage);color:var(--cream)}
.vc-btn-solid:hover{background:var(--sage-deep);transform:translateY(-2px)}
.vc-btn-ghost{background:transparent;color:var(--sage)}
.vc-btn-ghost:hover{background:var(--sage);color:var(--cream);transform:translateY(-2px)}

#vc-hdr{position:sticky;top:0;z-index:50;background:rgba(235,229,214,.82);backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .3s}
#vc-hdr.scrolled{border-color:var(--line)}
#vc-hdr nav{display:flex;align-items:center;justify-content:space-between;height:78px;max-width:var(--max);margin:0 auto;padding:0 32px}
.vc-brand{display:flex;align-items:center;gap:.6em;font-family:'Fraunces',serif;font-size:1.4rem;letter-spacing:.01em}
.vc-brand svg{width:30px;height:30px}
.vc-navlinks{display:flex;gap:2.4rem;align-items:center}
.vc-navlinks a{font-size:.93rem;color:var(--ink-soft);transition:color .2s}
.vc-navlinks a:hover{color:var(--ink)}
.vc-nav-cta{padding:.62em 1.25em;font-size:.85rem}
.vc-menu-btn{display:none;background:none;border:none;cursor:pointer;color:var(--ink)}

.vc-hero{padding:72px 0 90px;position:relative}
.vc-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.vc-hero h1{font-size:clamp(3rem,7vw,5.6rem);margin:.28em 0 .42em}
.vc-hero h1 em{font-style:italic;color:var(--sage)}
.vc-hero p.vc-lead{font-size:1.18rem;color:var(--ink-soft);max-width:32ch;margin-bottom:2.2em}
.vc-hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.vc-hero-visual{position:relative;aspect-ratio:4/5;border-radius:200px 200px 24px 24px;background:linear-gradient(165deg,#9AA37E 0%,#6E7757 45%,#4C5440 100%);overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.vc-hero-visual .vc-botanical{position:absolute;inset:0;width:100%;height:100%;opacity:.5}
.vc-hero-visual .vc-caption{position:relative;z-index:2;color:#EFEAD9;font-family:'Fraunces',serif;font-style:italic;font-size:1.05rem;padding:0 0 32px;text-align:center;opacity:.92}

.vc-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;margin-top:10px}
.vc-strip-inner{display:flex;gap:3rem;justify-content:center;flex-wrap:wrap;color:var(--ink-soft);font-size:.9rem}
.vc-strip-inner span{display:flex;align-items:center;gap:.5em}
.vc-strip-inner span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--clay)}

.vc-section{padding:108px 0}
.vc-section-head{max-width:620px;margin-bottom:56px}
.vc-section-head h2{font-size:clamp(2.1rem,4.2vw,3.2rem);margin:.35em 0 .5em}
.vc-section-head p{color:var(--ink-soft);font-size:1.06rem}

.vc-philo{background:var(--cream)}
.vc-doshas{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:8px}
.vc-dosha{padding:38px 30px;border:1px solid var(--line);border-radius:18px;background:var(--sand);position:relative;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.vc-dosha::after{content:"";position:absolute;inset:0;border-radius:18px;box-shadow:0 22px 40px -28px rgba(59,66,50,.45);opacity:0;transition:opacity .45s ease;pointer-events:none}
.vc-dosha:hover{transform:translateY(-6px)}
.vc-dosha:hover::after{opacity:1}
.vc-dosha .vc-mark{width:46px;height:46px;margin-bottom:22px;color:var(--sage)}
.vc-dosha h3{font-size:1.55rem;margin-bottom:.35em}
.vc-dosha .vc-el{font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--clay);font-weight:600;display:block;margin-bottom:1em}
.vc-dosha p{color:var(--ink-soft);font-size:.96rem}

.vc-svc-list{border-top:1px solid var(--line)}
.vc-svc{display:grid;grid-template-columns:auto 1fr auto;gap:36px;align-items:baseline;padding:34px 0;border-bottom:1px solid var(--line)}
.vc-svc .vc-num,.vc-svc .vc-body{transition:transform .45s cubic-bezier(.22,1,.36,1)}
.vc-svc:hover .vc-num,.vc-svc:hover .vc-body{transform:translateX(12px)}
.vc-svc .vc-num{font-family:'Fraunces',serif;font-size:1rem;color:var(--sage);padding-top:.3em}
.vc-svc .vc-body h3{font-size:1.75rem;margin-bottom:.2em}
.vc-svc .vc-body p{color:var(--ink-soft);font-size:1rem;max-width:54ch}
.vc-svc .vc-meta{text-align:right;white-space:nowrap}
.vc-svc .vc-price{font-family:'Fraunces',serif;font-size:1.5rem}
.vc-svc .vc-dur{display:block;font-size:.82rem;color:var(--ink-soft);margin-top:.1em}

.vc-process{background:var(--sage-deep);color:#E8E4D6}
.vc-process .vc-eyebrow{color:#B9C19E}
.vc-process .vc-section-head h2{color:#F4F0E6}
.vc-process .vc-section-head p{color:#C5C8B4}
.vc-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.vc-step .vc-n{font-family:'Fraunces',serif;font-size:2.6rem;color:#9AA37E;line-height:1;margin-bottom:.35em}
.vc-step h3{font-size:1.4rem;color:#F4F0E6;margin-bottom:.4em}
.vc-step p{color:#C5C8B4;font-size:.96rem}

.vc-about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}
.vc-about-visual{aspect-ratio:1;border-radius:24px;background:linear-gradient(150deg,#C9B79A,#A98E6B);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.vc-about-visual svg{width:62%;height:62%;opacity:.55;color:#5A4A33}
.vc-about-body h2{font-size:clamp(2rem,4vw,3rem);margin:.3em 0 .55em}
.vc-about-body p{color:var(--ink-soft);margin-bottom:1.2em;font-size:1.05rem;max-width:52ch}
.vc-signoff{font-family:'Fraunces',serif;font-style:italic;font-size:1.3rem;color:var(--sage)}

.vc-quote{background:var(--cream);text-align:center}
.vc-quote blockquote{max-width:760px;margin:0 auto;font-family:'Fraunces',serif;font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.3}
.vc-quote cite{display:block;margin-top:1.4em;font-family:'Mulish',sans-serif;font-style:normal;font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}

.vc-book{text-align:center}
.vc-book-card{background:var(--sage);color:var(--cream);border-radius:28px;padding:74px 40px;position:relative;overflow:hidden}
.vc-book-card .vc-botanical{position:absolute;inset:0;width:100%;height:100%;opacity:.12;color:#fff}
.vc-book-card h2{position:relative;font-size:clamp(2.1rem,4.5vw,3.4rem);margin-bottom:.4em}
.vc-book-card p{position:relative;color:#DCE0CB;max-width:46ch;margin:0 auto 2em;font-size:1.08rem}
.vc-book-card .vc-btn-solid{position:relative;background:var(--cream);color:var(--sage-deep);border-color:var(--cream)}
.vc-book-card .vc-btn-solid:hover{background:#fff;transform:translateY(-2px)}

#vc-footer{background:var(--sage-deep);color:#C5C8B4;padding:72px 0 40px}
.vc-foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:48px;border-bottom:1px solid rgba(255,255,255,.12)}
#vc-footer .vc-brand{color:#F4F0E6;margin-bottom:1em}
#vc-footer h4{font-family:'Mulish',sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:#9AA37E;margin-bottom:1.2em}
#vc-footer p,#vc-footer li{font-size:.95rem;line-height:1.9;list-style:none}
#vc-footer a:hover{color:#F4F0E6}
.vc-foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:28px;font-size:.82rem;color:#8E927E}

.vc-reveal{transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.js-reveal .vc-reveal{opacity:0;transform:translateY(26px)}
.vc-reveal.in{opacity:1;transform:none}

@media(max-width:880px){
  .vc-navlinks{display:none}
  .vc-menu-btn{display:block}
  .vc-hero-grid,.vc-about-grid{grid-template-columns:1fr;gap:44px}
  .vc-hero-visual{aspect-ratio:5/4;border-radius:120px 120px 20px 20px;max-height:420px}
  .vc-doshas,.vc-steps{grid-template-columns:1fr}
  .vc-svc{grid-template-columns:1fr;gap:8px}
  .vc-svc .vc-meta{text-align:left}
  .vc-foot-grid{grid-template-columns:1fr}
  .vc-section{padding:78px 0}
}
@media(prefers-reduced-motion:reduce){
  .js-reveal .vc-reveal,.vc-reveal{transition:none;opacity:1;transform:none}
  html{scroll-behavior:auto}
}
