@font-face{font-family:'Instrument Serif';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/instrument-serif-400-normal.ttf') format('truetype')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/instrument-serif-400-italic.ttf') format('truetype')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/jetbrains-mono-400.ttf') format('truetype')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/jetbrains-mono-500.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:300;font-display:swap;src:url('../fonts/manrope-300.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/manrope-400.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/manrope-500.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/manrope-600.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/manrope-700.ttf') format('truetype')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:800;font-display:swap;src:url('../fonts/manrope-800.ttf') format('truetype')}

:root{
  --yellow:#F5C518;
  --yellow-deep:#E2B000;
  --yellow-soft:#FFF1B8;
  --ink:#15130E;
  --ink-2:#2A2620;
  --paper:#F8F4EC;
  --paper-2:#EFE8D9;
  --mute:#7A7568;
  --line:rgba(21,19,14,.12);
  --shadow:0 30px 60px -30px rgba(21,19,14,.25), 0 8px 20px -10px rgba(21,19,14,.18);
  --ease-out:cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out:cubic-bezier(0.77, 0, 0.175, 1);
  --ease-fade:cubic-bezier(0.4, 0, 0.2, 1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--paper)}
body{
  font-family:'Manrope',system-ui,sans-serif;
  background:var(--paper);
  color:var(--ink);
  font-size:17px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  padding-top:72px;
}
body > :not(.nav):not(.contact-popup):not(.phone-qr-lightbox){
  transition:opacity 420ms var(--ease-fade);
}
body.is-soft-fading > :not(.nav):not(.contact-popup):not(.phone-qr-lightbox){
  opacity:0;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
.wrap{max-width:1280px;margin:0 auto;padding:0 32px}
.serif{font-family:'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-.01em}
.mono{font-family:'JetBrains Mono',monospace;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase}

.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:15px 24px;
  border-radius:999px;
  font-size:15px;
  font-weight:500;
  transition:transform 160ms var(--ease-out),background 180ms ease,color 180ms ease,border-color 180ms ease,box-shadow 180ms ease;
  will-change:transform;
}
.btn:active{transform:scale(.97)}
.btn svg{width:14px;height:14px;transition:transform 180ms var(--ease-out)}
.btn-primary{background:var(--ink);color:var(--paper)}
.btn-yellow{background:var(--yellow);color:var(--ink);font-weight:600}
.btn-ghost{border:1px solid var(--line);color:var(--ink)}

.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:opacity 420ms ease,transform 520ms var(--ease-out);
}
.reveal.in{opacity:1;transform:translateY(0)}

.whatsapp-float{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:70;
  width:66px;
  height:66px;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:#fff;
  background:#25D366;
  box-shadow:0 18px 40px rgba(21,19,14,.24), 0 0 42px rgba(37,211,102,.52);
  transition:transform .22s var(--ease-out), box-shadow .28s ease;
}
.whatsapp-float:hover{
  transform:translateY(-3px);
  box-shadow:0 22px 48px rgba(21,19,14,.3), 0 0 56px rgba(37,211,102,.58);
}
.whatsapp-float:focus-visible{outline:3px solid rgba(37,211,102,.38);outline-offset:4px}
.whatsapp-float svg{width:36px;height:36px}
.whatsapp-float::before{
  content:"1";
  position:absolute;
  top:-3px;
  right:-2px;
  width:20px;
  height:20px;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:#fff;
  background:#e53935;
  border:2px solid var(--paper);
  font-size:11px;
  font-weight:800;
  line-height:1;
}
.whatsapp-float::after{
  content:"";
  position:absolute;
  top:-5px;
  right:-4px;
  width:24px;
  height:24px;
  border-radius:999px;
  border:2px solid rgba(229,57,53,.3);
  animation:waPing 1.8s ease-out infinite;
}
@keyframes waPing{
  0%{transform:scale(.8);opacity:.8}
  80%,100%{transform:scale(1.5);opacity:0}
}

@media (hover:hover) and (pointer:fine){
  .btn-primary:hover{background:var(--yellow);color:var(--ink);transform:translateY(-2px);box-shadow:0 12px 28px -12px rgba(245,197,24,.6)}
  .btn-primary:hover svg{transform:translateX(3px)}
  .btn-yellow:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(245,197,24,.7)}
  .btn-yellow:hover svg{transform:translateX(3px)}
  .btn-ghost:hover{border-color:var(--ink);background:white;transform:translateY(-1px)}
}

@media (max-width:640px){
  .wrap{padding:0 20px}
  .whatsapp-float{
    right:16px;
    bottom:86px;
    width:60px;
    height:60px;
  }
}
