@import url('/brand.css');
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ivory);color:var(--ink);font:400 18px/1.65 var(--font-body)}a{color:inherit;text-underline-offset:5px}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--old-gold);outline-offset:5px}img{display:block;max-width:100%;object-fit:cover}h1,h2,h3,p{margin:0}h1,h2{font-family:var(--font-heading);font-weight:500;line-height:1.12;letter-spacing:-.02em}h1{font-size:clamp(42px,4.5vw,70px)}h2{font-size:clamp(34px,3.5vw,52px)}h3{font-size:23px;font-weight:400;line-height:1.3}p+p{margin-top:18px}p{max-width:70ch}small{font-size:13px}ul{padding-left:20px}li+li{margin-top:9px}
.wrap{width:min(1680px,calc(100% - 112px));margin:auto}
.cms-preview { padding: 12px 20px; background: var(--ink); color: var(--ivory); font: 14px/1.6 var(--font-body); }
.cms-preview a { margin-left: 12px; }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.faq-toggle { display: block; flex: 0 0 22px; width: 22px; height: 22px; color: var(--primary); transition: transform 160ms ease-out; }
.faq details[open] > summary .faq-toggle { transform: rotate(45deg); }

.skip{position:fixed;top:-90px;left:20px;background:var(--ivory);padding:10px;z-index:90}
.skip:focus{top:10px}
.header{background:var(--burgundy);color:var(--ivory);border-bottom:1px solid var(--burgundy)}
.head{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand{display:flex;align-items:center;text-decoration:none;gap:14px}
.brand img{width:44px;height:56px;object-fit:contain}
.wordmark{font-family:var(--font-heading);font-size:27px;letter-spacing:.08em;line-height:1.3}
.wordmark small{display:block;font-family:var(--font-body);font-size:9px;letter-spacing:.23em;text-transform:uppercase}
.nav{display:flex;align-items:center;gap:31px}
.nav a{text-decoration:none;font-size:14px}
.nav a[aria-current=page]{border-bottom:1px solid var(--old-gold)}
.nav .button{font-size:14px}
.button{display:inline-flex;justify-content:center;align-items:center;gap:24px;padding:15px 23px;background:var(--primary);color:var(--ivory);text-decoration:none;border:1px solid var(--primary);cursor:pointer;line-height:1.4;transition:background-color 160ms ease,border-color 160ms ease,color 160ms ease,transform 140ms cubic-bezier(.23,1,.32,1)}
@media (hover: hover) and (pointer: fine) { .button:hover{background:var(--cherry)} }
.button.gold{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.button.outline{background:transparent;color:var(--primary)}
.text-link{display:inline-block;text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:5px;font-size:15px}
.menu{display:none;background:none;border:1px solid var(--line);padding:9px 14px}
.eyebrow{text-transform:uppercase;letter-spacing:.17em;font-size:11px;font-weight:700;line-height:1.7;margin-bottom:24px}
.hero{background:var(--paper);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;min-height:670px}
.hero-copy{padding:68px 65px 55px 0;align-self:center}
.hero h1 em{color:var(--primary);font-weight:500}
.hero .intro{font-size:18px;max-width:49ch;margin-top:27px;color:var(--muted)}
.actions{display:flex;gap:25px;align-items:center;flex-wrap:wrap;margin-top:31px}
.hero-note{font-size:12px;color:var(--muted);margin-top:19px}
.portrait{position:relative;min-height:630px}
.portrait>img{height:100%;width:100%;object-fit:cover;object-position:50% 30%;position:absolute}
.caption{position:absolute;bottom:27px;left:28px;right:28px;background:var(--ivory);padding:19px 23px;border-left:3px solid var(--gold)}
.caption strong{font-family:var(--font-heading);font-size:23px;font-weight:400;display:block}
.caption span{font-size:12px;color:var(--muted)}
.trust{border-bottom:1px solid var(--line)}
.trust .wrap{display:flex;justify-content:space-between;gap:18px;padding-top:23px;padding-bottom:23px;font-size:13px}

.section{padding:95px 0}
.section-head{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:44px}
.section-head>p{max-width:400px;font-size:16px;color:var(--muted)}
.section-head h2{max-width:650px}
.service-list{border-top:1px solid var(--line)}
.service-row{display:grid;grid-template-columns:55px 1fr 1.05fr;gap:22px;align-items:center;padding:33px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:background-color 160ms ease}
@media (hover: hover) and (pointer: fine) { .service-row:hover{background:var(--sand)} }
.service-row .number{font-size:12px;color:var(--old-gold)}
.service-row h3{font-family:var(--font-heading);font-size:30px}
.service-row p{font-size:15px;color:var(--muted)}
.green{background:var(--primary);color:var(--ivory)}
.green p{color:var(--sand)}
.green .eyebrow{color:var(--ivory)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.split p{margin-top:24px}
@media (min-width: 781px) and (min-height: 700px) {
  .online-counseling > div { position: sticky; top: 112px; align-self: start; }
}
.green .text-link{margin-top:25px}
.situations{border-top:1px solid var(--gold)}
.situations div{padding:22px 0;border-bottom:1px solid var(--gold);font-family:var(--font-heading);font-size:25px;line-height:1.4}
.situations span{display:block;font:14px/1.7 var(--font-body);margin-top:8px;color:var(--sand)}
.about-photo{height:500px;width:100%;object-position:50% 30%}
.credentials{display:flex;gap:22px;align-items:center;border-top:1px solid var(--line);margin-top:28px;padding-top:22px}
.credentials img{width:68px;height:72px;object-fit:contain}
.credentials p{font-size:13px;margin:0}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:46px}
.step{border-top:1px solid var(--line);padding-top:25px}
.step .number{font-size:12px;color:var(--old-gold);margin-bottom:20px}
.step p{font-size:15px;color:var(--muted);margin-top:15px}
.cream{background:var(--sand)}
.faq{max-width:850px;margin:35px auto 0}details{border-top:1px solid var(--line);padding:22px 0}details:last-child{border-bottom:1px solid var(--line)}summary{cursor:pointer;font-size:18px;list-style:none}summary::marker{content:''}summary::-webkit-details-marker{display:none}details p{color:var(--muted);font-size:16px;margin-top:17px}
.center{text-align:center}
.center p{margin-left:auto;margin-right:auto}
.cta{padding:75px 0}
.cta .wrap{display:flex;justify-content:space-between;gap:45px;align-items:center}
.cta h2{max-width:780px}
.cta p{margin-top:20px;max-width:650px}
.footer{padding:55px 0 25px;background:var(--sand)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px}
.footer .wordmark{font-size:24px}
.footer p{font-size:14px;margin-top:16px;color:var(--muted)}
.footer nav{display:flex;flex-direction:column;gap:10px;font-size:14px}
.footer h3{font-size:14px;margin-bottom:14px}
.bottom{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:22px;margin-top:40px;font-size:11px;color:var(--muted)}
.page-hero{background:var(--paper);padding:65px 0 72px}
.page-hero h1{max-width:930px}
.page-hero--watermark { position: relative; isolation: isolate; overflow: clip; }
.page-hero--watermark::before {
  content: ''; position: absolute; z-index: 0; pointer-events: none;
  inset: 12px max(20px, calc((100vw - 1280px) / 2)) 12px auto;
  width: min(60%, 720px);
  background: url('/assets/perforentia-logo.png') right center / contain no-repeat;
  /* Even a black logo pixel keeps small altgold labels above 4.5:1 on ivory. */
  opacity: .07;
}
.page-hero--watermark > .wrap { position: relative; z-index: 1; }
@media (max-width: 780px) {
  .page-hero--watermark::before { inset: 12px 16px; width: auto; opacity: .05; }
}
@media (forced-colors: active) {
  .page-hero--watermark::before { display: none; }
}
.page-hero .intro{max-width:730px;margin-top:26px;font-size:19px;color:var(--muted)}
.breadcrumb{font-size:12px;margin-bottom:30px;color:var(--muted)}
.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.offer{padding:30px;border:1px solid var(--line);display:flex;flex-direction:column;align-items:start}
.offer h3{font-family:var(--font-heading);font-size:29px;margin:13px 0}
.offer .tag{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--old-gold)}
.offer p,.offer li{font-size:15px;color:var(--muted)}
.offer .text-link{margin-top:auto}
.offer ul{margin-bottom:30px}
.wide-row{display:grid;grid-template-columns:1fr 1.1fr;gap:70px;padding:40px 0;border-top:1px solid var(--line)}
.wide-row h3{font-family:var(--font-heading);font-size:32px}
.wide-row p,.wide-row li{font-size:16px;color:var(--muted)}
.wide-row .eyebrow{margin-bottom:12px}
.notice{padding:30px;background:var(--paper);border-left:3px solid var(--old-gold);margin-top:38px;font-size:15px}
.notice p{margin-top:14px}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:85px}
.contact-list{margin:30px 0}
.contact-list a{display:block;margin:12px 0}
.form{border:1px solid var(--line);padding:35px}
.form label{display:block;font-size:14px;margin-bottom:7px}
.form input,.form textarea,.form select{width:100%;padding:12px;border:1px solid var(--field-border);background:var(--ivory);border-radius:0;color:var(--primary)}
.form textarea{min-height:140px;resize:vertical}
.field{margin-bottom:20px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.demo-note{font-size:13px;color:var(--muted);margin-bottom:25px}
.check{display:flex;gap:11px;margin-bottom:22px}
.check input{width:19px;height:19px;flex:none}
.check label{font-size:12px}
.status{margin-top:18px;font-size:14px}
.bio-text p{margin-bottom:21px}
.qualifications{margin-top:30px;border-top:1px solid var(--line)}
.qualifications div{padding:16px 0;border-bottom:1px solid var(--line)}
.qualifications small{display:block;color:var(--muted)}
.book{width:230px;max-height:340px;object-fit:contain;margin:auto}
.anchor{scroll-margin-top:30px}
@media(min-width:1000px){.hero h1{font-size:65px}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}
.nav{gap:18px}
.hero-copy{padding-right:35px}
.hero h1{font-size:51px}
.split{gap:45px}
.wordmark{font-size:23px}
.hero-grid{min-height:600px}
.portrait{min-height:600px}
.contact-grid{gap:40px}}
@media(max-width:780px){.wrap{width:calc(100% - 40px)}
.head{height:88px}
.brand img{height:60px;width:45px}
.wordmark{font-size:20px}
.wordmark small{font-size:7px}
.menu{display:block}
.nav{display:none;position:absolute;top:88px;left:0;right:0;background:var(--ivory);padding:24px;z-index:20;border-bottom:1px solid var(--line);align-items:stretch}
.nav.open{display:flex;flex-direction:column}
.hero-grid{grid-template-columns:1fr}
.hero-copy{padding:45px 0 39px}
.hero h1{font-size:48px;max-width:600px}
.hero .intro{font-size:17px}
.portrait{min-height:490px;margin:0 -20px}
.portrait>img{object-position:center 27%}
.caption{left:20px;right:20px;bottom:20px}
.trust .wrap{flex-wrap:wrap;font-size:11px;gap:8px 18px}
.section{padding:60px 0}
.section-head{display:block;margin-bottom:30px}
.section-head>p{margin-top:24px}
.service-row{grid-template-columns:28px 1fr;gap:12px;padding:27px 0}
.service-row h3{font-size:26px}
.service-row p{grid-column:2;grid-row:2}
.split,.contact-grid{grid-template-columns:1fr;gap:36px}
.about-photo{height:440px}
.steps,.offer-grid{grid-template-columns:1fr;gap:28px}
.steps{margin-top:30px}
.step .number{margin-bottom:12px}
.cta .wrap{display:block}
.cta .button{margin-top:30px}
.footer-grid{grid-template-columns:1fr 1fr}
.footer-grid>div:first-child{grid-column:1/-1}
.bottom{gap:20px;flex-wrap:wrap}
.page-hero{padding:38px 0 48px}
.page-hero h1{font-size:44px;overflow-wrap:anywhere}
.page-hero .intro{font-size:17px}
.wide-row{grid-template-columns:1fr;gap:20px}
.form{padding:23px}
.form-row{grid-template-columns:1fr;gap:0}
.actions{gap:20px}
.eyebrow{font-size:10px}
.notice{padding:24px}
.hero-note{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}

/* Motion and fixed navigation */
.header{position:sticky;top:0;z-index:60;background:var(--burgundy);transition:box-shadow .3s}
.header:after{content:'';position:absolute;bottom:-1px;left:0;height:2px;width:var(--progress,0%);background:var(--gold)}
.header.scrolled{box-shadow:0 8px 24px #5a1a2614}
.brand{transition:opacity .2s}
@media (hover: hover) and (pointer: fine) { .brand:hover{opacity:.75} }


.nav a:not(.button){position:relative}
.nav a:not(.button):after{content:'';position:absolute;left:0;bottom:-5px;width:100%;height:1px;background:var(--old-gold);transform:scaleX(0);transform-origin:left;transition:transform .3s}
@media (hover: hover) and (pointer: fine) { .nav a:hover:after{transform:scaleX(1)} }
.portrait{overflow:hidden}
.hero .portrait>img{will-change:transform;transform-origin:center}
.hero-copy{animation:hero-arrive .9s both}
.caption{animation:hero-arrive 1.1s .15s both}
.offer{transition:border-color 180ms ease,background-color 180ms ease}
@media (hover: hover) and (pointer: fine) { .offer:hover{border-color:var(--gold);background:var(--ivory)} }


.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s var(--delay,0ms),transform .65s var(--delay,0ms)}
.reveal.is-visible{opacity:1;transform:translateY(0)}

.selection-note{font-size:14px;padding:12px 15px;background:var(--paper);border-left:3px solid var(--gold);margin:18px 0}
.anchor,#main{scroll-margin-top:128px}@keyframes hero-arrive{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:780px){.anchor,#main{scroll-margin-top:100px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}
.hero .portrait>img{transform:none!important}

.header{backdrop-filter:none}}


/* Accessible reflow, focus and navigation. */
html { scroll-padding-top: 112px; }
body { overflow-wrap: anywhere; }
main, .hero-copy, .split > *, .wide-row > *, .contact-grid > *, .offer, .footer-grid > * { min-width: 0; }
main:focus { outline: none; }
.hero-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.split, .wide-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.contact-grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.offer-grid, .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.button { max-width: 100%; }
.brand, .brand img { flex-shrink: 0; }
.nav a, .footer nav a { min-height: 24px; }
:is(a, button, input, textarea, select, summary):focus-visible {
  outline: 3px solid var(--old-gold);
  outline-offset: 4px;
  box-shadow: 0 0 0 4px var(--ivory);
}
.form :is(input, textarea, select) { border-color: var(--field-border); }
.form :is(input, textarea)::placeholder { color: var(--muted); opacity: 1; }
/* Content stays visible before scrolling and if scripts fail. */
.reveal { opacity: 1; transform: none; transition: none; }
@media (max-width: 1120px) {
  .head { height: auto; min-height: 76px; padding-block: 12px; flex-wrap: wrap; gap: 12px; }
  .menu { display: block; min-width: 44px; min-height: 44px; border-color: var(--field-border); color: var(--primary); }
  .nav { display: none; position: static; flex: 0 0 100%; padding: 12px 0; border: 0; }
  .nav.open { display: flex; flex-direction: column; align-items: stretch; gap: 4px; }
  .nav a { padding: 10px 12px; min-height: 44px; }
  .header:has(.nav.open) { position: relative; }
}
@media (max-width: 780px) {
  html { scroll-padding-top: 112px; }
  .hero-grid, .split, .wide-row, .contact-grid, .steps, .offer-grid { grid-template-columns: minmax(0, 1fr); }
  .hero h1 { font-size: clamp(2rem, 8.8vw, 3rem); }
  .hero-copy { padding-right: 0; }
  .brand { gap: 8px; }
  .brand img { width: 36px; height: 52px; }
  .wordmark { font-size: clamp(15px, 4.3vw, 20px); }
  .wordmark small { font-size: 7px; letter-spacing: .12em; }
  .head { gap: 8px; }
  .menu { padding: 9px 10px; }
}
@media (max-height: 500px) { .header { position: relative; } }
@media (forced-colors: active) {
  .button, .menu { border: 1px solid ButtonText; }
  :is(a, button, input, textarea, select, summary):focus-visible { outline-color: Highlight; }
}

/* Documentary photographs retain their complete composition and natural color. */
.editorial-photo { margin: 0; min-width: 0; width: 100%; }
.editorial-photo img { width: 100%; height: auto; object-fit: contain; }
.editorial-photo figcaption { margin-top: 12px; font-size: 14px; line-height: 1.5; color: var(--muted); }
.editorial-photo figcaption a { text-decoration-thickness: 1px; }

/* Supplied portraits and reading photographs. */
.supplied-portrait { height: auto; max-height: 680px; object-fit: contain; }
.book { height: auto; }
.reading-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; align-items: start; }
.reading-gallery > :first-child { grid-column: 1 / -1; }
@media (max-width: 780px) { .reading-gallery { grid-template-columns: minmax(0, 1fr); } }

/* Matching gold frames for portraits, About images and service photographs. */
.portrait-frame,
.about-page :is(.supplied-portrait, .book, .editorial-photo img),
.unternehmen-page .editorial-photo img,
.einzelberatung-page .editorial-photo img {
  border: 2px solid var(--gold);
  border-radius: 16px;
}
.about-page .supplied-portrait { width: min(100%, 430px); max-height: none; justify-self: center; }
.about-page .book { max-height: none; }

/* Legal pages share the site's typography and quiet editorial layout. */
.legal-hero .intro { max-width: 48ch; }
.legal-section { padding-block: 72px 90px; }
.legal-grid { display: grid; grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr); gap: clamp(40px, 8vw, 120px); }
.legal-sidebar, .legal-content { min-width: 0; }
.privacy-page .legal-content { max-width: 75ch; overflow-wrap: anywhere; }
.privacy-page h1 { overflow-wrap: anywhere; }
.privacy-page .legal-block p { margin-block: 0 1.25em; }
.privacy-page .legal-block h3 { margin-block: 1.6em .7em; font-size: 1.25rem; }
.privacy-page .legal-block h2 { hyphens: auto; }
.legal-nav { max-width: 270px; }
.legal-nav .eyebrow { margin-bottom: 18px; }
.legal-nav a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding-block: 12px; border-bottom: 1px solid var(--line); text-decoration: none; font-size: 15px; }
@media (hover: hover) and (pointer: fine) { .legal-nav a:hover { color: var(--old-gold); } }
.legal-privacy { max-width: 30ch; margin-top: 32px; color: var(--muted); font-size: 14px; }
.legal-block { padding-block: 34px 38px; border-top: 1px solid var(--line); }
.legal-block:first-child { padding-top: 0; border-top: 0; }
.legal-block:last-child { padding-bottom: 0; }
.legal-block .eyebrow { margin-bottom: 12px; color: var(--muted); }
.legal-block h2 { margin-bottom: 24px; font-size: clamp(29px, 3vw, 38px); }
.legal-name { font-size: 21px; font-weight: 500; }
.legal-name + p { margin-top: 4px; }
.legal-block address { margin-top: 18px; font-style: normal; }
.legal-contact { margin: 0; }
.legal-contact > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 16px; align-items: baseline; }
.legal-contact > div + div { margin-top: 14px; }
.legal-contact dt { color: var(--muted); font-size: 14px; }
.legal-contact dd { margin: 0; }
@media (hover: hover) and (pointer: fine) { .legal-content a:hover { text-decoration-thickness: 2px; } }
@media (max-width: 780px) {
  .legal-section { padding-block: 40px 60px; }
  .legal-grid { grid-template-columns: minmax(0, 1fr); gap: 42px; }
  .legal-nav, .legal-privacy { max-width: none; }
  .legal-privacy { margin-top: 22px; }
  .legal-contact > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}

/* Keep dropdowns operable without decorative arrow indicators. */
.form select { appearance: none; -webkit-appearance: none; }
.form .contact-trap { display: none; }
.form button:disabled { opacity: .65; cursor: wait; }
.form .status:not(:empty) { margin-top: 18px; }

/* Rounded controls across the public website. */
.button, button { border-radius: 999px; }
.button { min-height: 48px; text-align: center; }
@media (hover: hover) and (pointer: fine) { .button.outline:hover { background: var(--primary); color: var(--ivory); } }
.button:active:not(:focus-visible), .menu:active:not(:focus-visible) { transform: scale(.98); }

/* BDP membership shown with the existing association seal. */
.membership { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 22px; align-items: start; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.membership img { width: 84px; height: auto; object-fit: contain; }
.membership h3 { font-size: 18px; margin: 0 0 8px; }
.membership p { font-size: 14px; line-height: 1.65; margin: 0; color: var(--muted); }
@media (max-width: 480px) { .membership { grid-template-columns: minmax(0, 1fr); gap: 16px; } }

/* WhatsApp logo link: a 44px target with an accessible name. */
.footer nav a.whatsapp-link, .contact-list a.whatsapp-link {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; min-height: 44px; flex: none; align-self: flex-start;
  padding: 0; border-radius: 50%; background: var(--primary); color: var(--ivory);
  text-decoration: none; transition: background .2s;
}
.whatsapp-link svg { display: block; width: 26px; height: 26px; flex: none; }
@media (hover: hover) and (pointer: fine) { .footer nav a.whatsapp-link:hover, .contact-list a.whatsapp-link:hover { background: var(--cherry); } }
@media (forced-colors: active) { .whatsapp-link { border: 1px solid LinkText; } }

/* Contact shortcuts share a generous target and remain named for assistive technology. */
.footer nav.contact-icons, .contact-list.contact-icons {
  display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px;
}
.contact-icons a.contact-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; min-height: 44px; flex: none; padding: 0;
  border-radius: 50%; background: var(--primary); color: var(--ivory);
  text-decoration: none; transition: background .2s;
}
.contact-list.contact-icons a { margin: 0; }
.contact-icon svg { display: block; width: 24px; height: 24px; flex: none; }
@media (hover: hover) and (pointer: fine) { .contact-icons a.contact-icon:hover { background: var(--cherry); } }
@media (forced-colors: active) { .contact-icon { border: 1px solid LinkText; } }

/* Counseling principles follow the personal introduction. */
.counseling-values { border-top: 1px solid var(--line); }
.counseling-values-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 80px; align-items: start; }
@media (min-width: 781px) and (min-height: 600px) {
  .counseling-values-layout > h2 { position: sticky; top: 112px; }
}
.counseling-values-list { list-style: none; padding: 0; margin: 0; }
.counseling-values-list li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 22px; padding-block: 24px; border-top: 1px solid var(--line); margin: 0; }
.counseling-values-list li:first-child { padding-top: 0; border-top: 0; }
.counseling-values-list li:last-child { padding-bottom: 0; }
.counseling-values-list svg { color: var(--old-gold); }
.counseling-values-list h3 { font-family: var(--font-heading); font-size: 27px; }
.counseling-values-list p { margin-top: 10px; font-size: 16px; color: var(--muted); }
@media (max-width: 780px) {
  .counseling-values-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .counseling-values-list li { gap: 16px; }
}

/* The photograph determines its own ratio; the copy may grow independently. */
.hero--window { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr); max-width: 1920px; margin-inline: auto; }
.hero--window .hero-backdrop {
  grid-area: 1 / 1; align-self: center; justify-self: end; position: relative; z-index: 0;
  width: min(100%, calc(720px * 1672 / 941)); height: auto; aspect-ratio: 1672 / 941;
  object-fit: contain; object-position: right center;
}
.hero--window::before {
  content: ''; grid-area: 1 / 1; justify-self: end; width: min(100%, calc(720px * 1672 / 941)); position: relative; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, var(--ivory) 0%, rgba(247,242,234,.94) 25%, rgba(247,242,234,.80) 43%, rgba(247,242,234,.38) 60%, rgba(247,242,234,.03) 80%);
}
.hero--window .hero-grid { grid-area: 1 / 1; position: relative; z-index: 2; display: flex; align-items: center; min-height: 560px; }
.hero--window .hero-copy { width: min(720px, 64%); padding: 52px 0 58px; animation: none; }
.hero--window h1 { font-size: clamp(44px, 4vw, 58px); line-height: 1.12; }
.hero--window h1 em { display: block; margin-top: 8px; padding-bottom: .08em; }
.hero--window .eyebrow { margin-bottom: 20px; }
.hero--window .intro { margin-top: 20px; }
.hero-secondary { display: inline-flex; align-items: center; min-height: 44px; padding-block: 8px; color: var(--primary); }
.hero--window .intro { max-width: 43ch; }
.hero--window .hero-byline { margin-top: 12px; font-size: 13px; color: var(--primary); }
.hero-image-credit { position: absolute; z-index: 3; right: 24px; bottom: 18px; padding: 3px 9px; background: rgba(247,242,234,.9); color: var(--primary); font-size: 11px; }
@media (max-width: 1120px) {
  .hero--window .hero-grid { min-height: 0; align-items: start; }
  .hero--window .hero-copy { width: 100%; padding: 36px 0 64px; }
  .hero--window h1 { max-width: 620px; font-size: clamp(32px, 7.8vw, 48px); }
  /* Keep the complete landscape photo behind the lower copy without cropping. */
  .hero--window .hero-backdrop {
    align-self: end;
    width: 100%; height: auto; max-height: none; aspect-ratio: 1672 / 941;
    object-fit: contain; object-position: center bottom;
  }
  .hero--window::before {
    position: absolute; inset: auto 0 0; width: 100%; aspect-ratio: 1672 / 941;
    background:
      linear-gradient(180deg, var(--ivory) 0%, rgba(247,242,234,0) 45%),
      linear-gradient(90deg, rgba(247,242,234,.78) 0%, rgba(247,242,234,.58) 45%, rgba(247,242,234,.12) 100%);
  }
  .hero--window .actions { gap: 12px; }
  .hero--window .hero-image-credit { right: 20px; bottom: 14px; }
}
@media (max-width: 780px) {
  .trust .wrap { flex-direction: column; align-items: flex-start; gap: 8px; }
}


/* Readable type and controls for the October 2026 brand palette. */
h1, h2 { text-wrap: balance; }
h3 { font-weight: 600; }
.wordmark, .caption strong { font-weight: 500; }
.wordmark small { font-weight: 500; }
p { max-width: 65ch; }
.nav a, .button, .menu { font-weight: 500; }
.nav a, .button { text-transform: uppercase; letter-spacing: .06em; font-size: 14px; }
.nav { gap: 22px; flex-wrap: wrap; }
.nav a { flex-shrink: 0; }
@media (min-width: 1121px) {
  .head { height: auto; min-height: 88px; padding-block: 12px; flex-wrap: wrap; }
}
.button { white-space: normal; }
@media (hover: hover) and (pointer: fine) { .button:hover { border-color: var(--cherry); } }
.button.gold { color: var(--ink); }
@media (hover: hover) and (pointer: fine) { .button.gold:hover { background: var(--sand); border-color: var(--sand); color: var(--ink); } }
@media (hover: hover) and (pointer: fine) { .button.outline:hover { background: var(--cherry); border-color: var(--cherry); color: var(--ivory); } }
.eyebrow, .offer .tag { font-size: 14px; font-weight: 500; letter-spacing: .12em; color: var(--old-gold); }
.hero-note, .hero--window .hero-byline, .caption span, .trust .wrap,
.credentials p, .bottom, .breadcrumb, .demo-note, .check label,
.service-row .number, .step .number { font-size: 14px; }
.hero-image-credit { font-size: 12px; }
.section-head > p, .service-row p, .step p, details p,
.offer p, .offer li, .wide-row p, .wide-row li,
.counseling-values-list p, .membership p, .situations span { font-size: 17px; }
.form label { font-size: 16px; font-weight: 500; }
.form :is(input, textarea, select) { color: var(--ink); }
:is(a, button, input, textarea, select, summary):focus-visible {
  outline-color: var(--primary);
  box-shadow: 0 0 0 4px var(--ivory);
}
.green :is(a, button, input, textarea, select, summary):focus-visible,
.cms-preview a:focus-visible {
  outline-color: var(--gold);
  box-shadow: 0 0 0 4px var(--primary);
}
@media (forced-colors: active) {
  :is(a, button, input, textarea, select, summary):focus-visible { outline-color: Highlight; box-shadow: none; }
  .green :focus-visible, .cms-preview a:focus-visible { outline-color: Highlight; box-shadow: none; }
}

/* Updated workshops on the company page */
.workshop-offer h3 { margin-bottom: 16px; }
.workshop-offer ul { padding-left: 1.25em; margin-top: 20px; }
.workshop-offer li + li { margin-top: 10px; }

/* Quiet, immediate responses for keyboard and reduced-motion users. */
.menu { transition: background-color 160ms ease, transform 140ms cubic-bezier(.23,1,.32,1); }
.button:focus-visible, .menu:focus-visible, .faq summary:focus-visible .faq-toggle { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .button:active:not(:focus-visible), .menu:active:not(:focus-visible) { transform: none; }
}

/* Subpages: concise introductions, readable offers and complete photographs.
   Brand palette and supplied image frames stay consistent with the homepage. */
html:has(.subpage) { scroll-behavior: auto; }
.subpage .page-hero { padding-block: 38px 48px; border-bottom: 1px solid var(--line); }
.subpage .breadcrumb { margin-bottom: 24px; }
.subpage .breadcrumb a { display: inline-flex; align-items: center; min-height: 32px; }
.subpage .page-hero h1 { max-width: 1000px; font-size: clamp(38px, 4vw, 58px); }
.subpage .page-hero .intro { max-width: 65ch; margin-top: 22px; font-size: 18px; }
.subpage .section { padding-block: 72px; }
.subpage .section-head { display: block; margin-bottom: 36px; }
.subpage .section-head > p { margin-top: 20px; max-width: 65ch; }
.subpage h2 { font-size: clamp(32px, 3.2vw, 46px); }
.subpage .text-link { display: inline-flex; align-items: center; min-height: 44px; padding-block: 9px; font-size: 16px; }
.subpage .offer-meta { margin: 12px 0 0; color: var(--muted); font: 400 16px/1.6 var(--font-body); letter-spacing: normal; text-transform: none; }
.subpage .cta { padding-block: 60px; }
.subpage .cta .wrap > :last-child { flex: 0 0 auto; max-width: 100%; }
.subpage .cta h2 { max-width: 680px; }
.subpage .cta p { max-width: 58ch; }
.subpage .notice { background: var(--sand); margin-top: 40px; padding: 28px 32px; }
.subpage .notice p { max-width: 80ch; font-size: 16px; }
.subpage .notice h3 { font-size: 22px; }
.subpage .center:has(+ .faq) { text-align: left; max-width: 1100px; margin-inline: auto; }
.subpage .faq { max-width: 1100px; margin-top: 28px; }
.subpage .faq summary { min-height: 44px; }
.subpage .faq details { padding-block: 16px; }
.subpage .faq details p { max-width: 72ch; padding-right: 46px; }

/* An intact portrait-format photograph, sized to the accompanying reading length. */
.einzelberatung-page .online-counseling { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 64px; }
.einzelberatung-page .online-counseling > div { position: static; align-self: center; }
.einzelberatung-page .online-counseling .editorial-photo { max-width: 304px; justify-self: center; }
.consultation-offers { display: grid; }
.consultation-offer { display: grid; grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr); gap: clamp(32px, 6vw, 88px); padding-block: 36px; border-top: 1px solid var(--line); }
.consultation-offer:last-child { padding-bottom: 0; }
.consultation-heading h3 { font-family: var(--font-heading); font-size: 32px; }
.consultation-heading .text-link { margin-top: 22px; }
.consultation-copy { min-width: 0; }
.consultation-copy p, .consultation-copy li { font-size: 17px; color: var(--muted); }
.consultation-copy ul { margin: 24px 0 0; padding-left: 1.2em; }
.consultation-copy li::marker { color: var(--old-gold); }

.unternehmen-page .company-intro { margin-bottom: 56px; }
.unternehmen-page .wide-row { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 88px); padding-block: 36px; }
.unternehmen-page .wide-row h3 { max-width: 24ch; }
.unternehmen-page .wide-row ul { margin-block: 18px 12px; }
.leistungen-page .service-row h3 { text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 1px; text-underline-offset: 6px; }

.about-page.subpage .split:has(.bio-text) { align-items: start; }
.about-page.subpage .bio-text h2 { margin-bottom: 24px; }
.about-page.subpage .reading-gallery { grid-template-columns: minmax(0, 1.7fr) repeat(2, minmax(0, 1fr)); gap: 24px; align-items: end; }
.about-page.subpage .reading-gallery > :first-child { grid-column: auto; }
.about-page.subpage .reading-gallery figcaption { min-height: 3em; }

.kontakt-page .contact-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(40px, 6vw, 80px); align-items: start; }
.contact-channels { display: grid; gap: 4px; margin-block: 24px; max-width: 400px; }
.contact-channel { display: flex; align-items: center; gap: 18px; padding-block: 12px; min-height: 68px; text-decoration: none; }
.contact-channel svg { flex: 0 0 24px; width: 24px; height: 24px; color: var(--primary); }
.contact-channel > span { min-width: 0; }
.contact-channel strong { display: block; color: var(--muted); font-size: 14px; font-weight: 400; }
.contact-channel span span { display: block; text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 1px; text-underline-offset: 5px; }
@media (hover: hover) and (pointer: fine) { .contact-channel:hover span span { text-decoration-color: currentColor; } }
.kontakt-page .form { background: var(--sand); border: 0; border-radius: 16px; padding: clamp(24px, 3vw, 40px); }
.kontakt-page .form h3 { font-family: var(--font-heading); font-size: 32px; margin-bottom: 12px; }
.kontakt-page .demo-note { font-size: 14px; line-height: 1.6; }
.kontakt-page .form :is(input:not([type=checkbox]), select, textarea) { min-height: 48px; border-radius: 8px; }
.kontakt-page .form .check { align-items: start; }
.kontakt-page .form .check input { margin: 5px 0 0; accent-color: var(--primary); }
.kontakt-page .form .check label { font-weight: 400; min-height: 44px; }
.kontakt-page .form .status:empty { margin: 0; }
.kontakt-page .form .status:not(:empty) { padding-top: 18px; border-top: 1px solid var(--line); }
.impressum-page .legal-grid { grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr); }
.impressum-page .legal-nav > .offer-meta { margin-top: 0; margin-bottom: 12px; }
.impressum-page .legal-block > .offer-meta { margin: 0 0 12px; font-size: 14px; }

@media (min-width: 1001px) and (min-height: 850px) {
  .about-page.subpage .supplied-portrait { position: sticky; top: 112px; align-self: start; }
}
@media (max-width: 1000px) {
  .about-page.subpage .reading-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about-page.subpage .reading-gallery > :first-child { grid-column: 1 / -1; }
  .kontakt-page .form-row { grid-template-columns: minmax(0, 1fr); gap: 0; }
}
@media (max-width: 780px) {
  .subpage .page-hero { padding-block: 24px 32px; }
  .subpage .page-hero h1 { font-size: clamp(34px, 8vw, 46px); }
  .subpage .page-hero .intro { font-size: 17px; margin-top: 18px; }
  .subpage .breadcrumb { margin-bottom: 18px; }
  .subpage .section { padding-block: 48px; }
  .subpage .cta { padding-block: 44px; }
  .subpage .notice { padding: 24px; }
  .subpage .faq details p { padding-right: 0; }
  .einzelberatung-page .online-counseling, .unternehmen-page .wide-row,
  .kontakt-page .contact-grid, .impressum-page .legal-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .einzelberatung-page .online-counseling .editorial-photo { max-width: 264px; }
  .consultation-offer { grid-template-columns: minmax(0, 1fr); gap: 20px; padding-block: 28px; }
  .consultation-heading { display: contents; }
  .consultation-heading h3 { order: 0; }
  .subpage .consultation-heading .offer-meta { order: 1; margin: -10px 0 0; }
  .consultation-copy { order: 2; }
  .consultation-heading .text-link { order: 3; justify-self: start; margin-top: 0; }
  .about-page.subpage .reading-gallery { grid-template-columns: minmax(0, 1fr); max-width: 460px; margin-inline: auto; gap: 28px; }
  .about-page.subpage .reading-gallery figcaption { min-height: 0; }
  .unternehmen-page .company-intro { margin-bottom: 40px; }
}

/* Burgundy navigation with the original logo silhouette in brand gold. */
.header .brand { position: relative; color: var(--gold); }
.header .brand img { visibility: hidden; }
.header .brand::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 56px;
  background: var(--gold);
  mask: url('/assets/perforentia-logo.png') center / contain no-repeat;
  pointer-events: none;
}
.header .wordmark small { color: var(--ivory); }
.header .nav { background: var(--burgundy); }
.header .nav a[aria-current=page] { border-bottom-color: var(--gold); }
.header .nav a:not(.button)::after { background: var(--gold); }
.header .nav .button { background: var(--gold); border-color: var(--gold); color: var(--ink); }
.header .menu { color: var(--ivory); border-color: var(--gold); }
.header :is(a, button):focus-visible { outline-color: var(--gold); box-shadow: 0 0 0 4px var(--burgundy); }
@media (hover: hover) and (pointer: fine) {
  .header .brand:hover { opacity: 1; }
  .header .nav .button:hover { background: var(--sand); border-color: var(--sand); color: var(--ink); }
  .header .menu:hover { background: var(--cherry); }
}
@media (max-width: 780px) {
  .header .brand::before { width: 36px; height: 52px; }
}
@media (forced-colors: active) {
  .header .brand::before { background: CanvasText; forced-color-adjust: none; }
  .header :is(a, button):focus-visible { outline-color: Highlight; box-shadow: none; }
}