@font-face{font-family:Montserrat;src:url('/assets/Montserrat-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Montserrat;src:url('/assets/Montserrat-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
:root{color:#1c2a37;background:#ecebe6;font-family:Montserrat,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:6px}
.hero{min-height:100vh;min-height:100svh;display:grid;grid-template-columns:38.1966% 61.8034%;position:relative}
.panel{grid-column:1;grid-row:1;display:flex;flex-direction:column;padding:0 max(24px,4.75vw);min-width:0;min-height:max(100svh,var(--menu-min-height,0px))}
.identity{margin-block:auto;padding-block:145px 100px;font-size:clamp(30px,5.5vw,108px);transform:translateY(-2.5vh)}
.degree{font-size:.5em;font-weight:400;line-height:1.3;margin:0 0 .3em;white-space:nowrap}
h1{font-size:1em;font-weight:600;line-height:1.16;letter-spacing:-.025em;margin:0 0 0 -.035em}h1 span{display:block}
.legal{display:flex;flex-wrap:wrap;gap:12px 2rem;padding-bottom:max(32px,env(safe-area-inset-bottom));font-size:clamp(14px,1.0625vw,18px)}
.legal a{display:inline-flex;align-items:center;text-decoration:none;padding:8px 0;min-height:44px}.legal a:hover{text-decoration:underline;text-underline-offset:5px}
.portrait{grid-column:2;grid-row:1;position:relative;min-width:0;overflow:hidden}
.portrait img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 22%;display:block}
.menu{position:absolute;z-index:2;left:max(14px,calc(4.75vw - 10px));top:max(30px,env(safe-area-inset-top));width:50px;height:50px;padding:10px;border:0;background:transparent;display:flex;flex-direction:column;justify-content:center;gap:7px}
.brand-logo{display:none;position:absolute;z-index:2;left:calc(max(14px,calc(4.75vw - 10px)) + 66px);top:calc(max(30px,env(safe-area-inset-top)) + 25px);transform:translateY(-50%);width:min(clamp(160px,16vw,240px),calc(33.4466vw - 80px));aspect-ratio:860/91;background:currentColor;-webkit-mask:url(/assets/dochoffmann-logo-original.png) center/contain no-repeat;mask:url(/assets/dochoffmann-logo-original.png) center/contain no-repeat}
.menu[aria-expanded="true"] + .brand-logo{display:block}
.identity{translate:0 var(--menu-offset,0px)}
.menu span{height:2px;width:30px;background:currentColor}
[hidden]{display:none!important}
.navigation{position:absolute;z-index:3;top:calc(max(30px,env(safe-area-inset-top)) + 56px);left:max(14px,calc(4.75vw - 14px));width:calc(38.1966vw - max(14px,calc(4.75vw - 14px)));max-width:calc(100vw - 28px);padding:10px 14px;background:transparent;border:0;border-radius:0;box-shadow:none}
.channel-links{list-style:none;padding:0;margin:0}
.channel-links a{display:flex;align-items:center;min-height:44px;padding:6px 0;font-size:clamp(18px,1.25vw,22px);line-height:1.4;text-decoration:none}
.channel-links a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.menu[aria-expanded="true"] span:first-child{transform:translateY(9px) rotate(45deg)}
.menu[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu[aria-expanded="true"] span:last-child{transform:translateY(-9px) rotate(-45deg)}
@media(prefers-reduced-motion:no-preference){.navigation:not([hidden]){animation:reveal .16s ease-out}@keyframes reveal{from{opacity:0}to{opacity:1}}}
@media(max-width:700px), (max-width:1100px) and (orientation:portrait){
.hero{display:flex;flex-direction:column;min-height:100svh}
.brand-logo{left:74px;top:calc(max(10px,env(safe-area-inset-top)) + 22px);width:clamp(170px,46vw,210px)}
.navigation{left:14px;top:calc(max(10px,env(safe-area-inset-top)) + 50px);width:184px;padding:8px 10px;background:transparent}
.menu[aria-expanded="true"] span:first-child{transform:translateY(8px) rotate(45deg)}
.menu[aria-expanded="true"] span:last-child{transform:translateY(-8px) rotate(-45deg)}
.portrait{order:-1;flex:none;height:61.8vh;height:clamp(240px,calc(100svh - 322px),61.8svh)}
.portrait img{object-position:50% 0%;width:100%;max-width:none;left:0;height:100%;object-fit:cover}
.panel{min-height:322px;flex:1;padding:0 max(24px,env(safe-area-inset-left));}
.identity{font-size:clamp(42px,14.359vw,66px);transform:none;margin-block:auto;padding-block:52px 26px}
.degree{margin-bottom:.24em;line-height:1.25}
.legal{font-size:16px;gap:12px 26px;padding-bottom:max(28px,env(safe-area-inset-bottom))}
.menu{left:14px;top:max(10px,env(safe-area-inset-top));color:#1c2a37;width:44px;height:44px;gap:6px}.menu span{width:24px}
}

@media(min-width:701px) and (max-height:540px){.identity{padding-block:110px 40px;transform:none}.legal{padding-bottom:16px}}


.channel-links a{font-weight:600}
.menu{display:none}.brand-logo{display:block}.navigation{position:static;width:auto;max-width:none;padding:0;background:transparent;grid-column:1;grid-row:1;z-index:3;align-self:start;margin:94px max(24px,4.75vw) 0}.hero:not(.menu-enhanced) .identity{padding-top:340px}
.menu-enhanced .menu{display:flex}.menu-enhanced .brand-logo{display:none}.menu-enhanced .menu[aria-expanded="true"] + .brand-logo{display:block}.menu-enhanced .navigation{position:absolute;align-self:auto;margin:0;top:calc(max(30px,env(safe-area-inset-top)) + 56px);left:max(14px,calc(4.75vw - 14px));width:calc(38.1966vw - max(14px,calc(4.75vw - 14px)));max-width:calc(100vw - 28px);padding:10px 14px}
@media(max-width:700px),(max-width:1100px) and (orientation:portrait){.navigation{order:-2;margin:60px 24px 16px}.hero:not(.menu-enhanced) .identity{padding-top:52px}.menu-enhanced .navigation{left:14px;top:calc(max(10px,env(safe-area-inset-top)) + 50px);width:184px;padding:8px 10px}}