:root{
  --bg:#020706;--bg2:#03100d;--petrol:#10b7b0;--petrol-soft:rgba(16,183,176,.14);
  --copper:#b77b50;--copper-light:#cf986b;--copper-deep:#744527;
  --cream:#f2ede6;--muted:#aab2af;--line:rgba(183,123,80,.23);
  --ease:cubic-bezier(.22,.77,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--cream);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.site{position:relative;isolation:isolate;min-height:100vh;overflow:hidden;background:linear-gradient(180deg,#020706 0%,#03110e 46%,#020706 100%)}
.site:before{content:"";position:fixed;inset:-20%;z-index:-2;pointer-events:none;background:radial-gradient(circle at 14% 24%,rgba(16,183,176,.095),transparent 24%),radial-gradient(circle at 85% 18%,rgba(183,123,80,.075),transparent 22%),radial-gradient(circle at 72% 78%,rgba(16,183,176,.055),transparent 25%);filter:blur(18px)}
.site:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.42;background-image:radial-gradient(circle at 11% 18%,rgba(207,152,107,.45) 0 1px,transparent 1.6px),radial-gradient(circle at 21% 77%,rgba(207,152,107,.28) 0 1px,transparent 1.8px),radial-gradient(circle at 63% 24%,rgba(207,152,107,.25) 0 1px,transparent 1.8px),radial-gradient(circle at 88% 68%,rgba(207,152,107,.38) 0 1px,transparent 1.8px);background-size:330px 290px,410px 360px,460px 410px,520px 470px;animation:none}
@keyframes starDrift{to{transform:translate3d(24px,-18px,0)}}
.header{position:fixed;z-index:100;top:0;left:0;right:0;transition:.35s ease;background:linear-gradient(180deg,rgba(2,7,6,.88),rgba(2,7,6,.48));backdrop-filter:blur(15px)}
.nav{width:min(1280px,calc(100% - 64px));height:78px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(183,123,80,.16)}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none!important;white-space:nowrap}
.brand-monogram{width:34px;height:46px;object-fit:contain;object-position:center;display:block;filter:drop-shadow(0 0 7px rgba(183,123,80,.22));image-rendering:auto}
.brand-name{color:var(--cream);font-size:11px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;white-space:nowrap}
.links{display:flex;align-items:center;gap:28px}.links a{font-size:10px;letter-spacing:.19em;text-transform:uppercase;color:rgba(242,237,230,.72);position:relative;padding:8px 0}.links a:after{content:"";position:absolute;left:0;right:.18em;bottom:0;height:1px;background:linear-gradient(90deg,var(--petrol),var(--copper-light));transform:scaleX(0);transform-origin:left;transition:.35s var(--ease)}.links a:hover,.links a.active{color:var(--cream)}.links a:hover:after,.links a.active:after{transform:scaleX(1)}.links .story{border:1px solid rgba(183,123,80,.32);padding:12px 15px}.links .story:after{display:none}
.hero{position:relative;min-height:760px;padding-top:78px;overflow:hidden}.hero-grid{position:relative;z-index:5;width:min(1280px,calc(100% - 64px));min-height:682px;margin:auto;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:36px;align-items:center}.hero-copy{position:relative;z-index:5;max-width:610px}.eyebrow{display:flex;align-items:center;gap:14px;color:var(--petrol);font-size:10px;letter-spacing:.34em;text-transform:uppercase;margin-bottom:20px}.eyebrow:before{content:"";width:30px;height:1px;background:linear-gradient(90deg,var(--copper),var(--petrol))}.hero h1,.section h2,.statement{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.04em}.hero h1{font-size:clamp(58px,6.7vw,96px);line-height:.91;margin:0;text-wrap:balance}.hero h1 em,.section h2 em,.statement em{color:var(--copper-light);font-weight:400}.hero-lead{max-width:590px;margin:28px 0 0;color:rgba(242,237,230,.82);font-size:16px;line-height:1.82}.hero-note{margin-top:20px;color:rgba(170,178,175,.68);font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.hero-visual{position:relative;min-height:620px;display:flex;align-items:center;justify-content:flex-end}.hero-visual:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:2%;top:10%;background:radial-gradient(circle,rgba(16,183,176,.10),rgba(183,123,80,.055) 43%,transparent 70%);filter:blur(35px);animation:auraPulse 7s ease-in-out infinite}.portrait{position:relative;z-index:2;width:min(100%,530px);max-height:650px;object-fit:cover;object-position:center;display:block;-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 12%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 8%,#000 90%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0%,#000 12%,#000 91%,transparent 100%),linear-gradient(to bottom,transparent 0%,#000 8%,#000 90%,transparent 100%);mask-composite:intersect;filter:drop-shadow(0 18px 30px rgba(0,0,0,.24));animation:portraitFloat 9s ease-in-out infinite}
@keyframes portraitFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,-8px,0) scale(1.008)}}@keyframes auraPulse{50%{opacity:.62;transform:scale(1.05)}}
.scroll-cue{position:absolute;z-index:6;left:calc((100% - min(1280px,calc(100% - 64px)))/2);bottom:28px;display:flex;align-items:center;gap:14px;color:rgba(242,237,230,.42);font-size:8px;letter-spacing:.28em;text-transform:uppercase}.scroll-cue:before{content:"";width:44px;height:1px;background:linear-gradient(90deg,var(--petrol),var(--copper))}
.section{position:relative;min-height:600px}.inner{width:min(1180px,calc(100% - 64px));margin:auto;padding:100px 0}.section-head{display:grid;grid-template-columns:.82fr 1.18fr;gap:64px;align-items:end;margin-bottom:54px}.section h2{margin:0;font-size:clamp(48px,5.3vw,78px);line-height:.95}.section-intro{margin:0;color:var(--muted);font-size:15px;line-height:1.88;max-width:650px}.intro-accent{font-family:Georgia,"Times New Roman",serif;font-style:italic;color:var(--copper-light);font-size:1.08em;letter-spacing:.01em;text-shadow:0 0 12px rgba(183,123,80,.12)}
.text-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.text-card{position:relative;min-height:260px;padding:30px 27px;border:1px solid rgba(183,123,80,.18);background:linear-gradient(180deg,rgba(4,16,13,.72),rgba(2,9,7,.38));overflow:hidden;transition:.4s var(--ease)}.text-card:hover{transform:translateY(-5px);border-color:rgba(207,152,107,.38);background:linear-gradient(180deg,rgba(5,20,16,.82),rgba(3,10,8,.46))}.text-card:after{content:"";position:absolute;right:-50px;bottom:-65px;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,rgba(16,183,176,.10),transparent 70%)}.num{font-family:Georgia,"Times New Roman",serif;font-size:28px;color:var(--copper-light);margin-bottom:34px}.text-card h3{font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 14px}.text-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.68}
.chapter{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:70px;align-items:center}.chapter-copy p{color:var(--muted);font-size:15px;line-height:1.9;margin:22px 0 0}





/* =====================================================
   DIGITAL – FREISTEHENDER FILIGRANER KUPFERKOMPASS
   Keine Bühne, keine Schatten, keine Reflexionskopie.
   ===================================================== */

.digital-page .site:after{
    animation:none;
    transform:none;
    opacity:.18;
}

.compass-stage{
    position:relative;
    min-height:430px;
    overflow:visible;
    isolation:isolate;
    border:0;
    background:transparent;
    box-shadow:none;
    filter:none;
}

.compass-stage-clean::before,
.compass-stage-clean::after{
    content:none;
}

.compass-static-ring{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border-radius:50%;
    pointer-events:none;
    z-index:1;
    box-shadow:none;
    filter:none;
}

.ring-one{
    width:244px;
    height:244px;
    border:1px solid rgba(16,183,176,.10);
    animation:ringRotateA 34s linear infinite;
}

.ring-two{
    width:304px;
    height:304px;
    border:1px solid rgba(183,123,80,.08);
    animation:ringRotateB 44s linear infinite reverse;
}

.compass-sparkles{
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:2;
}

.spark{
    position:absolute;
    width:5px;
    height:5px;
    border-radius:50%;
    opacity:.28;
    background:var(--copper-light);
    box-shadow:none;
    filter:none;
    animation:twinkleClean 4.8s ease-in-out infinite;
}

.spark::before,
.spark::after{
    content:none;
}

.s1{left:64%;top:26%;animation-delay:0s}
.s2{left:73%;top:63%;width:4px;height:4px;animation-delay:1.1s;background:var(--petrol)}
.s3{left:33%;top:68%;width:5px;height:5px;animation-delay:2.2s}
.s4{left:57%;top:78%;width:4px;height:4px;animation-delay:3s;background:var(--petrol)}

.compass-wrap{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    transform-origin:center;
    z-index:4;
    box-shadow:none;
    filter:none;
}

.compass-wrap-filigree{
    width:min(50%, 255px);
    aspect-ratio:1 / 1;
    animation:compassFloat 8.5s ease-in-out infinite;
}

.compass-art{
    display:block;
    width:100%;
    height:auto;
    position:absolute;
    inset:0;
    image-rendering:auto;
}

.compass-art-clean{
    z-index:3;
    filter:none;
    box-shadow:none;
    mix-blend-mode:normal;
}

.compass-rotor{
    animation:compassTurn 48s linear infinite;
    transform-origin:50% 50%;
}

@keyframes compassFloat{
    0%,100%{transform:translate(-50%,-50%) scale(.992)}
    50%{transform:translate(-50%,-51.1%) scale(1)}
}

@keyframes compassTurn{
    from{transform:rotate(0deg)}
    to{transform:rotate(360deg)}
}

@keyframes ringRotateA{
    from{transform:translate(-50%,-50%) rotate(0deg)}
    to{transform:translate(-50%,-50%) rotate(360deg)}
}

@keyframes ringRotateB{
    from{transform:translate(-50%,-50%) rotate(0deg)}
    to{transform:translate(-50%,-50%) rotate(360deg)}
}

@keyframes twinkleClean{
    0%,100%{opacity:.18;transform:scale(.8)}
    50%{opacity:.58;transform:scale(1.18)}
}
.marquee{overflow:hidden;border-top:1px solid rgba(183,123,80,.14);border-bottom:1px solid rgba(183,123,80,.14);background:rgba(2,8,7,.38)}.marquee-track{display:flex;width:max-content;gap:48px;padding:18px 0;animation:marquee 27s linear infinite}.marquee span{font-size:9px;letter-spacing:.26em;text-transform:uppercase;color:rgba(242,237,230,.56);white-space:nowrap}.marquee span b{font-weight:400;color:var(--petrol);margin-right:48px}@keyframes marquee{to{transform:translateX(-50%)}}
.statement-wrap{padding:120px 0;text-align:center;width:min(980px,calc(100% - 64px));margin:auto}.statement{font-size:clamp(42px,5.6vw,80px);line-height:1.02;margin:0;text-wrap:balance}.statement-sub{max-width:650px;margin:30px auto 0;color:var(--muted);font-size:15px;line-height:1.86}.cta-row{display:flex;justify-content:center;gap:12px;margin-top:34px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 21px;border:1px solid rgba(183,123,80,.32);font-size:9px;letter-spacing:.18em;text-transform:uppercase;transition:.3s var(--ease)}.btn:hover{transform:translateY(-2px);border-color:rgba(207,152,107,.7)}.btn.fill{background:linear-gradient(90deg,#8d542f,#c78655);color:#fff;border-color:rgba(207,152,107,.42)}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}.reveal.in{opacity:1;transform:none}.delay1{transition-delay:.12s}.delay2{transition-delay:.24s}
.footer{width:min(1180px,calc(100% - 64px));margin:auto;padding:34px 0 42px;border-top:1px solid rgba(183,123,80,.14);display:flex;justify-content:space-between;gap:20px;color:rgba(170,178,175,.58);font-size:9px;letter-spacing:.12em;text-transform:uppercase}
@media(max-width:900px){.nav{width:calc(100% - 34px)}.links{gap:13px}.links a{font-size:8px}.hero-grid,.section-head,.chapter{grid-template-columns:1fr}.hero-grid{width:calc(100% - 34px);padding:55px 0 70px}.hero-copy{max-width:none}.hero-visual{min-height:520px;justify-content:center}.inner,.statement-wrap,.footer{width:calc(100% - 34px)}.section-head{gap:26px}.text-grid{grid-template-columns:1fr}.chapter{gap:34px}.scroll-cue{display:none}.compass-stage{min-height:340px}}
@media(max-width:600px){.compass-stage{min-height:330px}.compass-wrap{width:min(82%,300px)}.brand-name{display:none}.links .story{padding:10px}.links{gap:8px}.links a{font-size:7px;letter-spacing:.12em}.hero h1{font-size:clamp(50px,15vw,70px)}.hero-lead{font-size:15px}.hero-visual{min-height:440px}.portrait{max-height:500px}.inner{padding:78px 0}.section h2{font-size:clamp(44px,13vw,62px)}.statement-wrap{padding:92px 0}.footer{flex-direction:column}}


/* APS SAFE FALLBACK: content must remain visible even if IntersectionObserver JS is not executed. */
.reveal{opacity:1 !important;translate:0 0 !important;filter:none !important;}

.footer-links{display:flex;align-items:center;gap:16px}.footer a{transition:.25s}.footer a:hover{color:var(--copper-light,#cf986b)}@media(max-width:600px){.footer-links{flex-wrap:wrap}}