/* =========================================================
   Naturheilpraxis Dilje — Premium CSS
   DSGVO-friendly: local fonts only, no Google Fonts import

   Wichtig:
   Lege die Schriftdateien lokal in deinem Theme ab, z. B.:
   /wp-content/themes/DEIN-THEME/assets/fonts/InterVariable.woff2
   /wp-content/themes/DEIN-THEME/assets/fonts/PlayfairDisplay.woff2

   Wenn du andere Dateinamen nutzt, passe unten nur die src-URLs an.
   ========================================================= */

@font-face{
  font-family:"Praxis Sans";
  src:url("/wp-content/themes/naturpraxis/assets/fonts/InterVariable.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Praxis Serif";
  src:url("/wp-content/themes/naturpraxis/assets/fonts/PlayfairDisplay.woff2") format("woff2");
  font-weight:400 800;
  font-style:normal;
  font-display:swap;
}

:root{
  --bg:#fbfaf7;
  --surface:#ffffff;
  --muted:#f2f6f1;
  --muted-warm:#f7f1ea;
  --text:#1e2420;
  --sub:#4f5c55;
  --accent:#1f8e56;
  --accent-dark:#176c41;
  --accent-soft:rgba(31,142,86,.12);
  --white:#ffffff;
  --footer:#111f1a;
  --footer-2:#172b25;
  --radius:22px;
  --radius-lg:30px;
  --shadow:0 18px 48px rgba(18,33,26,.10);
  --shadow-soft:0 12px 34px rgba(18,33,26,.08);
  --container:1140px;
  --font-body:"Praxis Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-display:"Praxis Serif", "Praxis Sans", system-ui, sans-serif;
}

*{ box-sizing:border-box; }
html,body{ width:100%; overflow-x:hidden; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--text);
  background:var(--bg);
  line-height:1.65;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; }
.container{ width:min(var(--container), calc(100% - 32px)); margin-inline:auto; }
.section{ padding:72px 0; }
.section--muted{ background:linear-gradient(180deg,var(--muted) 0%,#f7faf6 100%); }
.lead{ color:var(--sub); font-size:1.08rem; max-width:70ch; }
h1,h2,h3{ line-height:1.15; margin:0 0 14px; letter-spacing:-.025em; }
h1,h2{ font-family:var(--font-display); font-weight:650; }
h1{ font-size:clamp(2.4rem, 5vw, 4.8rem); }
h2{ font-size:clamp(1.8rem, 3.2vw, 3rem); }
h3{ font-size:1.18rem; font-weight:800; }
p{ margin:0 0 14px; }

.skip-link{ position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus{
  left:16px; top:16px; width:auto; height:auto;
  background:#fff; padding:10px 12px; border-radius:14px; z-index:99999;
  box-shadow:var(--shadow);
}

/* Brand */
.brand{ display:flex; align-items:center; gap:14px; text-decoration:none; }
.brand__logo{ width:64px; height:64px; filter:drop-shadow(0 10px 22px rgba(0,0,0,.16)); }
.brand__text{ display:flex; flex-direction:column; line-height:1.12; }
.brand__title{ font-weight:900; letter-spacing:.01em; font-size:1.12rem; }
.brand__subtitle{ margin-top:4px; font-weight:650; font-size:.92rem; opacity:.88; }
.brand--dark .brand__title,
.brand--dark .brand__subtitle{ color:var(--text); }
.brand--light .brand__title,
.brand--light .brand__subtitle{ color:rgba(255,255,255,.96); text-shadow:0 8px 22px rgba(0,0,0,.25); }

/* Header */
.header{
  position:sticky;
  top:0;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(18px);
  z-index:50;
  border-bottom:1px solid rgba(20,35,27,.08);
}
.header__row{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; }
.site-header{ width:100%; z-index:100; }
.site-header--home{ position:absolute; top:0; left:0; background:transparent; }
.site-header--inner{ position:relative; background:rgba(234,245,241,.92); backdrop-filter:blur(14px); }
.site-header--inner .topnav__link,
.site-header--inner .dropdown__toggle,
.site-header--inner .brand__title,
.site-header--inner .brand__subtitle{ color:#26332e; }
.site-header--inner .nav-toggle__bar{ background:#26332e; }
.home .container.hero__topbar{ margin-top:20px !important; }

/* Hero */
.hero{
  position:relative;
  min-height:86vh;
  background:center/cover no-repeat var(--hero-image);
  color:var(--white);
  isolation:isolate;
  display:flex;
  align-items:flex-start;
}
.hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:38%;
  background:linear-gradient(to bottom,rgba(251,250,247,0),var(--bg));
  z-index:0;
  pointer-events:none;
}
.hero__overlay{
position:absolute;
inset:0;

background:
linear-gradient(
to bottom,
rgba(35,65,45,.52) 0%,
rgba(35,75,52,.44) 32%,
rgba(35,75,52,.30) 62%,
rgba(35,75,52,.16) 100%
);

z-index:0;
}
.hero__topbar{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:22px 0;
}
.hero__content{
  position:relative;
  z-index:1;
  min-height:calc(78vh - 86px);
  display:grid;
  place-items:center;
  padding:64px 0 84px;
  text-align:center;
  margin-top:92px;
}
.hero__content > div{ width:100%; max-width:920px; margin:0 auto; text-align:center; }
.hero__title{
    font-size: clamp(54px, 6vw, 76px);
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -2px;
    max-width: 980px;
    margin: 0 auto 28px;
    text-shadow: 0 4px 18px rgba(0,0,0,.22);
}
.hero__subtitle{
    font-size: clamp(18px, 1.8vw, 24px);
    line-height: 1.65;
    max-width: 760px;
    margin: 0 auto;
    color:#ffffff !important;
    opacity:1 !important;
    font-weight:600 !important;
    text-shadow:0 2px 12px rgba(0,0,0,.60) !important;
}

/* Navigation */
.topnav{
  display:flex;
  align-items:center;
  gap:10px;
  z-index:10050;
}

/* Alle Hauptmenü-Punkte exakt gleich: Links + Therapie-Dropdown */
.topnav__link,
.dropdown__toggle{
  font-family:var(--font-body) !important;
  font-size:18px !important;
  font-weight:800 !important;
  line-height:1 !important;

  padding:18px 24px !important;
  min-height:58px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;

  border:0 !important;
  border-radius:999px !important;
  box-sizing:border-box !important;

  background:transparent !important;
  cursor:pointer !important;
  white-space:nowrap !important;
  text-decoration:none !important;

  appearance:none !important;
  -webkit-appearance:none !important;

  transition:
    background .22s ease,
    transform .22s ease,
    color .22s ease,
    box-shadow .22s ease !important;
}

.topnav__link:hover,
.dropdown__toggle:hover{
  transform:translateY(-1px);
  text-decoration:none !important;
}

/* Menü auf dunklem Hero */
.topnav--light .topnav__link,
.topnav--light .dropdown__toggle{
  color:rgba(255,255,255,.96) !important;
  text-shadow:0 3px 14px rgba(0,0,0,.22);
}

.topnav--light .topnav__link:hover,
.topnav--light .dropdown__toggle:hover{
  background:rgba(255,255,255,.14) !important;
}

.topnav--light .topnav__link.is-active{
  background:rgba(255,255,255,.18) !important;
}

/* Menü auf hellen Innen-Seiten */
.topnav--dark .topnav__link,
.topnav--dark .dropdown__toggle{
  color:var(--text) !important;
  text-shadow:none;
}

.topnav--dark .topnav__link:hover,
.topnav--dark .dropdown__toggle:hover{
  background:rgba(31,142,86,.10) !important;
}

.topnav--dark .topnav__link.is-active{
  background:rgba(31,142,86,.12) !important;
}

.dropdown{ position:relative; }

.dropdown__chev{
  width:9px !important;
  height:9px !important;
  display:inline-block;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  margin-left:4px !important;
  margin-top:-3px !important;
  opacity:.9 !important;
  flex:0 0 auto;
}

.dropdown__menu{
  position:absolute;
  top:calc(100% + 12px);
  left:0;
  min-width:390px;
  border-radius:24px;
  padding:18px;
  display:none;
  z-index:10060;
}

.topnav--dark .dropdown__menu{
  background:#fff;
  border:1px solid rgba(20,35,27,.10);
  box-shadow:var(--shadow);
}

.topnav--light .dropdown__menu{
  background:linear-gradient(
    180deg,
    rgba(24,62,44,.96) 0%,
    rgba(18,43,34,.96) 100%
  ) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:0 20px 55px rgba(0,0,0,.30) !important;
  backdrop-filter:blur(14px);
}

.dropdown__menu a{
  display:block;
  padding:13px 16px;
  border-radius:16px;
  font-size:16px;
  font-weight:700;
  text-decoration:none !important;
}

.topnav--dark .dropdown__menu a{ color:var(--text); }
.topnav--dark .dropdown__menu a:hover{ background:rgba(31,142,86,.10); }
.topnav--light .dropdown__menu a{ color:rgba(255,255,255,.95) !important; }
.topnav--light .dropdown__menu a:hover{ background:rgba(255,255,255,.10) !important; }

.dropdown.is-open .dropdown__menu{ display:block; }

/* Mobile toggle */
.nav-toggle{ display:none; background:transparent; border:0; padding:10px; border-radius:14px; }
.nav-toggle__bar{ display:block; width:24px; height:2px; margin:5px 0; border-radius:99px; }
.nav-toggle--light .nav-toggle__bar{ background:rgba(255,255,255,.96); }
.nav-toggle--dark .nav-toggle__bar{ background:var(--text); }

/* Buttons */
.btn,
.callback-btn,
.wpcf7-submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 26px;
  border-radius:999px;
  border:1px solid transparent;
  font-weight:850;
  cursor:pointer;
  white-space:nowrap;
  background:linear-gradient(135deg,var(--accent) 0%,#2ca66a 100%);
  color:#fff;
  box-shadow:0 14px 28px rgba(31,142,86,.22);
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}
.btn:hover,
.callback-btn:hover,
.wpcf7-submit:hover{
  background:linear-gradient(135deg,var(--accent-dark) 0%,var(--accent) 100%);
  text-decoration:none;
  transform:translateY(-2px);
  box-shadow:0 18px 36px rgba(31,142,86,.28);
}
.btn--small{ padding:10px 16px; font-size:.95rem; }
.btn--primary{ background:linear-gradient(135deg,var(--accent) 0%,#2ca66a 100%); color:#fff; }

/* Layout */
.grid-2{ display:grid; grid-template-columns:1.05fr .95fr; gap:42px; align-items:start; }
.figure{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow); background:#fff; }
.figure--portrait{ max-width:380px; margin-left:auto; }
.figure--portrait img{ width:100%; height:auto; object-fit:cover; border-radius:24px; }
.home h2{ font-size:clamp(2.1rem, 4vw, 3rem); }
.home p{ font-size:18px; line-height:1.75; color:var(--sub); }
.home .grid-2 h2{ font-size:clamp(34px,4vw,46px); line-height:1.12; margin-bottom:18px; }
.home .grid-2 p{ font-size:18px; line-height:1.75; }
main#content{ padding-top:46px; }

/* Steps */
.steps{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:24px; }
.step{ display:flex; gap:15px; background:var(--surface); border:1px solid rgba(31,142,86,.08); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow-soft); }
.step__num{ width:38px; height:38px; border-radius:999px; background:var(--accent-soft); display:grid; place-items:center; font-weight:950; color:var(--accent-dark); flex:0 0 auto; }
.step__body p{ margin:0; color:var(--sub); }

/* Cards */
.cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.card{ background:var(--surface); border-radius:26px; overflow:hidden; box-shadow:var(--shadow-soft); border:1px solid rgba(31,142,86,.07); display:flex; flex-direction:column; transition:transform .22s ease, box-shadow .22s ease; }
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.card__img{ width:100%; aspect-ratio:16/10; object-fit:cover; }
.card__body{ padding:18px 18px 20px; }
.card__body p{ margin:0 0 12px; color:var(--sub); }
.card__link{ font-weight:900; color:var(--accent); }

/* Panels / lists */
.bullets{ margin:14px 0 0; padding-left:18px; }
.bullets li{ margin:6px 0; }
.panel{ background:var(--surface); border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); border:1px solid rgba(31,142,86,.08); padding:24px; margin-top:18px; }
.center-text{ text-align:center; margin-left:auto; margin-right:auto; }

/* Forms */
.form{ margin-top:22px; }
.form--center{ text-align:center; }
.form__grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; text-align:left; max-width:860px; margin:0 auto; }
.form__full{ grid-column:1/-1; }
label{ display:block; font-weight:850; font-size:.95rem; color:var(--text); }
input,textarea{
  width:100%;
  margin-top:6px;
  padding:14px 16px;
  border:1px solid rgba(31,142,86,.14);
  border-radius:18px;
  font:inherit;
  background:#fff;
  color:var(--text);
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
input:focus,textarea:focus{ outline:0; border-color:rgba(31,142,86,.48); box-shadow:0 0 0 5px rgba(31,142,86,.10); }
.form__actions{ margin-top:16px; text-align:center; }

/* Contact */
.contact-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:22px; }
.contact-box{ background:#fff; border-radius:var(--radius); box-shadow:var(--shadow-soft); border:1px solid rgba(31,142,86,.08); padding:20px; }

/* Therapie list */
.therapy-list{ display:grid; gap:18px; }
.therapy-item{ display:grid; grid-template-columns:240px 1fr; gap:18px; background:#fff; border-radius:var(--radius); box-shadow:var(--shadow-soft); border:1px solid rgba(31,142,86,.08); padding:16px; align-items:start; scroll-margin-top:110px; }
.therapy-item img{ width:100%; border-radius:16px; aspect-ratio:4/3; object-fit:cover; }
.therapie-row{ display:grid; grid-template-columns:360px 1fr; gap:52px; align-items:start !important; }
.therapie-row--reverse{ grid-template-columns:1fr 360px; }
.therapie-row--reverse .therapie-media{ order:2; }
.therapie-row--reverse .therapie-content{ order:1; }
.therapie-media img{ width:100%; height:260px; object-fit:cover; display:block; border-radius:26px; box-shadow:var(--shadow-soft); }
.therapie-content h2{ font-size:clamp(2rem,3vw,2.5rem); line-height:1.15; margin-bottom:16px; }
.therapie-content p{ font-size:18px; line-height:1.78; margin:0 0 16px; color:var(--sub); }

/* Callback / Termin */
.callback-section{ padding:68px 0 52px; background:linear-gradient(180deg,#fff 0%,var(--bg) 100%); }
.callback-box{ max-width:980px; margin:0 auto; }
.callback-header{ text-align:center; margin-bottom:28px; }
.callback-title h2{ margin:0 0 12px; font-family:var(--font-display); font-size:clamp(42px,4.8vw,64px); line-height:1.05; font-weight:600; color:#241f1c; letter-spacing:-.04em; }
.callback-text{ max-width:720px; margin:0 auto; }
.callback-text p{ margin:0; font-size:16px; line-height:1.75; color:#5b514d; }
.wpcf7 form{ max-width:700px; margin:30px auto 0; }
.callback-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:20px; }
.form-field input,
.callback-grid input{ width:100%; height:58px; padding:0 22px; border:1px solid rgba(31,142,86,.10); border-radius:999px; background:#f7f2ed; font-size:16px; color:#302b28; box-sizing:border-box; }
.callback-grid input::placeholder{ color:#8e8480; }
.callback-consent{ margin:12px auto 26px; max-width:680px; }
.callback-consent .wpcf7-list-item{ margin:0; }
.callback-consent label{ display:flex; align-items:flex-start; gap:12px; }
.callback-consent input[type="checkbox"]{ margin-top:5px; width:16px; height:16px; accent-color:var(--accent); flex:0 0 auto; }
.callback-consent .wpcf7-list-item-label{ font-size:14px; line-height:1.65; color:#332c2a; }
.callback-actions,
.wpcf7 form p:last-child{ text-align:center; }
.callback-btn,
.wpcf7-submit{
  width:auto !important;
  min-width:260px;
  max-width:320px;
  padding:15px 34px;
  margin-top:6px;
  font-size:16px;
}
.wpcf7-not-valid-tip{ font-size:13px; margin-top:6px; }

/* Footer Premium */
.footer,
.site-footer{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 18% 16%, rgba(43,158,102,.20), transparent 34%),
    linear-gradient(135deg,var(--footer) 0%,var(--footer-2) 100%);
  color:rgba(255,255,255,.92);
  padding-top:46px;
}
.footer::before,
.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0));
  pointer-events:none;
}
.footer__grid{
  position:relative;
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:28px;
  padding-bottom:28px;
}
.footer__cta{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  border-radius:28px;
  padding:28px;
  box-shadow:0 18px 50px rgba(0,0,0,.18);
  backdrop-filter:blur(12px);
}
.footer__name{ font-family:var(--font-display); font-size:28px; font-weight:650; letter-spacing:-.02em; margin-bottom:12px; }
.footer__meta{ font-size:16px; line-height:1.85; color:rgba(255,255,255,.82); }
.footer__links{ display:grid; gap:12px; align-content:center; justify-content:start; padding:10px 0; }
.footer__links a{ color:rgba(255,255,255,.88); text-decoration:none; font-weight:760; padding:6px 0; }
.footer__links a:hover{ color:#fff; text-decoration:none; }
.footer__bottom{ position:relative; border-top:1px solid rgba(255,255,255,.12); padding:16px 0 24px; color:rgba(255,255,255,.68); font-size:14px; }

/* Overlay */
.nav-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:10040; }

@media (max-width:980px){
  .grid-2{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .contact-grid{ grid-template-columns:1fr; }
  .therapy-item{ grid-template-columns:1fr; }
  .footer__grid{ grid-template-columns:1fr; }
  .therapie-row,
  .therapie-row--reverse{ grid-template-columns:1fr; gap:28px; }
  .therapie-row--reverse .therapie-media,
  .therapie-row--reverse .therapie-content{ order:initial; }
}

@media (max-width:768px){
  .section{ padding:54px 0; }
  .hero{ min-height:72vh; }
  .hero__content{ padding:112px 0 76px; margin-top:34px; }
  .hero__title{
    font-size:clamp(36px,10vw,48px);
    line-height:1.08;
    font-weight:700;
    letter-spacing:-1px;
    max-width:92%;
    margin:0 auto 20px;
    text-shadow:0 4px 18px rgba(0,0,0,.22);
  }
  .hero__subtitle{
    font-size:17px;
    line-height:1.55;
    max-width:92%;
  }
}
@media (max-width:760px){
  .nav-toggle{ display:inline-block; }
  .topnav{
    position:fixed;
    top:14px;
    left:16px;
    right:16px;
    max-height:calc(100vh - 28px);
    overflow:auto;
    border-radius:22px;
    padding:14px;
    display:none;
    box-shadow:var(--shadow);
    z-index:10050;
  }
  .topnav.is-open{ display:flex; flex-direction:column; align-items:stretch; gap:10px; }
  .topnav--light{ background:rgba(13,28,22,.92); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(14px); }
  .topnav--dark{ background:#fff; border:1px solid rgba(0,0,0,.12); }
  .topnav__link,
  .dropdown__toggle,
  .btn{ width:100%; justify-content:flex-start; text-align:left; }
  .dropdown__menu{ position:static; display:none; border:0; box-shadow:none; padding:6px 0 0; min-width:0; background:transparent; }
  .topnav--light .dropdown__menu a{ color:rgba(255,255,255,.95); }
  .topnav--light .dropdown__menu a:hover{ background:rgba(255,255,255,.10); }
  .topnav--dark .dropdown__menu a{ color:var(--text); }
  .topnav--dark .dropdown__menu a:hover{ background:rgba(0,0,0,.06); }
  .dropdown.is-open .dropdown__menu{ display:block; }
  .form__grid{ grid-template-columns:1fr; }
  .cards{ grid-template-columns:1fr; }
  .figure--portrait img{ height:auto; }
}


/* ===== PREMIUM HERO REFINEMENT — calmer, more readable ===== */
@media (max-width: 768px){
  .hero__title{
    font-size: clamp(36px, 10vw, 48px);
    letter-spacing: -1px;
    line-height: 1.08;
    margin-bottom: 20px;
  }

  .hero__subtitle{
    font-size: 17px;
    line-height: 1.55;
    max-width: 92%;
  }

  .hero__content{
    margin-top: 60px;
  }
}


/* ===== HERO SUBTITLE FORCE WHITE ===== */
.hero__subtitle,
.hero__subtitle p,
.hero__subtitle span,
.hero__content p,
.hero__content .lead{
  color:#ffffff !important;
  opacity:1 !important;
  font-weight:600 !important;
  text-shadow:0 2px 12px rgba(0,0,0,.60) !important;
}


/* ===== PREMIUM FIXED HEADER ===== */
.site-header{
  position:fixed !important;
  top:0;
  left:0;
  width:100%;
  z-index:9999;
}

.site-header--home{
  background:rgba(16,42,30,.72) !important;
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.10);
}

.site-header--inner{
  background:rgba(234,245,241,.92) !important;
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(0,0,0,.06);
}

body:not(.home) main#content{
  padding-top:120px;
}


/* ===== MOBILE MENU CONSISTENCY ===== */
@media (max-width:760px){
  .topnav__link,
  .dropdown__toggle,
  .btn{
    width:100% !important;
    justify-content:flex-start !important;
    text-align:left !important;
    font-size:16px !important;
    min-height:52px !important;
    padding:14px 18px !important;
  }

  .dropdown__menu{
    position:static !important;
    min-width:0 !important;
    width:100% !important;
    background:transparent !important;
    box-shadow:none !important;
    border:0 !important;
    padding:6px 0 0 !important;
  }
}
/* ===== HEADER BLEND WITH HERO (NOT FIXED) ===== */

/* ===== HEADER: HOME TRANSPARENT / INNER GREEN ===== */

/* стартовая страница */
.site-header--home{
    position:absolute !important;
    top:0;
    left:0;
    width:100%;
    z-index:1000;

    background:transparent !important;
    border-bottom:none !important;
    box-shadow:none !important;

    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}

/* все внутренние страницы */
/* все внутренние страницы */
.site-header--inner{
    position:relative !important;
    width:100%;

    background:
      linear-gradient(
        180deg,
        rgba(52,92,68,.92) 0%,
        rgba(64,110,82,.88) 100%
      ) !important;

    border-bottom:1px solid rgba(255,255,255,.10) !important;

    box-shadow:
      0 10px 28px rgba(0,0,0,.10) !important;

    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);

    z-index:1000;
}

/* меню на внутренних страницах */
.site-header--inner .topnav__link,
.site-header--inner .dropdown__toggle{
    color:#ffffff !important;
    font-weight:780 !important;
    text-shadow:none !important;
}

/* hover */
.site-header--inner .topnav__link:hover,
.site-header--inner .dropdown__toggle:hover{
    background:rgba(255,255,255,.10) !important;
}

/* активный пункт */
.site-header--inner .topnav__link.is-active{
    background:rgba(255,255,255,.14) !important;
}

/* логотип */
.site-header--inner .brand__title,
.site-header--inner .brand__subtitle{
    color:#ffffff !important;
    text-shadow:none !important;
}

/* бургер */
.site-header--inner .nav-toggle__bar{
    background:#ffffff !important;
}
/* контейнер */
.site-header .container,
.site-header .hero__topbar{
    background: transparent !important;
}

/* меню */
.site-header .topnav__link,
.site-header .dropdown__toggle{
    color: rgba(255,255,255,.96) !important;
    font-weight: 780 !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.28);
}

/* hover */
.site-header .topnav__link:hover,
.site-header .dropdown__toggle:hover{
    background: rgba(255,255,255,.12) !important;
    text-decoration: none !important;
}

/* активная кнопка */
.site-header .topnav__link.is-active{
    background: rgba(255,255,255,.18) !important;
}

/* логотип */
.site-header .brand__title,
.site-header .brand__subtitle{
    color:#fff !important;
    text-shadow:0 2px 10px rgba(0,0,0,.28);
}

/* бургер */
.site-header .nav-toggle__bar{
    background:#fff !important;
}

/* hero */
.hero{
    position:relative;
}

/* контент hero */
.home .hero__content{
    padding-top:120px;
}
.footer-disclaimer{
    margin-top:40px;
    padding-top:22px;
    border-top:1px solid rgba(255,255,255,.10);
}

.footer-disclaimer p{
    margin:0;
    font-size:14px;
    line-height:1.7;
    color:rgba(255,255,255,.72);
    text-align:center;
    max-width:950px;
    margin-inline:auto;
}
/* ==================== ABOUT PAGE — STRONG INDEPENDENT LAYOUT ==================== */

/* ===== ABOUT PAGE ===== */

.about-wrap{
    display:flex;

    align-items:flex-start;
    justify-content:space-between;

    gap:60px;
}

/* LEFT */

.about-text{
    flex:1;
    max-width:760px;
}

/* RIGHT */

.about-photo{
    width:320px;
    flex-shrink:0;
}

.about-photo img{
    width:100%;
    display:block;

    border-radius:28px;

    box-shadow:
        0 18px 40px rgba(0,0,0,.12);
}

/* MOBILE */

@media (max-width: 900px){

    .about-wrap{
        flex-direction:column;
    }

    .about-photo{
        width:240px;
        margin:0 auto 30px;
    }
}
/* =========================
   ABOUT PAGE
========================= */

.about-layout{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:60px;
    max-width:1200px;
    margin:0 auto;
margin-top:50px;
}

.about-content{
    flex:1;
    max-width:760px;
}

.about-image{
    width:320px;
    flex-shrink:0;
    position:sticky;
    top:120px;
}

.about-image img{
    width:100%;
    border-radius:28px;
    display:block;
    box-shadow:0 10px 35px rgba(0,0,0,.12);
}

/* Typography */

.about-content h1{
    font-size:52px;
    line-height:1.1;
    margin-bottom:28px;
    color:#1f2f24;
    font-weight:800;
    letter-spacing:-1px;
}

.about-content h2{
    font-size:34px;
    line-height:1.2;
    margin-top:50px;
    margin-bottom:20px;
    color:#1f2f24;
    font-weight:700;
}

.about-content h3{
    font-size:24px;
    margin-top:36px;
    margin-bottom:16px;
    color:#23412f;
    font-weight:700;
}

.about-content p{
    font-size:18px;
    line-height:1.85;
    margin-bottom:22px;
    color:#4d5b52;
}

.about-content ul{
    padding-left:22px;
    margin-top:18px;
}

.about-content li{
    font-size:17px;
    line-height:1.8;
    margin-bottom:12px;
    color:#4d5b52;
}

/* Highlight block */

.about-note{
    margin-top:40px;
    padding:20px 24px;
    border-radius:18px;
    background:rgba(44,110,73,.08);
    border:1px solid rgba(44,110,73,.12);
    font-size:15px;
    line-height:1.7;
    color:#5a655f;
}

/* Mobile */

@media (max-width: 980px){

    .about-layout{
        flex-direction:column;
        gap:40px;
    }

    .about-image{
        width:100%;
        max-width:360px;
        margin:0 auto;
        position:relative;
        top:auto;
    }

    .about-content h1{
        font-size:42px;
    }

    .about-content h2{
        font-size:30px;
    }

    .about-content p,
    .about-content li{
        font-size:17px;
    }
}