@tailwind base;
@tailwind components;
@tailwind utilities;

:root{color-scheme:dark}

.nav-link{font-weight:600;color:rgba(255,255,255,.82);padding:.5rem .75rem;border-radius:.75rem;transition:background-color .15s ease, color .15s ease, box-shadow .15s ease}
.nav-link:hover{background-color:rgba(255,255,255,.06);color:#fff}
.nav-link:focus{outline:none;box-shadow:0 0 0 2px rgba(255,215,0,.9)}

.mobile-link{width:100%;text-align:center;font-family:Archivo Black,ui-sans-serif,system-ui;letter-spacing:.04em;text-transform:uppercase;color:#fff;font-size:1.5rem;line-height:2rem;padding:.75rem 1rem;border-radius:1rem;transition:transform .15s ease, background-color .15s ease, box-shadow .15s ease}
.mobile-link:hover{background-color:rgba(255,255,255,.07);transform:translateY(-1px)}
.mobile-link:focus{outline:none;box-shadow:0 0 0 2px rgba(255,215,0,.9)}

.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:1rem;padding:.85rem 1.1rem;font-weight:700;background-color:#FFD700;color:#1A1A1A;transition:transform .15s ease, filter .15s ease, box-shadow .15s ease}
.btn-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.btn-primary:focus{outline:none;box-shadow:0 0 0 2px rgba(255,255,255,.9), 0 0 0 4px rgba(255,215,0,.9)}
.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}

.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:1rem;padding:.85rem 1.1rem;font-weight:700;background-color:rgba(255,255,255,.06);color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.14) inset;transition:transform .15s ease, background-color .15s ease, box-shadow .15s ease}
.btn-secondary:hover{background-color:rgba(255,255,255,.09);transform:translateY(-1px);box-shadow:0 0 0 1px rgba(255,215,0,.35) inset}
.btn-secondary:focus{outline:none;box-shadow:0 0 0 2px rgba(255,215,0,.9)}
.btn-secondary:disabled{opacity:.6;cursor:not-allowed;transform:none}

.footer-link{color:rgba(255,255,255,.75);text-decoration:none;transition:color .15s ease, text-decoration-color .15s ease}
.footer-link:hover{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,215,0,.75);text-underline-offset:4px}
.footer-link:focus{outline:none;box-shadow:0 0 0 2px rgba(255,215,0,.9);border-radius:.5rem}

.legal-link{display:inline-flex;align-items:center;justify-content:center;border-radius:1rem;padding:.7rem .9rem;background-color:rgba(255,255,255,.05);color:rgba(255,255,255,.85);box-shadow:0 0 0 1px rgba(255,255,255,.12) inset;transition:transform .15s ease, background-color .15s ease, box-shadow .15s ease}
.legal-link:hover{background-color:rgba(255,255,255,.08);transform:translateY(-1px);box-shadow:0 0 0 1px rgba(255,215,0,.35) inset}
.legal-link:focus{outline:none;box-shadow:0 0 0 2px rgba(255,215,0,.9)}

.chip{display:inline-flex;align-items:center;gap:.4rem;border-radius:9999px;padding:.35rem .65rem;font-size:.85rem;line-height:1.2;background-color:rgba(255,255,255,.06);color:rgba(255,255,255,.82);box-shadow:0 0 0 1px rgba(255,255,255,.12) inset}

.service-cell{position:relative;border-radius:1rem;background-color:rgba(255,255,255,.05);box-shadow:0 0 0 1px rgba(255,255,255,.12) inset;padding:1.25rem;transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease;min-height:240px;outline:none}
.service-cell:hover{transform:translateY(-3px);background-color:rgba(255,255,255,.07);box-shadow:0 0 0 1px rgba(255,215,0,.35) inset, 0 20px 40px rgba(0,0,0,.35)}
.service-cell:focus{box-shadow:0 0 0 2px rgba(255,215,0,.9), 0 0 0 1px rgba(255,255,255,.12) inset}

.service-cell.is-expanded .details{display:block}
.service-cell:hover .details{display:block}

.reveal{opacity:0;transform:translateY(14px)}
.reveal.is-visible{opacity:1;transform:translateY(0);transition:opacity .6s ease, transform .6s ease}

.glitch-title{position:relative;display:inline-block}
.glitch-title::before,.glitch-title::after{content:attr(data-text);position:absolute;left:0;top:0;opacity:.6;pointer-events:none}
.glitch-title::before{transform:translate(2px,-1px);color:rgba(255,215,0,.8);mix-blend-mode:screen}
.glitch-title::after{transform:translate(-2px,1px);color:rgba(255,255,255,.65);mix-blend-mode:screen}

body.menu-open{overflow:hidden}

img{max-width:100%;height:auto;display:block;object-fit:cover}

:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(255,215,0,.9)}

@media (prefers-reduced-motion:reduce){
  .reveal,.reveal.is-visible{transition:none;transform:none;opacity:1}
  .service-cell{transition:none}
}