/* ==========================================================
   Café Halisi — shared foundation
   Loaded on every page. Tokens, reset, buttons, type.
   Page-specific rules live in landing.css / register.css
   ========================================================== */

:root{
  --orange:#F67A20;
  --orange-deep:#C55A0B;
  --amber:#FFC28C;
  --ink:#201611;
  --ink-2:#2E211A;
  --ink-soft:#6B5A4E;
  --paper:#FFFDFA;
  --sand:#F1E7DC;
  --line:#E7DACC;
  --leaf:#3C7A57;

  --display:'Bricolage Grotesque','Trebuchet MS',system-ui,sans-serif;
  --body:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--body);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit}

.wrap{width:min(1120px,100% - 48px);margin-inline:auto}
.section{padding:clamp(72px,9vw,124px) 0}

.eyebrow{
  display:inline-block;margin:0 0 14px;
  font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--orange);
}
.h2{
  font-family:var(--display);font-weight:800;
  font-size:clamp(30px,4.2vw,50px);line-height:1.02;letter-spacing:-.035em;margin:0;
}
.lede{margin:16px 0 0;font-size:17px;line-height:1.62;color:var(--ink-soft);max-width:56ch}

/* buttons */
.btn{
  display:inline-flex;align-items:center;gap:11px;
  height:54px;padding:0 26px;border-radius:13px;
  font-size:15px;font-weight:700;text-decoration:none;white-space:nowrap;
  transition:background .2s ease,color .2s ease,transform .15s ease,box-shadow .2s ease,border-color .2s ease;
}
.btn i{font-size:13px;transition:transform .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn:hover i{transform:translateX(4px)}
.btn--primary{background:var(--orange);color:#fff;box-shadow:0 14px 30px -14px rgba(246,122,32,.9)}
.btn--primary:hover{background:var(--orange-deep)}
.btn--ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.34)}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn--ghost:hover i{transform:none}
.btn--ink{background:var(--ink);color:#fff}
.btn--ink:hover{background:#3A2A20}
.btn--paper{background:var(--paper);color:var(--ink);box-shadow:0 14px 30px -16px rgba(32,22,17,.55)}

a.skip{position:absolute;left:-9999px;top:0;z-index:99;background:var(--ink);color:#fff;padding:12px 18px;border-radius:0 0 10px 0}
a.skip:focus{left:0}

:focus-visible{outline:2.5px solid var(--orange);outline-offset:3px;border-radius:4px}

/* the hidden attribute must beat any display rule below it */
[hidden]{display:none!important}

/* honeypot — off-screen, never announced */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* scroll reveal */
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}
[data-reveal].is-in{opacity:1;transform:none}

@media (max-width:960px){ .wrap{width:min(1120px,100% - 36px)} }
@media (max-width:600px){ .wrap{width:min(1120px,100% - 32px)} }

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  [data-reveal]{opacity:1;transform:none}
  .btn:hover{transform:none}
}
