/* EUROPHIL — zentrale Gestaltung, direkt in Dreamweaver bearbeitbar */
:root{--blue:#171d67;--ink:#222538;--yellow:#f1dc56;--paper:#faf9f5;--muted:#666876;--line:#dedfdc;--radius:6px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.65 Arial,Helvetica,sans-serif}a{color:inherit;text-underline-offset:5px}img{max-width:100%;display:block}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:500;color:var(--blue);line-height:1.1;letter-spacing:normal}h1{font-size:clamp(40px,5vw,72px);margin-bottom:26px}h2{font-size:clamp(32px,3.3vw,46px)}h3{font-size:28px}h1 em{font-style:normal;color:#73778a}p{margin-bottom:22px}.wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}.topline{padding:9px 48px;background:var(--blue);color:white;font-size:18px;letter-spacing:normal;display:flex;justify-content:space-between}.topline span{color:#dddde9}header{display:flex;justify-content:space-between;align-items:center;gap:28px;padding-block:30px}.brand{display:inline-block;text-decoration:none;font-size:30px;font-weight:700;line-height:1.1;letter-spacing:normal;color:var(--blue)}.brand span{display:block;font-size:18px;font-weight:400;letter-spacing:normal;margin-top:8px}nav{display:flex;align-items:center;gap:25px}nav a{text-decoration:none;font-size:18px}nav a:hover,nav a[aria-current]{text-decoration:underline}.button{display:inline-flex;align-items:center;justify-content:center;gap:20px;text-decoration:none;background:var(--blue);color:white;padding:16px 25px;border-radius:3px;font-size:18px;font-weight:600;transition:background .2s}.button:hover{background:#343b8d}.button.small{padding:12px 18px}.textlink{font-size:18px;display:inline-block;margin-left:22px}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;padding-block:44px 78px;align-items:center}.eyebrow{font-size:18px;font-weight:700;letter-spacing:normal;text-transform:uppercase;color:var(--blue);margin-bottom:22px}.lead{
    font-size: 18px;
    line-height: 1.75;
    color: var(--muted);
    max-width: 680px;
    margin-bottom: 30px
}.hero-photo{position:relative;align-self:stretch;margin:12px 0 60px}.hero-photo>img{height:100%;min-height:450px;width:100%;object-fit:cover;border-radius:120px 4px 4px 4px}.photo-label{position:absolute;top:26px;left:25px;background:var(--paper);padding:15px 20px;font-size:18px;color:var(--muted);box-shadow:0 4px 25px #0000000b}.photo-label span{display:block;font-size:18px;color:var(--blue)}.portrait{position:absolute;bottom:-55px;right:25px;display:flex;gap:18px;align-items:center;background:var(--yellow);padding:14px 30px 14px 14px;border-radius:4px;box-shadow:0 14px 30px #171d6710}.portrait img{width:90px;height:100px;object-fit:cover;object-position:top}.portrait span{font-family:Georgia,serif;font-size:23px;line-height:1.25;color:var(--blue);font-style:italic}.signature{font-family:Georgia,serif;font-style:italic;font-size:22px;color:var(--blue);margin-top:32px}.signature span{display:block;font:18px Arial,sans-serif;color:var(--muted);margin-top:7px}.language-strip{border-block:1px solid var(--line);padding:22px 0}.language-strip .wrap{display:flex;justify-content:space-between;align-items:center;color:var(--blue);font-size:23px}.language-strip i{color:#aaa35a;font-style:normal;font-size:20px}.section{padding-block:85px}.section-heading{max-width:640px;margin-bottom:40px}.section-heading h2{margin-bottom:18px}.section-heading>p:last-child{color:var(--muted)}.offers{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.offer{display:flex;flex-direction:column;padding:30px 34px 30px 0;text-decoration:none}.offer+.offer{border-left:1px solid var(--line);padding-left:34px}.number{font-size:18px;color:#777a8f;margin-bottom:35px}.offer h3{font-size:27px;letter-spacing:normal}.offer p{font-size:18px;color:var(--muted)}.offer-link{margin-top:auto;font-size:18px;color:var(--blue);display:flex;justify-content:space-between}.offer-link b{font-size:20px;font-weight:400}.offer:hover h3{text-decoration:underline;text-underline-offset:6px}.about{background:#eeeee9;padding-block:75px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.about-grid>img{height:470px;width:100%;object-fit:cover;border-radius:4px}.about p:not(.eyebrow){color:var(--muted);font-size:18px}.checks{list-style:none;padding:0;font-size:18px}.checks li{padding:10px 0;border-bottom:1px solid #d7d8d2}.checks li:before{content:'✓';color:var(--blue);margin-right:12px}.about .textlink{margin:15px 0 0}.contact-band{display:flex;justify-content:space-between;align-items:center;gap:40px;padding-block:75px}.contact-band h2{margin-bottom:15px}.contact-band p:last-child{margin:0;color:var(--muted)}footer{background:#e5e7ed;padding-top:55px;color:var(--blue);font-size:18px}.foot{display:grid;grid-template-columns:2fr 1.4fr .8fr;gap:40px}.foot p{margin-top:20px;color:var(--muted);font-size:18px}.foot a:not(.brand){text-decoration:none}.foot a:hover{text-decoration:underline}.bottom{margin-top:40px;padding-block:22px;border-top:1px solid #cdd0da;font-size:18px;display:flex;justify-content:space-between}.breadcrumb{display:inline-block;margin-bottom:30px;color:var(--muted);font-size:18px}.narrow{max-width:780px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:50px;align-items:start}.prose{line-height:1.8}.prose h2{font-size:32px}.prose h3{font-size:25px}.detail-image{width:100%;max-height:560px;object-fit:contain;object-position:top left}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px}.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover}.gallery img:first-child{grid-column:1/-1;aspect-ratio:2/1}.legal{max-width:900px;overflow-wrap:anywhere}.legal h1{font-size:48px}a:focus-visible{outline:3px solid #b28000;outline-offset:6px}.skip{position:absolute;left:15px;top:-100px;background:white;padding:10px;z-index:10}.skip:focus{top:10px}@media(max-width:1100px){.wrap{width:calc(100% - 56px)}header{align-items:flex-start}nav{flex-wrap:wrap;justify-content:flex-end;gap:15px}.hero{gap:35px}.hero .textlink{margin:18px 0 0;display:block}.hero-photo>img{min-height:420px}.about-grid{gap:40px}.offer h3{font-size:23px}}@media(max-width:720px){.wrap{width:calc(100% - 40px)}.topline{padding:9px 20px}.topline span{display:none}header{display:block;padding-block:25px}nav{justify-content:flex-start;gap:14px 20px;margin-top:25px}nav a{font-size:18px}.button.small{padding:9px 12px}.hero{grid-template-columns:1fr;padding-block:22px 65px;gap:30px}h1{font-size:44px}.hero-photo{height:350px;margin-bottom:50px}.hero-photo>img{min-height:0;border-radius:75px 4px 4px 4px}.hero .textlink{display:inline-block;margin-left:15px}.portrait{right:15px;bottom:-40px;padding:10px 20px 10px 10px}.portrait img{height:80px;width:70px}.portrait span{font-size:21px}.language-strip .wrap{font-size:18px;gap:10px;flex-wrap:wrap}.language-strip i{font-size:18px}.section{padding-block:55px}.offers,.about-grid,.detail-grid{grid-template-columns:1fr}.offer,.offer+.offer{border-left:0;padding:25px 0;border-bottom:1px solid var(--line)}.offer:last-child{border-bottom:0}.number{margin-bottom:18px}.offer h3{font-size:28px}.about{padding-block:50px}.about-grid>img{height:310px}.contact-band{display:block;padding-block:50px}.contact-band .button{margin-top:28px}.foot{grid-template-columns:1fr 1fr;gap:30px}.foot>div:first-child{grid-column:1/-1}.bottom{display:block}.bottom span{display:block;margin-top:8px}.gallery{gap:12px}.gallery img:first-child{aspect-ratio:4/3}.detail-grid{gap:30px;margin-top:30px}.legal h1{font-size:37px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none}}

/* Überarbeitung: größere Marke und Navigation, mindestens 14 px */
body{font-size:18px}
.topline{font-size:18px}
.brand{font-size:38px}
.brand span{font-size:18px}
nav a{font-size:18px}
.button.small{font-size:18px}
.eyebrow,.signature span,.photo-label,.number,.offer-link,.foot p,.bottom,.breadcrumb{font-size:18px}
.textlink{font-size:18px}
.hero-photo>img{filter:none;opacity:1}
@media(max-width:1100px){header{flex-wrap:wrap}nav{gap:18px;justify-content:flex-start}}
@media(max-width:720px){.brand{font-size:34px}.brand span,nav a,.button.small,.language-strip .wrap,.language-strip i,.topline,.eyebrow,.signature span,.photo-label,.number,.offer-link,.foot p,.bottom,.breadcrumb{font-size:18px}nav{margin-top:22px}.textlink{font-size:18px}}

/* Gut lesbare Typografie: mindestens 18 px, auch auf Mobilgeräten. */
:root{--muted:#454958}
body{font-family:Verdana,Geneva,sans-serif;font-size:18px;line-height:1.75}
h1,h2,h3{letter-spacing:normal;font-weight:600}
p,li{line-height:1.75}
.eyebrow{letter-spacing:normal;text-transform:none;line-height:1.5}
.lead{font-size:20px;color:var(--muted)}
.number{color:#454958}
h1 em{color:#50576d}
.signature span{font-family:Verdana,Geneva,sans-serif}
header{flex-wrap:wrap;gap:25px}
nav{flex-wrap:wrap;justify-content:flex-start;gap:20px 26px}
nav a{line-height:1.5;padding-block:8px}
.brand span{line-height:1.5;letter-spacing:normal}
.hero .textlink{display:block;margin:20px 0 0}
.foot{grid-template-columns:1.5fr 1.5fr 1fr}
.foot>div{min-width:0;overflow-wrap:anywhere}
.bottom{gap:25px;flex-wrap:wrap}
@media(max-width:900px){.offers{grid-template-columns:1fr}.offer,.offer+.offer{padding:28px 0;border-left:0;border-bottom:1px solid var(--line)}.offer:last-child{border-bottom:0}.hero{grid-template-columns:1fr}.hero-photo{height:420px}.hero-photo>img{min-height:0}.about-grid{grid-template-columns:1fr}.contact-band{flex-wrap:wrap}}
@media(max-width:720px){.foot{grid-template-columns:1fr}.foot>div:first-child{grid-column:auto}.language-strip .wrap{gap:15px}.hero .textlink{display:block;margin:20px 0 0}.portrait{right:0}.photo-label{left:15px;right:15px}.brand span{font-size:18px}}

/* Logoähnliche geometrische Schrift für Marke und Überschriften. */
.brand,h1,h2,h3{font-family:Futura,'Century Gothic','Avenir Next',Verdana,sans-serif;font-weight:600;letter-spacing:normal}
.brand{font-weight:700;letter-spacing:normal}
.brand span{font-family:Verdana,Geneva,sans-serif;font-weight:400;letter-spacing:normal}

/* Lato lokal eingebunden; Originalblau der bisherigen Homepage: #009. */
@font-face{font-family:Lato;src:url('Lato-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Lato;src:url('Lato-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
:root{--blue:#000099}
body,.brand,.brand span,h1,h2,h3,.signature,.signature span,.portrait span{font-family:Lato,Arial,sans-serif}
h1,h2,h3,.brand,.button,.eyebrow{font-weight:700}
.button:hover{background:#000066}

/* Originalgelb der bisherigen Homepage (#FF0). */
:root{--yellow:#ffff00}

/* Einheitlich blaue Schrift; gelbe Navigationstexte auf blauem Grund. */
:root{--ink:#000099;--muted:#000099}
body,body *{color:#000099}
a,a:link,a:visited,a:hover,a:active{color:#000099}
.topline,.topline span,.button,.button:link,.button:visited,.button:hover,.button:active{color:#ffff00}
.topline,.button{background:#000099}
nav{gap:10px;align-items:stretch}
nav a,nav a:link,nav a:visited{display:flex;align-items:center;justify-content:center;background:#000099;color:#ffff00;padding:12px 18px;border-radius:3px;font-size:18px;font-weight:700;text-decoration:none}
nav a:hover,nav a:focus-visible{background:#000066;color:#ffff00;text-decoration:underline;text-underline-offset:6px}
nav a[aria-current="page"],nav a[aria-current="page"]:visited{color:#ffff00;text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:7px;box-shadow:inset 0 -4px #ffff00}
h1 em,.number,.signature span,.photo-label,.photo-label span,.portrait span,.section-heading>p:last-child,.about p:not(.eyebrow),.contact-band p:last-child,.foot p,.checks li:before,.language-strip i{color:#000099}

/* Kopfzeile: Logo und Hauptnavigation in derselben Höhe. */
header{align-items:stretch;gap:18px}
header .brand,header .brand:link,header .brand:visited,header .brand:hover{background:#000099;color:#ffff00;border-radius:3px;padding:12px 18px;height:88px;display:flex;flex-direction:column;justify-content:center;font-size:34px;line-height:1.05;text-decoration:none;flex-shrink:0}
header .brand span{color:#ffff00;font-size:18px;line-height:1.2;margin-top:7px}
header nav{align-items:stretch;flex:1}
header nav a,header nav .button.small{height:88px;padding:12px 16px;line-height:1.35;white-space:normal;text-align:center}
@media(max-width:1100px){header .brand{align-self:flex-start}header nav{flex-basis:100%}}
@media(max-width:720px){header{display:flex;flex-direction:column}header .brand,header nav a,header nav .button.small{height:88px}header .brand{width:100%;font-size:34px}header nav{margin-top:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}header nav a{min-width:0}header nav a:last-child{grid-column:1/-1}}

/* Kleinere Seitenüberschriften und zugängliche Bildvergrößerung. */
h1{font-size:clamp(36px,4vw,48px)}
@media(max-width:720px){h1,.legal h1{font-size:36px}}
.bildlink{display:block;text-decoration:none;cursor:zoom-in}
.bildlink .detail-image{max-height:none}
.bildhinweis{display:block;font-size:18px;margin-top:12px;text-decoration:underline;color:#000099}
.bildvorschau{padding:68px 16px 16px;border:0;border-radius:6px;background:#faf9f5;width:max-content;max-width:96vw;max-height:94dvh;overflow:auto}
.bildvorschau::backdrop{background:rgb(0 0 60 / .85)}
.bildvorschau>img{width:auto;height:auto;max-width:100%;max-height:calc(90dvh - 90px);object-fit:contain;margin:auto}
.vorschau-schliessen{position:absolute;right:16px;top:12px;border:0;border-radius:3px;padding:10px 16px;background:#000099;color:#ffff00;font:700 18px Lato,Arial,sans-serif;cursor:pointer}
.vorschau-schliessen:focus-visible{outline:3px solid #000099;outline-offset:4px}
.vorschau-offen{overflow:hidden}

/* Kontaktfoto in Originalauflösung, ohne Hochskalierung oder Beschnitt. */
.detail-image[src="assets/kontakt-eva-hindl.jpg"]{width:100%;max-width:578px;height:auto;max-height:none;object-fit:contain}

/* Breiter, kompakter Header mit 4 px Außenabstand. */
.topline{margin:4px 4px 0;padding:9px 18px;width:calc(100% - 8px);min-height:44px;align-items:center;gap:20px}
header.wrap{width:calc(100% - 8px);max-width:none;margin:4px 4px 0;padding:0;display:flex;flex-direction:row;flex-wrap:nowrap;gap:4px;align-items:stretch}
header .brand{height:88px;margin:0;border-radius:0}
header nav{display:flex;flex:1;flex-basis:auto;flex-wrap:nowrap;gap:4px;margin:0;min-width:0}
header nav a,header nav .button.small{flex:1;height:88px;border-radius:0;padding:12px;min-width:0}
@media(max-width:1200px){header.wrap{flex-wrap:wrap}header .brand{width:100%;align-items:center;text-align:center}header nav{flex-basis:100%}}
@media(max-width:760px){.topline{padding:10px 14px}.topline span{display:none}header nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}header nav a:last-child{grid-column:1/-1}header .brand{height:88px}header nav a,header nav .button.small{height:88px}}

/* Sprachenleiste passend zur Hauptnavigation. */
.language-strip{background:#000099;border-color:#000099}
.language-strip .wrap,.language-strip i{color:#ffff00}

/* Aktiver Menüpunkt: nur Textunterstreichung, kein Balken am Buttonrand. */
nav a[aria-current="page"],nav a[aria-current="page"]:visited{box-shadow:none}

/* Alle Fotos lassen sich ohne Veränderung ihres Layouts vergrößern. */
img[data-bildvorschau]{cursor:zoom-in}
img[data-bildvorschau]:focus-visible{outline:3px solid #000099;outline-offset:4px}

/* Schwerpunkt Schülernachhilfe: klare Hinweise, gut lesbar. */
.bindung{display:inline-block;background:#ffff00;color:#000099;padding:10px 18px;font-size:20px;font-weight:700;margin-top:20px}
.hero-photo>img{object-position:center}
.erfahrung{max-width:1000px}.methoden{max-width:900px}.methoden h2{margin-top:40px}
.hero-copy .lead{max-width:620px}

/* Einheitliche normale Schriftlaufweite auf der gesamten Website. */
html body,html body *{letter-spacing:normal;word-spacing:normal}

/* Gleich große Aktionsflächen; Größe des blauen Buttons als Maßstab. */
.hero-aktionen{display:grid;grid-template-columns:max-content;width:max-content;max-width:100%;gap:20px;margin-bottom:22px}
.hero-aktionen .button,.hero-aktionen .bindung{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;margin:0;padding:16px 25px;border-radius:3px;font-size:18px;font-weight:700;line-height:1.65;text-align:center;min-height:62px}
@media(max-width:480px){.hero-aktionen{width:100%;grid-template-columns:minmax(0,1fr)}.hero-aktionen .button,.hero-aktionen .bindung{min-height:86px}}
