/* Devontra mother-site typography, controls and composition for DeviNote. */
:root{--cyan:#01C1F7;--blue:#007AC1;--bg:#042240;--ink:#E5F6FE;--muted:#afc6d8}html[data-theme=light]{--bg:#E5F6FE;--ink:#042240;--muted:#475569}body{font-family:Arial,Helvetica,sans-serif;font-size:17px;line-height:1.6;overflow-wrap:break-word}em{font-family:Georgia,serif;font-weight:400}main:focus{outline:0}
.header{position:sticky;top:0;z-index:40;background:#042240e8;backdrop-filter:blur(16px);border-bottom:0}.header-row{gap:22px;height:92px}.header .brand{flex:none}.header .brand-name{font-size:29px}.header .brand-by{font-size:10px}.header .nav{font-size:15px;gap:22px}.header .header-actions{gap:15px}
html[data-theme=light] .header{background:#E5F6FEed}
.theme-switch{display:flex;align-items:center;gap:3px;padding:4px;border:1px solid var(--line);border-radius:100px;flex:none}.theme-switch button{border:0;background:transparent;color:var(--muted);font-size:13px;line-height:1.4;padding:9px 13px;min-height:38px;border-radius:100px}.theme-switch button[aria-pressed=true]{background:#E5F6FE;color:#042240}.theme-switch button:hover{color:var(--ink)}.theme-switch button[aria-pressed=true]:hover{color:#042240}html[data-theme=light] .theme-switch button[aria-pressed=true]{background:#042240;color:#E5F6FE}.header .menu{min-width:44px;min-height:44px}.btn{font-size:16px;line-height:1.5;min-height:52px;border-radius:8px}.nav a,.login{min-height:44px;display:inline-flex;align-items:center}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #01C1F7;outline-offset:4px}html[data-theme=light] :is(a,button,input,textarea,summary):focus-visible{outline-color:#007AC1}
.hero{padding:80px 0 95px}.hero h1{font-size:clamp(44px,5.4vw,80px);line-height:1.08;letter-spacing:-.045em}.hero-copy>p{font-size:clamp(18px,1.5vw,21px);line-height:1.75}.hero-actions{gap:14px;flex-wrap:wrap}.hero-visual{min-width:0}
html body .family-chapter h2.section-title{font-size:clamp(38px,4.2vw,60px);line-height:1.16;letter-spacing:-.035em;font-weight:500;margin:0;text-transform:none}
html body .family-chapter .section-subtitle{font-size:clamp(22px,2.2vw,30px);line-height:1.5;letter-spacing:-.015em;margin:22px 0 0;color:var(--ink);max-width:780px}
html body .family-chapter .section-subtitle em{color:var(--family-heading-accent,#BCEFFF)}
.section{padding:100px 0;border:0}.section-head{margin-bottom:42px}.section-head>p:not(.section-subtitle),.split>div>p:not(.section-subtitle){font-size:18px;line-height:1.8}.feature-grid p,.steps p,.privacy-panel p,.team-layout p{font-size:17px;line-height:1.75}.feature-grid h3,.step h3{font-size:25px;line-height:1.3}.section :is(.split,.team-layout,.faq-grid)>*{min-width:0}.section :is(input,textarea){max-width:100%;min-width:0;font-size:17px}.product-shot img,.handbook-shot img{object-fit:contain;max-width:100%;height:auto}.product-shot figcaption{font-size:14px;line-height:1.6}
html body .family-chapter .plan,.surface{border-radius:22px}.plan ul{font-size:16px;line-height:1.7}.faq-list summary{font-size:19px;line-height:1.45}.faq-list p{font-size:17px;line-height:1.8}.contact-intro>p{font-size:18px;line-height:1.8}.contact-details a{font-size:17px}.contact-fields{gap:22px}
.footer.note-footer{padding:70px 0 28px;border:0;background:var(--bg)}.note-footer-main{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:65px}.note-footer-main>*{min-width:0}.note-footer-brand>p{font-size:clamp(21px,2vw,27px);line-height:1.5;margin-top:25px;color:var(--ink)}.note-footer-brand em{color:#BCEFFF}html[data-theme=light] .note-footer-brand em{color:#007AC1}.note-footer-main h3{font-size:18px;line-height:1.4;margin:0 0 18px}.note-footer-main>nav>a,.note-footer-contact>a{display:block;width:fit-content;padding:7px 0;font-size:16px;line-height:1.6;color:var(--muted);overflow-wrap:anywhere}.note-footer-main a:hover,.footer-bottom a:hover{color:var(--cyan)}.note-footer-contact address{font-size:16px;line-height:1.8;font-style:normal;color:var(--muted);margin-top:15px}.note-footer .footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:22px;margin-top:48px;padding-top:23px;font-size:14px;line-height:1.7;border:0}.footer-bottom nav{display:flex;gap:23px;flex-wrap:wrap}.footer-bottom a{padding:8px 0;border:0}
@media(max-width:1220px){.header .nav{display:none;position:absolute;top:92px;left:0;right:0;background:var(--bg);padding:25px 5%;max-height:calc(100svh - 92px);overflow:auto;flex-direction:column;align-items:stretch;gap:14px}.header .nav.open{display:flex}.header .menu{display:block}.header .header-actions{margin-left:auto}.header .nav a{font-size:17px}.hero{padding-top:65px}}
@media(max-width:800px){.note-footer-main{grid-template-columns:1fr 1fr;gap:35px}.note-footer-brand{grid-column:1/-1}.section{padding:75px 0}.hero{padding-top:55px;padding-bottom:70px}.header .login{display:none}.hero h1{font-size:clamp(42px,7vw,64px)}}
@media(max-width:600px){.header-row{height:78px;gap:10px}.header .nav{top:78px;max-height:calc(100svh - 78px)}.header .brand-name{font-size:25px}.header .brand-mark{width:38px;height:27px}.header .brand-by{font-size:9px}.header .brand{gap:8px}.header .header-actions{gap:7px}.header .header-actions>.btn{display:none}.theme-switch{padding:3px}.theme-switch button{padding:8px;min-height:36px;font-size:12px}.hero h1{font-size:clamp(38px,9vw,54px)}.hero-copy>p{font-size:18px}.hero-actions>.btn{width:100%}html body .family-chapter h2.section-title{font-size:clamp(32px,8.4vw,44px)}html body .family-chapter .section-subtitle{font-size:22px}.section-head{margin-bottom:30px}.note-footer-main{grid-template-columns:1fr;gap:32px}.note-footer-brand{grid-column:auto}.note-footer .footer-bottom{align-items:flex-start;margin-top:35px}.contact-submit{width:100%}.footer-bottom nav{gap:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal.pending{opacity:1!important;transform:none!important}}
html body :is(#so-funktioniert-es,#produkt,#ablauf,#praxis,#daten,#team,#tarife,#fragen,#kontakt).family-chapter h2.section-title{font-size:clamp(38px,4.2vw,60px);line-height:1.16;letter-spacing:-.035em;font-weight:500;margin:0;text-transform:none}
html body :is(#produkt,#ablauf,#praxis,#daten,#team,#tarife,#fragen).family-chapter p.section-subtitle{font-size:clamp(22px,2.2vw,30px);line-height:1.5;letter-spacing:-.015em;margin:22px 0 0;color:var(--ink)}
@media(max-width:600px){html body :is(#so-funktioniert-es,#produkt,#ablauf,#praxis,#daten,#team,#tarife,#fragen,#kontakt).family-chapter h2.section-title{font-size:clamp(32px,8.4vw,44px)}html body :is(#produkt,#ablauf,#praxis,#daten,#team,#tarife,#fragen).family-chapter p.section-subtitle{font-size:22px}}

.nav-account{display:none}@media(max-width:1220px){.header .nav-account{display:flex;flex-wrap:wrap;gap:16px;margin-top:8px}.header .nav-account a{padding:10px 16px;border:1px solid var(--line);border-radius:8px}}