:root { --ink: #f6f4ef; --paper: #090a0c; --gold: #d5ab5b; --gold-soft: #9e7939; --line: rgba(246,244,239,.22); --mono: "DM Mono", monospace; }
* { box-sizing: border-box; }
html { scroll-behavior: auto; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto; }
.lenis.lenis-stopped { overflow: clip; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "DM Sans", sans-serif; overflow-x: hidden; }
body:before { content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.13; background-image:linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px); background-size:64px 64px; mask-image:linear-gradient(to bottom, black, transparent 75%); }
.noise { position: fixed; z-index: 10; inset: 0; opacity: .045; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); }
.cursor-glow { position: fixed; width: 440px; height: 440px; border-radius: 50%; background: radial-gradient(circle, rgba(213,171,91,.13), transparent 62%); pointer-events: none; z-index: 0; transform: translate(-50%,-50%); }
a { color: inherit; text-decoration: none; } button { font: inherit; color: inherit; }
.site-header { position: fixed; z-index: 20; top: 0; width: 100%; padding: 27px 3.5vw; display: flex; align-items: center; justify-content: space-between; font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; transition: padding .45s ease, background-color .45s ease, border-color .45s ease; border-bottom:1px solid transparent; }
.site-header.is-scrolled { padding-top:16px; padding-bottom:16px; background:rgba(9,10,12,.86); border-color:rgba(213,171,91,.25); backdrop-filter:blur(16px); }
.brand { font: 600 28px/1 "DM Sans"; letter-spacing: -.08em; }.brand span { color: var(--gold); }
nav { display:flex; gap:29px; position:absolute; left:50%; transform:translateX(-50%); } nav a, .header-contact { position: relative; } nav a:after, .header-contact:after { content: ""; position: absolute; height: 1px; background: currentColor; bottom: -5px; left: 0; width: 0; transition: width .3s; } nav a:hover:after,.header-contact:hover:after { width: 100%; }.header-contact { display:flex; align-items:center; gap:5px; }.header-contact svg { width:13px; }
.hero { min-height:100vh; position:relative; padding:111px 3.5vw 36px; display:flex; flex-direction:column; background:#101216; overflow:hidden; border-bottom:1px solid rgba(213,171,91,.4); }.hero:after { content:""; position:absolute; width:58vw; height:58vw; right:-20vw; top:-35vw; border:1px solid rgba(213,171,91,.35); border-radius:50%; box-shadow:0 0 0 10vw rgba(213,171,91,.025),0 0 0 20vw rgba(213,171,91,.018); }.hero-topline { display:flex; justify-content:space-between; font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.06em; position:relative; z-index:2; color:var(--gold); }.hero-content { margin-top:auto; position:relative; z-index:2; }.eyebrow,.section-label { font:10px var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--gold); }.hero h1 { margin:12px 0 0; font-size:clamp(67px,15.25vw,250px); line-height:.75; letter-spacing:-.085em; font-weight:500; }.hero-word { display:block; }.word-two { margin-left:9.2vw; color:var(--gold); }.word-two em { font-family:"Playfair Display",serif; font-weight:500; letter-spacing:-.095em; }.word-two b { font:10px var(--mono); letter-spacing:0; vertical-align:top; margin-left:9px; }.hero-bottom { margin:30px 0 0 54%; display:flex; align-items:end; justify-content:space-between; gap:25px; max-width:510px; }.hero-bottom p { margin:0; max-width:285px; font-size:14px; line-height:1.35; }.round-link { width:60px; height:60px; border-radius:50%; background:var(--gold); color:var(--paper); display:grid; place-items:center; transition:transform .3s,background .3s; flex:none; }.round-link svg { width:20px; }.round-link:hover { background:var(--ink); color:var(--paper); transform:rotate(-45deg); }.hero-image-wrap { position:absolute; height:59vh; width:25vw; min-width:245px; right:10.5vw; top:17%; overflow:hidden; border:1px solid rgba(213,171,91,.8); }.hero-image { width:100%; height:100%; background:url('https://images.unsplash.com/photo-1556742049-0cfed4f6a45d?auto=format&fit=crop&w=900&q=85') center/cover; filter:grayscale(100%) contrast(1.18) brightness(.65); animation:breathe 10s ease-in-out infinite; }.hero-image-label { position:absolute; bottom:13px; left:13px; color:white; font:9px var(--mono); text-transform:uppercase; letter-spacing:.08em; display:flex; gap:8px; align-items:center; }.hero-image-label span { width:24px; height:1px; background:var(--gold); }.section-pad { padding:160px 8.5vw; position:relative; z-index:1; }.intro { display:grid; grid-template-columns:31% 1fr; }.intro-copy { max-width:835px; }.intro-copy>p { margin:0 0 35px; font-size:clamp(28px,3.6vw,58px); letter-spacing:-.055em; line-height:1.08; }.intro em,h2 em { font-family:"Playfair Display",serif; font-weight:500; color:var(--gold); }.text-link { font-size:13px; padding-bottom:5px; border-bottom:1px solid var(--gold); }.text-link svg { width:14px; vertical-align:middle; margin-left:4px; }.work { background:#101216; color:var(--ink); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.section-heading { display:flex; justify-content:space-between; align-items:start; margin-bottom:80px; }.section-heading>p:last-child { max-width:310px; font-size:12px; line-height:1.45; margin:0; }.project-list { display:grid; grid-template-columns:repeat(12,1fr); gap:43px 20px; }.project-card { grid-column:span 7; }.project-card.card-offset { grid-column:6 / span 7; }.project-trigger { padding:0; border:0; background:transparent; width:100%; text-align:left; cursor:pointer; }.project-image { height:clamp(280px,48vw,660px); overflow:hidden; position:relative; transition:transform .5s cubic-bezier(.2,.8,.2,1),filter .5s; filter:grayscale(100%) brightness(.72); border:1px solid rgba(213,171,91,.28); }.project-trigger:hover .project-image { transform:scale(.982); filter:grayscale(30%) brightness(.9); }.image-number { position:absolute; z-index:2; top:15px; left:16px; font:10px var(--mono); color:var(--gold); }.image-kramm { background:url('https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=1400&q=85') center/cover; }.image-yume { background:url('https://images.unsplash.com/photo-1515377905703-c4788e51af15?auto=format&fit=crop&w=1400&q=85') center/cover; }.image-berg { background:url('https://images.unsplash.com/photo-1483985988355-763728e1935b?auto=format&fit=crop&w=1400&q=85') center/cover; }.project-image:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.24),transparent 35%); }.project-meta { padding-top:13px; display:flex; justify-content:space-between; align-items:start; }.project-meta p { margin:0; }.project-name { font-size:20px; letter-spacing:-.04em; }.project-meta div p:last-child { font:10px var(--mono); text-transform:uppercase; margin-top:5px; opacity:.65; }.project-meta svg { width:19px; transition:transform .3s; color:var(--gold); }.project-trigger:hover svg { transform:translate(4px,-4px); }.marquee { background:var(--gold); color:#121212; padding:15px 0; overflow:hidden; white-space:nowrap; font-size:clamp(28px,4vw,64px); letter-spacing:-.06em; }.marquee div { width:max-content; display:flex; align-items:center; gap:28px; animation:scroll 18s linear infinite; }.marquee b { font-size:.46em; }.about { display:grid; grid-template-columns:45% 1fr; gap:10vw; align-items:start; }.about-image { height:680px; overflow:hidden; border:1px solid rgba(213,171,91,.35); }.about-image img { width:100%; height:100%; object-fit:cover; filter:grayscale(100%) contrast(1.1) brightness(.75); }.about-content h2,.contact h2 { font-size:clamp(42px,6.5vw,100px); line-height:.91; letter-spacing:-.075em; margin:90px 0 55px; font-weight:500; }.about-text { display:grid; grid-template-columns:1fr 1fr; gap:30px; max-width:570px; font-size:14px; line-height:1.5; }.about-text p { margin:0; }.contact { padding-top:120px; background:#101216; border-top:1px solid rgba(213,171,91,.4); }.contact-main { display:flex; justify-content:space-between; align-items:end; }.contact h2 { margin-bottom:0; }.contact-round { width:98px; height:98px; background:var(--gold); color:var(--paper); }.contact-mail { display:inline-block; margin-top:80px; font-size:14px; border-bottom:1px solid var(--gold); padding-bottom:4px; color:var(--gold); } footer { padding:22px 3.5vw; display:flex; justify-content:space-between; background:#101216; border-top:1px solid var(--line); font:10px var(--mono); text-transform:uppercase; color:var(--gold); } footer svg { width:12px; vertical-align:middle; }
dialog { border:0; padding:0; max-width:none; max-height:none; }.project-modal { width:min(940px,92vw); color:var(--ink); background:#101216; grid-template-columns:42% 1fr; overflow:hidden; border:1px solid rgba(213,171,91,.75); }.project-modal[open] { display:grid; animation:modal-in .35s ease-out; }.project-modal::backdrop,.project-view::backdrop { background:rgba(0,0,0,.82); backdrop-filter:blur(8px); }.modal-visual { min-height:530px; background:url('https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?auto=format&fit=crop&w=900&q=85') center/cover; filter:grayscale(100%) brightness(.62); }.modal-content { padding:75px 10%; align-self:center; }.modal-content h2 { font-size:clamp(36px,4.2vw,62px); letter-spacing:-.065em; margin:27px 0 18px; font-weight:500; }.modal-content>p:not(.section-label) { max-width:340px; font-size:14px; line-height:1.45; }.modal-close { position:absolute; top:18px; right:18px; z-index:2; width:37px; height:37px; border-radius:50%; border:1px solid var(--gold); color:var(--gold); background:transparent; cursor:pointer; display:grid; place-items:center; }.modal-close svg { width:17px; }form { margin-top:46px; max-width:350px; }label { display:block; margin-bottom:9px; font:10px var(--mono); text-transform:uppercase; }.password-row { display:flex; border-bottom:1px solid var(--gold); }input { border:0; color:var(--ink); background:transparent; width:100%; outline:none; padding:12px 0; font:18px "DM Sans"; }.password-row button { color:var(--gold); background:transparent; border:0; cursor:pointer; padding:0 3px; }.password-row button svg { width:20px; }.form-hint { font:10px var(--mono); margin-top:13px; color:#9e9e9e; }.form-hint.error { color:#ff8c78; }.project-view { width:100vw; height:100vh; background:var(--paper); }.project-view[open] { display:block; }.project-view-close { position:fixed; }.private-project { min-height:100%; display:grid; place-items:center; text-align:center; background:linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),url('https://images.unsplash.com/photo-1600566753190-17f0baa2a6c3?auto=format&fit=crop&w=2000&q=90') center/cover; color:white; }.private-project div { max-width:720px; padding:25px; }.private-project span { font:10px var(--mono); text-transform:uppercase; letter-spacing:.1em; color:var(--gold); }.private-project h2 { font-size:clamp(52px,10vw,160px); letter-spacing:-.08em; line-height:.84; margin:22px 0; font-weight:500; }.private-project p { font-size:15px; } .reveal { opacity:0; transform:translateY(28px); transition:opacity .85s ease,transform .85s cubic-bezier(.22,1,.36,1); }.reveal.visible { opacity:1; transform:translateY(0); }
.work.section-pad { padding-top:190px; padding-bottom:210px; }
.work .section-heading { margin-bottom:120px; }
.work .project-list { row-gap:130px; }
.work .reveal { opacity:1; transform:none; }
.work .project-image,
.work .project-trigger:hover .project-image { transform:none; transition:none; filter:grayscale(100%) brightness(.72); }
.project-meta { justify-content:flex-start; }
.card-offset .project-meta { justify-content:flex-end; text-align:right; }
.portfolio-signal { position:absolute; z-index:0; inset:0; width:100%; height:100%; pointer-events:none; opacity:0; transition:opacity .25s ease; overflow:visible; }
.portfolio-signal.is-visible { opacity:1; }.portfolio-signal path { fill:none; stroke:var(--gold); stroke-linecap:round; }
.signal-base { opacity:.16; }.signal-pulse,.signal-pulse-tail,.signal-pulse-core { display:none; }
.signal-energy-particle { fill:#f6ca68; filter:drop-shadow(0 0 3px rgba(255,219,133,.7)); }
.signal-swirl { stroke-width:.7; opacity:.42; filter:drop-shadow(0 0 3px rgba(213,171,91,.36)); transform-box:fill-box; transform-origin:center; animation:swirl-spin 9s linear infinite, swirl-breathe 3.8s ease-in-out infinite; }.signal-swirl:nth-last-child(1) { opacity:.24; animation:swirl-spin-reverse 12s linear infinite, swirl-breathe 4.6s ease-in-out infinite; animation-delay:-2.8s; }
.portfolio-cursor { position:fixed; z-index:30; top:0; left:0; width:20px; height:20px; transform:translate(-50%,-50%); pointer-events:none; opacity:0; transition:width .32s cubic-bezier(.22,1,.36,1),height .32s cubic-bezier(.22,1,.36,1),opacity .2s ease,background-color .25s ease,border-color .25s ease; }
.portfolio-cursor.is-visible { opacity:1; }.portfolio-cursor-core { position:absolute; width:4px; height:4px; border-radius:50%; background:var(--gold); top:50%; left:50%; transform:translate(-50%,-50%); box-shadow:0 0 9px rgba(213,171,91,.7); }
.portfolio-orbit { position:absolute; border:1px solid var(--gold); border-radius:50%; top:50%; left:50%; transform:translate(-50%,-50%); opacity:.72; }
.orbit-one { width:18px; height:18px; animation:orbit-breathe 2.8s ease-in-out infinite; }
.portfolio-cursor.is-project { width:112px; height:112px; border:1px solid var(--gold); border-radius:50%; color:var(--gold); display:grid; place-items:center; }.portfolio-cursor.is-project .portfolio-cursor-core,.portfolio-cursor.is-project .portfolio-orbit { opacity:0; }
.portfolio-cursor-label { display:none; font:9px var(--mono); letter-spacing:.1em; text-transform:uppercase; text-align:center; line-height:1.35; max-width:68px; }
.portfolio-cursor-index { display:none; position:absolute; top:12px; left:18px; font:9px var(--mono); }
.portfolio-cursor.is-project .portfolio-cursor-label,.portfolio-cursor.is-project .portfolio-cursor-index { display:block; }
@media (hover:hover) and (pointer:fine) { .work, .work * { cursor:none; } }

.work { isolation:isolate; }
.work .section-heading,.work .project-list { position:relative; z-index:1; }
.marquee { padding-left:3.5vw; padding-right:3.5vw; display:flex; justify-content:center; }
.marquee div { width:auto; justify-content:center; animation:none; }
.image-kramm { background-image:url("/Alissia%20Website/assets/images/wedding-hero-demo.png?v=20260721-portfolio"); background-position:center; }
.image-rossow-praxis { background-image:url("/zahnarztpraxis-rossow/gebaeude.jpg?v=20260721-portfolio"); background-position:center; }
.modal-visual.is-alissia { background-image:url("/Alissia%20Website/assets/images/wedding-hero-demo.png?v=20260721-portfolio"); background-position:center; }
.modal-visual.is-rossow-praxis { background-image:url("/zahnarztpraxis-rossow/gebaeude.jpg?v=20260721-portfolio"); background-position:center; }
.modal-content>p:not(.section-label) { max-width:360px; line-height:1.55; }
.demo-open { width:min(350px,100%); margin-top:38px; padding:15px 17px; border:1px solid var(--gold); background:#101216; color:var(--gold); cursor:pointer; display:flex; align-items:center; justify-content:space-between; font:500 11px var(--mono); letter-spacing:.08em; text-transform:uppercase; transition:background-color .25s ease,color .25s ease,box-shadow .25s ease; }
.demo-open svg { width:19px; color:currentColor; transition:transform .25s ease; }
.demo-open:hover { background:var(--gold); color:#101216; box-shadow:0 0 22px rgba(213,171,91,.18); }
.demo-open:hover svg,.demo-open:focus-visible svg { transform:translate(3px,-3px); }
.demo-open:focus-visible { outline:1px solid var(--gold); outline-offset:5px; }
.private-project--embedded { display:block; background:#101216; }
.private-project-frame { width:100%; height:100vh; border:0; display:block; background:#101216; }
footer { gap:16px; flex-wrap:wrap; }
.honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }.form-status { min-height:20px; margin:22px 0 0; font-size:13px; line-height:1.45; }.form-status.success { color:#a9cda5; }.form-status.error { color:#ff9b88; }.form-submit-row button:disabled { cursor:wait; opacity:.6; }
.about-placeholder { position:relative; display:grid; place-items:center; overflow:hidden; background:#121417; isolation:isolate; }
.about-placeholder::before { content:""; position:absolute; width:56%; aspect-ratio:1; border:1px solid rgba(213,171,91,.56); transform:rotate(45deg); }
.about-placeholder::after { content:""; position:absolute; inset:11%; border:1px solid rgba(246,244,239,.11); }
.about-placeholder span { position:relative; z-index:1; color:var(--gold); font:500 clamp(80px,14vw,180px)/1 "DM Sans",sans-serif; letter-spacing:-.1em; transform:translateX(-.06em); }

@keyframes breathe { 50% { transform:scale(1.08); } } @keyframes scroll { to { transform:translateX(-50%); } } @keyframes signal-pulse { from { stroke-dashoffset:100; opacity:.25; } 15% { opacity:.98; } to { stroke-dashoffset:0; opacity:.25; } } @keyframes swirl-breathe { 50% { opacity:.7; stroke-width:1.05; } } @keyframes swirl-spin { to { transform:rotate(360deg); } } @keyframes swirl-spin-reverse { to { transform:rotate(-360deg); } } @keyframes orbit-breathe { 50% { transform:translate(-50%,-50%) scale(1.08); opacity:.38; } } @keyframes modal-in { from { opacity:0; transform:translateY(15px) scale(.98); } }
@media (max-width:700px) { .cursor-glow,.portfolio-cursor,.portfolio-signal { display:none; }.site-header { padding:21px 5vw; }.header-contact,nav a:nth-child(3) { display:none; } nav { gap:18px; }.hero { padding:96px 5vw 26px; min-height:720px; }.hero-image-wrap { width:42vw; min-width:0; height:41vh; right:5vw; top:19%; opacity:.83; }.hero h1 { font-size:20.2vw; position:relative; }.word-two { margin-left:4vw; }.hero-bottom { margin:44px 0 0; width:100%; }.section-pad { padding:100px 5vw; }.intro { display:block; }.intro .section-label { margin-bottom:70px; }.section-heading { display:block; margin-bottom:48px; }.section-heading>p:last-child { margin-top:25px; }.project-card,.project-card.card-offset { grid-column:span 12; }.project-list { gap:42px; }.work.section-pad { padding-top:120px; padding-bottom:135px; }.work .section-heading { margin-bottom:70px; }.work .project-list { row-gap:78px; }.project-image { height:107vw; }.about { grid-template-columns:1fr; gap:50px; }.about-image { height:105vw; }.about-content h2 { margin:55px 0 34px; }.about-text { display:block; }.about-text p + p { margin-top:17px; }.contact-main { align-items:center; }.contact-round { width:66px; height:66px; }.contact-mail { margin-top:58px; }footer { padding:18px 5vw; } footer span:nth-child(2) { display:none; }.project-modal { grid-template-columns:1fr; }.modal-visual { display:none; }.modal-content { min-height:500px; padding:75px 8%; }.project-modal[open] { display:block; }.private-project h2 { font-size:18vw; } }

.inquiry-page { min-height:100vh; background:#101216; }.inquiry-header { position:relative; border-bottom:1px solid rgba(213,171,91,.3); }.inquiry-main { max-width:1480px; margin:0 auto; padding:130px 7vw 150px; }.inquiry-intro { display:grid; grid-template-columns:31% 1fr; padding-bottom:105px; border-bottom:1px solid var(--line); }.inquiry-intro h1 { grid-column:2; margin:0; font-size:clamp(56px,8vw,126px); line-height:.85; letter-spacing:-.08em; font-weight:500; }.inquiry-intro>p:last-child { grid-column:2; max-width:340px; margin:39px 0 0; font-size:15px; line-height:1.5; }.inquiry-form-wrap { width:min(100%,980px); margin:0 auto; padding-top:72px; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:42px 70px; }.form-grid label { color:var(--gold); }.form-grid input,.form-grid select,.form-grid textarea { display:block; width:100%; color:var(--ink); border:0; border-bottom:1px solid rgba(246,244,239,.48); border-radius:0; background:transparent; outline:0; padding:14px 0 12px; font:500 16px "DM Sans",sans-serif; transition:border-color .25s; appearance:none; }.form-grid select { cursor:pointer; }.form-grid textarea { resize:vertical; min-height:130px; line-height:1.45; }.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus { border-color:var(--gold); }.form-grid input::placeholder,.form-grid textarea::placeholder { color:rgba(246,244,239,.38); }.form-wide { grid-column:1 / -1; }.budget-label { max-width:calc(50% - 35px); }.form-submit-row { margin-top:80px; display:flex; align-items:center; justify-content:space-between; gap:30px; }.form-submit-row p { max-width:270px; margin:0; font-size:12px; line-height:1.5; color:rgba(246,244,239,.65); }.form-submit-row button { display:inline-flex; align-items:center; gap:10px; background:var(--gold); border:0; padding:17px 21px; color:#111; cursor:pointer; font:500 12px var(--mono); letter-spacing:.06em; text-transform:uppercase; }.form-submit-row button svg { width:15px; }.form-submit-row button:hover { background:var(--ink); color:var(--paper); }
@media (max-width:700px) { .inquiry-header nav { position:absolute; left:50%; transform:translateX(-50%); }.inquiry-main { padding:85px 5vw 100px; }.inquiry-intro { display:block; padding-bottom:70px; }.inquiry-intro .section-label { margin-bottom:50px; }.inquiry-intro h1 { font-size:18vw; }.inquiry-intro>p:last-child { margin-top:30px; }.inquiry-form-wrap { padding-top:55px; }.form-grid { grid-template-columns:1fr; gap:35px; }.form-wide,.budget-label { grid-column:auto; max-width:none; }.form-submit-row { margin-top:55px; display:block; }.form-submit-row button { margin-top:25px; } }

/* The inquiry form is deliberately sized from the viewport, not a fixed content column. */
.inquiry-main { max-width:none; width:100%; padding-left:0; padding-right:0; }
.inquiry-intro { width:82vw; margin:0 auto; }
.inquiry-form-wrap { width:74vw; max-width:none; margin-left:auto; margin-right:auto; }
.inquiry-form-wrap form { max-width:none; margin-top:0; }
@media (max-width:700px) { .inquiry-main { padding-left:0; padding-right:0; }.inquiry-intro,.inquiry-form-wrap { width:90vw; } }