/* Estilo común de las páginas internas de Agencia La Novela (mismo lenguaje que la portada) */
:root{
  --bg:#0c0a0b; --bg2:#141113; --card:#1a1618; --line:rgba(255,240,235,.1); --line2:rgba(255,240,235,.18);
  --ink:#f6efe9; --muted:#a89d97; --dim:#6f6560;
  --rojo:#ff2e63; --naranja:#ff7a3d; --oro:#ffc86b; --violeta:#8b5cf6; --verde:#34d399;
  --grad:linear-gradient(100deg,var(--rojo) 0%,var(--naranja) 55%,var(--oro) 100%);
  --serif:"Instrument Serif",Georgia,"Times New Roman",serif; --sans:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --pad:clamp(16px,4vw,48px); --max:1240px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{margin:0; background:var(--bg); color:var(--ink); font:16px/1.6 var(--sans); overflow-x:hidden; -webkit-font-smoothing:antialiased}
img,video{display:block; max-width:100%}
a{color:inherit}
::selection{background:var(--rojo); color:#fff}
:focus-visible{outline:2px solid var(--naranja); outline-offset:2px}
.wrap{max-width:var(--max); margin:0 auto; padding:0 var(--pad)}
.grano{position:fixed; inset:0; pointer-events:none; z-index:60; opacity:.06; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* nav */
.nav{position:fixed; top:0; left:0; right:0; z-index:50; transition:background .3s, border-color .3s; border-bottom:1px solid transparent}
.nav.solida{background:rgba(12,10,11,.72); backdrop-filter:blur(14px) saturate(1.4); -webkit-backdrop-filter:blur(14px) saturate(1.4); border-color:var(--line)}
.nav .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; height:68px}
.logo{font:400 26px/1 var(--serif); text-decoration:none; letter-spacing:-.01em; white-space:nowrap}
.logo i{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; padding-right:.06em}
.links{display:flex; gap:24px; font-size:14.5px; color:var(--muted)}
.links a{text-decoration:none; transition:color .2s; white-space:nowrap}
.links a:hover,.links a[aria-current="page"]{color:var(--ink)}
.nav .ctas-nav{display:flex; gap:8px}
@media (max-width:1140px){ .links{display:none} }
@media (max-width:420px){ .nav .btn-cotizar{display:none} }

.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; font:600 14.5px/1 var(--sans); text-decoration:none; border-radius:999px; padding:13px 20px; transition:transform .2s, background .2s, box-shadow .2s; white-space:nowrap; cursor:pointer; border:0}
.btn:active{transform:scale(.97)}
.btn-luz{background:var(--ink); color:var(--bg)}
.btn-luz:hover{background:#fff; box-shadow:0 0 0 6px rgba(255,255,255,.08)}
.btn-grad{background:var(--grad); color:#1a0a0c}
.btn-grad:hover{box-shadow:0 10px 40px -8px rgba(255,46,99,.6)}
.btn-borde{border:1px solid var(--line2); color:var(--ink); background:rgba(255,255,255,.02)}
.btn-borde:hover{border-color:var(--ink)}
.btn svg{width:16px; height:16px}
.nav .btn{padding:11px 16px; font-size:13.5px}

/* tipografía de secciones */
.eyebrow{font:500 12.5px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; color:var(--rojo); display:flex; align-items:center; gap:12px}
.eyebrow::before{content:""; width:28px; height:1px; background:currentColor}
h1{font:400 clamp(46px,7.4vw,104px)/.95 var(--serif); letter-spacing:-.035em; margin:22px 0 22px}
h1 em,h2 em.grad{font-style:italic; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; padding-right:.08em}
h2{font:400 clamp(36px,5vw,68px)/1 var(--serif); letter-spacing:-.03em; margin:16px 0 18px}
h2 em{font-style:italic; color:var(--muted)}
.lead{color:var(--muted); font-size:clamp(16px,1.4vw,19px); max-width:600px; margin:0; font-weight:350}
.aura{position:absolute; inset:-20% -10% auto; height:120%; pointer-events:none; z-index:0;
  background:radial-gradient(40% 35% at 72% 30%,rgba(255,46,99,.24),transparent 70%),radial-gradient(35% 40% at 12% 18%,rgba(139,92,246,.14),transparent 70%)}
.cabecera{position:relative; padding:140px 0 60px; overflow:hidden}
.cabecera .wrap{position:relative; z-index:1}
section.sec{padding:clamp(60px,9vw,120px) 0}

footer{border-top:1px solid var(--line); padding:34px 0 calc(34px + env(safe-area-inset-bottom,0px)); color:var(--dim); font-size:13.5px}
footer .wrap{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; align-items:center}
footer nav{display:flex; gap:22px; flex-wrap:wrap}
footer a{text-decoration:none} footer a:hover{color:var(--ink)}

.rev{opacity:0; transform:translateY(24px); transition:opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1)}
.rev.visto{opacity:1; transform:none}
.rev.d1{transition-delay:.08s} .rev.d2{transition-delay:.16s} .rev.d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation:none!important; transition:none!important} .rev{opacity:1; transform:none} html{scroll-behavior:auto} }
