/* =============================================================
   Alissa Brontë — Shared chrome for non-cinematic pages
   (contact, privacy, legal, cookies)
   Mirrors the look of cinema-v3.css nav + footer for unity
   ============================================================= */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{color-scheme:dark}
html,body{background:#000;color:#ece8e6;font-family:var(--font-sans);overflow-x:clip;-webkit-font-smoothing:antialiased;min-height:100%}
img{display:block;max-width:100%}
::selection{background:#c75a1e;color:#fff}
button{font:inherit;background:none;border:0;color:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}

/* ---------- Film grain ---------- */
.grain{position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.10;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.7 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}

/* ---------- Progress rail ---------- */
.rail{position:fixed;top:0;left:0;right:0;height:2px;z-index:300;pointer-events:none}
.rail-fill{height:100%;background:linear-gradient(90deg,#c75a1e,#f5b042);transform-origin:left;transform:scaleX(0)}

/* ---------- NAV ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;justify-content:space-between;align-items:center;padding:18px clamp(20px,4vw,56px);transition:background .5s,backdrop-filter .5s,padding .4s,border-color .5s;border-bottom:1px solid transparent;color:#fff;background:rgba(8,5,3,.82);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}
.nav.scrolled{padding:12px clamp(20px,4vw,56px);border-bottom-color:rgba(255,255,255,.06)}
.nav-brand img{height:42px;width:auto;display:block;filter:brightness(1.2) drop-shadow(0 0 2px rgba(0,0,0,.95)) drop-shadow(0 0 6px rgba(0,0,0,.85)) drop-shadow(0 0 22px rgba(245,176,66,.55)) drop-shadow(0 4px 14px rgba(0,0,0,.75))}
.nav-links{display:flex;gap:36px;list-style:none;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.28em}
.nav-links a{opacity:.85;transition:opacity .3s,color .3s}
.nav-links a:hover,.nav-links a.active{opacity:1;color:#f5b042}
.nav-cta{background:#c75a1e;color:#fff;padding:11px 22px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.22em;border-radius:999px;transition:background .3s,transform .3s,box-shadow .3s}
.nav-cta:hover{background:#fff;color:#0a0608;transform:translateY(-1px);box-shadow:0 10px 28px -8px rgba(255,255,255,.4)}
@media(max-width:780px){.nav-links{display:none}}

/* ---------- PAGE SHELL ---------- */
.page-shell{padding:clamp(120px,18vh,180px) clamp(20px,4vw,56px) clamp(80px,10vh,140px);max-width:920px;margin:0 auto;position:relative;z-index:2}
.page-shell--wide{max-width:1180px}

.page-eyebrow{font-family:'JetBrains Mono','Manrope',monospace;font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:#f5b042;display:inline-flex;align-items:center;gap:14px;margin-bottom:18px}
.page-eyebrow::before{content:'';width:32px;height:1px;background:#f5b042}
.page-title{font-family:var(--font-serif);font-weight:300;font-size:clamp(40px,6vw,72px);line-height:1.05;color:#fff;letter-spacing:-.02em;margin:0 0 14px}
.page-title em{font-style:italic;color:#f5b042}
.page-sub{font-family:var(--font-serif);font-style:italic;font-size:clamp(16px,1.8vw,20px);color:rgba(255,255,255,.65);max-width:60ch;margin:0 0 48px}
.page-rule{width:64px;height:1px;background:linear-gradient(90deg,#f5b042,transparent);margin:0 0 36px}

/* ---------- PROSE (legal pages) ---------- */
.page-prose{font-family:var(--font-serif);font-size:1.05rem;line-height:1.8;color:rgba(255,255,255,.78)}
.page-prose h2{font-family:var(--font-serif);font-weight:400;font-size:clamp(20px,2vw,26px);color:#fff;letter-spacing:-.01em;margin:48px 0 14px}
.page-prose h2 em{font-style:italic;color:#f5b042}
.page-prose h2:first-child{margin-top:0}
.page-prose p{margin:0 0 16px;color:inherit}
.page-prose ul{margin:14px 0 22px;padding-left:24px}
.page-prose ul li{margin-bottom:8px;color:rgba(255,255,255,.78)}
.page-prose strong{color:#fff;font-weight:500}
.page-prose a{color:#f5b042;border-bottom:1px solid rgba(245,176,66,.4);transition:border-color .3s,color .3s}
.page-prose a:hover{color:#fff;border-bottom-color:#fff}
.page-prose-meta{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:rgba(245,176,66,.6);margin:0 0 48px}

/* ---------- CONTACT GRID ---------- */
.contact-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:clamp(40px,5vw,80px);align-items:start;margin-top:24px}
@media(max-width:880px){.contact-grid{grid-template-columns:1fr;gap:48px}}

.contact-aside{display:flex;flex-direction:column;gap:36px}
.contact-card{background:linear-gradient(160deg,rgba(20,12,8,.65) 0%,rgba(0,0,0,.4) 100%);border:1px solid rgba(245,176,66,.15);padding:32px 28px;transition:border-color .5s}
.contact-card:hover{border-color:rgba(245,176,66,.32)}
.contact-card h3{font-family:var(--font-serif);font-weight:400;font-size:1.2rem;color:#fff;margin:0 0 12px;letter-spacing:-.01em}
.contact-card p{font-family:var(--font-serif);font-style:italic;font-size:14px;color:rgba(255,255,255,.6);margin:0 0 18px}
.contact-card .email{font-family:'JetBrains Mono',monospace;font-size:14px;letter-spacing:.04em;color:#f5b042;border-bottom:1px solid rgba(245,176,66,.4);padding-bottom:6px;display:inline-block;transition:color .3s,border-color .3s}
.contact-card .email:hover{color:#fff;border-bottom-color:#fff}
.contact-socials{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.contact-socials a{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,255,255,.75);background:rgba(255,255,255,.04);border:1px solid rgba(245,176,66,.2);padding:10px 16px;border-radius:999px;transition:all .35s}
.contact-socials a:hover{background:rgba(245,176,66,.1);color:#f5b042;border-color:#f5b042;transform:translateY(-1px)}

/* ---------- FORM ---------- */
.form-card{background:linear-gradient(160deg,rgba(20,12,8,.65) 0%,rgba(0,0,0,.4) 100%);border:1px solid rgba(245,176,66,.18);padding:clamp(28px,3vw,40px)}
.form-card h3{font-family:var(--font-serif);font-weight:400;font-size:clamp(22px,2.2vw,28px);color:#fff;margin:0 0 6px;letter-spacing:-.01em}
.form-card .form-sub{font-family:var(--font-serif);font-style:italic;font-size:14px;color:rgba(255,255,255,.55);margin:0 0 28px}
.form{display:flex;flex-direction:column;gap:18px}
.form .field{display:flex;flex-direction:column;gap:6px}
.form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:520px){.form .field-row{grid-template-columns:1fr}}
.form label{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:rgba(245,176,66,.7);font-weight:600}
.form input,.form select,.form textarea{background:rgba(0,0,0,.4);border:1px solid rgba(245,176,66,.22);padding:14px 16px;color:#fff;font-family:var(--font-serif);font-size:15px;border-radius:2px;transition:border-color .3s,background .3s}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:#f5b042;background:rgba(0,0,0,.55)}
.form textarea{resize:vertical;min-height:140px;font-family:var(--font-serif);font-style:italic}
.form .field-check{flex-direction:row;gap:10px;align-items:flex-start;margin-top:6px}
.form .field-check input{width:18px;height:18px;flex:0 0 auto;accent-color:#f5b042;margin-top:2px}
.form .field-check label{text-transform:none;letter-spacing:.02em;font-family:var(--font-serif);font-size:13px;color:rgba(255,255,255,.7);font-weight:400;line-height:1.5}
.form .field-check label a{color:#f5b042;border-bottom:1px solid rgba(245,176,66,.4)}
.form button[type="submit"]{margin-top:8px;background:#c75a1e;color:#fff;padding:16px 28px;font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.32em;text-transform:uppercase;border-radius:999px;cursor:pointer;border:1px solid #c75a1e;transition:all .35s;align-self:flex-start;display:inline-flex;align-items:center;gap:14px}
.form button[type="submit"]:hover{background:#fff;color:#0a0608;border-color:#fff;transform:translateY(-2px);box-shadow:0 14px 38px -8px rgba(255,255,255,.4)}
.form button[type="submit"]:disabled{opacity:.6;cursor:not-allowed;transform:none}

/* ---------- BACK LINK ---------- */
.back-link{display:inline-flex;align-items:center;gap:14px;margin-top:48px;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#f5b042;border-bottom:1px solid rgba(245,176,66,.4);padding-bottom:8px;transition:gap .3s,color .3s,border-color .3s}
.back-link:hover{color:#fff;border-bottom-color:#fff;gap:22px}

/* ---------- FOOTER MINI (matches cinema-v3) ---------- */
.footer-mini{background:#040303;padding:50px clamp(24px,5vw,64px) 30px;border-top:1px solid rgba(255,255,255,.06);position:relative;z-index:2}
.footer-mini-inner{max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap}
.footer-brand img{height:48px}
.footer-links{display:flex;gap:32px;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.22em;flex-wrap:wrap}
.footer-links a{color:rgba(255,255,255,.65);transition:color .3s}
.footer-links a:hover{color:#f5b042}
.footer-meta{font-size:11px;color:rgba(255,255,255,.4);letter-spacing:.1em}
@media(max-width:680px){.footer-mini-inner{flex-direction:column;align-items:flex-start;gap:24px}}

/* ---------- Feedback del formulario de contacto ---------- */
.form .form-status{margin-top:14px;font-family:var(--font-serif,'Cormorant Garamond',serif);font-size:16.5px;line-height:1.5;color:#b9d8b0;min-height:1.2em}
.form .form-status.error{color:#e8a890}
.form button.sent{background:#4a7d52;color:#f4ebe0;cursor:default;pointer-events:none}
