/*
Theme Name:  HAY pharma Web v2
Description: Child theme of Astra (Pro) for hay-pharma.de. Core Gutenberg patterns, no Elementor. Mobile first. Built 1:1 from website-v2/mockup v0.2.
Template:    astra
Version:     0.1.4
Text Domain: hay-web-theme
*/

/* Satoshi lokal (ITF FFL 2.0: Web-Einbettung und Selbsthosting erlaubt, Weitergabe der Datei nicht — Stufe 06 §6). */
@font-face{font-family:Satoshi;src:url(assets/fonts/satoshi-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Satoshi;src:url(assets/fonts/satoshi-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Satoshi;src:url(assets/fonts/satoshi-700.woff2) format("woff2");font-weight:700;font-display:swap}

/* Tokens aus strategie/06_ci.html + 07_styleguide.html */
:root{
  --petrol:#008088; --petrol-dk:#00676E; --petrol-hell:#E0EEEE; --petrol-licht:#7CC4C4;
  --blau:#142A4D; --tinte:#111821; --schiefer:#4B5563; --nebel:#EFF5F5;
  --linie:#D5DEE2; --linie-stark:#8696A3; --weiss:#FFFFFF;
  --offen-bg:#FFF3B0; --offen:#6B5200;
  --w:1120px;
  --gutter:max(16px,calc((100% - var(--w)) / 2));
}

/* ── Basis ── */
body.hay-v2{margin:0;background:var(--weiss);color:var(--tinte);font:17px/1.6 Satoshi,-apple-system,Helvetica,Arial,sans-serif;-webkit-text-size-adjust:100%}
.hay-v2 *{box-sizing:border-box}
.hay-v2 img{max-width:100%;height:auto;display:block}
.hay-v2 a{color:var(--petrol-dk)}
.hay-v2 :is(h1,h2,h3){font-family:inherit;color:var(--blau);font-weight:700;letter-spacing:-.015em;line-height:1.15;margin:0 0 .5em}
.hay-v2 h1{font-size:clamp(34px,5.4vw,56px)}
.hay-v2 h2{font-size:clamp(26px,3.4vw,36px)}
.hay-v2 h3{font-size:20px}
.hay-v2 p{margin:0 0 1em}
.hay-v2 :focus-visible{outline:3px solid var(--petrol-licht);outline-offset:2px}
.hay-v2 mark.offen,.hay-v2 .offen{background:var(--offen-bg);color:var(--offen);font-size:.78em;font-weight:700;padding:1px 6px;overflow-wrap:anywhere}
.hay-v2 .ki,.hay-v2 figcaption{font-size:12px;color:var(--schiefer);margin-top:6px;text-align:left}

/* ── Astra neutralisieren: Abschnitte bringen Rand und Hintergrund selbst mit ── */
.hay-v2.page .site-content>.ast-container{max-width:none;padding:0;display:block}
.hay-v2.page #primary{margin:0;padding:0}
.hay-v2.page .entry-content{margin:0}
.hay-v2.page .entry-content>*{margin-block:0}
.hay-v2.page article.page{padding:0;margin:0}
.hay-v2 .entry-content .wp-block-group{padding:0}
/* WP-Flow-Layout setzt Abstände zwischen Geschwistern; in Rastern stören sie (vgl. ax 0.3.9). */
.hay-v2 :is(.raster,.hero,.schritte,.btns,.fuss-raster)>*{margin-block:0!important}
#ast-scroll-top{display:none!important}

/* ── Kopf ── */
.hay-v2 .kopf{position:sticky;top:0;z-index:10;background:var(--weiss);border-bottom:1px solid var(--linie)}
.admin-bar.hay-v2 .kopf{top:32px}
.hay-v2 .kopf-in{display:flex;align-items:center;gap:24px;padding:12px var(--gutter);position:relative}
.hay-v2 .kopf .logo img{height:46px;width:auto}
.hay-v2 .kopf .beschreiber{font-size:13px;color:var(--schiefer);line-height:1.3;max-width:190px}
.hay-v2 .kopf nav{margin-left:auto;display:flex;gap:22px;align-items:center}
.hay-v2 .kopf nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0}
.hay-v2 .kopf nav a{color:var(--blau);text-decoration:none;font-weight:500;font-size:16px}
.hay-v2 .kopf nav .current-menu-item>a{box-shadow:inset 0 -2px 0 var(--petrol)}
.hay-v2 .kopf nav a.btn{color:#fff}
.hay-v2 .menue{display:none;margin-left:auto}
.hay-v2 .menue summary{list-style:none;cursor:pointer;font-weight:700;color:var(--blau);border:2px solid var(--blau);padding:6px 12px}
.hay-v2 .menue summary::-webkit-details-marker{display:none}
.hay-v2 .menue[open] .menue-liste{display:flex}
.hay-v2 .menue-liste{display:none;flex-direction:column;position:absolute;left:0;right:0;top:100%;background:var(--weiss);border-bottom:1px solid var(--linie);padding:8px 16px 16px}
.hay-v2 .menue-liste ul{list-style:none;margin:0;padding:0}
.hay-v2 .menue-liste a{display:block;padding:10px 0;border-bottom:1px solid var(--linie);color:var(--blau);text-decoration:none;font-weight:500}

/* ── Buttons: eckig, 2px Kante (07 §4). Core-Button mit Klasse btn-primary / btn-secondary / btn-hell ── */
.hay-v2 :is(.btn,.wp-block-button__link,.wpcf7-submit){display:inline-block;padding:12px 20px;font:700 16px/1.3 Satoshi,sans-serif;text-decoration:none;border:2px solid var(--petrol-dk);border-radius:0;cursor:pointer;background:var(--petrol-dk);color:#fff}
.hay-v2 :is(.btn.secondary,.btn-secondary .wp-block-button__link){background:var(--weiss);color:var(--petrol-dk)}
.hay-v2 :is(.btn.hell,.btn-hell .wp-block-button__link){background:var(--weiss);color:var(--blau);border-color:var(--weiss)}
.hay-v2 .btns,.hay-v2 .wp-block-buttons.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

/* ── Abschnitte ── */
.hay-v2 .entry-content .hay-sec{padding:72px var(--gutter)}
.hay-v2 .hay-sec.nebel{background:var(--nebel)}
.hay-v2 .hay-sec.blau{background:var(--blau);color:#fff}
.hay-v2 .hay-sec.blau :is(h2,h3){color:#fff}
.hay-v2 .kicker{font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--petrol-dk);margin:0 0 12px}
.hay-v2 .blau .kicker{color:var(--petrol-licht)}
.hay-v2 .lead{font-size:20px;color:var(--schiefer);max-width:46em}
.hay-v2 .blau .lead{color:#fff}
.hay-v2 .schmal{max-width:760px}

/* Petrol-Quadrat als Modul (06 Formensprache) */
.hay-v2 .q{display:inline-grid;place-items:center;min-width:30px;height:30px;padding:0 6px;background:var(--petrol);color:#fff;font-size:13px;font-weight:700;margin-right:10px;vertical-align:middle}
.hay-v2 ul.quadrat{list-style:none;padding:0;margin:0}
.hay-v2 ul.quadrat li{position:relative;padding-left:22px;margin:8px 0}
.hay-v2 ul.quadrat li::before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;background:var(--petrol)}

/* Hero */
.hay-v2 .hero{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.hay-v2 .entry-content .hay-sec.hero{padding-top:64px}
.hay-v2 .hero .unterzeile{font-size:22px;font-weight:500;color:var(--petrol-dk);margin-bottom:18px}

/* Raster und Karten: Linien statt Kästen, keine Schatten */
.hay-v2 .raster{display:grid;gap:24px}
.hay-v2 :is(.raster,.hero,.schritte)>*{min-width:0} /* Grid-Kinder dürfen schrumpfen, sonst drücken lange Wörter die Seite breit */
.hay-v2 .r2{grid-template-columns:repeat(2,1fr)}
.hay-v2 .r3{grid-template-columns:repeat(3,1fr)}
.hay-v2 .r4{grid-template-columns:repeat(4,1fr)}
.hay-v2 .mt{margin-top:28px!important}
.hay-v2 .mitte{align-items:center}
.hay-v2 .karte{border-top:3px solid var(--petrol);padding:20px 0 0!important}
.hay-v2 :is(.nebel .karte,.karte.fl){background:var(--weiss);padding:20px!important}
.hay-v2 .karte.grau{background:var(--nebel)}
.hay-v2 .karte .preis{font-size:26px;font-weight:700;color:var(--blau);margin:12px 0 4px}
.hay-v2 .preis.gross{font-size:44px}
.hay-v2 .klein{font-size:14px;color:var(--schiefer)}
.hay-v2 .hinweis{border-left:4px solid var(--petrol);background:var(--nebel);padding:14px 18px!important;margin:20px 0}

/* Tabellen: nur Querlinien, Kopf mit Petrol-Unterkante (06) */
.hay-v2 .wp-block-table{margin:0}
.hay-v2 table{border-collapse:collapse;width:100%;font-size:16px}
.hay-v2 :is(th,td){text-align:left;padding:12px 10px 12px 0;border:0;border-bottom:1px solid var(--linie);vertical-align:top}
.hay-v2 thead{border:0}
.hay-v2 th{border-bottom:2px solid var(--petrol);color:var(--blau);font-size:14px}
.hay-v2 :is(td,th).has-text-align-right{text-align:right;white-space:nowrap}

/* Ablauf: Gruppe .schritte mit Kindgruppen, Nummer per Zähler */
.hay-v2 .schritte{counter-reset:s;display:grid;gap:24px;grid-template-columns:repeat(3,1fr)}
.hay-v2 .schritte.einspaltig{grid-template-columns:1fr}
.hay-v2 .schritte>*{counter-increment:s;border-top:1px solid var(--linie);padding-top:16px!important}
.hay-v2 .schritte>*::before{content:counter(s);display:grid;place-items:center;width:34px;height:34px;background:var(--petrol);color:#fff;font-weight:700;margin-bottom:12px}

/* Laptop-Rahmen um einen echten Screenshot */
.hay-v2 .laptop{margin:0;padding:0 6%!important}
.hay-v2 .laptop .bildschirm{background:var(--tinte);padding:3.2% 3.2% 2.4%!important;border-radius:10px 10px 0 0}
.hay-v2 .laptop .bildschirm img{width:100%;aspect-ratio:5/3;object-fit:cover;object-position:top}
.hay-v2 .laptop .bildschirm figure{margin:0}
.hay-v2 .laptop .basis{height:14px;background:linear-gradient(#C9D2D7,#8696A3);margin:0 -6%!important;border-radius:0 0 10px 10px;position:relative}
.hay-v2 .laptop .basis::before{content:"";position:absolute;left:42%;right:42%;top:0;height:5px;background:#7A8792;border-radius:0 0 6px 6px}
.hay-v2 .rahmen img{border:1px solid var(--linie)}
.hay-v2 .wp-block-image{margin:0}

/* Formulare (CF7): wie Mockup form.feld */
.hay-v2 .wpcf7-form{display:grid;gap:14px;max-width:640px;grid-template-columns:minmax(0,1fr)}
.hay-v2 .wpcf7-form p{margin:0}
.hay-v2 .wpcf7-form label{font-weight:500;font-size:15px;display:grid;grid-template-columns:minmax(0,1fr);gap:6px;color:var(--blau)}
.hay-v2 .wpcf7-form :is(input:not([type=checkbox]):not([type=submit]),select,textarea){width:100%;font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--linie-stark);border-radius:2px;background:#fff;color:var(--tinte)}
.hay-v2 .wpcf7-form .wpcf7-list-item{margin:0}
.hay-v2 .wpcf7-form .wpcf7-list-item label{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--tinte)}
.hay-v2 .wpcf7-form .wpcf7-list-item input{margin-top:5px}
.hay-v2 .wpcf7-form .wpcf7-submit{width:100%} /* wie im Mockup: Button im Formularraster über die volle Breite */

/* Rechtstexte aus eRecht24: Überschriften kleiner als im Marketingteil */
.hay-v2 .rechtstext h2{font-size:22px;margin-top:1.6em}
.hay-v2 .rechtstext h3{font-size:18px;margin-top:1.2em}

/* Passwortformular (Investoren) */
.hay-v2 .post-password-form{display:grid;gap:14px;max-width:640px}
.hay-v2 .post-password-form input[type=password]{width:100%;font:inherit;padding:10px 12px;border:1px solid var(--linie-stark);border-radius:2px}

/* ── Fuß ── */
.hay-v2 .fuss{background:var(--tinte);color:#C3D3DD;padding:48px var(--gutter) 32px;font-size:15px}
.hay-v2 .fuss a{color:#fff;text-decoration:none}
.hay-v2 .fuss-raster{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.hay-v2 .fuss img{height:52px;width:auto;margin-bottom:12px}
.hay-v2 .fuss ul{list-style:none;padding:0;margin:0}
.hay-v2 .fuss li{margin:6px 0}
.hay-v2 .fuss .unten{border-top:1px solid #2B3644;margin-top:32px;padding-top:16px;font-size:13px}

@media (max-width:900px){
  .hay-v2 .kopf nav,.hay-v2 .kopf .beschreiber{display:none}
  .hay-v2 .menue{display:block}
  .hay-v2 :is(.hero,.r2,.r3,.r4,.schritte,.fuss-raster){grid-template-columns:1fr}
  .hay-v2 .hero{gap:28px}
  .hay-v2 .entry-content .hay-sec{padding:52px var(--gutter)}
  .hay-v2 .entry-content .hay-sec.hero{padding-top:40px}
  /* Tabellen mobil als gestapelte Zeilen: Leistung, Umfang, Preis untereinander */
  .hay-v2 :is(table,tbody,tr,td){display:block;width:100%}
  .hay-v2 thead{display:none}
  .hay-v2 tr{border-bottom:1px solid var(--linie);padding:12px 0}
  .hay-v2 td{border:0;padding:4px 0}
  .hay-v2 td:first-child{font-weight:700;color:var(--blau)}
  .hay-v2 td.has-text-align-right{text-align:left;white-space:normal;font-weight:700;color:var(--petrol-dk)}
}
@media (max-width:782px){.admin-bar.hay-v2 .kopf{top:46px}}