/* ================================================================
   MIM STUDIO — Main Stylesheet
   Photography & Video Studio · Bavaro, Punta Cana · Dominican Republic
================================================================ */
:root{
  --bg:#060608; --bg2:#0c0c12; --bg3:#111119; --bg4:#16161f;
  --gold:#C9A84C; --gold-l:#E8C96B; --gold-d:#9A7A2E; --gold-xl:#F0DFA0;
  --gold-pale:rgba(201,168,76,.07); --gold-border:rgba(201,168,76,.22);
  --gold-glow:0 0 32px rgba(201,168,76,.45);
  --w:#F0EDE8; --wd:rgba(240,237,232,.6); --wf:rgba(240,237,232,.06); --wb:rgba(240,237,232,.08);
  --green:#22D45E; --blue:#5BB8F5; --red:#E85555; --orange:#F5A623;
  --serif:'Cormorant Garamond',serif; --sans:'Montserrat',sans-serif;
  --max:1300px; --rad:0;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--w);font-family:var(--sans);font-weight:300;overflow-x:hidden;cursor:none}
::-webkit-scrollbar{width:3px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--gold-border);border-radius:2px}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button{cursor:none;font-family:var(--sans)}

/* ── CURSOR ─────────────────────────────────────────── */
.cur{position:fixed;width:7px;height:7px;background:var(--gold);border-radius:50%;
  pointer-events:none;z-index:9999;top:0;left:0;transition:transform .04s;will-change:transform}
.cur-r{position:fixed;width:28px;height:28px;border:1px solid rgba(201,168,76,.4);border-radius:50%;
  pointer-events:none;z-index:9998;top:0;left:0;transition:width .18s,height .18s,border-color .18s,top .08s,left .08s;will-change:transform}
.cur.hov{transform:scale(2.4);background:transparent;border:1px solid var(--gold)}
.cur-r.hov{width:0;height:0}

/* ── NAV ────────────────────────────────────────────── */
#nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:0 2.5rem;height:70px;
  display:flex;align-items:center;justify-content:space-between;
  transition:background .4s,backdrop-filter .4s,border-bottom .4s}
#nav.scrolled{background:rgba(6,6,8,.93);backdrop-filter:blur(20px);border-bottom:1px solid var(--gold-border)}
.nav-logo{display:flex;align-items:center;gap:.7rem}
.nav-logo img{height:36px;width:auto;filter:drop-shadow(0 0 10px rgba(201,168,76,.45))}
.nav-brand{font-family:var(--sans);font-weight:800;font-size:.75rem;letter-spacing:.38em;color:var(--gold)}
.nav-links{display:flex;gap:1.8rem;list-style:none}
.nav-links a{font-size:.6rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--wd);transition:color .2s;position:relative}
.nav-links a::after{content:'';position:absolute;bottom:-3px;left:0;width:0;height:1px;
  background:var(--gold);transition:width .25s}
.nav-links a:hover{color:var(--gold)}
.nav-links a:hover::after{width:100%}
.nav-cta{display:flex;align-items:center;gap:.8rem}
.nav-portal-btn{padding:.42rem 1rem;border:1px solid var(--gold-border);color:var(--gold);
  font-size:.58rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  cursor:none;transition:.2s;background:transparent}
.nav-portal-btn:hover{background:var(--gold-pale)}
.nav-book-btn{padding:.42rem 1.1rem;background:var(--gold);color:var(--bg);
  font-size:.58rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;cursor:none;
  clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px));
  transition:box-shadow .25s}
.nav-book-btn:hover{box-shadow:var(--gold-glow)}
.nav-hamburger{display:none;flex-direction:column;gap:4px;cursor:none;padding:.3rem;
  background:none;border:none}
.nav-hamburger span{width:22px;height:1px;background:var(--gold);transition:.3s}

/* ── MOBILE DRAWER ──────────────────────────────────── */
.mob-drawer{position:fixed;top:0;right:-100%;width:min(320px,80vw);height:100vh;
  background:var(--bg2);border-left:1px solid var(--gold-border);z-index:2000;
  transition:right .38s cubic-bezier(.22,1,.36,1);padding:5rem 2rem 2rem;
  display:flex;flex-direction:column;gap:1.2rem;overflow-y:auto}
.mob-drawer.open{right:0}
.mob-drawer a{font-size:.72rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--wd);padding:.6rem 0;border-bottom:1px solid var(--wb);transition:color .2s}
.mob-drawer a:hover{color:var(--gold)}
.mob-close{position:absolute;top:1.2rem;right:1.5rem;font-size:1.4rem;cursor:none;
  background:none;border:none;color:var(--wd)}

/* ── SECTIONS ───────────────────────────────────────── */
.section{padding:6rem 2.5rem;position:relative}
.section-inner{max-width:var(--max);margin:0 auto}
.section-tag{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1.2rem}
.section-tag::before,.section-tag::after{content:'';height:1px;background:var(--gold);opacity:.4}
.section-tag::before{width:30px}.section-tag::after{width:15px}
.section-tag span{font-size:.55rem;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.section-title{font-family:var(--serif);font-size:clamp(2.5rem,5vw,4rem);font-weight:700;line-height:1;margin-bottom:.6rem}
.section-title em{color:var(--gold);font-style:italic}
.section-sub{font-size:.82rem;color:var(--wd);max-width:520px;line-height:1.9}
.divider{width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--gold-border),transparent)}

/* ── REVEAL ─────────────────────────────────────────── */
.rev{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.rev.in{opacity:1;transform:translateY(0)}
.rev.fl{transform:translateX(-28px)}.rev.fl.in{transform:translateX(0)}
.rev.fr{transform:translateX(28px)}.rev.fr.in{transform:translateX(0)}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}
.d4{transition-delay:.4s}.d5{transition-delay:.5s}

/* ── BUTTONS ────────────────────────────────────────── */
.btn-gold{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 2.2rem;
  background:linear-gradient(135deg,var(--gold-l),var(--gold));color:var(--bg);
  font-family:var(--sans);font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  cursor:none;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
  transition:box-shadow .3s,transform .2s;border:none}
.btn-gold:hover{box-shadow:var(--gold-glow);transform:translateY(-2px)}
.btn-outline{display:inline-flex;align-items:center;gap:.5rem;padding:.82rem 2rem;
  border:1px solid var(--gold-border);color:var(--gold);font-family:var(--sans);
  font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  cursor:none;transition:.25s;background:transparent}
.btn-outline:hover{background:var(--gold-pale);border-color:rgba(201,168,76,.5)}

/* ── TOAST ──────────────────────────────────────────── */
.toast{position:fixed;top:1.2rem;right:1.2rem;z-index:9999;padding:.85rem 1.5rem;
  background:var(--bg2);border:1px solid var(--gold-border);
  display:flex;align-items:center;gap:.7rem;
  transform:translateX(130%);transition:transform .38s cubic-bezier(.22,1,.36,1);
  max-width:320px;min-width:240px}
.toast.show{transform:translateX(0)}
.t-icon{font-size:.9rem}
.t-title{display:block;font-size:.72rem;font-weight:600;color:var(--w)}
.t-msg{font-size:.62rem;color:var(--wd)}

/* ── FLOATING BUTTONS ───────────────────────────────── */
.float-wa{position:fixed;bottom:1.8rem;left:1.8rem;z-index:900;
  display:flex;align-items:center;gap:.5rem;padding:.65rem 1.2rem;
  background:#25D366;color:#fff;font-family:var(--sans);font-size:.62rem;
  font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:none;
  box-shadow:0 4px 20px rgba(37,211,102,.35);transition:.25s}
.float-wa:hover{box-shadow:0 6px 28px rgba(37,211,102,.5);transform:translateY(-2px)}
.float-call{position:fixed;bottom:1.8rem;right:1.8rem;z-index:900;
  width:52px;height:52px;background:var(--gold);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;
  cursor:none;box-shadow:0 4px 20px rgba(201,168,76,.4);transition:.25s;border:none}
.float-call:hover{box-shadow:var(--gold-glow);transform:translateY(-2px)}
.float-call::before{content:'';position:absolute;border-radius:50%;
  border:2px solid rgba(201,168,76,.35);width:70px;height:70px;
  animation:callpulse 2s ease-out infinite}
@keyframes callpulse{0%{transform:scale(.7);opacity:.8}100%{transform:scale(1.35);opacity:0}}

/* ── FORM ELEMENTS ──────────────────────────────────── */
.form-group{margin-bottom:.9rem}
.form-label{display:block;font-size:.54rem;font-weight:600;letter-spacing:.24em;
  text-transform:uppercase;color:var(--wd);margin-bottom:.35rem}
.form-input,.form-select,.form-textarea{width:100%;background:var(--wf);
  border:1px solid var(--wb);color:var(--w);padding:.68rem 1rem;
  font-family:var(--sans);font-size:.8rem;font-weight:300;outline:none;
  transition:border-color .2s;resize:vertical}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:rgba(201,168,76,.4)}
.form-select option{background:var(--bg2)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}

/* ── PAGE HERO (inner pages) ────────────────────────── */
.page-hero{min-height:40vh;padding-top:70px;display:flex;align-items:center;
  position:relative;overflow:hidden}
.page-hero-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 50%,rgba(201,168,76,.06),transparent)}
.page-hero-grid{position:absolute;inset:0;
  background-image:linear-gradient(rgba(201,168,76,.012) 1px,transparent 1px),
    linear-gradient(90deg,rgba(201,168,76,.012) 1px,transparent 1px);
  background-size:60px 60px}
.page-hero-inner{position:relative;z-index:2;max-width:var(--max);margin:0 auto;
  padding:4rem 2.5rem;width:100%}
.page-breadcrumb{display:flex;align-items:center;gap:.5rem;
  font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--wd);margin-bottom:1.5rem}
.page-breadcrumb a{color:var(--wd);transition:color .2s}
.page-breadcrumb a:hover{color:var(--gold)}
.page-breadcrumb span{color:var(--gold)}

/* ── FOOTER ─────────────────────────────────────────── */
footer{background:var(--bg2);border-top:1px solid var(--gold-border);padding:3rem 2.5rem 1.5rem}
.footer-inner{max-width:var(--max);margin:0 auto}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:3rem;margin-bottom:2.5rem}
.footer-logo img{height:42px;margin-bottom:.8rem;filter:drop-shadow(0 0 8px rgba(201,168,76,.3))}
.footer-brand{font-family:var(--sans);font-weight:800;font-size:.78rem;letter-spacing:.35em;color:var(--gold);margin-bottom:.3rem}
.footer-desc{font-size:.65rem;color:var(--wd);line-height:1.75;margin-bottom:1rem}
.footer-col-title{font-size:.54rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:.45rem}
.footer-links a{font-size:.65rem;color:var(--wd);transition:color .2s}
.footer-links a:hover{color:var(--gold)}
.footer-soc{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.8rem}
.footer-soc a{font-size:.58rem;color:var(--wd);padding:.3rem .7rem;
  border:1px solid var(--wb);transition:.2s}
.footer-soc a:hover{border-color:var(--gold-border);color:var(--gold)}
.footer-bottom{border-top:1px solid var(--wb);padding-top:1.2rem;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem}
.footer-copy{font-size:.6rem;color:rgba(240,237,232,.25)}
.footer-seo-text{display:none}

/* ── RESPONSIVE ─────────────────────────────────────── */
@media(max-width:1100px){.footer-top{grid-template-columns:1fr 1fr}}
@media(max-width:900px){
  .nav-links,.nav-cta{display:none}
  .nav-hamburger{display:flex}
  .section{padding:4rem 1.5rem}
  .footer-top{grid-template-columns:1fr 1fr}
  .form-row{grid-template-columns:1fr}
}
@media(max-width:600px){
  .section{padding:3rem 1.2rem}
  .footer-top{grid-template-columns:1fr}
  .page-hero-inner{padding:3rem 1.2rem}
}