:root{color-scheme:light;--ink:#172635;--muted:#526575;--blue:#12669b;--line:#dbe4e9;--bg:#f5f8fa;--max:1140px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:17px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:white}a{color:var(--blue)}a:hover{text-decoration-thickness:2px}a:focus-visible,button:focus-visible{outline:3px solid #f0a23c;outline-offset:4px}img{max-width:100%;height:auto;display:block}.wrap{width:min(var(--max),calc(100% - 2.7rem));margin:auto}.skip{position:absolute;left:-9999px;top:10px;background:white;padding:12px;z-index:10}.skip:focus{left:10px}.site-header{border-bottom:1px solid var(--line);background:#fff}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:18px 0;flex-wrap:wrap}.brand{font-size:1.7rem;letter-spacing:-.045em;font-weight:800;text-decoration:none;color:var(--ink)}.brand span{color:var(--blue)}.nav-list,.langs{list-style:none;padding:0;margin:0;display:flex;align-items:center;gap:19px;flex-wrap:wrap}.nav-list a{text-decoration:none;color:var(--ink);font-size:.94rem;font-weight:600}.nav-list a:hover{color:var(--blue)}.langs{gap:7px}.langs a{font-size:.78rem;text-decoration:none;border:1px solid var(--line);border-radius:5px;padding:3px 8px;color:var(--ink)}.langs a[aria-current="page"]{background:var(--ink);color:#fff;border-color:var(--ink)}.hero{background:linear-gradient(125deg,#f2f7fa,#fff 72%);border-bottom:1px solid var(--line)}.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:45px;padding:80px 0}.eyebrow{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);font-weight:800}.hero h1{font-size:clamp(2.25rem,4.4vw,4.2rem);line-height:1.12;letter-spacing:-.05em;margin:17px 0 24px}.lead{font-size:1.16rem;color:var(--muted);max-width:60ch}.actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:30px}.button{display:inline-block;background:var(--blue);border:2px solid var(--blue);padding:12px 22px;color:white;text-decoration:none;border-radius:5px;font-weight:700}.button.alt{background:transparent;color:var(--blue)}.hero-visual{border:1px solid var(--line);padding:12px;background:white;box-shadow:0 20px 45px #19314c0c;border-radius:9px}.note{font-size:.78rem;color:#526575;margin:9px 0 0}.section{padding:76px 0}.section.tinted{background:var(--bg)}.section h2{font-size:clamp(1.8rem,3vw,2.55rem);line-height:1.2;letter-spacing:-.035em;margin:8px 0 12px}.section-intro{max-width:760px;color:var(--muted);margin:0 0 30px}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:21px}.card{padding:31px;background:white;border:1px solid var(--line);border-radius:8px;border-top:4px solid var(--blue)}.card h3{font-size:1.25rem;line-height:1.3;margin:0 0 13px}.card p{margin:0 0 14px;color:var(--muted)}.card ul{padding-left:20px;margin:0}.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.small-caps{font-size:.79rem;text-transform:uppercase;letter-spacing:.1em;color:var(--blue);font-weight:700}.flag{display:inline-block;font-size:.76rem;color:#694b04;background:#fff6df;border:1px solid #ead29c;padding:5px 10px;border-radius:4px;margin:10px 0}.site-footer{background:#132638;color:#cdd9e0;padding:35px 0}.footer-inner{display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap}.site-footer a{color:#e5f1f7}.footer-links{display:flex;gap:22px;flex-wrap:wrap}.legal{padding:55px 0 90px;max-width:820px}.legal h1{font-size:2.4rem;line-height:1.18}.legal h2{font-size:1.33rem;margin-top:34px}.legal p{color:#354859}.legal .warning{border-left:4px solid #cd8f19;background:#fff8e8;padding:16px 20px}.technical{font-size:.95rem}.legal a{overflow-wrap:anywhere}@media(max-width:850px){.hero-inner,.split{grid-template-columns:1fr}.hero-inner{padding:52px 0}.hero-visual{max-width:680px}.cards{grid-template-columns:1fr}.section{padding:52px 0}.header-inner{justify-content:flex-start}.langs{margin-left:auto}}@media(max-width:480px){body{font-size:16px}.wrap{width:min(var(--max),calc(100% - 2rem))}.hero h1{font-size:2.25rem}.nav-list{gap:12px}.nav-list a{font-size:.85rem}.header-inner{gap:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* MKTronix v0.2 – fixed-on-scroll header and improved content flow */
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.98);box-shadow:0 3px 14px rgba(23,38,53,.075)}
html{scroll-padding-top:115px}
.section[id]{scroll-margin-top:115px}
.profile-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr);gap:42px;align-items:center}
.profile-text .section-intro{margin:0 0 20px;max-width:75ch}
.profile-picture{background:#f5f8fa;border:1px solid var(--line);border-radius:9px;padding:12px}
.profile-picture img{border-radius:5px;width:100%}
.office-description{color:var(--muted);margin-bottom:20px}
.contact-details{font-weight:650;color:var(--ink)}
.pending-contact{display:inline-block;color:var(--muted);font-weight:600;border:1px dashed #9daeb8;border-radius:5px;padding:11px 18px}
#approach h3{font-size:1.2rem;margin:26px 0 6px}
#approach h3 + p{margin-top:0}
@media(max-width:850px){.profile-grid{grid-template-columns:1fr}.profile-picture{max-width:380px}.site-header{max-height:none}}
@media(max-width:600px){.header-inner{gap:10px;padding:10px 0}.brand{font-size:1.45rem}.nav-list{gap:10px}.langs{margin-left:0}.nav-list a{font-size:.82rem}html{scroll-padding-top:155px}.section[id]{scroll-margin-top:155px}}

/* V0.3 contact and profile refinements */
.contact-links {display:flex;flex-wrap:wrap;gap:.4rem 2.1rem;margin:1.4rem 0;font-size:1.04rem;}
.contact-links p {margin:0;}
.contact-links a {font-weight:600;text-underline-offset:.2em;}
.personal-note {margin-top:1.25rem;}
@media (max-width:700px){.contact-links{display:block}.contact-links p{margin:.65rem 0}}

/* Version 0.4: alignment and narrative hierarchy */
.hero-inner{align-items:start}
.hero .hero-visual{margin-top:0}
.hero-visual img{width:100%;object-fit:contain;border-radius:4px}
#approach .hero-visual img{aspect-ratio:4/3;object-fit:cover}
.profile-grid{align-items:start}
.profile-picture img{aspect-ratio:4/5;object-fit:cover;object-position:center top}
.office-description{color:var(--ink);margin-top:1.25rem;margin-bottom:1rem}
.personal-note{color:var(--muted);margin:1rem 0 1.4rem}
@media(min-width:851px){.hero .hero-visual{margin-top:0}}

/* Version 0.5: align visual with the first headline row, not the eyebrow. */
@media (min-width:851px){.hero .hero-visual{margin-top:52px}}
@media (max-width:850px){.hero .hero-visual{margin-top:0}}
.portrait-caption{padding:14px 4px 4px;line-height:1.5}
.portrait-caption strong{display:block;font-size:1.05rem;color:var(--ink)}
.portrait-caption span{display:block;color:var(--muted);font-size:.82rem;margin-top:.25rem}

/* Version 0.6: consistent captions and readable legal contact details */
.photo-frame{margin:0;min-width:0}.photo-frame>.hero-visual{margin:0}.photo-frame .image-caption{font-size:.83rem;line-height:1.45;color:var(--muted);padding:11px 3px 0}.hero .photo-frame{margin-top:52px}.hero .photo-frame>.hero-visual{margin-top:0}@media(max-width:850px){.hero .photo-frame{margin-top:0}}
.address-block{white-space:pre-line}.legal{overflow-wrap:break-word}.legal p{margin:0 0 15px}.legal h2{margin-bottom:10px}


/* Version 0.8: favicon, moderated image enlargement, and refined desktop image balance */
@media (min-width:851px){
  .hero-inner{grid-template-columns:minmax(0,1fr) minmax(430px,0.96fr);gap:50px}
  .hero .photo-frame{margin-top:36px;max-width:620px;justify-self:end}
  #approach .split{align-items:start}
  #approach .photo-frame{max-width:540px;justify-self:end;margin-top:0}
}
.zoom-link{position:relative;display:block;border-radius:4px;overflow:hidden}
.zoom-link img{transition:transform .18s ease}
.zoom-link:hover img,.zoom-link:focus-visible img{transform:scale(1.015)}
.zoom-hint{position:absolute;right:12px;bottom:12px;display:inline-flex;align-items:center;gap:.42rem;background:rgba(23,38,53,.84);color:#fff;border-radius:999px;padding:7px 11px;font-size:.76rem;font-weight:650;line-height:1;opacity:0;transform:translateY(4px);transition:opacity .18s ease,transform .18s ease;pointer-events:none}
.zoom-link:hover .zoom-hint,.zoom-link:focus-visible .zoom-hint{opacity:1;transform:translateY(0)}
.zoom-hint::before{content:'+';display:inline-grid;place-items:center;width:1.15rem;height:1.15rem;border-radius:999px;background:rgba(255,255,255,.18);font-size:1rem;font-weight:700}
.lightbox[hidden]{display:none}
.lightbox{position:fixed;inset:0;z-index:1000}
.lightbox-backdrop{position:absolute;inset:0;background:rgba(12,22,33,.62)}
.lightbox-panel{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:100%;padding:24px}
.lightbox-figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 22px 60px rgba(16,29,43,.28);max-width:min(900px,90vw);width:auto;padding:14px}
.lightbox-figure img{display:block;max-width:min(860px,86vw);max-height:80vh;width:auto;height:auto;border-radius:6px}
.lightbox-figure figcaption{font-size:.84rem;line-height:1.45;color:var(--muted);padding:10px 4px 0;max-width:min(860px,86vw)}
.lightbox-close{position:absolute;top:16px;right:16px;border:0;border-radius:999px;background:rgba(255,255,255,.96);box-shadow:0 8px 22px rgba(16,29,43,.18);color:var(--ink);font-size:1.35rem;line-height:1;padding:.3rem .7rem;cursor:pointer}
.lightbox-close:hover{background:#fff}
@media (max-width:850px){
  .zoom-hint{opacity:1;transform:none;bottom:10px;right:10px;padding:6px 10px;font-size:.72rem}
}

/* Version 0.8.1: no hero text overlap and full uncropped measurement setup */
.hero-inner > div:first-child{min-width:0}
.hero-inner .photo-frame{min-width:0;max-width:100%}
@media(min-width:851px){
 .hero-inner{grid-template-columns:minmax(0,1.13fr) minmax(0,.87fr);gap:clamp(24px,3vw,42px)}
 .hero h1{font-size:clamp(2.2rem,3.2vw,3.45rem);overflow-wrap:normal;hyphens:auto}
 .hero .photo-frame{margin-top:52px;max-width:100%}
 #approach .split{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);align-items:start}
 #approach .photo-frame{margin-top:8px;max-width:420px;justify-self:end}
}
#approach .hero-visual img{aspect-ratio:auto;object-fit:contain;width:auto;max-width:100%;height:auto;max-height:420px;margin-inline:auto}
@media(max-width:850px){#approach .hero-visual img{max-height:none;width:100%;height:auto;object-fit:contain}}

/* V0.8.2: close control anchored to the visible lightbox frame */
.lightbox:not([hidden]){display:grid;place-items:center}
.lightbox-panel{min-height:0;width:max-content;max-width:calc(100vw - 44px);padding:0;position:relative}
.lightbox-figure{max-width:calc(100vw - 44px)}
.lightbox-close{position:absolute;z-index:10;top:-15px;right:-15px;width:42px;height:42px;display:grid;place-items:center;padding:0;background:#fff;border:1px solid #c7d6df;box-shadow:0 3px 15px #0004;font-size:29px;line-height:1}
@media(max-width:480px){.lightbox-close{top:-13px;right:-13px;width:40px;height:40px}}

/* V0.8.4 – dezente Copyright-Zeile */
.footer-copyright{font-size:.87rem;color:#cdd9e0;align-self:center}

/* V0.8.5: legal links left, copyright right */
.footer-links{order:0}
.footer-copyright{order:1;text-align:right;margin-left:auto}
@media(max-width:600px){.footer-copyright{text-align:left;margin-left:0}}

/* MKTronix V1.1 – bronze design study; all text and site architecture retained. */
:root{--ink:#302b27;--muted:#625b53;--blue:#765a3d;--line:#e3dbd1;--bg:#f6f2ed}
body{color:var(--ink)}
a:focus-visible,button:focus-visible{outline-color:#ad874f}
.site-header{border-bottom-color:var(--line);box-shadow:0 3px 14px rgba(54,40,25,.07)}
.hero{background:linear-gradient(125deg,#f3ede4,#fff 75%)}
.hero-visual{box-shadow:0 20px 45px rgba(87,58,30,.09)}
.profile-picture{background:#f5f0e9}
.note,.legal p{color:var(--muted)}
.flag{color:#694b04;background:#fff6df}
.site-footer{background:#302820;color:#e7ddd0}
.site-footer a{color:#f8eee1}
.footer-copyright{color:#e7ddd0}
.zoom-hint{background:rgba(51,37,25,.85)}
.lightbox-backdrop{background:rgba(37,29,23,.72)}
.lightbox-figure{box-shadow:0 22px 60px rgba(37,29,23,.28)}
.lightbox-close{border-color:#d8cbbc}
.footer-copyright{display:flex;align-items:center;gap:12px;justify-content:flex-end}
.footer-compass{width:26px;height:26px;flex:none;opacity:.85;color:#cdb38f}
@media(max-width:600px){.footer-copyright{justify-content:flex-start}}

/* MKTronix V1.3 – circular overhead compass beside 30 years of experience. */
.hero-experience{display:flex;align-items:center;gap:20px}
.hero-experience .lead{flex:1;min-width:0;margin:0}
.hero-compass{width:126px;height:126px;object-fit:contain;flex:none;display:block}
@media(max-width:540px){.hero-experience{gap:12px}.hero-compass{width:90px;height:90px}}
@media(max-width:380px){.hero-compass{width:76px;height:76px}}

/* MKTronix V1.4 – realistic compass as standalone hero image; PCB photograph by service introduction. */
.hero-inner{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);align-items:center}
.hero .hero-compass-display{display:flex;align-items:center;justify-content:center;min-width:0;padding:10px}
.hero .hero-compass-display .hero-compass{display:block;width:min(100%,340px);height:auto;aspect-ratio:1/1;object-fit:contain;filter:drop-shadow(0 10px 15px rgba(79,57,34,.14))}
.hero-inner .lead{margin-top:0}
.services-intro-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:36px;align-items:center;margin:12px 0 32px}
.services-intro-copy .section-intro{margin:0;max-width:unset}
#services .photo-frame{max-width:100%;margin:0;min-width:0}
#services .photo-frame .hero-visual{margin:0}
#services .photo-frame .hero-visual img{width:100%;height:auto;object-fit:contain}
#services .photo-frame .image-caption{font-size:.83rem;line-height:1.45;color:var(--muted);padding:11px 3px 0}
@media(max-width:850px){.hero-inner{grid-template-columns:1fr}.hero .hero-compass-display{justify-content:center;padding:8px 0 0}.hero .hero-compass-display .hero-compass{width:min(65vw,285px)}.services-intro-layout{grid-template-columns:1fr;gap:24px}}
@media(max-width:480px){.hero .hero-compass-display .hero-compass{width:min(65vw,230px)}.services-intro-layout{margin-bottom:25px}}

/* MKTronix V2.0.2 – translated legal-page notice. */
.legal .translation-notice{padding:13px 17px;margin:18px 0 28px;border-left:4px solid #907456;background:#f6f1e9;border-radius:0 6px 6px 0;color:#413629;line-height:1.55}
.legal .translation-notice a{font-weight:650;color:#695034}

/* Footer: copyright stays together on one line */
.footer-copyright .copyright-text{white-space:nowrap}
@media(max-width:380px){.footer-copyright .copyright-text{font-size:clamp(.69rem,2.9vw,.87rem)}}