*{box-sizing:border-box} :root{--bg:#080808;--panel:#11100e;--panel2:#171512;--gold:#c6a15b;--gold2:#e0bf7b;--ivory:#f4f0e8;--muted:#aaa49a;--line:rgba(198,161,91,.24);--serif:"Cormorant Garamond",Georgia,serif;--sans:Inter,Arial,sans-serif}html{scroll-behavior:smooth;scroll-padding-top:84px}body{margin:0;background:var(--bg);color:var(--ivory);font-family:var(--sans);font-size:14px;line-height:1.6;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.grain{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.04;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='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E")}.site-header{height:78px;padding:0 clamp(22px,6vw,92px);display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:30;top:0;left:0;width:100%;border-bottom:1px solid rgba(255,255,255,.09);background:linear-gradient(#050505a8,transparent)}.brand{display:flex;flex-direction:column;align-items:center;line-height:1}.brand-logo{width:48px;height:48px;object-fit:contain;border-radius:50%;background:#000;box-shadow:0 0 22px #c6a15b20}.brand-sub{font-size:8px;letter-spacing:2px;margin-top:5px;white-space:nowrap}.brand-sub{font-size:9px;letter-spacing:3px;margin-top:2px}.nav{display:flex;align-items:center;gap:clamp(16px,2.5vw,36px);font-size:10px;text-transform:uppercase;letter-spacing:1px}.nav a:not(.nav-book){color:#e4ded3;transition:color .2s}.nav a:hover,.text-link:hover{color:var(--gold2)}.nav-book{background:var(--gold);color:#17110a;padding:11px 18px;border-radius:3px;font-weight:700}.menu-toggle{display:none;background:none;border:0;color:white}.hero{min-height:690px;height:min(850px,100svh);position:relative;display:flex;align-items:center;overflow:hidden;padding:120px clamp(22px,9vw,140px) 90px}.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;filter:brightness(.76) saturate(.86);transform:scale(1.01);background:#050505}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#050505 0%,#060605f2 24%,#070706bd 48%,#07070630 76%,#05050510 100%),linear-gradient(0deg,#080808 0%,transparent 24%,#05050555 100%);pointer-events:none}.hero-content{position:relative;z-index:2;width:min(540px,55%)}.eyebrow{font-size:10px;letter-spacing:2.3px;text-transform:uppercase;color:var(--gold);font-weight:600;margin:0 0 18px}.eyebrow i{display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--gold);vertical-align:middle;margin:0 7px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:.98}h1{font-size:clamp(58px,7vw,104px);letter-spacing:-2.5px;margin:0;color:#f4efe6;text-transform:uppercase}h1 em,h2 em,.script-line{color:var(--gold);font-style:normal}h1 em{font-weight:400}.script-line{font-family:var(--serif);font-style:italic;font-size:clamp(28px,3vw,42px);margin:8px 0 18px}.hero-copy{max-width:370px;color:#d0c9bd;font-size:13px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 18px;border:1px solid var(--gold);border-radius:3px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;transition:transform .2s,background .2s,color .2s;cursor:pointer}.button:hover{transform:translateY(-2px)}.button-gold{background:linear-gradient(110deg,#d9b66e,#b58b42);color:#100d08;box-shadow:0 5px 24px #b48a4220}.button-outline{background:#0808086e;color:var(--ivory)}.button-outline:hover{background:var(--gold);color:#100d08}.button span{font-size:16px}.trust-row{display:flex;gap:22px;flex-wrap:wrap;margin-top:42px;color:#d5c8a8;text-transform:uppercase;font-size:9px;letter-spacing:.6px}.scroll-cue{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);font-size:9px;text-transform:uppercase;letter-spacing:2px;color:#a9a093;display:flex;align-items:center;gap:10px}.scroll-cue span{height:26px;width:14px;border:1px solid var(--gold);border-radius:9px;position:relative}.scroll-cue span:after{content:"";position:absolute;top:5px;left:5px;width:2px;height:5px;background:var(--gold);animation:scroll 1.5s infinite}.section{padding:88px clamp(22px,5vw,76px)}.styles-section,.artists-section{background:#0c0b0a}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:30px}.section-heading h2,.idea-copy h2,.finder-panel h2,.preview-panel h2,.booking-section h2{font-size:clamp(38px,4.5vw,60px);margin:0}.section-heading>p{max-width:320px;color:var(--muted);font-size:12px;margin-bottom:4px}.style-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.style-card{padding:0;position:relative;overflow:hidden;border:1px solid #373027;background:#171513;min-height:240px;text-align:left;color:var(--ivory);cursor:pointer}.style-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.62) saturate(.72);transition:transform .5s,filter .3s}.style-card:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,#080808f2)}.style-card:hover img{transform:scale(1.07);filter:brightness(.8)}.style-name,.style-link{position:absolute;z-index:2;left:16px}.style-name{bottom:32px;font-family:var(--serif);font-size:24px;text-transform:uppercase}.style-link{bottom:13px;color:var(--gold);font-size:9px}.gallery-section{background:#080808}.text-link{color:var(--gold);font-size:11px;text-transform:uppercase;letter-spacing:.7px}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}.filter{background:#141311;border:1px solid #302b23;color:#c7c0b5;padding:9px 16px;border-radius:20px;font-size:9px;text-transform:uppercase;letter-spacing:.7px;cursor:pointer}.filter.active,.filter:hover{background:var(--gold);border-color:var(--gold);color:#110e08}.gallery-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;grid-auto-rows:190px;gap:9px}.gallery-item{padding:0;position:relative;overflow:hidden;background:#181512;border:1px solid #30291f;cursor:zoom-in}.gallery-item.tall{grid-row:span 2}.gallery-item img{width:100%;height:100%;object-fit:cover;filter:brightness(.77) saturate(.7);transition:transform .45s,filter .3s}.gallery-item:hover img{transform:scale(1.06);filter:brightness(.95)}.gallery-item span{position:absolute;bottom:0;left:0;right:0;padding:25px 13px 11px;text-align:left;background:linear-gradient(transparent,#000d);font-size:10px;color:#eee}.gallery-note{font-size:10px;color:#79736a;margin:15px 0 0}.idea-banner{display:grid;grid-template-columns:1fr 1fr;min-height:360px;background:#11100e;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.idea-image{min-height:340px;overflow:hidden}.idea-image img{width:100%;height:100%;object-fit:cover;filter:brightness(.72) saturate(.65)}.idea-copy{align-self:center;padding:48px clamp(28px,6vw,90px)}.idea-copy h2{margin-bottom:20px}.idea-copy>p:not(.eyebrow){max-width:420px;color:var(--muted);font-size:12px}.discovery-section{display:grid;grid-template-columns:1fr 1fr;gap:50px;background:#0b0a09}.finder-panel,.preview-panel{min-width:0}.finder-panel h2,.preview-panel h2{font-size:42px}.muted{color:var(--muted);font-size:12px}.step-count{display:flex;align-items:center;gap:8px;margin:25px 0}.step-count>span{height:1px;width:45px;background:#494032}.step-dot{height:25px;width:25px;border:1px solid #4b4130;border-radius:50%;display:grid;place-items:center;font-size:10px;color:#a69b87}.step-dot.active{background:var(--gold);border-color:var(--gold);color:#100d08}.finder-panel h3{font-family:var(--sans);font-size:14px;font-weight:500;margin:0 0 15px}.choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.choice{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:88px;background:#151412;border:1px solid #2e2a23;color:#cfc6b8;cursor:pointer;font-family:var(--serif);font-size:26px}.choice span{font-family:var(--sans);font-size:10px}.choice.selected,.choice:hover{border-color:var(--gold);box-shadow:inset 0 0 0 1px #c6a15b50;color:var(--gold)}.finder-next{margin-top:15px;min-width:160px}.finder-result{color:var(--gold);font-size:11px;margin-top:10px}.placement-tabs{display:flex;gap:7px;margin:20px 0 12px}.placement-tabs button{background:#171512;border:1px solid #353027;color:#c6bca9;border-radius:20px;padding:7px 13px;font-size:9px;text-transform:uppercase;cursor:pointer}.placement-tabs button.active{background:var(--gold);color:#100d08;border-color:var(--gold)}.preview-photo{height:auto;aspect-ratio:1/1;width:min(100%,420px);position:relative;overflow:hidden;background:#050505;border:1px solid #352d22;border-radius:4px;box-shadow:0 18px 50px #0008}.preview-photo img,.preview-photo video{display:block;width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;object-position:center;filter:brightness(.92) saturate(.9)}.preview-tag{position:absolute;left:12px;bottom:12px;background:#080808d9;padding:7px 10px;color:var(--gold);font-size:9px;letter-spacing:1px}.preview-disclaimer{font-size:9px;color:#7d766c}.benefits{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;padding:30px clamp(22px,6vw,90px);background:#0e0d0b;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.benefits>div{display:flex;align-items:center;justify-content:center;gap:12px}.benefits span{font-size:25px;color:var(--gold)}.benefits strong{font-size:9px;letter-spacing:.7px;text-transform:uppercase;font-weight:500}.artist-card{display:grid;grid-template-columns:260px 1fr;gap:35px;align-items:center;max-width:850px;margin:auto;border:1px solid #332c21;background:#11100e;padding:20px}.artist-card>img{width:100%;height:260px;object-fit:cover;filter:grayscale(.7)}.artist-card h3{font-size:36px;margin-bottom:14px}.artist-card p:not(.eyebrow){max-width:490px}.reviews-section{background:#0c0b0a;text-align:center}.centered{justify-content:center;text-align:center}.review-placeholder{max-width:540px;margin:auto;padding:30px;border:1px solid #332c21;background:#11100e}.review-placeholder span{color:var(--gold);letter-spacing:4px}.review-placeholder p{font-family:var(--serif);font-size:23px;margin:15px 0}.review-placeholder small{color:var(--muted)}.booking-section{display:grid;grid-template-columns:1.5fr .8fr;gap:45px;background:#100f0d}.booking-section h2{margin-bottom:16px}.booking-copy>.muted{max-width:500px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:25px}.form-grid label{display:flex;flex-direction:column;gap:7px;font-size:10px;color:#d9d1c4}.form-grid label small{display:inline;color:#8c8579}.form-grid .full{grid-column:1/-1}.form-grid input,.form-grid select,.form-grid textarea{width:100%;border:1px solid #373027;background:#171512;color:#f4f0e8;border-radius:3px;padding:12px;font-size:11px;outline:none}.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:#7c756b}.form-note{color:#817a70;font-size:9px}.submit-button{margin-top:8px}.form-message{font-size:11px;color:var(--gold);margin-top:10px}.whatsapp-card{align-self:center;padding:35px 25px;text-align:center;background:radial-gradient(ellipse at top,#242017,#11100e 65%);border:1px solid #403523}.wa-icon{margin:0 auto 20px;width:52px;height:52px;border:1px solid #49a878;border-radius:50%;display:grid;place-items:center;color:#64d79a;font-size:25px}.whatsapp-card h3{font-size:38px;margin-bottom:14px}.whatsapp-card h3 em{color:var(--gold);font-style:normal}.whatsapp-card p:not(.eyebrow){color:var(--muted);font-size:11px}.whatsapp-card .button{width:100%;margin:10px 0 16px}.whatsapp-card small{display:block;font-size:9px;color:#8c8376}.whatsapp-card code{color:var(--gold)}.footer{background:#070707;padding:38px clamp(22px,5vw,76px) 0;border-top:1px solid var(--line)}.footer-main{display:grid;grid-template-columns:1.1fr 1.2fr 1fr 1.4fr .8fr;gap:25px;align-items:center;padding-bottom:30px}.footer-main .muted{font-size:10px}.footer-links,.footer-contact{display:flex;flex-direction:column;gap:8px;font-size:10px;color:#c7c0b5}.footer-contact strong{color:var(--gold);font-weight:500}.social-links{display:flex;gap:8px}.social-links a{width:28px;height:28px;display:grid;place-items:center;border:1px solid #51432c;border-radius:50%;color:var(--gold);font-weight:700}.footer-bottom{border-top:1px solid #29241d;display:flex;justify-content:space-between;gap:15px;padding:14px 0;color:#777066;font-size:9px}.lightbox{position:fixed;inset:0;z-index:60;background:#000f;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px}.lightbox[hidden]{display:none}.lightbox img{max-width:min(90vw,1000px);max-height:78vh;object-fit:contain}.lightbox p{color:var(--gold);margin:15px}.lightbox-close{position:absolute;top:20px;right:25px;background:none;border:0;color:white;font-size:40px;cursor:pointer}.reveal{animation:rise .9s ease both}@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes slowzoom{from{transform:scale(1.02)}to{transform:scale(1.1)}}@keyframes scroll{0%{transform:translateY(0);opacity:1}80%,100%{transform:translateY(8px);opacity:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}@media(max-width:900px){.nav{gap:13px;font-size:9px}.nav-book{padding:10px}.hero{min-height:650px}.hero-content{width:65%}.scroll-cue{left:23px;transform:none}.section{padding:60px 20px}.section-heading{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:24px}.section-heading h2,.idea-copy h2,.booking-section h2{font-size:46px}.section-heading>p{font-size:11px}.style-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.style-card{min-height:210px}.style-name{left:12px;font-size:22px}.style-link{left:12px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:170px;gap:7px}.gallery-item.tall{grid-row:span 2}.filter-row{gap:6px}.filter{padding:8px 11px;font-size:8px}.idea-banner{grid-template-columns:1fr}.idea-image{min-height:220px;height:240px}.idea-copy{padding:34px 22px 42px}.discovery-section{grid-template-columns:1fr;gap:48px}.finder-panel h2,.preview-panel h2{font-size:39px}.choice{min-height:78px}.preview-photo{height:260px}.benefits{grid-template-columns:repeat(3,1fr);gap:22px 10px;padding:28px 15px}.benefits>div{font-size:9px}.benefits span{font-size:23px}.benefits strong{font-size:8px}.artist-card{grid-template-columns:105px 1fr;gap:17px;padding:13px}.artist-card>img{height:170px}.artist-card h3{font-size:28px}.artist-card .muted{font-size:10px}.review-placeholder{padding:23px 18px}.review-placeholder p{font-size:20px}.booking-section{grid-template-columns:1fr;gap:30px}.form-grid{gap:11px}.form-grid input,.form-grid select,.form-grid textarea{padding:11px 9px}.whatsapp-card{padding:28px 22px}.footer{padding:30px 20px 0}.footer-main{grid-template-columns:1fr 1fr;gap:25px 15px}.footer-main>.brand{align-items:flex-start}.footer-main .muted{align-self:center}.footer-links,.footer-contact{font-size:10px}.social-links{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:6px;font-size:8px}}@media(max-width:360px){.hero-actions{flex-direction:column;align-items:flex-start}.hero-actions .button{width:100%}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.style-card{min-height:175px}.gallery-grid{grid-auto-rows:145px}}


/* === OS TATTOOS cinematic motion layer === */
:root{--pointer-x:50vw;--pointer-y:35vh;--scroll-progress:0%}
html{scroll-behavior:smooth}
body{background-image:radial-gradient(520px circle at var(--pointer-x) var(--pointer-y),rgba(198,161,91,.055),transparent 68%)}
body:before{content:"";position:fixed;z-index:19;top:0;left:0;height:2px;width:var(--scroll-progress);background:linear-gradient(90deg,#8e682b,var(--gold2),#fff0bd);box-shadow:0 0 14px #d4ad5c88;pointer-events:none}
.site-header{transition:background .45s ease,border-color .45s ease,backdrop-filter .45s ease}
.site-header.is-scrolled{position:fixed;background:rgba(7,7,6,.82);backdrop-filter:blur(16px);border-bottom-color:rgba(198,161,91,.22);box-shadow:0 10px 30px #0005}
.brand-mark{animation:brandBreath 4.8s ease-in-out infinite}
.nav a:not(.nav-book){position:relative}
.nav a:not(.nav-book):after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:var(--gold2);box-shadow:0 0 9px #d8b66b99;transition:right .32s ease}
.nav a:not(.nav-book):hover:after,.nav a:not(.nav-book).is-current:after{right:0}
.nav-book{position:relative;overflow:hidden;isolation:isolate;box-shadow:0 0 0 rgba(198,161,91,0);transition:box-shadow .3s ease,transform .3s ease}
.nav-book:before,.button-gold:before{content:"";position:absolute;z-index:-1;top:-80%;bottom:-80%;left:-45%;width:28%;transform:rotate(22deg);background:linear-gradient(90deg,transparent,#fff9d7b8,transparent);animation:goldSweep 5.5s ease-in-out infinite}
.nav-book:hover{box-shadow:0 0 25px #c6a15b55;transform:translateY(-2px)}
.hero:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.42;background:radial-gradient(ellipse at 76% 44%,transparent 0 24%,rgba(5,5,5,.15) 56%,#050505 115%);mix-blend-mode:screen;animation:atmospherePulse 9s ease-in-out infinite alternate}
.hero-content{animation:heroEntrance 1.2s cubic-bezier(.2,.75,.2,1) both}
.hero-content .eyebrow{animation:heroEntrance .9s .12s both}
.hero-content h1{animation:heroEntrance 1s .22s both;text-shadow:0 3px 36px #0008}
.hero-content .script-line{animation:heroEntrance 1s .34s both}
.hero-content .hero-copy{animation:heroEntrance 1s .45s both}
.hero-content .hero-actions{animation:heroEntrance 1s .56s both}
.hero-content .trust-row{animation:heroEntrance 1s .68s both}
.button{position:relative;overflow:hidden;isolation:isolate}
.button-gold{box-shadow:0 0 0 1px #e0bf7b15,0 8px 28px #b48a4225;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,filter .3s ease}
.button-gold:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 12px 36px #c6a15b48;filter:brightness(1.08)}
.button-outline:hover{box-shadow:0 0 22px #c6a15b22}
.scroll-cue{animation:cueFloat 2.6s ease-in-out infinite}
.section-heading h2 em{display:inline-block;position:relative}
.section-heading h2 em:after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:1px;transform:scaleX(0);transform-origin:left;background:linear-gradient(90deg,var(--gold),transparent);transition:transform .9s .2s ease}
.section-heading.is-visible h2 em:after{transform:scaleX(1)}
.style-card,.gallery-item,.choice,.preview-photo,.artist-card,.review-placeholder,.whatsapp-card{transition:transform .55s cubic-bezier(.2,.75,.2,1),border-color .4s ease,box-shadow .45s ease,filter .45s ease}
.style-card:hover,.gallery-item:hover{transform:translateY(-8px);border-color:#c6a15b99;box-shadow:0 18px 42px #0008,0 0 24px #c6a15b12}
.style-card img,.gallery-item img{transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .6s ease}
.style-card:hover img,.gallery-item:hover img{transform:scale(1.075);filter:brightness(.94) saturate(.92)}
.style-card:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid transparent;transition:border-color .4s ease;box-shadow:inset 0 0 0 0 #c6a15b}
.style-card:hover:after{border-color:#c6a15b55;box-shadow:inset 0 0 28px #c6a15b0b}
.gallery-item:before{transition:opacity .45s ease}
.idea-image img{transition:transform 1.2s cubic-bezier(.2,.7,.2,1),filter .6s ease}
.idea-banner:hover .idea-image img{transform:scale(1.045);filter:brightness(.78) saturate(.9)}
.artist-card:hover,.review-placeholder:hover,.whatsapp-card:hover{border-color:#8f713d;box-shadow:0 18px 45px #0005,0 0 28px #c6a15b0d}
.artist-card>img{transition:filter .6s ease,transform .7s ease}
.artist-card:hover>img{filter:grayscale(.2);transform:scale(1.015)}
.wa-icon{animation:waPulse 3s ease-out infinite}
.filter,.placement-tabs button{transition:color .25s ease,background .25s ease,border-color .25s ease,transform .25s ease}
.filter:hover,.placement-tabs button:hover{transform:translateY(-2px)}
.form-grid input,.form-grid select,.form-grid textarea{transition:border-color .25s ease,box-shadow .25s ease,background .25s ease}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{box-shadow:0 0 0 3px #c6a15b1d;background:#1a1712}
.social-links a{transition:transform .3s ease,color .3s ease,background .3s ease,box-shadow .3s ease}
.social-links a:hover{transform:translateY(-4px);background:var(--gold);color:#080808;box-shadow:0 5px 20px #c6a15b33}
/* Scroll-triggered entrances; content remains visible if JavaScript is disabled. */
.motion-ready .scroll-reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.motion-ready .scroll-reveal.is-visible{opacity:1;transform:translateY(0)}
.motion-ready .scroll-reveal[data-motion="left"]{transform:translateX(-28px)}
.motion-ready .scroll-reveal[data-motion="right"]{transform:translateX(28px)}
.motion-ready .scroll-reveal[data-motion="left"].is-visible,.motion-ready .scroll-reveal[data-motion="right"].is-visible{transform:translateX(0)}
.gold-particle{position:absolute;z-index:1;pointer-events:none;width:3px;height:3px;border-radius:50%;background:#f0cf82;box-shadow:0 0 9px 2px #c6a15b88;opacity:0;animation:particleDrift var(--duration,9s) linear infinite;animation-delay:var(--delay,0s);left:var(--left,50%);bottom:-8px}
.hero-video{will-change:transform}
@keyframes heroEntrance{from{opacity:0;transform:translate3d(0,22px,0);filter:blur(3px)}to{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}}
@keyframes brandBreath{0%,100%{text-shadow:0 0 14px #c6a15b20}50%{text-shadow:0 0 28px #c6a15b80}}
@keyframes goldSweep{0%,66%,100%{left:-45%;opacity:0}72%{opacity:1}88%{left:125%;opacity:0}}
@keyframes atmospherePulse{0%{opacity:.18;transform:scale(1)}100%{opacity:.48;transform:scale(1.035)}}
@keyframes cueFloat{0%,100%{translate:0 0}50%{translate:0 5px}}
@keyframes waPulse{0%{box-shadow:0 0 0 0 #49a87822}65%{box-shadow:0 0 0 12px #49a87800}100%{box-shadow:0 0 0 0 #49a87800}}
@keyframes particleDrift{0%{transform:translate3d(0,0,0) scale(.55);opacity:0}12%{opacity:.6}75%{opacity:.35}100%{transform:translate3d(var(--drift,28px),-115vh,0) scale(1.2);opacity:0}}
@media(max-width:900px){.hero:after{opacity:.24}.motion-ready .scroll-reveal[data-motion="left"],.motion-ready .scroll-reveal[data-motion="right"]{transform:translateY(22px)}.motion-ready .scroll-reveal[data-motion="left"].is-visible,.motion-ready .scroll-reveal[data-motion="right"].is-visible{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){body:before,.gold-particle{display:none!important}.motion-ready .scroll-reveal,.motion-ready .scroll-reveal[data-motion="left"],.motion-ready .scroll-reveal[data-motion="right"]{opacity:1;transform:none;transition:none}.hero-content,.hero-content .eyebrow,.hero-content h1,.hero-content .script-line,.hero-content .hero-copy,.hero-content .hero-actions,.hero-content .trust-row{animation:none!important}}


/* Cinematic section-to-section transitions: lens zoom out, then destination fades in */
.page-transition{
  position:fixed;inset:0;z-index:1000;pointer-events:none;opacity:0;
  display:grid;place-items:center;background:rgba(4,4,4,0);
  transition:opacity .32s ease,background .32s ease;
}
.transition-lens{
  position:absolute;left:50%;top:50%;width:12vmax;height:12vmax;min-width:100px;min-height:100px;
  border-radius:50%;transform:translate(-50%,-50%) scale(.04);
  background:radial-gradient(circle at 45% 42%,#d8b56b 0%,#9b7333 18%,#17120a 48%,#030303 72%);
  box-shadow:0 0 40px #c6a15b33,inset 0 0 30px #e0bf7b20;
  opacity:0;transition:transform .58s cubic-bezier(.2,.72,.16,1),opacity .18s ease;
}
.transition-wordmark{
  position:relative;z-index:1;opacity:0;transform:scale(.86);
  font:500 clamp(18px,3vw,34px) var(--serif);letter-spacing:.18em;color:#f4f0e8;
  transition:opacity .22s ease .12s,transform .58s cubic-bezier(.2,.72,.16,1);
}
.transition-wordmark i{font-style:normal;color:var(--gold);font-size:.55em;letter-spacing:.35em}
body.is-transitioning .page-transition{opacity:1;background:rgba(4,4,4,.96)}
body.is-transitioning .transition-lens{opacity:1;transform:translate(-50%,-50%) scale(18)}
body.is-transitioning .transition-wordmark{opacity:1;transform:scale(1)}
body.is-transitioning main,body.is-transitioning .site-header{
  filter:blur(5px);transform:scale(.985);opacity:.22;
  transition:filter .3s ease,transform .3s ease,opacity .3s ease;
}
main,.site-header{transition:filter .35s ease,transform .35s ease,opacity .35s ease}
.section.section-arriving{animation:sectionArrive .72s cubic-bezier(.2,.72,.2,1) both}
.hero.hero-arriving{animation:heroArrive .8s cubic-bezier(.2,.72,.2,1) both}
@keyframes sectionArrive{
  from{opacity:0;filter:blur(9px);transform:scale(1.025)}
  to{opacity:1;filter:blur(0);transform:scale(1)}
}
@keyframes heroArrive{
  from{opacity:.3;filter:blur(8px);transform:scale(1.035)}
  to{opacity:1;filter:blur(0);transform:scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .page-transition,.transition-lens,.transition-wordmark,main,.site-header{transition:none!important}
  body.is-transitioning main,body.is-transitioning .site-header{filter:none;transform:none}
  .section.section-arriving,.hero.hero-arriving{animation:none}
}


/* Keep the lion film running behind every section, not only the hero */
body{position:relative;background:#050505}
.site-background-video{
  position:fixed;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center center;z-index:0;pointer-events:none;
  filter:brightness(.43) saturate(.72);background:#050505;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(4,4,4,.9) 0%,rgba(5,5,5,.68) 48%,rgba(5,5,5,.38) 100%),
             linear-gradient(0deg,rgba(4,4,4,.82),rgba(4,4,4,.18) 48%,rgba(4,4,4,.56));
}
.site-header,main{position:relative;z-index:1}
main{background:transparent}
.hero{background:transparent}
.hero-shade{background:linear-gradient(90deg,rgba(4,4,4,.78) 0%,rgba(4,4,4,.52) 38%,rgba(4,4,4,.14) 78%,rgba(4,4,4,.06) 100%),linear-gradient(0deg,rgba(8,8,8,.72),transparent 30%,rgba(5,5,5,.2))}
.section,.styles-section,.artists-section,.gallery-section,.discovery-section,.benefits,.reviews-section,.booking-section,.idea-banner{
  background-color:rgba(8,8,8,.46)!important;
  backdrop-filter:blur(1.5px);
}
.style-card,.gallery-item,.finder-panel,.preview-panel,.booking-form,.benefit-card,.review-card{
  background-color:rgba(17,16,14,.78);
}
.grain{z-index:20}
.page-transition{z-index:1000}
@media(max-width:700px){
  .site-background-video{object-position:60% center;filter:brightness(.34) saturate(.7)}
  body::before{background:linear-gradient(90deg,rgba(4,4,4,.8),rgba(4,4,4,.45)),linear-gradient(0deg,rgba(4,4,4,.8),rgba(4,4,4,.2))}
  .section,.styles-section,.artists-section,.gallery-section,.discovery-section,.benefits,.reviews-section,.booking-section,.idea-banner{background-color:rgba(8,8,8,.58)!important}
}


/* Varied cinematic section transitions: each destination gets its own visual entrance */
.transition-orb{
  position:absolute;width:clamp(160px,28vw,440px);aspect-ratio:1;border-radius:50%;
  border:1px solid rgba(224,191,123,.65);box-shadow:0 0 80px rgba(198,161,91,.13),inset 0 0 65px rgba(198,161,91,.08);
  opacity:0;transform:scale(.35) rotate(-25deg);
}
body.is-transitioning .transition-orb{animation:orbPulse .56s ease-out both}
@keyframes orbPulse{0%{opacity:0;transform:scale(.25) rotate(-25deg)}45%{opacity:.85}100%{opacity:0;transform:scale(1.6) rotate(20deg)}}
.section.section-arriving[data-page-motion="fade"]{animation:pageFade .78s ease both}
.section.section-arriving[data-page-motion="zoom"]{animation:pageZoom .88s cubic-bezier(.16,.72,.18,1) both}
.section.section-arriving[data-page-motion="slide-left"]{animation:pageSlideLeft .78s cubic-bezier(.16,.72,.18,1) both}
.section.section-arriving[data-page-motion="slide-right"]{animation:pageSlideRight .78s cubic-bezier(.16,.72,.18,1) both}
.section.section-arriving[data-page-motion="rise"]{animation:pageRise .8s cubic-bezier(.16,.72,.18,1) both}
.section.section-arriving[data-page-motion="blur"]{animation:pageBlur .82s ease both}
.section.section-arriving[data-page-motion="gold-wipe"]{animation:pageGoldWipe .86s cubic-bezier(.16,.72,.18,1) both}
.section.section-arriving[data-page-motion="zoom"]:after{animation:goldFlash .7s ease both}
@keyframes pageFade{from{opacity:0}to{opacity:1}}
@keyframes pageZoom{from{opacity:0;transform:scale(.91);filter:blur(10px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
@keyframes pageSlideLeft{from{opacity:0;transform:translateX(7vw);filter:blur(4px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
@keyframes pageSlideRight{from{opacity:0;transform:translateX(-7vw);filter:blur(4px)}to{opacity:1;transform:translateX(0);filter:blur(0)}}
@keyframes pageRise{from{opacity:0;transform:translateY(5vh);filter:blur(6px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes pageBlur{from{opacity:.1;filter:blur(16px);transform:scale(1.025)}to{opacity:1;filter:blur(0);transform:scale(1)}}
@keyframes pageGoldWipe{from{opacity:.2;clip-path:inset(0 0 100% 0);filter:brightness(1.4)}to{opacity:1;clip-path:inset(0 0 0 0);filter:brightness(1)}}
@keyframes goldFlash{0%,100%{opacity:0}35%{opacity:.18}}
@keyframes heroArriveDynamic{from{opacity:.2;transform:scale(1.07);filter:blur(10px)}to{opacity:1;transform:scale(1);filter:blur(0)}}
.hero.hero-arriving{animation:heroArriveDynamic .9s cubic-bezier(.16,.72,.18,1) both}
@media(prefers-reduced-motion:reduce){
 .transition-orb{display:none!important}
 .section.section-arriving,.hero.hero-arriving{animation:none!important}
}


/* Consistent page-to-page fade transaction: fade current view out, then fade destination in */
body.is-transitioning .page-transition{
  opacity:1!important;
  background:rgba(3,3,3,.94)!important;
}
body.is-transitioning .transition-lens{
  opacity:.25!important;
  transform:translate(-50%,-50%) scale(5)!important;
}
body.is-transitioning .transition-wordmark{
  opacity:0!important;
}
body.is-transitioning main,
body.is-transitioning .site-header{
  opacity:0!important;
  filter:blur(5px)!important;
  transform:scale(.99)!important;
  transition:opacity .42s ease,filter .42s ease,transform .42s ease!important;
}
main,.site-header{
  transition:opacity .42s ease,filter .42s ease,transform .42s ease;
}
.page-fade-in{
  animation:pageFadeIn .72s cubic-bezier(.22,.68,.2,1) both!important;
}
@keyframes pageFadeIn{
  0%{opacity:0;filter:blur(7px);transform:scale(1.012)}
  60%{opacity:.8;filter:blur(2px);transform:scale(1.003)}
  100%{opacity:1;filter:blur(0);transform:scale(1)}
}
@media(prefers-reduced-motion:reduce){
  body.is-transitioning .page-transition{opacity:0!important;background:transparent!important}
  body.is-transitioning main,body.is-transitioning .site-header{opacity:1!important;filter:none!important;transform:none!important}
  .page-fade-in{animation:none!important}
}


/* ===== Tattoo lettering: fonts that match the work ===== */
:root{--display:"Pirata One","UnifrakturCook",Georgia,serif;--blackletter:"UnifrakturCook","Pirata One",Georgia,serif;--script:"Pinyon Script","Cormorant Garamond",cursive;--fineline:"Italiana","Cormorant Garamond",serif;--ornate:"Cinzel Decorative","Cormorant Garamond",serif}
h1,h2,h3{font-family:var(--display);font-weight:400;text-transform:none;letter-spacing:.5px;line-height:1.02}
h1{letter-spacing:1px;line-height:.98}
h1 em,h2 em{font-family:var(--script);font-weight:400;letter-spacing:0;font-size:1.18em;line-height:.8}
.script-line{font-family:var(--script);font-style:normal;font-size:clamp(34px,3.6vw,52px)}
.finder-panel h3{font-family:var(--sans)}
.artist-card h3,.whatsapp-card h3{font-family:var(--display)}
/* each style is lettered the way it is tattooed */
.style-card .style-name{text-transform:none;line-height:1}
.style-card[data-style="Floral"] .style-name,.gallery-item[data-category="Floral"] span{font-family:var(--script)}
.style-card[data-style="Realism"] .style-name,.gallery-item[data-category="Realism"] span{font-family:var(--serif);font-style:italic;font-weight:600}
.style-card[data-style="Fine line"] .style-name,.gallery-item[data-category="Fine line"] span{font-family:var(--fineline);letter-spacing:2px}
.style-card[data-style="Blackwork"] .style-name,.gallery-item[data-category="Blackwork"] span{font-family:"Pirata One",serif}
.style-card[data-style="Lettering"] .style-name,.gallery-item[data-category="Lettering"] span{font-family:var(--blackletter)}
.style-card[data-style="Custom"] .style-name,.gallery-item[data-category="Custom"] span{font-family:var(--ornate);font-size:.82em}
.style-card .style-name{font-size:32px}
.style-card[data-style="Floral"] .style-name{font-size:40px}
.gallery-item span{font-size:22px;line-height:1.1;padding-top:40px}
.gallery-item[data-category="Floral"] span{font-size:30px}
.gallery-item[data-category="Custom"] span{font-size:17px}
.filter[data-filter="Floral"]{font-family:var(--script);font-size:15px;text-transform:none;letter-spacing:0}
.filter[data-filter="Realism"]{font-family:var(--serif);font-style:italic;font-size:13px;text-transform:none}
.filter[data-filter="Fine line"]{font-family:var(--fineline);font-size:12px;letter-spacing:1.5px}
.filter[data-filter="Blackwork"]{font-family:"Pirata One",serif;font-size:13px;text-transform:none}
.filter[data-filter="Lettering"]{font-family:var(--blackletter);font-size:13px;text-transform:none}
.filter[data-filter="Custom"]{font-family:var(--ornate);font-size:10px}

/* ===== Scroll-scrubbed lion film (canvas) ===== */
canvas.site-background-video{display:block;background:#050505 url(assets/frames/f001.webp) center/cover no-repeat;will-change:contents}

/* ===== Pinned gallery that glides sideways, then page scrolls on ===== */
.section.gallery-section{padding:0!important;position:relative}
.gallery-stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;overflow:hidden;padding:92px 0 14px}
.gallery-top{padding:0 clamp(22px,5vw,76px);flex:none}
.gallery-top .section-heading{margin-bottom:12px}
.gallery-top .section-heading h2{font-size:clamp(34px,4vw,54px)}
.gallery-top .filter-row{margin:0 0 6px}
.gallery-viewport{flex:1;min-height:0;overflow:hidden;position:relative;perspective:1400px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)}
.gallery-grid{transform-style:preserve-3d;display:flex;align-items:center;gap:clamp(14px,2vw,28px);height:100%;width:max-content;padding:0 clamp(40px,10vw,160px);will-change:transform}
.gallery-item{flex:none;width:clamp(230px,27vw,400px);height:min(100%,56vh);border-radius:6px;transform-origin:50% 100%;will-change:transform}
.gallery-item.tall{width:clamp(220px,22vw,330px);height:min(100%,68vh)}
.gallery-item[hidden]{display:none}
.gallery-item:hover{border-color:#c6a15bcc}
.gallery-foot{flex:none;display:flex;align-items:center;gap:18px;padding:10px clamp(22px,5vw,76px) 0}
.gallery-bar{flex:0 0 clamp(90px,16vw,220px);height:2px;background:#ffffff1f;position:relative;overflow:hidden}
.gallery-bar span{position:absolute;inset:0;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,#8e682b,var(--gold2))}
.gallery-hint{font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--gold)}
.gallery-foot .gallery-note{margin:0 0 0 auto;max-width:360px;font-size:9px;text-align:right}
.gallery-section.gallery-static .gallery-stage{position:relative;height:auto;min-height:100svh}
.gallery-section.gallery-static .gallery-viewport{overflow-x:auto;padding-bottom:10px;-webkit-mask-image:none;mask-image:none}
.gallery-section.gallery-static .gallery-hint,.gallery-section.gallery-static .gallery-bar{display:none}
.gallery-item{transition:border-color .4s ease,box-shadow .45s ease,filter .45s ease!important}
@media(max-width:900px){
  .gallery-stage{padding-top:84px}
  .gallery-top .section-heading>p,.gallery-top .text-link{display:none}
  .gallery-top .filter-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
  .gallery-item{width:68vw;height:min(100%,50vh)}.gallery-item.tall{width:58vw;height:min(100%,58vh)}
  .gallery-foot .gallery-note{display:none}
}


/* OS TATTOOS — left-side icon navigation rail */
@media (min-width: 901px) {
  .site-header { pointer-events:none; }
  .site-header .brand, .site-header .menu-toggle { pointer-events:auto; }
  .site-header .nav {
    pointer-events:auto;
    position:fixed;
    top:145px;
    left:18px;
    z-index:80;
    width:58px;
    padding:10px 7px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:7px;
    overflow:visible;
    border:1px solid rgba(198,161,91,.3);
    border-radius:15px;
    background:rgba(8,8,8,.76);
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
    box-shadow:0 12px 36px #0008, inset 0 1px 0 #ffffff0c;
    transition:width .38s cubic-bezier(.2,.8,.2,1), padding .38s ease, background .3s ease;
  }
  .site-header .nav:hover, .site-header .nav:focus-within { width:184px; padding:10px 8px; background:rgba(8,8,8,.94); }
  .site-header .nav a:not(.nav-book), .site-header .nav .nav-book {
    position:relative;
    display:flex;
    align-items:center;
    gap:15px;
    width:100%;
    height:43px;
    min-height:43px;
    padding:0 11px;
    border:1px solid transparent;
    border-radius:9px;
    color:#e4ded3;
    background:transparent;
    font-size:10px;
    letter-spacing:1.2px;
    white-space:nowrap;
    overflow:hidden;
    transition:background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
  }
  .site-header .nav a:not(.nav-book):hover, .site-header .nav a:not(.nav-book).is-current,
  .site-header .nav .nav-book:hover { color:var(--gold2); background:#c6a15b18; border-color:#c6a15b42; transform:translateX(2px); }
  .site-header .nav .nav-book { margin-top:5px; color:#17110a; background:var(--gold); font-weight:700; }
  .site-header .nav .nav-book:hover { color:#080705; background:var(--gold2); }
  .nav-icon { flex:0 0 20px; width:20px; display:inline-flex; align-items:center; justify-content:center; font-size:20px; line-height:1; color:var(--gold); }
  .nav-book .nav-icon { color:#17110a; font-size:17px; }
  .nav-label { display:inline-block; opacity:0; transform:translateX(-8px); max-width:0; overflow:hidden; transition:opacity .22s ease, transform .32s cubic-bezier(.2,.8,.2,1), max-width .38s ease; }
  .site-header .nav:hover .nav-label, .site-header .nav:focus-within .nav-label { opacity:1; transform:translateX(0); max-width:110px; transition-delay:.04s; }
  .site-header .nav:not(:hover):not(:focus-within) .nav-label { transition-delay:0s; }
  .site-header .nav-book { border-radius:9px; }
  .hero-content, .scroll-cue { margin-left:35px; }
}
@media (max-width: 900px) {
  .site-header { position:absolute; }
  .site-header .nav {
    position:fixed;
    top:50%;
    left:10px;
    transform:translateY(-50%);
    z-index:80;
    width:48px;
    padding:7px 5px;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:5px;
    border:1px solid rgba(198,161,91,.3);
    border-radius:13px;
    background:rgba(8,8,8,.84);
    -webkit-backdrop-filter:blur(16px);
    backdrop-filter:blur(16px);
    box-shadow:0 12px 30px #0008;
    opacity:1;
    visibility:visible;
  }
  .site-header .nav a:not(.nav-book), .site-header .nav .nav-book {
    display:flex;
    align-items:center;
    gap:12px;
    width:100%;
    height:40px;
    min-height:40px;
    padding:0 8px;
    border-radius:8px;
    overflow:hidden;
    white-space:nowrap;
    font-size:9px;
    color:#eee5d5;
    background:transparent;
  }
  .site-header .nav .nav-book { background:var(--gold); color:#17110a; margin-top:4px; }
  .nav-icon { flex:0 0 20px; width:20px; display:inline-flex; align-items:center; justify-content:center; font-size:19px; line-height:1; color:var(--gold); }
  .nav-book .nav-icon { color:#17110a; }
  .nav-label { opacity:0; max-width:0; overflow:hidden; transform:translateX(-7px); transition:opacity .22s ease, transform .3s ease, max-width .35s ease; }
  .site-header .nav:hover, .site-header .nav:focus-within, .site-header .nav.open { width:164px; background:rgba(8,8,8,.96); }
  .site-header .nav:hover .nav-label, .site-header .nav:focus-within .nav-label, .site-header .nav.open .nav-label { opacity:1; max-width:100px; transform:translateX(0); }
  .site-header .menu-toggle { display:none; }
  .hero-content, .scroll-cue { margin-left:26px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-header .nav, .site-header .nav *, .nav-label { transition:none !important; }
}


/* Critical stacking fix: keep the floating navigation above all page layers. */
.site-header { z-index: 2147483000 !important; isolation: isolate; }
.site-header .nav {
  z-index: 2147483001 !important;
  pointer-events: auto !important;
  position: fixed !important;
  isolation: isolate;
}
.site-header .nav a,
.site-header .nav a * { pointer-events: auto !important; }
.site-header .brand { position: relative; z-index: 2147483002; }
/* Page effects and decorative overlays must never intercept navigation hover/clicks. */
.grain, .page-transition, .site-background-video {
  pointer-events: none !important;
}


/* Cinematic object-by-object page transitions: detach, drift, dissolve, then reassemble. */
.page-flying-out {
  animation: objectDetach .46s cubic-bezier(.45,0,.8,.3) var(--fly-delay,0ms) both !important;
  pointer-events:none !important;
  will-change:transform,opacity,filter;
}
.page-flying-in {
  animation: objectAttach .78s cubic-bezier(.16,1,.3,1) var(--fly-delay,0ms) both !important;
  will-change:transform,opacity,filter;
}
@keyframes objectDetach {
  0% { opacity:1; transform:translate3d(0,0,0) rotate(0) scale(1); filter:blur(0); }
  35% { opacity:.82; transform:translate3d(calc(var(--fly-x,24px)*.45),calc(var(--fly-y,50px)*.45),0) rotate(1.2deg) scale(1.025); filter:blur(1px); }
  100% { opacity:0; transform:translate3d(var(--fly-x,24px),var(--fly-y,50px),0) rotate(-2deg) scale(.82); filter:blur(11px); }
}
@keyframes objectAttach {
  0% { opacity:0; transform:translate3d(var(--fly-x,24px),var(--fly-y,-50px),0) rotate(2deg) scale(.82); filter:blur(12px); }
  55% { opacity:.82; transform:translate3d(calc(var(--fly-x,24px)*-.12),calc(var(--fly-y,-50px)*-.12),0) rotate(-.5deg) scale(1.018); filter:blur(2px); }
  78% { opacity:1; transform:translate3d(0,0,0) rotate(0) scale(1.006); filter:blur(0); }
  100% { opacity:1; transform:translate3d(0,0,0) rotate(0) scale(1); filter:blur(0); }
}
/* Keep navigation responsive while the cinematic transition runs. */
.site-header, .site-header .nav, .site-header .nav * { pointer-events:auto; }
body.is-transitioning .page-transition { opacity:0 !important; background:transparent !important; }
body.is-transitioning main, body.is-transitioning .site-header {
  filter:none !important; transform:none !important; opacity:1 !important;
}
@media (prefers-reduced-motion:reduce) {
  .page-flying-out,.page-flying-in { animation:none !important; }
}


/* Reveal only the label belonging to the exact item under the pointer/focus. */
@media (min-width:901px) {
  .site-header .nav:hover .nav-label,
  .site-header .nav:focus-within .nav-label { opacity:0; transform:translateX(-8px); max-width:0; }
  .site-header .nav a:hover .nav-label,
  .site-header .nav a:focus-visible .nav-label { opacity:1; transform:translateX(0); max-width:110px; }
  .site-header .nav a:hover,
  .site-header .nav a:focus-visible { width:100%; }
}
@media (max-width:900px) {
  .site-header .nav:hover .nav-label,
  .site-header .nav:focus-within .nav-label,
  .site-header .nav.open .nav-label { opacity:0; max-width:0; transform:translateX(-7px); }
  .site-header .nav a:hover .nav-label,
  .site-header .nav a:focus-visible .nav-label,
  .site-header .nav.open a:focus-visible .nav-label { opacity:1; max-width:100px; transform:translateX(0); }
}


/* Clean cinematic chrome: remove the horizontal header strip and transition sheet. */
.site-header {
  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
.site-header::before, .site-header::after { display:none !important; }
.page-transition { display:none !important; }
/* The fixed scroll-film is the only background layer; blur it independently from foreground content. */
#bg-canvas.site-background-video {
  filter: blur(var(--scroll-bg-blur, 0px)) brightness(.43) saturate(.72) !important;
  transform: scale(1.045);
  transform-origin:center center;
  transition: filter .12s linear;
  will-change:filter;
}
body::before {
  pointer-events:none !important;
}
/* Keep section content crisp and above the cinematic background film. */
main, main > section, .site-header .brand, .site-header .nav {
  position:relative;
}
main { z-index:2 !important; }
.site-header { z-index:2147483000 !important; }
.site-header .nav { z-index:2147483001 !important; }
@media (prefers-reduced-motion: reduce) {
  #bg-canvas.site-background-video { transition:none !important; }
}


/* Remove the full-width header strip entirely; keep the brand and nav floating independently. */
.site-header {
  height:0 !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
  pointer-events:none !important;
}
.site-header .brand {
  position:fixed !important;
  top:24px !important;
  left:82px !important;
  z-index:2147483002 !important;
  pointer-events:auto !important;
}
.site-header .nav {
  pointer-events:auto !important;
}
.site-header .menu-toggle { display:none !important; }

/* Founder animation: fixed-size video plays smoothly once, then cross-fades to the original portrait. */
.founder-media{position:relative;width:100%;height:264px;overflow:hidden;background:#050505;border:1px solid #3a3020;isolation:isolate;flex:0 0 auto}
.founder-scroll-video,.founder-real-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;display:block;max-width:100%;max-height:100%}
.founder-scroll-video{z-index:1;opacity:1;will-change:opacity;filter:saturate(.95);background:#050505}
.founder-real-photo{z-index:2;opacity:0;transition:opacity 1.25s cubic-bezier(.2,.7,.2,1);object-fit:cover;padding:0;background:#050505;will-change:opacity}
.founder-media.is-finished .founder-real-photo{opacity:1}
.founder-media.is-finished .founder-scroll-video{opacity:0}
.artist-card>.founder-media{width:100%;height:264px}
@media(max-width:700px){.artist-card{grid-template-columns:1fr;gap:22px}.artist-card>.founder-media{height:min(72vw,360px);max-height:360px}.artist-card h3{font-size:30px}}
@media(prefers-reduced-motion:reduce){.founder-real-photo{transition-duration:.2s}}

/* Official OSHADA TATTOOS logo and square intro preview */
.brand-logo{display:block;flex:none}.transition-wordmark{display:flex;flex-direction:column;align-items:center;gap:12px}.transition-wordmark img{width:82px;height:82px;object-fit:contain;border-radius:50%;background:#000}.transition-wordmark b{font-size:10px;letter-spacing:.28em;color:#f4f0e8;font-weight:500}.transition-wordmark i{display:none}
/* macOS-style horizontal tattoo cards: side cards stay small, center card gently grows */
.gallery-grid{align-items:center;gap:clamp(12px,1.8vw,26px)}.gallery-item{transform-origin:50% 50%;backface-visibility:hidden;will-change:transform;transition:transform .42s cubic-bezier(.2,.75,.2,1),border-color .4s ease,box-shadow .4s ease!important}.gallery-item img{object-position:center;transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .45s ease}.gallery-item span{font-size:clamp(12px,1.1vw,17px);letter-spacing:.02em}.preview-video-square{max-width:420px}.preview-video-square video{background:#000}
@media(max-width:900px){.brand-logo{width:40px;height:40px}.preview-photo{width:min(100%,420px);height:auto;aspect-ratio:1/1}.preview-video-square video{aspect-ratio:1/1}.transition-wordmark img{width:68px;height:68px}}

/* User-requested cleanup: keep the placement intro visually clean and square. */
.scroll-cue{display:none!important}
.preview-video-square{position:relative;aspect-ratio:1/1;height:auto;width:min(100%,420px);overflow:hidden}
.preview-video-square video{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;object-position:center;filter:none}
.video-sound-toggle{position:absolute;right:12px;bottom:12px;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid rgba(198,161,91,.7);border-radius:999px;background:rgba(8,8,8,.82);color:#f4f0e8;font-size:10px;letter-spacing:.5px;cursor:pointer;backdrop-filter:blur(8px);transition:opacity .25s,background .25s}
.video-sound-toggle span{color:var(--gold);font-size:14px}
.video-sound-toggle.is-enabled{background:rgba(198,161,91,.92);color:#100d08}
.video-sound-toggle.is-enabled span{color:#100d08}


/* OS TATTOOS mobile refinement: remove crowded side rail, center the cinematic background,
   give the hero breathing room, and keep touch targets comfortably sized. */
.mobile-founder-overlay{display:none}
.contact-phone{display:block;color:var(--gold2);font-size:12px;letter-spacing:.4px;text-decoration:underline;text-underline-offset:3px;margin:3px 0 10px}
@media (max-width:700px){
  html{scroll-padding-top:76px}
  .site-header{position:absolute!important;top:0;left:0;width:100%;height:72px;padding:10px 17px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#050505a8,transparent)!important}
  .site-header .brand{align-items:flex-start;gap:2px}
  .site-header .brand-logo{width:43px;height:43px}
  .site-header .brand-sub{font-size:7px;letter-spacing:2px}
  .site-header .menu-toggle{display:flex!important;position:relative;z-index:2147483005;width:46px;height:44px;align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px solid rgba(198,161,91,.55);border-radius:10px;background:rgba(8,8,8,.78);backdrop-filter:blur(10px);cursor:pointer}
  .site-header .menu-toggle span{display:block;width:19px;height:2px;border-radius:2px;background:var(--gold2);transition:transform .25s ease,opacity .2s ease}
  .site-header .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
  .site-header .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
  .site-header .nav{position:fixed!important;top:67px!important;left:auto!important;right:12px!important;bottom:auto!important;transform:translateY(-8px)!important;width:min(245px,calc(100vw - 24px))!important;max-height:calc(100svh - 92px);overflow-y:auto;display:flex!important;flex-direction:column;align-items:stretch;gap:5px;padding:10px!important;border:1px solid rgba(198,161,91,.35)!important;border-radius:14px!important;background:rgba(8,8,8,.97)!important;backdrop-filter:blur(18px)!important;box-shadow:0 18px 45px #000b!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:opacity .22s ease,transform .22s ease,visibility .22s ease!important}
  .site-header .nav.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)!important;width:min(245px,calc(100vw - 24px))!important}
  .site-header .nav a:not(.nav-book),.site-header .nav .nav-book{width:100%;min-height:43px;height:43px;display:flex;align-items:center;gap:13px;padding:0 12px;border-radius:8px;font-size:11px;white-space:nowrap;overflow:hidden}
  .site-header .nav .nav-label,.site-header .nav:not(.open) .nav-label{opacity:1!important;max-width:150px!important;transform:none!important}
  .site-header .nav .nav-book{margin-top:4px}
  .hero{min-height:0;height:auto;min-height:100svh;padding:116px 22px 58px;align-items:center;justify-content:flex-start}
  .hero-content{width:100%!important;max-width:470px;margin:0!important;padding:0;z-index:3}
  .hero-content .eyebrow{font-size:9px;line-height:1.8;letter-spacing:1.7px;max-width:calc(100% - 70px);margin-bottom:14px}
  .hero h1{font-size:clamp(48px,13vw,76px);line-height:.92;letter-spacing:-1.7px;max-width:100%;overflow-wrap:normal}
  .hero .script-line{font-size:clamp(27px,7.5vw,39px);line-height:1.05;margin:13px 0 17px;max-width:100%}
  .hero-copy{font-size:13px;line-height:1.65;max-width:310px;margin-bottom:12px}
  .hero-actions{display:grid;grid-template-columns:1fr;gap:10px;margin:20px 0 0;max-width:340px}
  .hero-actions .button{width:100%;min-height:52px;padding:12px 15px;font-size:10px;justify-content:space-between;line-height:1.35}
  .trust-row{display:grid;grid-template-columns:1fr 1fr;gap:11px 14px;margin-top:25px;font-size:8px;line-height:1.5;letter-spacing:.5px}
  .site-background-video{object-position:center center!important;filter:blur(var(--scroll-bg-blur,0px)) brightness(.48) saturate(.78)!important;transform:scale(1.025)!important}
  #bg-canvas.site-background-video{object-position:center center!important}
  body::before{background:linear-gradient(90deg,rgba(4,4,4,.62),rgba(4,4,4,.34)),linear-gradient(0deg,rgba(4,4,4,.7),rgba(4,4,4,.2) 55%,rgba(4,4,4,.42))!important}
  .hero-shade{background:linear-gradient(90deg,rgba(4,4,4,.48),rgba(4,4,4,.24)),linear-gradient(0deg,rgba(8,8,8,.56),transparent 45%,rgba(5,5,5,.3))!important}
  .mobile-founder-overlay{display:block;position:absolute;z-index:2;right:15px;top:100px;width:64px;height:82px;object-fit:cover;object-position:center;border:1px solid rgba(224,191,123,.72);border-radius:40px;background:#080808;box-shadow:0 0 0 4px rgba(8,8,8,.45),0 8px 24px #0009;opacity:.9;pointer-events:none}
  .section{padding:58px 18px}
  .section-heading{gap:13px}
  .section-heading h2,.idea-copy h2,.booking-section h2{font-size:clamp(35px,10vw,46px);line-height:1.02}
  .section-heading>p{max-width:100%;font-size:12px;line-height:1.65}
  .style-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .style-card{min-height:190px}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:150px;gap:7px}
  .filter-row{overflow-x:auto;flex-wrap:nowrap;padding-bottom:6px;scrollbar-width:thin}
  .filter{flex:0 0 auto;min-height:38px}
  .discovery-section{gap:35px}
  .benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 9px;padding:24px 14px}
  .benefits>div{justify-content:flex-start;gap:8px}
  .benefits strong{font-size:8px;line-height:1.4}
  .booking-section{padding:54px 18px;gap:25px}
  .form-grid{grid-template-columns:1fr;gap:13px}
  .form-grid .full{grid-column:auto}
  .form-grid label{font-size:11px}
  .form-grid input,.form-grid select,.form-grid textarea{font-size:14px;min-height:46px;padding:12px}
  .form-grid textarea{min-height:110px}
  .submit-button{width:100%;min-height:50px}
  .whatsapp-card{padding:25px 18px}
  .footer-main{grid-template-columns:1fr 1fr;gap:20px 13px}
  .footer-contact{overflow-wrap:anywhere}
  .footer-contact a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}
  .footer-bottom{padding-bottom:18px;line-height:1.6}
  .site-header .nav,.site-header .nav *{transition-duration:.2s}
}
@media(max-width:380px){
  .hero{padding-left:18px;padding-right:18px}
  .hero-content .eyebrow{max-width:calc(100% - 58px);letter-spacing:1.3px}
  .hero h1{font-size:clamp(44px,12.5vw,58px)}
  .mobile-founder-overlay{width:54px;height:72px;right:12px;top:96px}
  .hero-actions .button{font-size:9px}
}
@media(prefers-reduced-motion:reduce){.mobile-founder-overlay{transition:none!important}}


/* Cleanup: prevent accidental blue text-selection blocks in the visual design. */
::selection {
  background: transparent;
  color: inherit;
}
::-moz-selection {
  background: transparent;
  color: inherit;
}

/* Hide decorative navigation glyphs; keep accessible labels and navigation behavior. */
.nav-icon {
  display: none !important;
}


/* Final mobile composition: center the founder and lion, and dock navigation horizontally to the screen bottom. */
@media (max-width:700px) {
  .site-background-video, #bg-canvas.site-background-video {
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100svh!important;
    object-fit:cover!important;
    object-position:50% 50%!important;
    transform:none!important;
  }
  .hero {
    min-height:100svh!important;
    padding-bottom:calc(100px + env(safe-area-inset-bottom))!important;
  }
  .mobile-founder-overlay { display:none!important; }

  .site-header .nav,
  .site-header .nav.open {
    position:fixed!important;
    top:auto!important;
    right:10px!important;
    bottom:calc(10px + env(safe-area-inset-bottom))!important;
    left:10px!important;
    width:auto!important;
    max-width:none!important;
    max-height:76px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-around!important;
    gap:3px!important;
    padding:7px 6px!important;
    border:1px solid rgba(198,161,91,.55)!important;
    border-radius:18px!important;
    background:rgba(5,5,5,.88)!important;
    backdrop-filter:blur(18px)!important;
    box-shadow:0 8px 28px rgba(0,0,0,.48)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    scrollbar-width:none!important;
    z-index:2147483001!important;
  }
  .site-header .nav::-webkit-scrollbar {display:none!important}
  .site-header .nav a:not(.nav-book),
  .site-header .nav .nav-book {
    flex:1 0 auto!important;
    width:auto!important;
    min-width:40px!important;
    height:48px!important;
    min-height:48px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
    padding:4px 7px!important;
    margin:0!important;
    border-radius:11px!important;
    font-size:9px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }
  .site-header .nav .nav-label {
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    max-width:none!important;
    transform:none!important;
    font-size:8px!important;
    letter-spacing:.3px!important;
  }
  .site-header .menu-toggle {display:none!important}
  .site-header .brand {top:12px!important;left:16px!important}
  .site-header .brand-logo {width:38px!important;height:38px!important}
  body {padding-bottom:calc(82px + env(safe-area-inset-bottom))!important}
}
@media(max-width:380px) {
  .site-header .nav a:not(.nav-book), .site-header .nav .nav-book {
    padding-left:5px!important;padding-right:5px!important;min-width:36px!important;
  }
  .site-header .nav .nav-label {font-size:7px!important}
}