*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#080808;color:#f3f0e9;font-family:DM Sans,sans-serif}header{position:fixed;z-index:9;top:0;width:100%;padding:24px 32px;display:flex;justify-content:space-between;mix-blend-mode:difference}nav{display:flex;gap:28px}a{color:inherit;text-decoration:none;font-size:12px}.hero{height:100vh;position:relative;overflow:hidden}.hero video{width:100%;height:100%;object-fit:cover}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.65),transparent 65%)}.heroText{position:absolute;left:5vw;bottom:5vh}.heroText h1{font:normal clamp(90px,18vw,270px)/.65 Italiana;margin:25px 0}.heroText i,.statement i,footer i{font-weight:400}.statement{min-height:80vh;display:grid;place-content:center;padding:8vw}.statement p{letter-spacing:.3em}.statement h2{font:normal clamp(60px,10vw,160px)/.86 Italiana;margin:20px 0}.cinema{padding:10vh 4vw}.cinema figure{margin:0 auto 18vh;max-width:92vw;position:relative}.cinema figure:nth-child(even){max-width:72vw;margin-left:22vw}.cinema img{display:block;width:100%;height:auto}.cinema span{position:absolute;right:0;top:calc(100% + 12px);font-size:11px;letter-spacing:.2em}.film{height:100vh;position:relative;display:flex;align-items:center;background:#d9d5cc;color:#111;overflow:hidden}.film video{width:62%;height:100%;object-fit:cover}.film div{padding:5vw}.film h2{font:normal clamp(60px,8vw,130px)/.85 Italiana}.film.reverse{flex-direction:row-reverse;background:#111;color:#eee}footer{min-height:100vh;padding:10vw 5vw;display:flex;flex-direction:column;justify-content:center}footer h2{font:normal clamp(70px,12vw,190px)/.82 Italiana;margin:0 0 60px}.reveal{opacity:.25;transform:translateY(80px);transition:1s}.reveal.in{opacity:1;transform:none}@media(max-width:700px){header{padding:18px}nav{gap:12px}.heroText h1{font-size:28vw}.cinema figure,.cinema figure:nth-child(even){max-width:100%;margin:0 0 15vh}.film,.film.reverse{height:auto;min-height:100vh;flex-direction:column}.film video{width:100%;height:68vh}.film div{width:100%}}/* KARIM6.5 red accent edition */
:root{--accent:#d3131b}
header b{position:relative}header b:after{content:'';display:block;width:28px;height:2px;background:var(--accent);margin-top:7px}
nav a{transition:color .25s ease}nav a:hover{color:var(--accent)}
.heroText h1 i,.statement h2 i,footer h2 i{color:var(--accent);font-style:italic}
.heroText small,.statement p,.film small{color:#fff}.heroText p{border-left:3px solid var(--accent);padding-left:12px}
.cinema figure:after{content:'';position:absolute;left:0;bottom:-2px;width:0;height:3px;background:var(--accent);transition:width .7s ease}.cinema figure:hover:after{width:100%}
.cinema span{color:var(--accent)}
.film h2:after{content:'';display:block;width:72px;height:5px;background:var(--accent);margin-top:24px}
footer a:hover{color:var(--accent)}
/* profile portraits beside the name */
.identity{display:flex;align-items:center;gap:18px;flex-wrap:wrap}.identity>p{margin:0;border-left:3px solid var(--accent);padding-left:12px}.profilePair{display:flex;align-items:center;gap:8px}.profilePair img{width:96px;height:120px;object-fit:cover;border:1px solid rgba(255,255,255,.72);filter:saturate(.9) contrast(1.04);box-shadow:0 8px 28px rgba(0,0,0,.28)}.profilePair img:last-child{border-color:var(--accent);transform:translateY(8px)}
@media(max-width:700px){.identity{gap:12px}.profilePair img{width:72px;height:90px}}

/* corrected owner portraits — larger beside the name */
.profilePair{gap:12px}
.profilePair img{width:150px!important;height:190px!important;object-fit:cover!important}
.profilePair img:first-child{object-position:center center}
.profilePair img:last-child{object-position:center center}
@media(max-width:700px){.profilePair{gap:8px}.profilePair img{width:105px!important;height:135px!important}.identity{align-items:flex-end}}


/* final requested treatment: both owner portraits red-framed + bilingual copy */
.identity{align-items:flex-end;gap:24px}
.identityCopy{display:flex;flex-direction:column;gap:13px;max-width:520px}
.ownerName{margin:0!important;border-left:3px solid var(--accent);padding-left:12px;letter-spacing:.12em;font-size:13px}
.passionQuote{margin:0 0 2px 0;padding:0 0 0 15px;border-left:1px solid var(--accent);max-width:500px;font-family:Italiana,serif}
.passionQuote span{display:block;font-size:clamp(18px,1.55vw,27px);line-height:1.12;color:#fff}
.passionQuote em{display:block;margin-top:7px;font-family:DM Sans,sans-serif;font-size:11px;line-height:1.4;letter-spacing:.08em;color:rgba(255,255,255,.62);font-style:normal;text-transform:uppercase}
.profilePair img,.profilePair img:first-child,.profilePair img:last-child{border:2px solid var(--accent)!important;box-shadow:0 0 0 1px rgba(211,19,27,.18),0 12px 36px rgba(0,0,0,.35)!important}
.profilePair img:last-child{transform:translateY(8px)}
.statement p small{display:block;margin-top:9px;font-size:10px;letter-spacing:.14em;color:rgba(255,255,255,.5)}
.statement h2 small{display:block;margin-top:24px;font-family:DM Sans,sans-serif;font-size:11px;line-height:1.3;letter-spacing:.16em;color:rgba(255,255,255,.55)}
.film small b{font-weight:400;opacity:.55;font-size:.82em}
.film h2 em{display:block;margin-top:24px;font-family:DM Sans,sans-serif;font-size:11px;line-height:1.3;letter-spacing:.14em;font-style:normal;opacity:.55}
footer h2 small{display:block;margin-top:28px;font-family:DM Sans,sans-serif;font-size:12px;line-height:1.3;letter-spacing:.15em;color:rgba(255,255,255,.58)}
@media(max-width:700px){.identity{align-items:flex-start;gap:14px}.identityCopy{width:100%;max-width:92vw}.passionQuote{max-width:86vw}.passionQuote span{font-size:17px}.passionQuote em{font-size:9px}.profilePair img{width:112px!important;height:145px!important}.statement h2 small{font-size:9px}}


/* final KARIM6.5 signature stamp */
.brandStamp{margin-top:clamp(80px,12vh,150px);display:flex;justify-content:center;align-items:center;width:100%;perspective:900px}
.stampRing{position:relative;width:clamp(250px,27vw,390px);aspect-ratio:1;border:3px solid var(--accent);border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;transform:rotate(-5deg);box-shadow:0 0 0 8px #080808,0 0 0 9px rgba(211,19,27,.7),inset 0 0 45px rgba(211,19,27,.08);background:radial-gradient(circle,rgba(211,19,27,.06),transparent 65%)}
.stampRing:before,.stampRing:after{content:'';position:absolute;left:10%;right:10%;height:1px;background:var(--accent);opacity:.9}.stampRing:before{top:28%}.stampRing:after{bottom:28%}
.stampRing strong{font:normal clamp(44px,6vw,82px)/.85 Italiana,serif;letter-spacing:-.06em;color:#f3f0e9}.stampRing strong span{color:var(--accent);font-style:italic;margin-left:5px}.stampRing i{font-style:normal;font-size:9px;letter-spacing:.24em;margin-top:15px;color:rgba(255,255,255,.72)}
.stampTop,.stampBottom{position:absolute;font-size:9px;letter-spacing:.28em;color:var(--accent);font-weight:700}.stampTop{top:15%}.stampBottom{bottom:15%}.brandStamp:hover .stampRing{transform:rotate(0deg) scale(1.035);transition:transform .5s ease}
@media(max-width:700px){.brandStamp{margin-top:90px}.stampRing{width:255px}.stampRing strong{font-size:51px}.stampTop,.stampBottom{font-size:7px;letter-spacing:.2em}.stampRing i{font-size:7px}}

/* Scroll-driven signature stamp */
.brandStamp{opacity:0;transform:translateY(130px) scale(.55) rotate(-14deg);filter:blur(8px);transition:opacity .25s linear}
.brandStamp .stampRing{will-change:transform,filter;transition:none}
.brandStamp.stamp-visible{opacity:1;filter:blur(0)}
@media(prefers-reduced-motion:reduce){.brandStamp{opacity:1;transform:none;filter:none}.brandStamp .stampRing{transform:rotate(-5deg)!important}}

/* Background music control */
.musicToggle{position:fixed;right:24px;bottom:24px;z-index:50;display:flex;align-items:center;gap:9px;border:1px solid rgba(211,19,27,.8);background:rgba(8,8,8,.78);color:#f3f0e9;padding:10px 14px;border-radius:999px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font:500 10px/1 DM Sans,sans-serif;letter-spacing:.16em;cursor:pointer;box-shadow:0 8px 30px rgba(0,0,0,.28);transition:.3s ease}
.musicToggle:hover{background:var(--accent);transform:translateY(-2px)}
.musicToggle.is-playing .musicIcon{animation:musicPulse 1.1s ease-in-out infinite}
.musicIcon{font-size:16px;color:var(--accent)}
.musicToggle:hover .musicIcon,.musicToggle.is-playing:hover .musicIcon{color:#fff}
@keyframes musicPulse{50%{transform:scale(1.25);opacity:.65}}
@media(max-width:700px){.musicToggle{right:14px;bottom:14px;padding:9px 12px;font-size:9px}}
