/* ============ CSS LANDING HOME (hero + puertas + feat + guide + nl + closing) ============ */
/* ============================================================
   IN — inpresencia.com · home v3
   Sistema visual del prototipo (mismo layout que universosantoamor.com)
   ============================================================ */

/* ---------- Fonts ---------- */
@font-face { font-family: "Lovan"; src: url("assets/fonts/Lovan.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-Thin.ttf") format("truetype"); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-ThinItalic.ttf") format("truetype"); font-weight: 100; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-ExtraLight.ttf") format("truetype"); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-Light.ttf") format("truetype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("assets/fonts/Inter-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }

/* ---------- Tokens ---------- */
:root {
  --in-power: #171717;
  --in-soul: #F3F3F3;
  --in-gray: #9C9C9C;
  --in-power-95: #1F1F1F;
  --in-power-90: #2A2A2A;
  --in-power-80: #3A3A3A;
  --ff-display: "Lovan", "Times New Roman", serif;
  --ff-text: "Inter", "Helvetica Neue", Arial, sans-serif;
  --ease-in: cubic-bezier(0.4, 0, 0.85, 0.4);
  --ease-out: cubic-bezier(0.16, 0.84, 0.3, 1);
  --ease-io: cubic-bezier(0.65, 0, 0.35, 1);
}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--in-power);color:var(--in-soul);font-family:var(--ff-text);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--in-soul);text-decoration:none;transition:color .4s var(--ease-io)}
a:hover{color:var(--in-gray)}
button{font-family:inherit;cursor:pointer;background:none;border:0;color:inherit}
img{display:block;max-width:100%;height:auto}
::selection{background:var(--in-soul);color:var(--in-power)}

/* ---------- Utilities ---------- */
.wrap{max-width:1320px;margin:0 auto;padding:0 clamp(24px,5vw,96px)}
.grain{position:relative;isolation:isolate}
.grain::after{content:"";position:absolute;inset:0;background:url(assets/img/bg-power-grain.png) center/cover;mix-blend-mode:overlay;opacity:.45;pointer-events:none;z-index:-1}
.eyebrow{font:500 11px/1.4 var(--ff-text);letter-spacing:.22em;text-transform:uppercase;color:var(--in-gray);margin:0}
.h2{font:100 clamp(34px,4.2vw,64px)/1.05 var(--ff-text);letter-spacing:-.02em;margin:0;text-wrap:balance}
.lede{font:300 18px/1.7 var(--ff-text);color:var(--in-gray);margin:0;max-width:56ch;text-wrap:pretty}
.rule{height:1px;background:#3A3A3A;border:0;margin:0}
section{scroll-margin-top:110px}
.sec{padding:clamp(96px,11vw,160px) 0}
.sec-head{display:grid;gap:20px;margin-bottom:clamp(48px,6vw,80px);max-width:820px}
.sec-head.c{margin-left:auto;margin-right:auto;text-align:center;justify-items:center}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 30px;border-radius:999px;font:500 14px/1 var(--ff-text);letter-spacing:.02em;border:1px solid var(--in-soul);transition:background .4s var(--ease-io),color .4s var(--ease-io),opacity .2s;white-space:nowrap;cursor:pointer}
.btn:active{opacity:.7}
.btn-p{background:var(--in-soul);color:var(--in-power)}
.btn-p:hover{background:transparent;color:var(--in-soul)}
.btn-s{background:transparent;color:var(--in-soul);border-color:#5C5C5C}
.btn-s:hover{border-color:var(--in-soul);color:var(--in-soul)}
.btn-sm{height:40px;padding:0 20px;font-size:13px}
.link{display:inline-flex;gap:8px;font:500 13px/1 var(--ff-text);letter-spacing:.04em;padding-bottom:6px;border-bottom:1px solid #5C5C5C;transition:border-color .4s}
.link:hover{border-color:var(--in-soul);color:var(--in-soul)}

/* ---------- Header ---------- */
.hdr{position:sticky;top:0;z-index:40;background:rgba(23,23,23,.92);border-bottom:1px solid #2A2A2A;transition:background .4s;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hdr-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:76px;gap:24px}
.nav{display:flex;gap:30px;font:400 13px/1 var(--ff-text);letter-spacing:.02em}
.nav a{color:#CFCFCF}
.nav a:hover{color:var(--in-soul)}
.nav a.btn-p{color:var(--in-power)}
.nav a.btn-p:hover{color:var(--in-soul)}
.nav-r{justify-content:flex-end;align-items:center}
.logo img{height:30px;display:block}
.burger{display:none;background:none;border:0;color:var(--in-soul);font:500 12px var(--ff-text);letter-spacing:.2em;text-transform:uppercase;padding:10px 0;justify-self:start;cursor:pointer}
.mnav{display:none;position:fixed;inset:0;z-index:60;background:var(--in-power);padding:24px;flex-direction:column;gap:0}
.mnav.open{display:flex}
.mnav a:not(.btn){font:100 34px/1 var(--ff-text);padding:18px 0;border-bottom:1px solid #2A2A2A;color:var(--in-soul)}
.mnav-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
@media(max-width:1080px){.nav{display:none}.burger{display:block}.nav-r{display:flex}.nav-r>a:not(.btn){display:none}}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:calc(100vh - 76px);min-height:calc(100svh - 76px);display:flex;align-items:flex-end;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:url(assets/img/bg-dark-mode-2.png) center 30%/cover}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,23,.35) 0%,rgba(23,23,23,.2) 35%,var(--in-power) 100%),linear-gradient(90deg,rgba(23,23,23,.7),transparent 70%)}
.hero-c{position:relative;padding-bottom:clamp(64px,9vw,120px);padding-top:120px;display:grid;gap:32px;width:100%}
.hero h1{font:100 clamp(48px,7.4vw,120px)/.98 var(--ff-text);letter-spacing:-.03em;margin:0;max-width:12ch}
.hero .lede{color:#CFCFCF;font-size:clamp(17px,1.5vw,20px);max-width:52ch}
.ctas{display:flex;flex-wrap:wrap;gap:14px}
.proof{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;font:400 13px/1.4 var(--ff-text);color:#BDBDBD}
.proof b{font-weight:500;color:var(--in-soul)}
.proof-dot{opacity:.4}

/* ---------- Hero variante centrada (santoamor style) ---------- */
.hero-center{align-items:center}
.hero-center .hero-bg::after{background:linear-gradient(180deg,rgba(23,23,23,.55) 0%,rgba(23,23,23,.45) 50%,rgba(23,23,23,.75) 100%)}
.hero-center .hero-c{text-align:center;justify-items:center;padding-top:120px;padding-bottom:120px;gap:24px}
.hero-center .hero-kicker{font-family:var(--ff-text);font-weight:300;font-size:clamp(15px,1.4vw,18px);letter-spacing:.01em;color:#CFCFCF;margin:0;white-space:nowrap;text-align:center;justify-self:center}
.hero-center .hero-lovan{font-family:var(--ff-display);font-style:normal;font-weight:400;font-size:clamp(34px,7.2vw,120px);line-height:.78;letter-spacing:-.01em;color:var(--in-soul);margin:0;text-align:center;justify-self:center}
.hero-center .hero-lovan span{display:block;white-space:nowrap}
.hero-center .ctas{justify-content:center;margin-top:16px}
@media(max-width:800px){
  .hero-center .hero-kicker{white-space:normal;max-width:36ch}
}

/* ---------- Tickets/Puertas (tus opciones) ---------- */
.tkt-title{text-align:center;margin:0 auto clamp(48px,6vw,88px);max-width:18ch}
.tkts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
.tkt{position:relative;aspect-ratio:3/4;display:grid;place-items:center;color:var(--in-soul);transition:transform .8s var(--ease-out)}
.tkt svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tkt use{fill:url(#inTkt);stroke:#3A3A3A;stroke-width:1;vector-effect:non-scaling-stroke;transition:stroke .6s var(--ease-io)}
.tkt:hover{transform:translateY(-6px);color:var(--in-soul)}
.tkt:hover use{stroke:var(--in-soul)}
.tkt-c{position:relative;height:66%;margin-top:14%;display:grid;grid-template-rows:auto 1fr auto;justify-items:center;align-items:center;text-align:center;padding:0 12%}
.tkt h3{font:200 clamp(22px,2.2vw,34px)/1.15 var(--ff-text);letter-spacing:-.01em;margin:0;hyphens:manual}
.tkt .link{justify-self:center}
.tkt:hover .link{border-color:var(--in-soul)}
@media(max-width:1000px){.tkts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.tkts{grid-template-columns:minmax(0,320px);justify-content:center}}

/* ---------- Ecosystem (formas de entrar) ---------- */
.eco{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#2A2A2A;border:1px solid #2A2A2A}
.eco a{background:var(--in-power);display:grid;grid-template-rows:auto 1fr;color:var(--in-soul);transition:background .4s var(--ease-io)}
.eco a:hover{background:#1F1F1F;color:var(--in-soul)}
.eco .eco-img{aspect-ratio:4/5;background-size:cover;background-position:center}
.eco-b{padding:28px 26px 32px;display:grid;gap:14px;align-content:start}
.eco h3{font:300 24px/1.2 var(--ff-text);margin:0}
.eco p{font:400 15px/1.6 var(--ff-text);color:var(--in-gray);margin:0}
.eco .go{font:500 13px var(--ff-text);margin-top:10px;letter-spacing:.04em}
@media(max-width:900px){.eco{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.eco{grid-template-columns:1fr}}

/* ---------- Courses (experiencias más escuchadas) ---------- */
.online-top{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap;margin-bottom:64px}
.courses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.course{display:grid;gap:18px;align-content:start;color:var(--in-soul)}
.course:hover{color:var(--in-soul)}
.course .course-img{aspect-ratio:16/9;background-size:cover;background-position:center;transition:opacity .4s}
.course:hover .course-img{opacity:.85}
.course h3{font:300 22px/1.25 var(--ff-text);margin:0}
.course p{font:400 14px/1.55 var(--ff-text);color:var(--in-gray);margin:0}
.course-m{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid #3A3A3A;padding-top:14px;font:400 13px var(--ff-text);color:var(--in-gray);margin-top:4px}
.course-m b{font:500 13px var(--ff-text);color:var(--in-soul);letter-spacing:.04em}
@media(max-width:1000px){.courses{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.courses{grid-template-columns:1fr}}

/* ---------- Feature block (estar en los días) ---------- */
.feat-block{display:grid;grid-template-columns:5fr 6fr;gap:clamp(40px,7vw,96px);align-items:center;padding:clamp(48px,6vw,80px);background:#1B1B1B;border:1px solid #2A2A2A}
.feat-block .feat-img{aspect-ratio:1/1;background:url(assets/img/estar-en-los-dias-cover.jpg) center/cover}
.feat-c{display:grid;gap:24px}
.feat-c h2{font:100 clamp(40px,5vw,72px)/1.02 var(--ff-text);letter-spacing:-.02em;margin:0}
.feat-c .lede{font-size:18px;color:#CFCFCF;max-width:52ch}
.feat-list{list-style:none;margin:0;padding:0;display:grid;gap:14px;border-top:1px solid #3A3A3A;padding-top:24px}
.feat-list li{display:grid;grid-template-columns:24px 1fr;gap:8px;font:300 16px/1.55 var(--ff-text);color:#E0E0E0}
.feat-list li::before{content:"—";color:var(--in-gray)}
.feat-price-block{display:flex;flex-direction:column;gap:6px;border-top:1px solid #3A3A3A;padding-top:20px;margin-top:4px}
.feat-price{display:flex;align-items:baseline;gap:14px;font:100 clamp(56px,7vw,88px)/1 var(--ff-text);letter-spacing:-.03em}
.feat-price small{font:500 12px var(--ff-text);letter-spacing:.22em;text-transform:uppercase;color:var(--in-gray)}
.feat-price-note{font:400 14px/1.5 var(--ff-text);color:var(--in-gray);margin:0}
.feat-meta{font:400 12px/1.6 var(--ff-text);letter-spacing:.06em;color:var(--in-gray)}
@media(max-width:900px){.feat-block{grid-template-columns:1fr;padding:clamp(32px,6vw,56px)}.feat-block .feat-img{aspect-ratio:1/1}}

/* ---------- Guide ---------- */
.guide{display:grid;grid-template-columns:5fr 6fr;gap:clamp(40px,7vw,120px);align-items:center}
.guide .guide-ph{aspect-ratio:4/5;background:url(assets/img/fabianna.jpg) center/cover;filter:grayscale(.15) brightness(.92);border-radius:16px;overflow:hidden}
.guide-t{display:grid;gap:28px}
.guide-name{font:400 clamp(44px,5vw,72px)/1 var(--ff-display);margin:0}
.guide-t p{font:300 18px/1.75 var(--ff-text);color:#CFCFCF;margin:0;max-width:52ch}
.guide-t p em{font-style:normal;color:var(--in-soul)}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #3A3A3A;border-bottom:1px solid #3A3A3A}
.facts div{padding:22px 0;display:grid;gap:6px}
.facts div+div{padding-left:22px;border-left:1px solid #3A3A3A}
.facts b{font:100 36px/1 var(--ff-text);letter-spacing:-.02em}
.facts span{font:400 13px/1.4 var(--ff-text);color:var(--in-gray)}
@media(max-width:900px){.guide{grid-template-columns:1fr}.guide .guide-ph{aspect-ratio:1/1;max-width:520px}}

/* ---------- Count + reviews ---------- */
.count{text-align:center;padding:clamp(96px,12vw,180px) 0 64px;display:grid;gap:24px;justify-items:center}
.count-n{font:100 clamp(72px,12vw,200px)/.9 var(--ff-text);letter-spacing:-.04em}
.count p{font:300 clamp(20px,2vw,28px)/1.3 var(--ff-text);margin:0;max-width:28ch;color:#CFCFCF}
.rv-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.rv{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(300px,calc((100% - 48px)/3));gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.rv::-webkit-scrollbar{display:none}
.card{scroll-snap-align:start;background:#1F1F1F;padding:36px 32px;display:grid;gap:28px;align-content:space-between;min-height:280px}
.card q{font:300 19px/1.6 var(--ff-text);quotes:none;text-wrap:pretty}
.card-f{display:flex;align-items:center;gap:14px;font:400 13px/1.4 var(--ff-text);color:var(--in-gray)}
.card-f i{width:40px;height:40px;border-radius:50%;background:#3A3A3A;flex:none;font-style:normal;display:flex;align-items:center;justify-content:center;color:var(--in-gray);font-weight:400;font-size:14px}
.card-f b{display:block;font-weight:500;color:var(--in-soul)}
.verif{font:400 12px var(--ff-text);color:#6A6A6A;margin-top:24px}

/* ---------- Objections (antes de entrar) ---------- */
.obj-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 48px}
.obj-item{border-top:1px solid #3A3A3A;padding-top:24px;display:grid;gap:12px}
.obj-q{font:400 18px/1.35 var(--ff-text);color:var(--in-soul);margin:0}
.obj-a{font:300 16px/1.65 var(--ff-text);color:var(--in-gray);margin:0}
@media(max-width:800px){.obj-grid{grid-template-columns:1fr;gap:24px}}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:4fr 7fr;gap:clamp(40px,6vw,96px)}
.faq-l{display:grid;gap:24px;align-content:start;position:sticky;top:120px}
.q{border-top:1px solid #3A3A3A}
.q:last-child{border-bottom:1px solid #3A3A3A}
.q button{width:100%;display:flex;justify-content:space-between;gap:24px;align-items:center;background:none;border:0;color:var(--in-soul);font:300 20px/1.4 var(--ff-text);text-align:left;padding:28px 0;cursor:pointer}
.q button span{font:100 28px/1 var(--ff-text);transition:transform .4s var(--ease-io);flex:none}
.q.open button span{transform:rotate(45deg)}
.q-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease-io)}
.q.open .q-a{grid-template-rows:1fr}
.q-a>div{overflow:hidden}
.q-a p{font:400 16px/1.7 var(--ff-text);color:var(--in-gray);margin:0;padding:0 48px 32px 0;max-width:64ch}
@media(max-width:900px){.faq{grid-template-columns:1fr}.faq-l{position:static}}

/* ---------- Newsletter (frecuencia) ---------- */
.nl{position:relative;overflow:hidden;padding:clamp(96px,12vw,170px) 0;text-align:center}
.nl-bg{position:absolute;inset:0;background:url(assets/img/bg-dark-gradient-grain.png) center/cover}
.nl-c{position:relative;display:grid;gap:28px;justify-items:center}
.nl-sym{width:64px;opacity:.9}
.nl form{display:flex;gap:10px;width:100%;max-width:560px;flex-wrap:wrap;justify-content:center}
.nl input[type=email]{flex:1 1 280px;height:52px;border-radius:999px;border:1px solid #5C5C5C;background:rgba(23,23,23,.5);color:var(--in-soul);font:400 15px var(--ff-text);padding:0 24px;outline:none;transition:border-color .4s}
.nl input[type=email]:focus{border-color:var(--in-soul)}
.nl input::placeholder{color:#8A8A8A}
.nl label{font:400 12px/1.5 var(--ff-text);color:var(--in-gray);display:flex;gap:10px;align-items:flex-start;max-width:480px;text-align:left;flex-basis:100%;justify-content:center}
.nl label input{accent-color:#F3F3F3;margin-top:2px}
.nl-ok{font:300 20px var(--ff-text);display:none}
.nl.done form,.nl.done label{display:none}
.nl.done .nl-ok{display:block}
.nl-note{font:400 12px/1.6 var(--ff-text);letter-spacing:.06em;color:var(--in-gray);max-width:520px}

/* ---------- Closing (cierre) ---------- */
.closing{padding:clamp(96px,12vw,180px) 0;text-align:center;display:grid;justify-items:center;border-top:1px solid #2A2A2A}
.closing .wrap{display:flex;flex-direction:column;align-items:center;gap:clamp(32px,4vw,56px)}
.closing-line{font-family:var(--ff-display);font-weight:400;font-style:normal;font-size:clamp(44px,8vw,112px);line-height:.9;letter-spacing:-.01em;color:var(--in-soul);margin:0;text-align:center}
.closing-ctas{justify-content:center}

/* ---------- Footer ---------- */
.ft{padding:96px 0 40px;border-top:1px solid #2A2A2A}
.ft-g{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:40px}
.ft h4{font:500 11px/1 var(--ff-text);letter-spacing:.22em;text-transform:uppercase;color:var(--in-gray);margin:0 0 22px}
.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;font:400 14px var(--ff-text)}
.ft ul a{color:#CFCFCF}
.ft ul a:hover{color:var(--in-soul)}
.ft-brand{display:grid;gap:20px;align-content:start}
.ft-brand img{height:34px}
.ft-brand p{font:300 15px/1.6 var(--ff-text);color:var(--in-gray);margin:0;max-width:30ch}
.ft-b{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:80px;padding-top:28px;border-top:1px solid #2A2A2A;font:400 12px var(--ff-text);color:#6A6A6A}
.ft-b nav{display:flex;gap:24px}
.ft-b a{color:#8A8A8A}
@media(max-width:1000px){.ft-g{grid-template-columns:repeat(2,minmax(0,1fr))}.ft-brand{grid-column:1/-1}}

/* ---------- Focus ---------- */
:focus-visible{outline:1px solid var(--in-soul);outline-offset:4px}

/* ---------- Small screens ---------- */
@media(max-width:600px){
  .hero-c{gap:24px}
  .proof{font-size:12px;gap:8px 16px}
  .proof-dot{display:none}
}

/* ============ CSS SUBPÁGINAS (in-header, in-feature, in-block, in-footer, in-nav, etc.) ============ */
/* ============================================================
   IN — inpresencia.com
   Sistema editorial. HTML/CSS puro sobre Netlify.
   Basado en el modelo IN Editorial. Sin React.
   ============================================================ */

/* ---------- Fuentes ---------- */
@font-face {
  font-family: "Lovan";
  src: url("assets/fonts/Lovan.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("assets/fonts/Inter-Variable.ttf") format("truetype-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("assets/fonts/Inter-Variable-Italic.ttf") format("truetype-variations");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

/* ---------- Tokens ---------- */
:root {
  --in-power: #171717;
  --in-soul: #F3F3F3;
  --in-gray: #9C9C9C;

  --in-power-95: #1F1F1F;
  --in-power-90: #2A2A2A;
  --in-power-80: #3A3A3A;
  --in-soul-98: #FAFAFA;
  --in-soul-94: #ECECEC;
  --in-soul-88: #DCDCDC;

  --bg: var(--in-power);
  --fg: var(--in-soul);
  --fg-mute: var(--in-gray);
  --fg-faint: #5C5C5C;
  --rule: var(--in-power-80);

  --ff-display: "Lovan", "Times New Roman", serif;
  --ff-text: "Inter", "Helvetica Neue", Arial, sans-serif;

  --fs-d1: clamp(64px, 9vw, 144px);
  --fs-d2: clamp(48px, 6vw, 96px);
  --fs-h1: clamp(48px, 6vw, 88px);
  --fs-h2: clamp(40px, 5vw, 72px);
  --fs-h3: 32px;
  --fs-body-lg: 18px;
  --fs-body: 16px;
  --fs-body-sm: 14px;
  --fs-eyebrow: 11px;

  --lh-display: 0.95;
  --lh-tight: 1.1;
  --lh-body: 1.55;
  --lh-loose: 1.7;

  --tk-tight: -0.025em;
  --tk-normal: 0;
  --tk-eyebrow: 0.22em;

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --sp-10: 144px;

  --ease-io: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 200ms;
  --dur-base: 400ms;
  --dur-slow: 800ms;
}

/* ---------- Reset & base ---------- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
}
html, body {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--ff-text);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  min-height: 100vh;
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; background: transparent; border: 0; cursor: pointer; }
img { display: block; max-width: 100%; height: auto; }

::selection { background: var(--in-soul); color: var(--in-power); }

/* ---------- Utilidades tipográficas ---------- */
.in-eyebrow {
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--fg-mute);
}
.in-anchor {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
}
.in-mute { color: var(--fg-mute); }
.in-rule { height: 1px; background: var(--rule); border: 0; margin: 0; }

/* ---------- Header ---------- */
.in-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--sp-8);
  height: 64px;
  border-bottom: 1px solid transparent;
  position: sticky;
  top: 0;
  background: rgba(23, 23, 23, 0);
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
  z-index: 50;
  transition: background var(--dur-base) var(--ease-io),
              border-color var(--dur-base) var(--ease-io),
              backdrop-filter var(--dur-base) var(--ease-io);
}
.in-header.scrolled {
  background: rgba(23, 23, 23, 0.85);
  border-bottom-color: var(--in-power-80);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.in-logo {
  display: inline-flex;
  align-items: center;
  height: 32px;
  transition: opacity var(--dur-fast) var(--ease-io);
}
.in-logo:hover {
  opacity: 0.7;
}
.in-logo img {
  height: 32px;
  width: auto;
  display: block;
}
.in-nav {
  display: flex;
  align-items: center;
  gap: var(--sp-6);
}
.in-nav-link {
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--in-gray);
  transition: color var(--dur-fast) var(--ease-io);
  padding-bottom: 2px;
  border-bottom: 1px solid transparent;
}
.in-nav-link:hover,
.in-nav-link.is-active {
  color: var(--in-soul);
}

/* ---------- Hero (imagen + overlay Power denso, centrado) ---------- */
.in-hero {
  position: relative;
  width: 100%;
  min-height: calc(100vh - 64px);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--in-power);
  background-image: url("assets/img/hero-bg.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: var(--sp-9) var(--sp-6);
}
.in-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(23, 23, 23, 0.80) 0%,
    rgba(23, 23, 23, 0.70) 50%,
    rgba(23, 23, 23, 0.85) 100%
  );
  pointer-events: none;
  z-index: 1;
}
.in-hero > * {
  position: relative;
  z-index: 2;
}
.in-hero-inner {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-5);
}
.in-hero-anchor {
  font-family: var(--ff-text);
  font-style: normal;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.2;
  color: var(--in-soul);
  opacity: 0.85;
  letter-spacing: 0;
  margin: 0;
}
.in-hero-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 var(--sp-4) 0;
}
.in-hero-logo img {
  height: 72px;
  width: auto;
  display: block;
  opacity: 0.95;
}
.in-hero-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(40px, 5vw, 72px);
  line-height: 1.04;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  max-width: none;
  margin: 0;
  white-space: nowrap;
}
.in-hero-sub {
  margin: var(--sp-2) auto 0 auto;
  font-weight: 300;
  font-size: 17px;
  line-height: 1.55;
  color: var(--in-gray);
  max-width: 480px;
}
.in-hero-actions {
  margin-top: var(--sp-6);
  display: flex;
  gap: var(--sp-4);
  align-items: center;
  justify-content: center;
}

/* ---------- Section base ---------- */
.in-section {
  padding: var(--sp-10) var(--sp-8);
  max-width: 1440px;
  margin: 0 auto;
}

/* ---------- Bloque experiencia destacada ---------- */
.in-feature {
  padding: var(--sp-10) var(--sp-8);
  max-width: 1440px;
  margin: 0 auto;
}
.in-feature-eyebrow {
  margin-bottom: var(--sp-4);
}
.in-feature-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(56px, 7vw, 112px);
  line-height: 0.98;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin: 0;
}
.in-feature-sub {
  margin-top: var(--sp-6);
  font-weight: 300;
  font-size: 22px;
  line-height: 1.5;
  color: var(--in-gray);
  max-width: 640px;
}
.in-feature-actions {
  margin-top: var(--sp-7);
  display: flex;
  gap: var(--sp-5);
  align-items: center;
}

/* ---------- Puertas secundarias ---------- */
.in-doors-wrap {
  position: relative;
  background-image: url("assets/img/texture-gray.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.in-doors-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(23, 23, 23, 0.55);
  pointer-events: none;
}
.in-doors {
  position: relative;
  padding: var(--sp-10) var(--sp-8);
  max-width: 1440px;
  margin: 0 auto;
  z-index: 1;
}
.in-doors-eyebrow {
  margin-bottom: var(--sp-8);
}
.in-doors-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-8);
}
.in-door {
  display: flex;
  flex-direction: column;
  padding-top: var(--sp-6);
  border-top: 1px solid var(--rule);
}
.in-door-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin-bottom: var(--sp-4);
}
.in-door-desc {
  font-weight: 300;
  font-size: 15px;
  line-height: 1.55;
  color: var(--in-gray);
  margin-bottom: var(--sp-6);
  flex: 1;
}
.in-door-cta {
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--in-soul);
  border-bottom: 1px solid var(--in-soul);
  padding-bottom: 4px;
  align-self: flex-start;
  transition: color var(--dur-fast), border-color var(--dur-fast);
}
.in-door-cta:hover {
  color: var(--in-gray);
  border-bottom-color: var(--in-gray);
}

/* ---------- Ancla / firma ---------- */
.in-anchor-section {
  padding: var(--sp-10) var(--sp-8);
  max-width: 1440px;
  margin: 0 auto;
  text-align: center;
  border-top: 1px solid var(--rule);
}
.in-anchor-xl {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(72px, 12vw, 180px);
  line-height: 1;
  color: var(--in-soul);
  letter-spacing: 0;
}

/* ---------- Essay (superficie light) ---------- */
.in-essay {
  background: var(--in-soul);
  color: var(--in-power);
  padding: var(--sp-10) var(--sp-8);
}
.in-essay-inner {
  max-width: 720px;
  margin: 0 auto;
}
.in-essay .in-eyebrow {
  color: #5C5C5C;
  margin-bottom: var(--sp-4);
}
.in-essay-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.05;
  letter-spacing: var(--tk-tight);
  color: var(--in-power);
  margin-bottom: var(--sp-6);
}
.in-essay-body {
  font-weight: 400;
  font-size: 18px;
  line-height: 1.7;
  color: var(--in-power);
  margin-bottom: var(--sp-6);
}
.in-essay-cta {
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--in-power);
  border-bottom: 1px solid var(--in-power);
  padding-bottom: 4px;
  display: inline-block;
  transition: opacity var(--dur-fast);
}
.in-essay-cta:hover { opacity: 0.6; }

/* ---------- Botones ---------- */
.in-btn-primary {
  font-size: 12px;
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  padding: 14px 32px;
  background: var(--in-soul);
  color: var(--in-power);
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  transition: opacity var(--dur-fast) var(--ease-io),
              transform var(--dur-fast) var(--ease-io);
}
.in-btn-primary:hover { opacity: 0.88; }
.in-btn-primary:active { opacity: 0.7; transform: scale(0.99); }

.in-btn-secondary {
  font-size: 12px;
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  padding: 13px 30px;
  background: transparent;
  color: var(--in-soul);
  border: 1px solid var(--in-soul);
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  transition: background var(--dur-fast), color var(--dur-fast);
}
.in-btn-secondary:hover {
  background: var(--in-soul);
  color: var(--in-power);
}

.in-btn-text {
  font-size: 12px;
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--in-soul);
  border-bottom: 1px solid var(--in-soul);
  padding-bottom: 4px;
  transition: color var(--dur-fast), border-color var(--dur-fast);
  display: inline-block;
}
.in-btn-text:hover {
  color: var(--in-gray);
  border-bottom-color: var(--in-gray);
}

/* ---------- Footer ---------- */
.in-footer {
  padding: 0 var(--sp-8) var(--sp-7) var(--sp-8);
  margin-top: var(--sp-9);
}
.in-footer .in-rule {
  background: var(--in-power-80);
}
.in-footer-inner {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: var(--sp-8);
  padding: var(--sp-8) 0;
}
.in-footer-brand {
  display: inline-flex;
  align-items: flex-start;
}
.in-footer-brand img {
  height: 72px;
  width: auto;
  display: block;
}
.in-footer-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-6);
}
.in-footer-col {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}
.in-footer-col .in-eyebrow {
  margin-bottom: var(--sp-2);
}
.in-footer-col a {
  font-weight: 300;
  font-size: 16px;
  color: var(--in-soul);
  transition: color var(--dur-fast);
}
.in-footer-col a:hover {
  color: var(--in-gray);
}
.in-footer-base {
  border-top: 1px solid var(--in-power-80);
  padding-top: var(--sp-5);
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--in-gray);
}

/* ---------- Reveal on scroll ---------- */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 900ms var(--ease-io), transform 900ms var(--ease-io);
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================================
   PÁGINA DE VENTA — /experiencias/estar-en-los-dias
   ============================================================ */

/* ---------- Hero de la experiencia ---------- */
.in-experience-hero {
  position: relative;
  padding: var(--sp-10) var(--sp-8) var(--sp-9) var(--sp-8);
  background: var(--in-power);
  text-align: center;
}
.in-experience-hero-inner {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-4);
}
.in-experience-hero-inner .in-eyebrow {
  margin-bottom: var(--sp-2);
}
.in-experience-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(56px, 8vw, 112px);
  line-height: 0.98;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin: 0;
}
.in-experience-sub {
  margin: var(--sp-4) auto 0 auto;
  font-weight: 300;
  font-size: 20px;
  line-height: 1.5;
  color: var(--in-gray);
  max-width: 640px;
}
.in-experience-meta {
  margin-top: var(--sp-4);
  opacity: 0.7;
}
.in-experience-hero-actions {
  margin-top: var(--sp-7);
  display: flex;
  gap: var(--sp-4);
  align-items: center;
  justify-content: center;
}

/* ---------- Reconocimiento (párrafo abridor) ---------- */
.in-recognition {
  padding: var(--sp-10) var(--sp-8);
  border-top: 1px solid var(--rule);
}
.in-recognition-inner {
  max-width: 780px;
  margin: 0 auto;
  text-align: center;
}
.in-recognition-body {
  font-family: var(--ff-text);
  font-weight: 200;
  font-size: clamp(22px, 2.5vw, 32px);
  line-height: 1.4;
  letter-spacing: -0.01em;
  color: var(--in-soul);
  margin: 0;
}

/* ---------- Bloques de contenido (qué es, para quién, etc) ---------- */
.in-block {
  padding: var(--sp-9) var(--sp-8);
  border-top: 1px solid var(--rule);
}
.in-block-inner {
  max-width: 720px;
  margin: 0 auto;
}
.in-block-inner .in-eyebrow {
  margin-bottom: var(--sp-5);
}
.in-block-body {
  font-weight: 300;
  font-size: 19px;
  line-height: 1.65;
  color: var(--in-soul);
  margin: 0;
}

/* ---------- Steps (cómo se vive) ---------- */
.in-steps {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-7);
}
.in-step {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: var(--sp-5);
  align-items: baseline;
}
.in-step-num {
  font-family: var(--ff-display);
  font-style: italic;
  font-weight: 400;
  font-size: 40px;
  line-height: 1;
  color: var(--in-soul);
  opacity: 0.7;
}
.in-step-body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.in-step-when {
  font-family: var(--ff-text);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  color: var(--in-gray);
}
.in-step-text {
  font-weight: 300;
  font-size: 18px;
  line-height: 1.55;
  color: var(--in-soul);
  margin: 0;
}

/* ---------- Testimonios ---------- */
.in-testimonials {
  padding: var(--sp-10) var(--sp-8);
  background: var(--in-power);
  border-top: 1px solid var(--rule);
}
.in-testimonials-inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}
.in-testimonials-inner .in-eyebrow {
  margin-bottom: var(--sp-7);
}
.in-testimonials-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-6) var(--sp-8);
  text-align: left;
}
.in-testimonial {
  margin: 0;
  padding: 0;
  border-left: 1px solid var(--rule);
  padding-left: var(--sp-5);
}
.in-testimonial p {
  font-family: var(--ff-text);
  font-weight: 300;
  font-style: italic;
  font-size: 19px;
  line-height: 1.5;
  color: var(--in-soul);
  margin: 0;
}
@media (max-width: 700px) {
  .in-testimonials-grid {
    grid-template-columns: 1fr;
    gap: var(--sp-5);
  }
}

/* ---------- Bloque de compra ---------- */
.in-purchase {
  padding: var(--sp-10) var(--sp-8);
  background: var(--in-power);
  border-top: 1px solid var(--rule);
  text-align: center;
}
.in-purchase-inner {
  max-width: 640px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-4);
}
.in-purchase-price {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(72px, 10vw, 128px);
  line-height: 1;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin: 0;
}
.in-purchase-terms {
  font-weight: 300;
  font-size: 16px;
  line-height: 1.55;
  color: var(--in-gray);
  margin: 0;
  max-width: 420px;
}
.in-purchase-actions {
  margin-top: var(--sp-5);
}
.in-purchase-guarantee {
  margin-top: var(--sp-4);
  font-size: 14px;
  opacity: 0.8;
}
.in-purchase-lang-alt {
  margin: var(--sp-3) 0 0 0;
  font-size: 13px;
}
.in-purchase-lang-alt a {
  color: var(--in-gray);
  border-bottom: 1px solid var(--in-gray);
  padding-bottom: 1px;
  transition: color var(--dur-fast) var(--ease-io), border-color var(--dur-fast) var(--ease-io);
}
.in-purchase-lang-alt a:hover {
  color: var(--in-soul);
  border-bottom-color: var(--in-soul);
}

/* ---------- FAQ (preguntas frecuentes desplegables) ---------- */
.in-faq {
  display: flex;
  flex-direction: column;
}
.in-faq-item {
  border-top: 1px solid var(--rule);
}
.in-faq-item:last-child {
  border-bottom: 1px solid var(--rule);
}
.in-faq-q {
  font-family: var(--ff-text);
  font-weight: 300;
  font-size: 18px;
  line-height: 1.5;
  color: var(--in-soul);
  cursor: pointer;
  list-style: none;
  position: relative;
  padding: var(--sp-5) var(--sp-7) var(--sp-5) 0;
  transition: color var(--dur-fast) var(--ease-io);
}
.in-faq-q::-webkit-details-marker { display: none; }
.in-faq-q::after {
  content: "+";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--ff-text);
  font-weight: 200;
  font-size: 24px;
  line-height: 1;
  color: var(--in-gray);
  transition: color var(--dur-fast) var(--ease-io);
}
.in-faq-item[open] .in-faq-q::after {
  content: "−";
  color: var(--in-soul);
}
.in-faq-q:hover {
  color: var(--in-soul);
}
.in-faq-q:hover::after {
  color: var(--in-soul);
}
.in-faq-a {
  font-weight: 300;
  font-size: 17px;
  line-height: 1.65;
  color: var(--in-gray);
  margin: 0 0 var(--sp-5) 0;
  padding-right: var(--sp-7);
  max-width: 640px;
}

/* ---------- Responsive página de venta ---------- */
@media (max-width: 900px) {
  .in-experience-hero,
  .in-recognition,
  .in-block,
  .in-purchase {
    padding-left: var(--sp-5);
    padding-right: var(--sp-5);
  }
  .in-experience-hero {
    padding-top: var(--sp-9);
    padding-bottom: var(--sp-8);
  }
  .in-recognition,
  .in-purchase {
    padding-top: var(--sp-9);
    padding-bottom: var(--sp-9);
  }
  .in-block {
    padding-top: var(--sp-8);
    padding-bottom: var(--sp-8);
  }
  .in-experience-title {
    font-size: clamp(40px, 12vw, 72px);
  }
  .in-recognition-body {
    font-size: clamp(18px, 5vw, 24px);
  }
  .in-purchase-price {
    font-size: clamp(56px, 18vw, 88px);
  }
  .in-step {
    grid-template-columns: 36px 1fr;
    gap: var(--sp-4);
  }
  .in-step-num {
    font-size: 32px;
  }
}

/* ============================================================
   PÁGINAS LEGALES — /privacidad.html, /terminos.html
   ============================================================ */

.in-legal-hero {
  padding: var(--sp-10) var(--sp-8) var(--sp-8) var(--sp-8);
  background: var(--in-power);
  text-align: center;
}
.in-legal-hero-inner {
  max-width: 720px;
  margin: 0 auto;
}
.in-legal-hero-inner .in-eyebrow {
  margin-bottom: var(--sp-4);
}
.in-legal-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1.05;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin: 0 0 var(--sp-4) 0;
}
.in-legal-meta {
  font-size: 12px;
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  font-weight: 500;
  color: var(--in-gray);
  margin: 0;
}

.in-legal {
  padding: 0 var(--sp-8) var(--sp-10) var(--sp-8);
  border-top: 1px solid var(--rule);
}
.in-legal-inner {
  max-width: 680px;
  margin: 0 auto;
  padding-top: var(--sp-9);
}
.in-legal-inner p {
  font-family: var(--ff-text);
  font-weight: 300;
  font-size: 16px;
  line-height: 1.7;
  color: var(--in-soul);
  margin: 0 0 var(--sp-5) 0;
}
.in-legal-inner h2 {
  font-family: var(--ff-text);
  font-weight: 400;
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: -0.005em;
  color: var(--in-soul);
  margin: var(--sp-7) 0 var(--sp-4) 0;
}
.in-legal-inner h2:first-child {
  margin-top: 0;
}

@media (max-width: 900px) {
  .in-legal-hero {
    padding: var(--sp-9) var(--sp-5) var(--sp-7) var(--sp-5);
  }
  .in-legal {
    padding: 0 var(--sp-5) var(--sp-9) var(--sp-5);
  }
  .in-legal-inner {
    padding-top: var(--sp-8);
  }
  .in-legal-inner p {
    font-size: 15px;
  }
}

/* ============================================================
   PÁGINA ORIGEN — /origen.html
   ============================================================ */

.in-origen-hero {
  padding: var(--sp-10) var(--sp-8) var(--sp-9) var(--sp-8);
  background: var(--in-power);
  text-align: center;
}
.in-origen-hero-inner {
  max-width: 720px;
  margin: 0 auto;
}
.in-origen-hero-inner .in-eyebrow {
  margin-bottom: var(--sp-4);
}
.in-origen-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(48px, 6vw, 88px);
  line-height: 1.05;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin: 0;
}

.in-origen {
  padding: 0 var(--sp-8) var(--sp-10) var(--sp-8);
  border-top: 1px solid var(--rule);
}
.in-origen-inner {
  max-width: 680px;
  margin: 0 auto;
  padding-top: var(--sp-9);
}
.in-origen-body {
  font-family: var(--ff-text);
  font-weight: 300;
  font-size: 19px;
  line-height: 1.75;
  color: var(--in-soul);
  margin: 0 0 var(--sp-5) 0;
}
.in-origen-body:last-of-type {
  margin-bottom: var(--sp-7);
}
.in-origen-quote {
  margin: var(--sp-7) 0;
  padding: 0;
  border: 0;
  text-align: center;
}
.in-origen-quote p {
  font-family: var(--ff-text);
  font-style: italic;
  font-weight: 200;
  font-size: clamp(26px, 4vw, 44px);
  line-height: 1.35;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin: 0;
}
.in-origen-sign {
  font-family: var(--ff-text);
  font-weight: 300;
  font-size: 15px;
  color: var(--in-gray);
  margin: var(--sp-8) 0 0 0;
  letter-spacing: 0.02em;
}

@media (max-width: 900px) {
  .in-origen-hero {
    padding: var(--sp-9) var(--sp-5) var(--sp-8) var(--sp-5);
  }
  .in-origen {
    padding: 0 var(--sp-5) var(--sp-9) var(--sp-5);
  }
  .in-origen-inner {
    padding-top: var(--sp-8);
  }
  .in-origen-body {
    font-size: 17px;
    line-height: 1.7;
  }
}

/* ============================================================
   PÁGINA GRACIAS — /gracias.html
   ============================================================ */

.in-thanks-body {
  font-weight: 300;
  font-size: 17px;
  line-height: 1.6;
  color: var(--in-gray);
  margin: 0;
  max-width: 480px;
}
.in-thanks-body-alt {
  margin-top: var(--sp-4);
  color: var(--in-soul);
  opacity: 0.85;
}
.in-thanks-actions {
  margin-top: var(--sp-6);
}

/* ============================================================
   PÁGINA AUDIO GRATUITO — /audio.html
   ============================================================ */

.in-mini-hero {
  min-height: calc(100vh - 64px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--sp-9) var(--sp-8);
  background: var(--in-power);
  text-align: center;
}
.in-mini-hero-inner {
  max-width: 640px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-5);
}
.in-mini-hero-inner .in-eyebrow {
  margin-bottom: var(--sp-2);
}
.in-mini-hero-title {
  font-family: var(--ff-text);
  font-weight: 100;
  font-size: clamp(40px, 6vw, 72px);
  line-height: 1.05;
  letter-spacing: var(--tk-tight);
  color: var(--in-soul);
  margin: 0;
}
.in-mini-hero-sub {
  font-weight: 300;
  font-size: 17px;
  line-height: 1.55;
  color: var(--in-gray);
  margin: 0;
}

/* Formulario editorial */
.in-form {
  display: flex;
  gap: var(--sp-3);
  align-items: stretch;
  margin-top: var(--sp-6);
  width: 100%;
  max-width: 440px;
}
.in-form input[type="email"] {
  flex: 1;
  min-width: 0;
  padding: 14px 20px;
  font-family: var(--ff-text);
  font-size: 15px;
  font-weight: 300;
  color: var(--in-soul);
  background: transparent;
  border: 1px solid var(--in-power-80);
  border-radius: 999px;
  outline: none;
  transition: border-color var(--dur-fast) var(--ease-io);
}
.in-form input[type="email"]::placeholder {
  color: var(--in-gray);
  opacity: 0.7;
}
.in-form input[type="email"]:focus {
  border-color: var(--in-soul);
}
.in-form button {
  padding: 14px 28px;
  font-family: var(--ff-text);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: var(--tk-eyebrow);
  text-transform: uppercase;
  color: var(--in-power);
  background: var(--in-soul);
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  transition: opacity var(--dur-fast) var(--ease-io);
  white-space: nowrap;
}
.in-form button:hover { opacity: 0.88; }
.in-form button:active { opacity: 0.7; }

.in-form-note {
  margin-top: var(--sp-4);
  font-size: 12px;
  color: var(--fg-faint);
  letter-spacing: 0.02em;
}
.in-form-error {
  margin-top: var(--sp-3);
  font-size: 13px;
  color: var(--in-gray);
  display: none;
}
.in-form-error.is-visible { display: block; }

@media (max-width: 600px) {
  .in-form {
    flex-direction: column;
    gap: var(--sp-2);
  }
  .in-form button {
    width: 100%;
  }
  .in-mini-hero {
    padding: var(--sp-8) var(--sp-5);
  }
}

/* ---------- Cursor: mantener el del sistema ---------- */
/* (se removió el cursor editorial custom por decisión editorial) */

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .in-header {
    padding: 0 var(--sp-5);
  }
  .in-nav {
    gap: var(--sp-4);
  }
  .in-nav-link {
    font-size: 10px;
  }
  .in-hero {
    padding: var(--sp-8) var(--sp-5);
  }
  .in-hero-logo img {
    height: 60px;
  }
  .in-hero-title {
    white-space: normal;
    font-size: clamp(32px, 8vw, 48px);
  }
  .in-section,
  .in-feature,
  .in-doors,
  .in-anchor-section,
  .in-essay,
  .in-footer {
    padding-left: var(--sp-5);
    padding-right: var(--sp-5);
  }
  .in-section,
  .in-feature,
  .in-doors,
  .in-anchor-section,
  .in-essay {
    padding-top: var(--sp-9);
    padding-bottom: var(--sp-9);
  }
  .in-doors-grid {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
  }
  .in-footer-inner {
    grid-template-columns: 1fr;
    gap: var(--sp-7);
  }
  .in-footer-cols {
    grid-template-columns: 1fr 1fr;
  }
  .in-footer-brand {
    font-size: 48px;
  }
  .in-footer-base {
    flex-direction: column;
    gap: var(--sp-3);
  }
  .in-feature-title {
    font-size: clamp(48px, 12vw, 72px);
  }
  .in-anchor-xl {
    font-size: clamp(56px, 18vw, 96px);
  }
}

@media (max-width: 600px) {
  .in-footer-cols {
    grid-template-columns: 1fr;
  }
  .in-hero-title {
    font-size: clamp(36px, 10vw, 56px);
  }
  .in-hero-sub {
    font-size: 16px;
  }
}

/* ---------- Meta strip debajo del bloque estar en los días (home) ---------- */
.in-feature-meta {
  margin-top: var(--sp-6);
  color: var(--in-gray);
}

/* ---------- Flag "gratis" arriba de la puerta audio gratuito (home) ---------- */
.in-door-flag {
  margin-bottom: var(--sp-3);
  color: var(--in-gray);
}
