/* ============================================================
   Joy Studio — design tokens & global styles
   ============================================================ */
:root{
  --bg:#F7F4EE;        /* warm cream canvas */
  --surface:#FFFFFF;
  --surface-2:#FBF8F3;
  --text:#1C1A1A;      /* warm charcoal */
  --muted:#6E6663;
  --muted-2:#938984;
  --primary:#CE1A29;   /* Joy Studio red */
  --primary-d:#B3141F;
  --secondary:#9E1620; /* deep maroon */
  --accent:#E0B33A;    /* gold sparkle */
  --ink:#231717;       /* dark sections */
  --ink-2:#1A1111;
  --border:#ECE3DE;
  --border-2:#E2D7D0;
  --shadow-sm:0 1px 2px rgba(40,20,15,.06), 0 2px 8px rgba(40,20,15,.05);
  --shadow:0 4px 16px rgba(40,20,15,.08), 0 12px 32px rgba(40,20,15,.07);
  --shadow-lg:0 12px 40px rgba(40,20,15,.16), 0 30px 80px rgba(40,20,15,.14);
  --maxw:1240px;
  --r:14px;
  --r-lg:22px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --serif:"Bodoni Moda", Georgia, serif;
  --sans:"Hanken Grotesk", -apple-system, system-ui, sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--sans);font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
::selection{background:var(--primary);color:#fff;}
:focus-visible{outline:2.5px solid var(--primary);outline-offset:3px;border-radius:3px;}

/* ---- type ---- */
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.08;letter-spacing:-.01em;}
.serif{font-family:var(--serif);}
.display{
  font-family:var(--serif);font-weight:500;line-height:1.02;
  letter-spacing:-.015em;font-optical-sizing:auto;
}
.eyebrow{
  font-size:12.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--primary);display:inline-flex;align-items:center;gap:.6em;
}
.eyebrow.on-dark{color:var(--accent);}
.eyebrow::before{content:"";width:26px;height:1.5px;background:currentColor;opacity:.7;display:inline-block;}
.eyebrow.center::after{content:"";width:26px;height:1.5px;background:currentColor;opacity:.7;display:inline-block;}
.lead{font-size:1.2rem;line-height:1.6;color:var(--muted);}

/* ---- layout ---- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
.section{padding:104px 0;}
.section.tight{padding:72px 0;}
@media(max-width:768px){.section{padding:64px 0;}.section.tight{padding:48px 0;}}

/* ---- buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font-family:var(--sans);font-weight:600;font-size:15px;letter-spacing:.01em;
  padding:14px 26px;border-radius:999px;transition:.28s var(--ease);
  white-space:nowrap;min-height:48px;
}
.btn svg{width:18px;height:18px;}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 6px 18px rgba(206,26,41,.28);}
.btn-primary:hover{background:var(--primary-d);transform:translateY(-2px);box-shadow:0 10px 26px rgba(206,26,41,.36);}
.btn-dark{background:var(--ink);color:#fff;}
.btn-dark:hover{background:#000;transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--text);border:1.5px solid var(--border-2);}
.btn-ghost:hover{border-color:var(--text);background:rgba(0,0,0,.02);}
.btn-ghost.on-dark{color:#fff;border-color:rgba(255,255,255,.32);}
.btn-ghost.on-dark:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn-wa{background:#1FA855;color:#fff;}
.btn-wa:hover{background:#178a44;transform:translateY(-2px);}
.btn-lg{padding:17px 34px;font-size:16px;min-height:56px;}
.btn-block{width:100%;}

/* ---- cards & surfaces ---- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);}

/* ---- reveal animation ---- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
.reveal.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}

/* image kenburns / hover */
.imgzoom{overflow:hidden;}
.imgzoom img{transition:transform 1.1s var(--ease);width:100%;height:100%;object-fit:cover;}
.imgzoom:hover img{transform:scale(1.06);}

/* scrim helper */
.scrim-b{background:linear-gradient(to top,rgba(20,10,8,.82) 0%,rgba(20,10,8,.4) 38%,rgba(20,10,8,0) 72%);}

/* utility */
.center{text-align:center;}
.muted{color:var(--muted);}
.hairline{height:1px;background:var(--border);border:0;margin:0;}