/* Beauty Lounge by Tiyani · Cinematic layer (loads after styles.css, every page) */

body.cine{background:var(--bg)}
body.cine nav{background:rgba(251,249,244,.62);border-bottom:1px solid transparent;transition:background .5s,border-color .5s,box-shadow .5s}
body.cine nav.scrolled{background:rgba(251,249,244,.94);border-color:var(--line)}
body.cine .navlinks .book{border-radius:999px;padding:12px 26px}
body.cine .logo{transition:letter-spacing .6s}
body.cine .logo:hover{letter-spacing:4px}
@media(hover:hover) and (pointer:fine){body.cine,body.cine a,body.cine button,body.cine select,body.cine input{cursor:none}}

/* ---- Preloader ---- */
.loader{position:fixed;inset:0;z-index:200;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:clip-path 1.1s cubic-bezier(.77,0,.18,1) .1s,visibility 0s 1.3s;clip-path:inset(0 0 0 0)}
body:not(.loading) .loader{clip-path:inset(0 0 100% 0);visibility:hidden}
.loader-in{text-align:center;transform:translateY(-10px)}
.loader-mark{width:64px;height:64px;border:1px solid var(--gold);border-radius:50%;margin:0 auto 26px;font-family:'Cormorant Garamond',serif;font-size:34px;color:var(--gold-deep);display:flex;align-items:center;justify-content:center;animation:pulse 2.2s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(184,150,58,.25)}50%{box-shadow:0 0 0 14px rgba(184,150,58,0)}}
.loader-word{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(22px,3vw,34px);letter-spacing:.32em;padding-left:.32em;color:var(--ink)}
.loader-by{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--gold-deep);font-size:18px;margin-top:6px}
.loader-bar{width:160px;height:1px;background:var(--line);margin:30px auto 0;overflow:hidden}
.loader-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--gold-deep));animation:bar 1.6s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes bar{to{width:100%}}
body.loading{overflow:hidden}
body.loading .cine-title,body.loading .cine-by,body.loading .cine-line,body.loading .cine-actions,body.loading .cine-meta,body.loading .cine-seal,body.loading .cine-pre,body.loading .cine-rule{animation-play-state:paused}

/* ---- Custom cursor ---- */
.cursor{position:fixed;left:0;top:0;z-index:300;pointer-events:none;mix-blend-mode:multiply;display:none}
@media(hover:hover) and (pointer:fine){.cursor{display:block}}
.cursor-dot{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--gold-deep);transform:translate(-50%,-50%);transition:opacity .25s}
.cursor-ring{position:absolute;width:36px;height:36px;border-radius:50%;border:1px solid rgba(140,109,31,.7);transform:translate(-50%,-50%);transition:width .35s cubic-bezier(.2,.7,.2,1),height .35s cubic-bezier(.2,.7,.2,1),background .35s,border-color .35s}
.cursor-label{position:absolute;transform:translate(-50%,-50%);font-size:9px;letter-spacing:2.5px;text-transform:uppercase;color:#fff;opacity:0;transition:opacity .3s;white-space:nowrap}
.cursor.is-link .cursor-ring{width:56px;height:56px;background:rgba(184,150,58,.18);border-color:transparent}
.cursor.is-view .cursor-ring{width:84px;height:84px;background:rgba(140,109,31,.85);border-color:transparent}
.cursor.is-view .cursor-dot{opacity:0}
.cursor.is-view .cursor-label{opacity:1}
.cursor.is-hidden{opacity:0}
/* Cursor on dark bands: multiply can only darken, so the gold cursor vanishes on the dark ground.
   cinema.js adds .on-dark while the pointer is over a dark section (or the nav while it is over a hero). */
.cursor.on-dark{mix-blend-mode:normal}
.cursor.on-dark .cursor-dot{background:#e8cd74}
.cursor.on-dark .cursor-ring{border-color:rgba(232,205,116,.75)}
.cursor.on-dark.is-link .cursor-ring{background:rgba(232,205,116,.22);border-color:transparent}
.cursor.on-dark.is-view .cursor-ring{background:rgba(232,205,116,.9);border-color:transparent}
.cursor.on-dark.is-view .cursor-label{color:#221d15}

/* ---- Scroll progress ---- */
.progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:120;background:linear-gradient(90deg,var(--gold),var(--gold-deep));transition:width .1s linear}

/* ---- Film grain ---- */
.grain{position:fixed;inset:-50%;width:200%;height:200%;z-index:90;pointer-events:none;opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-size:300px 300px;animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-2%,1%)}40%{transform:translate(1%,-2%)}60%{transform:translate(-1%,2%)}80%{transform:translate(2%,1%)}100%{transform:translate(0,0)}}

/* ---- Shared type ---- */
.cine-h2{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(40px,5.4vw,70px);line-height:1.02;letter-spacing:-.005em;margin-bottom:24px}
.cine-h2 em{font-style:italic;font-weight:300;color:var(--gold-deep)}
.cine-h2.light,.lead.light{color:#f6efe1}
.cine-h2.light em{color:#e8cd74}
.lead.light{opacity:.8}
.chapter{display:flex;align-items:center;gap:14px;font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--gold-deep);margin-bottom:22px;font-weight:400}
.chapter span{font-family:'Cormorant Garamond',serif;font-size:15px;letter-spacing:1px;color:var(--gold);padding-right:14px;border-right:1px solid var(--gold);line-height:1}
.chapter.center{justify-content:center}
.chapter.light{color:#e8cd74}
.chapter.light span{color:#e8cd74;border-color:rgba(232,205,116,.6)}
.link-gold{color:var(--gold-deep);letter-spacing:2.5px;text-transform:uppercase;font-size:12px;font-weight:400;padding-bottom:4px;position:relative;transition:.3s;background:none;border:0;font-family:'Jost',sans-serif;cursor:pointer}
.link-gold::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--gold);transform-origin:right;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.link-gold:hover::after{transform:scaleX(0);transform-origin:left;animation:relink .5s .5s forwards}
@keyframes relink{to{transform:scaleX(1);transform-origin:left}}
.link-gold:hover{color:var(--ink)}
.btn{border-radius:999px;letter-spacing:3px;padding:17px 40px}
.btn.wide{width:100%;text-align:center;margin-top:10px}
.magnetic{will-change:transform;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.cine-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Image mask reveal (clip lives on the image so IntersectionObserver still sees the box) */
.mask{overflow:hidden}
.mask img{clip-path:inset(0 0 100% 0);transform:scale(1.15);transition:clip-path 1.3s cubic-bezier(.77,0,.18,1),transform 1.6s cubic-bezier(.2,.7,.2,1)}
.mask.in img,.rv.in .mask img,.rv.in.mask img{clip-path:inset(0 0 0 0);transform:scale(1)}
.gal-card:hover img{transform:scale(1.06)!important}

/* ---- Hero ---- */
.cine-hero{position:relative;height:300vh;margin-top:-83px}
.cine-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--bg)}
.cine-stage .cine-video{z-index:0;transform:scale(1.02)}
.cine-veil{position:absolute;inset:0;z-index:1;background:
  radial-gradient(ellipse at 50% 60%,rgba(251,249,244,0) 0%,rgba(251,249,244,.35) 55%,rgba(251,249,244,.85) 100%),
  linear-gradient(180deg,rgba(251,249,244,.55) 0%,rgba(251,249,244,0) 30%,rgba(251,249,244,0) 70%,var(--bg) 100%)}
.cine-stage #fx{z-index:3}
.cine-stage .blob{z-index:2;opacity:.5}
.cine-stage .b1{width:420px;height:420px;top:8%;right:8%}
.cine-stage .b2{width:320px;height:320px;bottom:6%;left:4%}
.cine-stage .b3{width:260px;height:260px;background:#f2e2b3;top:55%;right:30%;animation-delay:-9s}

.cine-copy{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 24px}
.cine-pre{font-size:11px;letter-spacing:5px;text-transform:uppercase;color:var(--gold-deep);margin-bottom:28px;opacity:0;animation:fadeup 1.4s ease .1s forwards}
.cine-title{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(40px,6.4vw,100px);line-height:.95;white-space:nowrap;letter-spacing:.42em;padding-left:.42em;color:var(--ink);opacity:0;
  animation:trackin 2.4s cubic-bezier(.16,.84,.3,1) .2s forwards}
@keyframes trackin{0%{opacity:0;letter-spacing:.9em;padding-left:.9em;filter:blur(8px)}100%{opacity:1;letter-spacing:.16em;padding-left:.16em;filter:blur(0)}}
.cine-by{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:300;font-size:clamp(20px,2.4vw,32px);color:var(--gold-deep);margin-top:10px;letter-spacing:1px;opacity:0;animation:fadeup 1.4s ease 1.3s forwards}
.cine-rule{display:flex;align-items:center;gap:14px;margin-top:30px;opacity:0;animation:fadeup 1.4s ease 1.6s forwards}
.cine-rule i{display:block;width:70px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.cine-rule i:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.cine-rule b{color:var(--gold);font-size:11px;font-weight:400}
.cine-line{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(13px,1.2vw,16px);letter-spacing:5px;text-transform:uppercase;color:var(--muted);margin-top:26px;opacity:0;animation:fadeup 1.4s ease 1.8s forwards}
.cine-actions{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:44px;opacity:0;animation:fadeup 1.4s ease 2.1s forwards}
@keyframes fadeup{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cine-meta{position:absolute;left:36px;bottom:36px;z-index:4;display:flex;gap:12px;align-items:center;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);opacity:0;animation:fadeup 1.4s ease 2.4s forwards}
.cine-meta .stars{font-size:12px;letter-spacing:3px}
.cine-seal{position:absolute;right:36px;bottom:26px;z-index:4;width:110px;height:110px;display:flex;align-items:center;justify-content:center;opacity:0;animation:fadeup 1.4s ease 2.4s forwards}
.cine-seal svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 18s linear infinite;fill:var(--gold-deep);font-family:'Jost',sans-serif;font-size:10.5px;letter-spacing:2.6px;text-transform:uppercase}
.cine-seal span{width:40px;height:40px;border:1px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold-deep);font-size:14px;transition:.4s}
.cine-seal:hover span{background:var(--gold);color:#fff}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---- Ticker ---- */
.ticker{position:relative;z-index:5;overflow:hidden;border-block:1px solid var(--line);padding:16px 0;background:var(--bg)}
.ticker-track{display:inline-flex;white-space:nowrap;animation:tick 40s linear infinite;font-family:'Cormorant Garamond',serif;font-size:20px;letter-spacing:3px;text-transform:uppercase;color:var(--ink);font-weight:400}
.ticker span{padding:0 28px;opacity:.75}
.ticker i{color:var(--gold);font-style:normal;font-size:12px;line-height:2}
@keyframes tick{to{transform:translateX(-50%)}}

/* ---- Full-bleed video sections ---- */
.cine-story,.cine-bridal{position:relative;overflow:hidden;padding:150px 0}
.cine-bg{position:absolute;inset:-12% 0;z-index:0;will-change:transform}
.cine-wash{position:absolute;inset:0;background:linear-gradient(90deg,rgba(251,249,244,.97) 0%,rgba(251,249,244,.9) 45%,rgba(251,249,244,.6) 100%)}
.cine-wash.dark{background:linear-gradient(180deg,rgba(34,29,21,.84),rgba(34,29,21,.72) 50%,rgba(34,29,21,.9))}
.cine-story .wrap,.cine-bridal .wrap{position:relative;z-index:2}

/* Story */
.story-grid{display:grid;grid-template-columns:400px 1fr;gap:100px;align-items:center}
.portrait-gold{position:relative}
.portrait-gold .portrait-frame{width:100%;margin:0}
.portrait-gold .portrait-frame::before{inset:-20px -20px 20px 20px;border-color:var(--gold)}
.portrait-gold .portrait-frame img{box-shadow:var(--shadow);filter:saturate(.95)}
.portrait-cap{margin-top:34px;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);text-align:center}
.portrait-stamp{position:absolute;right:-34px;top:-30px;width:112px;height:112px;border-radius:50%;background:var(--dark);color:#f4efe2;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 20px 40px rgba(34,29,21,.25);z-index:3;transform:rotate(-8deg);border:1px solid rgba(232,205,116,.5)}
.portrait-stamp b{font-family:'Cormorant Garamond',serif;font-size:34px;font-weight:400;color:#e8cd74;line-height:1}
.portrait-stamp span{font-size:9px;letter-spacing:2px;text-transform:uppercase;text-align:center;margin-top:6px;color:#cfc4aa;line-height:1.4}
.story-copy p{font-size:17px;color:var(--ink);opacity:.82;margin-bottom:18px;line-height:1.85}
.story-facts{display:flex;flex-wrap:wrap;gap:30px 34px;margin-top:38px;padding-top:30px;border-top:1px solid var(--line)}
.story-facts b{display:block;font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:400;color:var(--gold-deep);line-height:1}
.story-facts span{display:block;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-top:8px}

/* ---- Gallery drift ---- */
.cine-gallery{padding:130px 0 120px;overflow:hidden;background:var(--bg)}
.gal-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:60px}
.gal-head .cine-h2{margin-bottom:0}
.gal-drift{display:flex;gap:22px;padding:0 max(24px,calc((100vw - 1140px)/2));will-change:transform}
.gal-card{position:relative;flex:0 0 auto;margin:0;overflow:hidden;background:var(--cream)}
.gal-card.tall{width:300px;height:400px}
.gal-card.wide{width:520px;height:400px}
.gal-card img{width:100%;height:100%;object-fit:cover;transition:clip-path 1.3s cubic-bezier(.77,0,.18,1),transform 1.6s cubic-bezier(.2,.7,.2,1),filter .8s}
.gal-card:hover img{transform:scale(1.06);filter:saturate(1.05)}
.gal-card figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 22px 18px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:22px;color:#fff;background:linear-gradient(transparent,rgba(34,29,21,.7));opacity:0;transform:translateY(10px);transition:.6s}
.gal-card:hover figcaption{opacity:1;transform:none}
.gal-card::after{content:"";position:absolute;inset:12px;border:1px solid rgba(255,255,255,.35);pointer-events:none;opacity:0;transition:.6s}
.gal-card:hover::after{opacity:1}
/* Swipe hint under the gallery strips. Built by cinema.js, mobile only (see the max-width:1000px block). */
.gal-swipe{display:none}
@keyframes swipenudge{0%,100%{transform:translateX(0);opacity:.5}50%{transform:translateX(7px);opacity:1}}

/* ---- Menu ---- */
.cine-menu{padding:140px 0;position:relative;background:var(--bg)}
.cine-menu::before{content:"";position:absolute;width:560px;height:560px;border-radius:50%;background:#f3e6c4;filter:blur(90px);opacity:.55;top:-120px;left:-160px;pointer-events:none}
.cine-menu::after{content:"";position:absolute;width:460px;height:460px;border-radius:50%;background:#f7ecd0;filter:blur(90px);opacity:.55;bottom:-120px;right:-120px;pointer-events:none}
.cine-menu .wrap{position:relative;z-index:1}
.menu-cols{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:76px}
.menu-col{background:rgba(255,255,255,.6);border:1px solid var(--line);padding:56px 50px 44px;position:relative;backdrop-filter:blur(6px);box-shadow:0 30px 70px rgba(140,109,31,.08)}
.menu-corner{position:absolute;width:26px;height:26px;border-color:var(--gold);border-style:solid;border-width:0;pointer-events:none}
.menu-corner.tl{top:14px;left:14px;border-top-width:1px;border-left-width:1px}
.menu-corner.br{bottom:14px;right:14px;border-bottom-width:1px;border-right-width:1px}
.menu-head{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:44px;text-align:center;color:var(--ink);margin-bottom:30px;position:relative;letter-spacing:1px}
.menu-head::after{content:"";display:block;width:44px;height:1px;background:linear-gradient(90deg,var(--gold),var(--gold-deep));margin:16px auto 0}
.menu-list{list-style:none}
.menu-list li{display:flex;align-items:baseline;gap:10px;padding:14px 10px;margin:0 -10px;font-size:16px;border-radius:4px;transition:background .4s}
.menu-list li:hover{background:rgba(184,150,58,.08)}
.menu-list .nm{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:500;color:var(--ink);white-space:nowrap;transition:color .3s}
.menu-list li:hover .nm{color:var(--gold-deep)}
.menu-list .nm small{font-family:'Jost',sans-serif;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-left:8px;font-weight:300;vertical-align:middle}
.sig-row .nm small{color:var(--gold-deep);border:1px solid var(--gold);padding:2px 7px;border-radius:999px}
.menu-list .ld{flex:1;border-bottom:1px dotted rgba(184,150,58,.7);transform:translateY(-5px);min-width:24px}
.menu-list .dur{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.menu-list .pr{font-family:'Cormorant Garamond',serif;font-size:21px;font-weight:500;color:var(--gold-deep);white-space:nowrap;min-width:84px;text-align:right}
.menu-foot{margin-top:60px;display:flex;gap:34px;justify-content:center;align-items:center;flex-wrap:wrap}

/* ---- Bridal ---- */
.cine-bridal{color:#f6efe1}
.bridal-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:76px;position:relative}
.bridal-steps::before{content:"";position:absolute;left:8%;right:8%;top:22px;height:1px;background:linear-gradient(90deg,transparent,rgba(232,205,116,.6),transparent)}
.bridal-steps li{text-align:center;padding:0 16px}
.bridal-steps .num{display:inline-block;font-family:'Cormorant Garamond',serif;font-size:14px;letter-spacing:4px;color:#e8cd74;background:var(--dark);padding:12px 18px;border:1px solid rgba(232,205,116,.5);position:relative;z-index:1;transition:.5s}
.bridal-steps li:hover .num{background:#e8cd74;color:var(--dark)}
.bridal-steps h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:32px;margin:28px 0 10px}
.bridal-steps p{font-size:15px;color:#cfc4aa;line-height:1.8}
.btn.light{background:#f6efe1;color:var(--ink)}

/* ---- Client love ---- */
.cine-love{padding:140px 0;background:linear-gradient(180deg,var(--bg),var(--cream) 50%,var(--bg))}
.love-score{flex-wrap:wrap;font-family:'Cormorant Garamond',serif;font-size:clamp(24px,3vw,34px);font-weight:400;color:var(--ink);display:flex;gap:16px;align-items:center;justify-content:center;margin-top:-4px}
.love-score .stars{font-size:16px}
.gmark{width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-family:'Jost',sans-serif;font-weight:500;font-size:20px;color:#4285f4;box-shadow:0 6px 16px rgba(0,0,0,.06)}
.love-rows{margin-top:64px;display:flex;flex-direction:column;gap:22px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.love-row{overflow:hidden}
.love-track{display:flex;gap:22px;width:max-content;will-change:transform}
.rcard{flex:0 0 380px;margin:0;display:flex;flex-direction:column;background:rgba(255,255,255,.7);border:1px solid var(--line);padding:30px 30px 26px;position:relative;backdrop-filter:blur(4px);transition:border-color .4s,box-shadow .4s,transform .4s}
.rcard:hover{border-color:var(--gold);box-shadow:var(--shadow);transform:translateY(-3px)}
.rcard .stars{display:block;font-size:11px;letter-spacing:3px;margin-bottom:14px}
.rcard blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:400;font-size:21px;line-height:1.4;color:var(--ink)}
.rcard blockquote::before{content:"\201C";color:var(--gold)}
.rcard blockquote::after{content:"\201D";color:var(--gold)}
.rcard figcaption{margin-top:auto;padding-top:18px;font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--ink)}
.rcard figcaption small{font-size:10px;letter-spacing:1.5px;color:var(--muted);text-transform:none}
.cine-love .center.rv:last-child{margin-top:48px}
@media(max-width:760px){.rcard{flex-basis:290px;padding:24px 22px}.rcard blockquote{font-size:18px}}

/* ---- Visit + Book ---- */
.cine-visit{padding:140px 0 150px;background:var(--bg);position:relative;overflow:hidden}
.cine-visit::before{content:"";position:absolute;width:600px;height:600px;border-radius:50%;background:#f5e8c6;filter:blur(100px);opacity:.5;right:-200px;top:0;pointer-events:none}
.visit-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:90px;align-items:start;position:relative;z-index:1}
.visit-info .addr{font-family:'Cormorant Garamond',serif;font-size:28px;line-height:1.3;margin-bottom:28px}
.hours{border-collapse:collapse;width:100%;max-width:420px;margin-bottom:14px}
.hours td{padding:13px 0;border-bottom:1px solid var(--line);font-size:15px}
.hours td:last-child{text-align:right;color:var(--gold-deep);font-weight:400}
.open-now{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);margin-bottom:26px;display:flex;align-items:center;gap:10px;min-height:16px}
.open-now::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--line)}
.open-now.on{color:#4c7a3e}.open-now.on::before{background:#6fae5c;box-shadow:0 0 0 4px rgba(111,174,92,.18);animation:pulse 2.2s infinite}
.open-now.off::before{background:#c98a6a}
.phone{display:inline-block;font-family:'Cormorant Garamond',serif;font-size:32px;color:var(--ink);letter-spacing:1px;margin-bottom:6px;transition:.3s}
.phone:hover{color:var(--gold-deep)}
.map-frame{position:relative;margin-top:40px;padding:10px;border:1px solid var(--line);background:#fff}
.cine-visit .map{height:300px;margin:0;border:0;filter:sepia(.35) saturate(.7) contrast(.95);transition:filter .6s}
.map-frame:hover .map{filter:none}
.book-card{background:rgba(255,255,255,.78);border:1px solid var(--line);padding:58px 56px 48px;position:relative;box-shadow:0 40px 90px rgba(140,109,31,.12);backdrop-filter:blur(8px)}
.book-card .lead{margin-bottom:34px}
.book-card .formgrid{position:relative;z-index:1;gap:22px}
.field{position:relative}
.book-card select,.book-card input{background:#fff;padding:15px 16px;border-radius:2px}
.book-card select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' fill='none' stroke='%238c6d1f' stroke-width='1.2'/></svg>");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px}
.form-note{font-size:12px;letter-spacing:1px;color:var(--muted);margin:18px 0 4px;min-height:18px;transition:color .3s}
.form-note.err{color:#a34a2a}
.form-alt{text-align:center;font-size:13px;color:var(--muted);margin-top:24px}
.form-done{text-align:center;padding:20px 0}
.done-mark{width:56px;height:56px;border:1px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 22px;color:var(--gold-deep);animation:pulse 2.2s ease-in-out infinite}
.form-done h3{font-family:'Cormorant Garamond',serif;font-size:44px;font-weight:400;margin-bottom:12px}
.form-done p{color:var(--muted);margin-bottom:28px;line-height:1.8}
.form-done .reset{display:block;margin:22px auto 0}

/* ---- Footer polish ---- */
footer.site{position:relative;overflow:hidden}
.foot-word{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(70px,14vw,220px);line-height:.8;color:rgba(232,205,116,.06);text-align:center;white-space:nowrap;letter-spacing:.02em;margin:-20px 0 30px;user-select:none;pointer-events:none}

/* ---- Floating book pill (appears after hero) ---- */
.float-book{position:fixed;right:28px;bottom:28px;z-index:80;background:var(--dark);color:#f4efe2;font-size:11px;letter-spacing:3px;text-transform:uppercase;padding:16px 26px;border-radius:999px;box-shadow:0 18px 40px rgba(34,29,21,.28);opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .5s,transform .5s;border:1px solid rgba(232,205,116,.35)}
.float-book.show{opacity:1;transform:none;pointer-events:auto}
.float-book::before{content:"✦";color:#e8cd74;margin-right:10px;font-size:10px}

/* ---- Low-power / reduced motion: still posters ---- */
body.lowpower .cine-video,body.lowpower .grain,body.lowpower #fx,body.lowpower .cursor{display:none}
body.lowpower .cine-stage{background:url(video/hero-poster.jpg) center/cover}
body.lowpower .cine-story .cine-bg{background:url(images/salon/band-lounge.jpg) center/cover}
body.lowpower .cine-bridal .cine-bg{background:url(images/salon/band-wedding.jpg) center/cover}
body.lowpower .cine-hero{height:100vh}
body.lowpower,body.lowpower a{cursor:auto}
@media (prefers-reduced-motion: reduce){
  .cine-title,.cine-by,.cine-line,.cine-actions,.cine-meta,.cine-seal,.cine-pre,.cine-rule{animation:none;opacity:1;letter-spacing:.16em;padding-left:.16em}
  .cine-hero{height:100vh}
  .mask,.rv .mask{clip-path:none}.mask img{transform:none}
  .loader{display:none}
}

/* ---- Mobile pass ---- */
@media(max-width:1000px){
  .story-grid{grid-template-columns:1fr;gap:70px}
  .portrait-gold{max-width:340px;margin:0 auto}
  .portrait-stamp{right:-14px;top:-24px;width:96px;height:96px}
  .visit-grid{grid-template-columns:1fr;gap:70px}
  /* Gallery strips on touch: free scrolling, auto-drift driven by cinema.js.
     scroll-snap was 'x mandatory' and the client said it was hard to swipe; mandatory snap
     fights both a flick and the auto-drift, so it is off here on purpose. */
  /* Gutters come from margins on the end cards, not the container's padding: a scroll
     container's trailing padding is honoured inconsistently, and that is what let the last
     photo sit hard against the screen edge. Margins on flex items always hold. */
  .gal-drift{overflow-x:auto;overflow-y:hidden;scroll-snap-type:none;padding:0 0 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;transform:none!important}
  .gal-drift::-webkit-scrollbar{display:none}
  .gal-drift>.gal-card:first-child{margin-left:24px}
  .gal-drift>.gal-card:last-child{margin-right:24px}
  .gal-card{scroll-snap-align:none}
  .gal-card figcaption{opacity:1;transform:none}
  .gal-swipe{display:flex;align-items:center;gap:11px;margin:18px max(24px,calc((100vw - 1140px)/2)) 0;font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--gold-deep);transition:opacity .6s}
  .gal-swipe.gone{opacity:0;pointer-events:none}
  .gal-swipe svg{flex:0 0 auto;animation:swipenudge 1.9s ease-in-out infinite}
  .gal-swipe i{flex:1 1 auto;max-width:110px;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}
}
@media(max-width:820px){
  .menu-cols{grid-template-columns:1fr;gap:40px}
  .bridal-steps{grid-template-columns:1fr;gap:44px}
  .bridal-steps::before{display:none}
  .gal-head{flex-direction:column;align-items:flex-start;gap:20px}
}
@media(max-width:760px){
  .cine-hero{height:220vh}
  .cine-title{letter-spacing:.16em;padding-left:.16em;white-space:normal;font-size:clamp(38px,11vw,60px);animation:fadeup 1.6s ease .2s forwards}
  .cine-by{font-size:clamp(23px,6.2vw,28px);font-weight:400;margin-top:12px}
  .cine-meta{left:20px;bottom:24px}
  .cine-seal{display:none}
  .cine-story,.cine-bridal{padding:100px 0}
  .cine-menu,.cine-love,.cine-visit,.cine-gallery{padding:90px 0}
  .menu-col{padding:40px 22px 30px}
  .menu-list li{flex-wrap:wrap;row-gap:2px;padding:14px 8px;border-bottom:1px solid var(--line);margin:0 -8px}
  .menu-list li:last-child{border-bottom:0}
  .menu-list .nm{white-space:normal;flex:1 1 60%}
  .menu-list .pr{min-width:0;order:2}
  .menu-list .ld{display:none}
  .menu-list .dur{flex:1 1 100%;order:3}
  .book-card{padding:40px 24px 34px}
    .cine-visit .map{height:240px}
  .gal-card.tall{width:240px;height:320px}.gal-card.wide{width:400px;height:320px}
  .story-facts{gap:24px;flex-wrap:wrap}
  .float-book{right:16px;bottom:16px;padding:14px 20px}
  .ticker-track{font-size:16px}
}

/* ---- Book card (Fresha) ---- */
.book-steps{list-style:none;display:flex;gap:26px;margin:6px 0 30px;flex-wrap:wrap}
.book-steps li{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);letter-spacing:.5px}
.book-steps span{width:26px;height:26px;border:1px solid var(--gold);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:14px;color:var(--gold-deep)}
.book-quick{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:22px}
.book-quick span{font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);margin-right:6px}
.book-quick a{font-size:12px;letter-spacing:1px;padding:7px 14px;border:1px solid var(--line);border-radius:999px;color:var(--ink);transition:.3s;background:#fff}
.book-quick a:hover{border-color:var(--gold);color:var(--gold-deep);background:var(--gold-soft)}
.book-alt{margin-top:34px;padding-top:26px;border-top:1px solid var(--line)}
.book-alt>p{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--ink);margin-bottom:6px}
.book-alt .socialbtns{margin-top:14px}
.book-alt .form-note{margin-top:20px;line-height:1.85;font-family:'Jost',sans-serif;font-size:12.5px;color:var(--muted);letter-spacing:.3px}
.book-alt .form-note+.form-note{margin-top:10px}
.book-alt .policy-label{font-family:'Jost',sans-serif;font-size:11px;font-weight:400;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold-deep);margin:28px 0 0;line-height:1}
.book-alt .policy-label+.form-note{margin-top:14px}

/* ============================================================
   PAGE LAYER · cinematic treatment for the inner pages
   (about · bridal · gallery · contact · services)
   Nothing in here is used by index.html.
   ============================================================ */

/* ---- Dark cinematic page hero ---- */
.page-hero{position:relative;overflow:hidden;margin-top:-83px;padding:116px 0 48px;text-align:center;background:var(--dark);color:#f6efe1}
.page-hero .cine-bg{position:absolute;inset:-10% 0;z-index:0;will-change:transform}
.page-hero .cine-bg img{width:100%;height:100%;object-fit:cover;opacity:.66;filter:saturate(.62) contrast(1.04) brightness(.98)}
.page-hero .cine-wash{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(18,15,10,.9) 0%,rgba(24,20,14,.6) 38%,rgba(24,20,14,.72) 74%,#221d15 100%),
  radial-gradient(62% 58% at 50% 52%,rgba(0,0,0,0) 0%,rgba(18,15,10,.55) 100%),
  linear-gradient(0deg,rgba(125,95,26,.26),rgba(125,95,26,.26))}
.page-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;z-index:3;background:linear-gradient(90deg,transparent,rgba(232,205,116,.55),transparent)}
.page-hero .wrap{position:relative;z-index:2}
.ph-pre{font-size:11px;letter-spacing:5px;text-transform:uppercase;color:#e8cd74;margin-bottom:14px}
.ph-title{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(38px,5.6vw,72px);line-height:1.02;letter-spacing:.05em;padding-left:.05em;color:#f8f2e6;text-shadow:0 3px 34px rgba(0,0,0,.4)}
.ph-title em{font-style:italic;font-weight:300;color:#e8cd74;letter-spacing:.015em}
.ph-rule{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:18px}
.ph-rule i{display:block;width:74px;height:1px;background:linear-gradient(90deg,transparent,#e8cd74)}
.ph-rule i:last-child{background:linear-gradient(90deg,#e8cd74,transparent)}
.ph-rule b{color:#e8cd74;font-size:11px;font-weight:400}
.ph-sub{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(12px,1.1vw,14px);letter-spacing:4px;text-transform:uppercase;color:#c9bda3;margin-top:14px}
body.lowpower .page-hero .cine-bg{display:none}
body.lowpower .page-hero{background:linear-gradient(180deg,#2b2418,var(--dark))}
@media(max-width:760px){.page-hero{padding:110px 0 44px}}

/* ---- Nav sits transparent while it is over the dark hero ---- */
body.over-hero:not(.menu-open) nav{background:transparent;backdrop-filter:none;box-shadow:none}
body.over-hero:not(.menu-open) .logo{color:#f8f2e6}
body.over-hero:not(.menu-open) .logo small{color:#e8cd74}
body.over-hero:not(.menu-open) .navlinks a{color:#f2ece0}
body.over-hero:not(.menu-open) .navlinks a.active{color:#e8cd74}
body.over-hero:not(.menu-open) .navlinks a:not(.book)::after{background:#e8cd74}
body.over-hero:not(.menu-open) .burger span{background:#f2ece0}

/* ---- Dark closing band, solid ground with a warm glow ---- */
.cine-cta{position:relative;overflow:hidden;padding:132px 0;text-align:center;background:var(--dark);color:#f6efe1}
.cine-cta::before{content:"";position:absolute;width:760px;height:760px;border-radius:50%;background:rgba(184,150,58,.16);filter:blur(120px);top:-260px;left:50%;transform:translateX(-50%);pointer-events:none}
.cine-cta .wrap{position:relative;z-index:2}
.cine-cta .lead{color:#cfc4aa;margin:0 auto 40px}
.cine-cta .cta-lines{margin-top:34px;font-size:12px;letter-spacing:2.5px;text-transform:uppercase;color:#a99e86}
.cine-cta .cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
@media(max-width:760px){.cine-cta{padding:92px 0}}

/* ---- Team (about) ---- */
.cine-crew{padding:76px 0 80px;background:linear-gradient(180deg,var(--bg),var(--cream) 55%,var(--bg));position:relative}
.crew{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:26px;margin-top:70px}
.crew-card{background:rgba(255,255,255,.7);border:1px solid var(--line);padding:46px 30px 38px;text-align:center;position:relative;backdrop-filter:blur(6px);transition:border-color .5s,box-shadow .5s,transform .5s}
.crew-card:hover{border-color:var(--gold);box-shadow:0 30px 70px rgba(140,109,31,.12);transform:translateY(-4px)}
.crew-card .menu-corner{width:20px;height:20px}
.crew-av{width:104px;height:104px;border-radius:50%;margin:0 auto 22px;border:1px solid var(--gold);background:var(--cream);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:36px;color:var(--gold-deep);overflow:hidden;position:relative}
.crew-av img{width:100%;height:100%;object-fit:cover}
.crew-card h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:28px;letter-spacing:.5px}
.crew-card .role{font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-deep);margin:8px 0 14px}
.crew-card p{font-size:14px;color:var(--muted);line-height:1.8}
.crew-card.tbc .crew-av{border-style:dashed;color:var(--muted)}

/* ---- Gallery, sections of real work ---- */
.cine-grid-sec{padding:130px 0 120px;background:var(--bg)}
.gal-sec{margin-top:96px}
.gal-sec:first-of-type{margin-top:64px}
.gal-sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.gal-sec-head h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(28px,3.2vw,40px);letter-spacing:.5px}
.gal-sec-head h3 em{font-style:italic;color:var(--gold-deep)}
.gal-sec-head span{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);white-space:nowrap;padding-bottom:6px}
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-flow:dense;gap:18px;margin-top:26px}
.gal-grid .gal-card{width:auto;height:auto;aspect-ratio:4/5;flex:auto}
.gal-grid .gal-card.wide{grid-column:span 2;aspect-ratio:auto}
.gal-grid .gal-card img{width:100%;height:100%;object-fit:cover}
@media(max-width:1000px){.gal-grid{grid-template-columns:repeat(2,1fr);gap:14px}}
@media(max-width:600px){
  .gal-grid{grid-template-columns:1fr}
  .gal-grid .gal-card,.gal-grid .gal-card.wide{grid-column:auto;aspect-ratio:4/5}
  .gal-sec{margin-top:64px}
  .gal-sec-head{flex-direction:column;align-items:flex-start;gap:8px}
}

/* ---- Notice, quiet glass (inner pages only) ---- */
body.page .notice{background:rgba(255,255,255,.65);border:1px solid var(--line);border-left:2px solid var(--gold);padding:24px 28px;font-size:14.5px;line-height:1.8;margin-top:48px;color:var(--ink);backdrop-filter:blur(6px);letter-spacing:.2px}
body.page .notice strong{font-weight:400;color:var(--gold-deep);letter-spacing:1.5px;text-transform:uppercase;font-size:11px}
body.page .notice p{margin:0}
body.page .notice p+p{margin-top:14px}
body.page .notice h3{font-size:24px;font-weight:400;letter-spacing:.3px;color:var(--ink);margin:0 0 16px;padding-bottom:13px;border-bottom:1px solid var(--line)}

/* ---- Pill social buttons (inner pages only) ---- */
body.page .socialbtns a{border-radius:999px;padding:12px 24px;background:rgba(255,255,255,.7);transition:.35s}
body.page .cine-cta .socialbtns{justify-content:center}
body.page .cine-cta .socialbtns a{background:transparent;border-color:rgba(232,205,116,.45);color:#f6efe1}
body.page .cine-cta .socialbtns a:hover{border-color:#e8cd74;color:#e8cd74;background:rgba(232,205,116,.1)}

/* ---- Contact page ---- */
.cine-visit.page{padding:130px 0}
.visit-info .infoline{border-bottom-color:var(--line);padding:15px 0}
.visit-info .infoline b{color:var(--gold-deep)}
.book-card .socialbtns{margin-top:26px}
.enquiry-note{font-size:14px;letter-spacing:.3px;line-height:1.7;color:var(--muted);margin-top:18px}
/* Quiet "you can ask" line under a booking CTA: homepage book card, contact hours, bridal intro.
   Deliberately understated. It is a reassurance, not an offer, so no border, badge or gold. */
.by-request{font-size:12.5px;line-height:1.75;color:var(--muted);margin-top:16px;max-width:48ch}
.visit-info .by-request{font-size:14px;line-height:1.7}
.cine-book{position:relative;overflow:hidden;padding:126px 0;background:var(--dark);color:#f6efe1;text-align:center}
.cine-book::before{content:"";position:absolute;width:720px;height:720px;border-radius:50%;background:rgba(184,150,58,.15);filter:blur(120px);bottom:-300px;left:50%;transform:translateX(-50%);pointer-events:none}
.cine-book .wrap{position:relative;z-index:2}
.cine-book .lead{color:#cfc4aa;margin:0 auto 38px}
.cine-book .book-steps{justify-content:center;margin:0 auto 38px;max-width:760px}
.cine-book .book-steps li{color:#cfc4aa}
.cine-book .book-steps span{border-color:rgba(232,205,116,.6);color:#e8cd74}
.cine-book .notice{background:rgba(255,255,255,.05);border-color:rgba(232,205,116,.25);border-left-color:#e8cd74;color:#cfc4aa;text-align:left;max-width:760px;margin:44px auto 0;backdrop-filter:none}
.cine-book .notice strong{color:#e8cd74}

/* ---- Bridal packages, menu card in a single column ---- */
.menu-cols.one{grid-template-columns:1fr;max-width:780px;margin-inline:auto}
.menu-cols.one .menu-list .nm{white-space:normal}
/* dark bridal band with no photo behind it */
.cine-bridal.plain{background:var(--dark)}
.cine-bridal.plain::before{content:"";position:absolute;width:800px;height:800px;border-radius:50%;background:rgba(184,150,58,.14);filter:blur(130px);top:-300px;left:50%;transform:translateX(-50%);pointer-events:none}
.cine-bridal.plain .wrap{position:relative;z-index:2}

/* ---- Services page, cinematic price list ---- */
.cine-services{padding:120px 0 130px;position:relative;background:var(--bg)}
.cine-services::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:#f3e6c4;filter:blur(90px);opacity:.5;top:-100px;left:-150px;pointer-events:none}
.cine-services::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:#f7ecd0;filter:blur(90px);opacity:.5;bottom:-100px;right:-110px;pointer-events:none}
.cine-services .wrap{position:relative;z-index:1}
.cat-tabs{gap:10px;margin-bottom:64px}
.cat-tab{border-radius:999px;padding:13px 26px;background:rgba(255,255,255,.7);backdrop-filter:blur(6px);letter-spacing:2.5px;font-size:11px}
.cat-tab.active{box-shadow:0 12px 28px rgba(140,109,31,.18)}
.svc-cat{margin-bottom:0;background:rgba(255,255,255,.6);border:1px solid var(--line);padding:56px 54px 46px;position:relative;backdrop-filter:blur(6px);box-shadow:0 30px 70px rgba(140,109,31,.08)}
.svc-cat>h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(32px,3.6vw,46px);color:var(--ink);text-align:center;margin-bottom:0;letter-spacing:1px}
.svc-cat>h3::after{content:"";display:block;width:44px;height:1px;background:linear-gradient(90deg,var(--gold),var(--gold-deep));margin:16px auto 0}
.svc-cat>p.ds{text-align:center;margin:18px auto 6px!important;max-width:560px!important;font-size:14.5px!important}
.svc-sub{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:var(--gold-deep);font-family:'Jost',sans-serif;font-weight:400;margin:46px 0 6px;display:flex;align-items:center;gap:14px}
.svc-sub::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}
.svc-row{padding:15px 12px;margin:0 -12px;border-bottom:0;border-radius:4px;transition:background .4s}
.svc-row:hover{background:rgba(184,150,58,.08)}
.svc-top{gap:10px}
.svc-top .nm{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:500;letter-spacing:0;color:var(--ink);transition:color .3s}
.svc-row:hover .svc-top .nm{color:var(--gold-deep)}
.svc-top .leader{border-bottom:1px dotted rgba(184,150,58,.7);transform:translateY(-5px);min-width:24px}
.svc-top .pr{font-family:'Cormorant Garamond',serif;font-size:21px;font-weight:500;color:var(--gold-deep);min-width:96px;text-align:right;letter-spacing:0}
.svc-row .dur{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-top:2px}
.svc-foot{margin-top:56px;display:flex;gap:34px;justify-content:center;align-items:center;flex-wrap:wrap}

/* ---- Keep the decorative blur blobs from widening the page ---- */
.cine-menu,.cine-services,.cine-visit{overflow:hidden}

@media(max-width:760px){
  .cine-services{padding:80px 0 90px}
  .svc-cat{padding:38px 22px 30px}
  .svc-top{flex-wrap:wrap;row-gap:2px}
  .svc-top .nm{flex:1 1 60%;font-size:20px}
  .svc-top .leader{display:none}
  .svc-top .pr{min-width:0;font-size:19px}
  .svc-row{border-bottom:1px solid var(--line);border-radius:0}
  .cine-crew,.cine-grid-sec,.cine-visit.page,.cine-book{padding:90px 0}
  .crew{margin-top:44px}
}
/* ---- Story section without a background photo ---- */
.cine-story.plain{background:linear-gradient(180deg,var(--bg),var(--cream) 62%,var(--bg));padding-bottom:96px}

body.page .cine-gallery{padding:72px 0 96px}

/* ---- About: the journey timeline ---- */
.cine-journey{padding:88px 0 84px;background:var(--bg);position:relative}
.journey{position:relative;max-width:800px;margin:56px auto 0;padding-left:66px}
.journey::before{content:"";position:absolute;left:18px;top:10px;bottom:10px;width:1px;background:linear-gradient(180deg,transparent,var(--gold) 7%,var(--gold) 93%,transparent)}
.jrn{position:relative;padding-bottom:50px}
.jrn:last-child{padding-bottom:0}
.jrn .num{position:absolute;left:-66px;top:-3px;width:37px;height:37px;border-radius:50%;border:1px solid var(--gold);background:var(--bg);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:15px;color:var(--gold-deep);transition:.45s}
.jrn:hover .num{background:var(--gold);color:#fff;border-color:var(--gold)}
.jrn h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(24px,2.6vw,32px);letter-spacing:.3px;margin-bottom:9px}
.jrn p{color:var(--muted);font-size:16px;line-height:1.85}
@media(max-width:600px){
  .cine-journey{padding:86px 0}
  .journey{padding-left:48px;margin-top:44px}
  .journey::before{left:14px}
  .jrn{padding-bottom:38px}
  .jrn .num{left:-48px;width:29px;height:29px;font-size:13px}
}

/* ---- About: closing note in her words ---- */
.cine-note{padding:80px 0 72px;background:linear-gradient(180deg,var(--bg),var(--cream) 50%,var(--bg));text-align:center}
.note-quote{max-width:740px;margin:0 auto}
.note-quote .mark{font-family:'Cormorant Garamond',serif;font-size:110px;line-height:.55;color:var(--gold);opacity:.3;display:block;margin-bottom:12px}
.note-quote blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:400;font-size:clamp(21px,2.3vw,30px);line-height:1.5;color:var(--ink);margin-bottom:26px}
.note-quote p{font-size:16px;line-height:1.9;color:var(--muted);margin:0 auto 16px;max-width:620px}
.note-quote .sig{margin-top:6px}
@media(max-width:600px){.cine-note{padding:86px 0}.note-quote .mark{font-size:84px}}

/* ---- About: two-person team, portrait cards ---- */
.crew.two{grid-template-columns:repeat(2,1fr);max-width:590px;margin-inline:auto;gap:26px}
.crew-card.person{padding:0 0 26px;text-align:center;overflow:hidden}
.crew-shot{aspect-ratio:4/5;overflow:hidden;background:var(--cream)}
.crew-shot img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.crew-card.person:hover .crew-shot img{transform:scale(1.04)}
.crew-in{padding:20px 22px 0}
.crew-card.person h3{font-size:24px}
.crew-card.person .role{font-size:9.5px;margin:6px 0 11px}
.crew-in .spec{font-size:13px;line-height:1.8;color:var(--muted)}
@media(max-width:700px){.crew.two{grid-template-columns:1fr;max-width:300px;gap:22px}}
/* breathing room under the services heading now the lead line is gone */
.cine-services .cat-tabs{margin-top:50px}

/* ---- Bridal journey band with a photo behind it (bridal.html only) ---- */
.cine-bridal.shot{background:var(--dark)}
.cine-bridal.shot .cine-bg{position:absolute;inset:-12% 0;z-index:0;will-change:transform}
.cine-bridal.shot .cine-bg img{width:100%;height:100%;object-fit:cover;opacity:.5;filter:saturate(.5) contrast(1.04)}
.cine-bridal.shot .cine-wash{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(18,15,10,.84) 0%,rgba(24,20,14,.62) 42%,rgba(18,15,10,.9) 100%),
  linear-gradient(0deg,rgba(125,95,26,.2),rgba(125,95,26,.2))}
.cine-bridal.shot .wrap{position:relative;z-index:2}
body.lowpower .cine-bridal.shot .cine-bg{display:none}
/* notice that lines up with a single-column menu card */
body.page .notice.narrow{max-width:780px;margin-inline:auto}
/* full-width buttons: keep long labels on one line on narrow screens */
@media(max-width:760px){
  .btn.wide{padding:16px 20px;letter-spacing:1.8px;white-space:nowrap}
}
/* the footer word has a 70px floor that overflows below ~500px, scale it with the viewport instead */
@media(max-width:500px){.foot-word{font-size:12.5vw}}

/* ---- Compact footer on phones ---- */
@media(max-width:600px){
  footer.site{padding:44px 22px 88px}  /* bottom clears the floating Book pill */
  .foot-word{margin:-8px 0 20px}
  .fgrid{grid-template-columns:1fr 1fr;gap:24px 18px}
  .fgrid>div:nth-child(1),.fgrid>div:nth-child(2){grid-column:1/-1}
  .fgrid h3{font-size:20px;margin-bottom:10px}
  .fgrid h3 small{letter-spacing:3px}
  .fgrid p,.fgrid a{font-size:14px;margin-bottom:7px;line-height:1.55}
  .fgrid>div:nth-child(1) p{max-width:34em}
  .fhead{margin-bottom:12px}
  .copy{margin-top:26px;padding-top:18px;font-size:11.5px;letter-spacing:1px}
}
