@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=DM+Sans:wght@400;500;600&display=swap');
html{scroll-behavior:smooth}body{margin:0;background:#e9e5df}button,a,input{-webkit-tap-highlight-color:transparent}a{color:inherit}::selection{background:#ac687f;color:white}section[id]{scroll-margin-top:30px}

#karina-cinema { --ink:#262322; --paper:#e9e5df; --wine:#65283e; font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--paper);position:relative;overflow:hidden;isolation:isolate; }
#karina-cinema * {box-sizing:border-box}
#karina-cinema button,#karina-cinema input {font:inherit}
#karina-cinema button {cursor:pointer}
#karina-cinema button:focus-visible {outline:2px solid #a95476;outline-offset:4px}
#karina-cinema .mast {display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 34px;border-bottom:1px solid #25232222;position:relative;z-index:3;background:#e9e5dff5}
#karina-cinema .brand {font-family:'Cormorant Garamond',serif;font-size:31px;letter-spacing:7px;line-height:1}
#karina-cinema .brand small {display:block;font-family:'DM Sans',sans-serif;font-size:9px;letter-spacing:3.5px;margin-top:8px}
#karina-cinema .nav {display:flex;gap:24px;align-items:center;padding-right:62px}
#karina-cinema .nav button {border:0;background:none;color:#494341;font-size:10px;letter-spacing:1.8px;padding:10px 0}
#karina-cinema .nav button:hover {color:#9b4e68}
#karina-cinema .hero {transition:background 1.2s; height:610px;position:relative;background:radial-gradient(ellipse at 74% 37%,#fbf9f6 0%,#e4dfd9 58%,#cbc8c4 100%);overflow:hidden}
#karina-cinema .scene {position:absolute;inset:0;touch-action:pan-y;cursor:grab}
#karina-cinema .scene:active {cursor:grabbing}
#karina-cinema .scene canvas {width:100%;height:100%;display:block}
#karina-cinema .hero:after {content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 -55px 60px -55px #77695b55}
#karina-cinema .copy {position:absolute;left:34px;top:44px;pointer-events:none;z-index:2;width:48%;}
#karina-cinema .eyebrow {font-size:9px;font-weight:500;letter-spacing:2.7px;text-transform:uppercase;display:flex;align-items:center;gap:10px}
#karina-cinema .eyebrow:before {content:'';width:20px;height:1px;background:currentColor}
#karina-cinema h1 {font:400 clamp(66px,10.5vw,116px)/.89 'Bebas Neue',Impact,'Arial Narrow',sans-serif;letter-spacing:-2px;margin:26px 0 20px;max-width:450px}
#karina-cinema h1 span {display:block}
#karina-cinema .subtitle {font-size:12px;line-height:1.8;max-width:220px;color:#625752}
#karina-cinema .discover {pointer-events:auto;background:#272323;color:#f3eee7;border:1px solid #272323;padding:14px 19px;font-size:10px;letter-spacing:1.3px;margin-top:18px;display:flex;align-items:center;gap:24px}
#karina-cinema .discover:hover {background:#5f2b40;border-color:#5f2b40}
#karina-cinema .scene-note {position:absolute;right:27px;top:32px;font-size:9px;letter-spacing:1.6px;writing-mode:vertical-rl;z-index:2;pointer-events:none;color:#6f635d}
#karina-cinema .coordinates {position:absolute;bottom:82px;left:34px;font-size:9px;letter-spacing:2px;line-height:1.8;pointer-events:none}
#karina-cinema .chapterbar {position:absolute;bottom:0;left:0;right:0;display:flex;gap:5px;padding:19px 34px;border-top:1px solid #28222222;z-index:4;background:#e5dfd6a0;backdrop-filter:blur(10px)}
#karina-cinema .chapterbar button {background:transparent;border:0;color:#68605a;padding:6px 12px 6px 0;text-align:left;min-width:115px;font-size:9px;letter-spacing:1.3px}
#karina-cinema .chapterbar button[aria-pressed=true] {color:#211d1d}
#karina-cinema .chapterbar button[aria-pressed=true]:before {content:'● ';color:#7b3551}
#karina-cinema .chapterbar .play {margin-left:auto;min-width:0;text-align:right;letter-spacing:1px}
#karina-cinema[data-chapter="2"] .hero {background:radial-gradient(ellipse at 72% 42%,#51323f 0%,#261b23 48%,#130f14 100%);color:#f0e5db}
#karina-cinema[data-chapter="2"] .subtitle,#karina-cinema[data-chapter="2"] .scene-note {color:#ceb8b7}
#karina-cinema[data-chapter="2"] .chapterbar {background:#241b22aa;border-color:#c6a99b33}
#karina-cinema[data-chapter="2"] .chapterbar button {color:#ae909b}
#karina-cinema[data-chapter="2"] .chapterbar button[aria-pressed=true] {color:#f2e4db}
#karina-cinema[data-chapter="2"] .discover {background:#e9dbcf;color:#2a1d25;border-color:#e9dbcf}
#karina-cinema .ticker {height:39px;background:#242020;color:#e4dbd3;display:flex;align-items:center;overflow:hidden;font-size:9px;letter-spacing:3px;white-space:nowrap}
#karina-cinema .ticker span {display:inline-block;padding-left:35px;word-spacing:10px;animation:karina-ticker 36s linear infinite}
@keyframes karina-ticker {to{transform:translateX(-35%)}}
#karina-cinema .ritual {background:#eee9e2;padding:35px 34px 34px;display:grid;grid-template-columns:1fr 1.1fr;gap:38px;}
#karina-cinema .ritual h2 {font:400 43px/.95 'Cormorant Garamond',serif;margin:17px 0 14px;letter-spacing:-1px}
#karina-cinema .ritual h2 em {font-weight:400;color:#83566a}
#karina-cinema .ritual .detail {font-size:11px;line-height:1.7;color:#665b56;max-width:300px;margin:0}
#karina-cinema .finishrow {display:flex;gap:10px;margin:22px 0 18px}
#karina-cinema .finish {background:transparent;border:1px solid #c4bcb3;min-width:0;flex:1;padding:12px 7px 10px;transition:background .3s,border-color .3s;color:#51463f;font-size:10px;}
#karina-cinema .finish[aria-pressed=true] {border-color:#292020;background:#e0d6cc}
#karina-cinema .swatch {display:block;margin:0 auto 12px;width:25px;height:42px;border-radius:55% 55% 42% 42%;transform:rotate(22deg);box-shadow:3px 6px 9px #25202022}
#karina-cinema .chrome {background:linear-gradient(100deg,#302c2a 0%,#eeece9 26%,#72706d 45%,#fdfcf9 55%,#48413d 77%,#ece9e5 100%)}
#karina-cinema .rose {background:linear-gradient(115deg,#713d45,#f9e1d7 30%,#c78e8e 47%,#af727c 70%,#f8d7c9)}
#karina-cinema .cherry {background:linear-gradient(128deg,#16070f 20%,#56112f 41%,#ebadc0 48%,#601335 55%,#170911 85%)}
#karina-cinema .control-label {display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.4px;margin-bottom:11px;color:#665b56}
#karina-cinema input[type=range] {width:100%;accent-color:#763b54;height:18px}
#karina-cinema .options {display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:15px}
#karina-cinema .shape {font-size:10px;padding:9px 13px;border:1px solid #b9afa5;color:#5a4d46;background:transparent}
#karina-cinema .shape[aria-pressed=true] {background:#302624;color:#f7ede4;border-color:#302624}
#karina-cinema .options label {font-size:10px;margin-left:auto;display:flex;gap:5px;align-items:center}
#karina-cinema input[type=checkbox] {accent-color:#7e3c54}
#karina-cinema .seal {display:flex;align-items:center;gap:12px;border-top:1px solid #b9afa577;margin-top:24px;padding-top:17px}
#karina-cinema .dots {display:flex;gap:5px}
#karina-cinema .dots i {height:7px;width:7px;border:1px solid #9d8c84;border-radius:50%;display:block}
#karina-cinema .dots i.found {background:#7a3c54;border-color:#7a3c54}
#karina-cinema .progress-label {font-size:10px;color:#5e514b}
#karina-cinema .reveal {background:#2c2325;color:#f6eee7;border:0;padding:12px 16px;font-size:10px;margin-top:17px;letter-spacing:.5px}
#karina-cinema .reveal:disabled {background:#d8cec4;color:#6e625c;cursor:default}
#karina-cinema .signature {background:#2a2024;color:#eee4da;padding:35px 34px;position:relative;overflow:hidden}
#karina-cinema .signature[hidden] {display:none}
#karina-cinema .signature-inner {border:1px solid #b2957b77;padding:27px;position:relative;z-index:2;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
#karina-cinema .sig-title {font:400 46px/1 'Cormorant Garamond',serif;margin:14px 0}
#karina-cinema .sig-meta {font-size:9px;letter-spacing:2px;line-height:1.9;color:#c4aca2}
#karina-cinema .sig-mark {font:400 100px/.8 'Cormorant Garamond',serif;color:#c6a489;padding:12px;transform:rotate(-10deg)}
#karina-cinema .sig-glow {position:absolute;width:300px;height:300px;background:radial-gradient(circle,#af5e7455,transparent 65%);right:-40px;top:-70px}
#karina-cinema .signature button {background:none;color:#d8bdad;border:0;padding:10px 0;font-size:10px}
#karina-cinema .foot {display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:17px 34px;background:#e6dfd6;font-size:9px;letter-spacing:1.2px;color:#6a5c55}
#karina-cinema .fallback {position:absolute;inset:0;pointer-events:none;display:flex;gap:20px;align-items:center;justify-content:flex-end;padding-right:10%;transform:rotate(15deg)}
#karina-cinema .fallback i {height:270px;width:100px;border-radius:60% 60% 40% 40%;box-shadow:20px 30px 25px #40352b33;display:block}
#karina-cinema .fallback i:nth-child(2) {transform:translateY(-50px)}
#karina-cinema[data-paused=true] .ticker span {animation-play-state:paused}
@media(max-width:650px){
#karina-cinema .mast {padding:22px 21px}#karina-cinema .brand{font-size:26px}#karina-cinema .nav {padding-right:0;gap:15px}#karina-cinema .nav button {font-size:9px}#karina-cinema .nav button:last-child {display:none}
#karina-cinema .hero {height:760px}#karina-cinema .copy {left:22px;top:29px;width:80%}#karina-cinema h1 {font-size:clamp(58px,21vw,83px);max-width:350px;margin:20px 0 13px}#karina-cinema .subtitle{font-size:11px;max-width:260px}#karina-cinema .discover{margin-top:12px;padding:11px 14px}
#karina-cinema .scene-note{right:16px;top:20px}#karina-cinema .coordinates {left:22px;bottom:96px;font-size:8px}#karina-cinema .chapterbar {padding:15px 18px;flex-wrap:wrap;gap:8px}#karina-cinema .chapterbar button {min-width:80px;font-size:8px;padding:4px 4px 4px 0}#karina-cinema .chapterbar .play {font-size:8px}
#karina-cinema .ritual {grid-template-columns:1fr;gap:4px;padding:29px 22px}#karina-cinema .ritual h2 {font-size:42px}#karina-cinema .ritual .detail{max-width:350px}#karina-cinema .finishrow {margin-top:20px}#karina-cinema .signature {padding:24px 22px}#karina-cinema .signature-inner{padding:20px;grid-template-columns:1fr}#karina-cinema .sig-mark {display:none}#karina-cinema .sig-title{font-size:41px}#karina-cinema .foot {padding:17px 22px;font-size:8px}#karina-cinema .fallback{top:290px;padding-right:8%;gap:13px}#karina-cinema .fallback i{width:75px;height:220px}
}
@media(prefers-reduced-motion:reduce){#karina-cinema .ticker span{animation:none}}

#karina-cinema{max-width:1920px;margin:auto}
#karina-cinema .mast{padding:30px 5%;background:#e9e5df}
#karina-cinema .nav{padding-right:0;gap:30px}
#karina-cinema .nav a{font-size:10px;letter-spacing:1.5px;text-decoration:none}
#karina-cinema .nav .reserve{border:1px solid #86766b;padding:14px 19px}
#karina-cinema .hero{height:min(820px,85svh);min-height:640px}
#karina-cinema .copy{left:5%;top:12%;transition:opacity 1s,transform 1.3s}
#karina-cinema h1{font-size:clamp(90px,8.5vw,154px);max-width:630px}
#karina-cinema .subtitle{font-size:14px;max-width:310px}
#karina-cinema .coordinates{left:5%}
#karina-cinema .chapterbar{padding-left:5%;padding-right:5%;gap:18px}
#karina-cinema .discover{padding:18px 23px;font-size:11px}
#karina-cinema[data-intro=true] .copy,#karina-cinema[data-intro=true] .coordinates,#karina-cinema[data-intro=true] .scene-note{opacity:0;transform:translateY(18px);pointer-events:none;visibility:hidden}
#karina-cinema #kc-skip{position:absolute;right:5%;top:25px;z-index:5;border:0;background:transparent;font-size:10px;letter-spacing:2px;padding:12px}
#karina-cinema .intro-caption{position:absolute;bottom:105px;left:0;right:0;z-index:3;text-align:center;pointer-events:none}
#karina-cinema .intro-caption span{display:block;font-size:10px;letter-spacing:4px}
#karina-cinema .intro-caption em{display:block;font:italic 36px 'Cormorant Garamond',serif;margin-top:15px}
#karina-cinema [hidden]{display:none!important}
#karina-cinema .ritual{padding:85px 8%;gap:10%}
#karina-cinema .ritual h2{font-size:64px;margin-top:24px}
#karina-cinema .ritual .detail{font-size:14px;max-width:380px;min-height:50px}
#karina-cinema .finish{font-size:12px;padding:22px 10px 18px}
#karina-cinema .swatch{height:62px;width:34px}
#karina-cinema .control-label{font-size:10px}
#karina-cinema .options{gap:8px}
#karina-cinema .options label{margin-left:0}
#karina-cinema .signature{padding:50px 8%}
#karina-cinema .signature-book{display:block;font-size:12px;margin:24px 0 8px;text-underline-offset:5px;color:#eed5c4}
#karina-cinema[data-wireframe=true] .hero{background:radial-gradient(ellipse at 70% 40%,#342d35,#131015);color:#f0e5db}
#karina-cinema[data-wireframe=true] .subtitle,#karina-cinema[data-wireframe=true] .scene-note{color:#cbb3bd}
#karina-cinema[data-wireframe=true] .chapterbar{background:#211b23aa;border-color:#c6a99b33}
#karina-cinema[data-wireframe=true] .chapterbar button{color:#c4acbb}
#karina-cinema[data-wireframe=true] .chapterbar button[aria-pressed=true]{color:#fff3e8}
#karina-cinema .portfolio{padding:90px 5% 105px;background:#f5f1eb}
#karina-cinema .section-heading{display:flex;justify-content:space-between;gap:35px;align-items:flex-end;margin-bottom:45px}
#karina-cinema .section-heading h2,#karina-cinema .atelier h2{font:400 clamp(48px,5.5vw,80px)/.96 'Cormorant Garamond',serif;margin:24px 0 0;letter-spacing:-2px}
#karina-cinema .section-heading h2 em,#karina-cinema .atelier h2 em{color:#946d7b}
#karina-cinema .section-heading a,#karina-cinema .atelier a{font-size:10px;letter-spacing:1.5px;text-decoration:none;border-bottom:1px solid #8b706e;padding-bottom:9px}
#karina-cinema .gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
#karina-cinema .work-item{text-decoration:none}
#karina-cinema .work-item:nth-child(even){padding-top:65px}
#karina-cinema .work-image{position:relative;overflow:hidden;background:#ddd0c9;aspect-ratio:9/14}
#karina-cinema .work-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
#karina-cinema .work-item:hover img{transform:scale(1.045)}
#karina-cinema .work-image span{position:absolute;bottom:15px;left:15px;font-size:9px;letter-spacing:1px;background:#f6f0e9e8;padding:10px 12px;color:#382828}
#karina-cinema .work-caption{padding-top:18px;display:flex;flex-direction:column;gap:7px}
#karina-cinema .work-caption>span{font:400 25px 'Cormorant Garamond',serif}
#karina-cinema .work-caption small{font-size:9px;letter-spacing:1.4px;color:#7a6960}
#karina-cinema .atelier{display:grid;grid-template-columns:1fr 1.1fr;gap:10%;padding:110px 10%;background:#e2d8cf;align-items:center}
#karina-cinema .atelier-mark{font:italic 260px/1 'Cormorant Garamond',serif;text-align:center;color:#8f7272;text-shadow:2px 2px 1px #f4e9dd;position:relative;border:1px solid #a38c7d88;border-radius:50%;aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center}
#karina-cinema .atelier-mark span{font:400 9px 'DM Sans',sans-serif;letter-spacing:2px;margin-top:5px;color:#665349}
#karina-cinema .atelier p{font-size:14px;line-height:1.9;max-width:450px;color:#5c504c;margin:24px 0}
#karina-cinema .atelier-notes{display:flex;gap:10px 20px;flex-wrap:wrap;margin:28px 0 36px;font-size:9px;letter-spacing:1.2px}
#karina-cinema .booking{background:#261c23;color:#f1e7dc;position:relative;overflow:hidden;padding:85px 8% 80px;text-align:center}
#karina-cinema .booking .eyebrow{justify-content:center}
#karina-cinema .booking h2{font:400 clamp(90px,12vw,170px)/.8 'Cormorant Garamond',serif;margin:45px 0 35px;position:relative;z-index:1;letter-spacing:-5px}
#karina-cinema .booking h2 em{color:#c8a3b1}
#karina-cinema .booking>a{display:inline-flex;align-items:center;gap:40px;padding:18px 25px;border:1px solid #9e7b87;text-decoration:none;font-size:11px;letter-spacing:1.3px;position:relative;z-index:1}
#karina-cinema .booking p{font-size:12px;line-height:1.9;color:#c0a8ab;position:relative;z-index:1;margin:22px 0 0}
#karina-cinema .booking-shine{position:absolute;width:70%;height:400px;border:1px solid #94718044;border-radius:50%;transform:rotate(-32deg);top:100px;left:15%;box-shadow:0 0 90px #b7627933,inset 0 0 100px #bb6e7911;pointer-events:none}
#karina-cinema .foot{padding:25px 5%}
#karina-cinema .foot a{text-decoration:none}
@media(max-width:900px){#karina-cinema .nav{gap:17px}#karina-cinema .nav a:not(.reserve){display:none}#karina-cinema .gallery{gap:15px}#karina-cinema .work-caption>span{font-size:22px}#karina-cinema .atelier{padding:75px 6%;gap:8%}#karina-cinema .atelier-mark{font-size:200px}#karina-cinema .ritual{padding:65px 5%;gap:6%}#karina-cinema .ritual h2{font-size:52px}#karina-cinema .ritual .detail{font-size:12px}}
@media(max-width:650px){
#karina-cinema .mast{padding:23px 6%}#karina-cinema .nav button{display:none}#karina-cinema .nav .reserve{font-size:8px;letter-spacing:1px;padding:11px 12px;max-width:132px}#karina-cinema .brand{font-size:25px;letter-spacing:5px}#karina-cinema .brand small{font-size:7px;letter-spacing:2px}
#karina-cinema .hero{height:800px;min-height:0}#karina-cinema .copy{left:6%;top:35px;width:88%}#karina-cinema h1{font-size:clamp(69px,19vw,110px);margin-top:24px}#karina-cinema .subtitle{font-size:12px}#karina-cinema .discover{font-size:10px;padding:14px 18px;margin-top:15px}#karina-cinema .scene-note{display:none}#karina-cinema .coordinates{left:6%;bottom:120px}#karina-cinema .chapterbar{gap:8px 12px;padding:17px 6%;justify-content:space-between}#karina-cinema .chapterbar button{font-size:9px;min-height:27px}#karina-cinema .chapterbar .play{margin-left:0}#karina-cinema #kc-replay{min-width:120px}#karina-cinema .intro-caption{bottom:135px;padding:0 20px}#karina-cinema .intro-caption em{font-size:30px}
#karina-cinema .ritual{padding:55px 6%;gap:15px}#karina-cinema .ritual h2{font-size:53px}#karina-cinema .ritual .detail{font-size:13px;min-height:0}#karina-cinema .finish{padding:18px 6px;font-size:11px}#karina-cinema .shape{min-height:40px}#karina-cinema .options{gap:10px}#karina-cinema .signature{padding:30px 6%}
#karina-cinema .portfolio{padding:60px 6%}#karina-cinema .section-heading{display:block;margin-bottom:30px}#karina-cinema .section-heading h2{margin-bottom:28px;font-size:56px}#karina-cinema .gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 14px}#karina-cinema .work-item:nth-child(even){padding-top:35px}#karina-cinema .work-image{aspect-ratio:9/16}#karina-cinema .work-image span{font-size:8px;bottom:8px;left:8px;padding:8px}#karina-cinema .work-caption>span{font-size:22px}#karina-cinema .work-caption small{font-size:8px;line-height:1.7;letter-spacing:.8px}
#karina-cinema .atelier{grid-template-columns:1fr;padding:60px 8%;gap:40px}#karina-cinema .atelier-mark{max-width:260px;width:80%;font-size:180px;justify-self:center}#karina-cinema .atelier h2{font-size:56px}#karina-cinema .booking{padding:65px 6%}#karina-cinema .booking h2{font-size:110px;letter-spacing:-3px}#karina-cinema .booking .eyebrow{font-size:8px;letter-spacing:2px}#karina-cinema .foot{font-size:8px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}#karina-cinema *{transition:none!important;animation:none!important}}

#karina-cinema[data-wireframe=true] .discover{background:#e9dbcf;color:#2a1d25;border-color:#e9dbcf}

/* Champagne-to-daylight lighting, synchronized with the liquid sequence. */
#karina-cinema .intro-atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse at 48% 44%,#7e5b58 0%,#362630 43%,#130f16 100%);opacity:var(--intro-dark,0);pointer-events:none}
#karina-cinema .intro-atmosphere:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 45% 38%,transparent 30%,#08070b99 100%);}
#karina-cinema[data-intro=true] .copy,#karina-cinema[data-intro=true] .coordinates{visibility:visible;opacity:var(--intro-reveal,0);transform:translateY(calc((1 - var(--intro-reveal,0))*20px));transition:none;pointer-events:none}
#karina-cinema[data-intro=true] .copy .discover{pointer-events:none}
#karina-cinema[data-intro=true] .intro-caption{color:#f1dfd0;opacity:calc(1 - var(--intro-reveal,0));text-shadow:0 2px 20px #100a10;}
#karina-cinema[data-intro=true] .intro-caption em{font-size:clamp(27px,3vw,40px);font-weight:400}
#karina-cinema[data-intro=true] #kc-skip{color:#f1dfd0;background:#291c2755;backdrop-filter:blur(8px);border:1px solid #d5b9b133;padding:12px 16px}
#karina-cinema[data-intro=true] .chapterbar{background:#271c24cc;border-color:#cab3ac33}
#karina-cinema[data-intro=true] .chapterbar button{color:#d1b8b7}
#karina-cinema[data-intro=true] .chapterbar button[aria-pressed=true]{color:#fff0e3}
#karina-cinema .copy{transition:opacity 1.1s,transform 1.1s;}
@media(prefers-reduced-motion:reduce){#karina-cinema .intro-atmosphere{display:none}}