/* pruve.es — notas de mantenimiento en docs/landing.md */

:root{
  --ink:#0F0E0C;
  --ink-soft:#1C1A16;
  --paper:#FFFFFF;
  --cream:#F7F3EA;
  --line:#E6E0D2;
  --muted:#6B665C;
  --brass:#D4AF37;

  --on-ink:var(--cream);
  --on-ink-2:rgba(247,243,234,.7);
  --line-ink:rgba(247,243,234,.16);

  --sans:"Instrument Sans",-apple-system,system-ui,"Segoe UI",Roboto,sans-serif;
  --sistema:-apple-system,system-ui,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --wrap:72rem;
  --gutter:clamp(1.25rem,4vw,3rem);

  interpolate-size:allow-keywords;
}

@font-face{
  font-family:"Instrument Sans";
  src:url(fonts/instrument-sans-var.woff2) format("woff2-variations");
  font-weight:400 700;font-style:normal;font-display:swap;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:4.5rem}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--cream);color:var(--ink);
  font:400 1.0625rem/1.55 var(--sans);letter-spacing:-.008em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.035em;line-height:1;text-wrap:balance}
:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.dark :focus-visible,.footer :focus-visible{outline-color:var(--brass)}

.legal,.error{min-height:100svh;display:flex;flex-direction:column}

.skip{position:absolute;left:-9999px;top:.75rem;z-index:100;background:var(--ink);
  color:var(--on-ink);padding:.6rem 1rem;font-weight:700}
.skip:focus{left:.75rem}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(4rem,10vw,7.5rem)}
.dark{background:var(--ink);color:var(--on-ink)}
.alt{background:var(--paper)}

.h-hero{font-size:clamp(2.75rem,9.5vw,5.5rem);line-height:.95}
.h-section{font-size:clamp(2.1rem,5.5vw,3.5rem)}
.h-small{font-size:clamp(1.5rem,3.4vw,2rem);letter-spacing:-.028em}
.lead{font-size:clamp(1.0625rem,2vw,1.25rem);line-height:1.5;color:var(--muted);max-width:36rem;
  margin-top:1.5rem;text-wrap:pretty}
.dark .lead{color:var(--on-ink-2)}
.note{font-size:.9375rem;color:var(--muted);max-width:34rem;margin-top:1rem}
.dark .note{color:var(--on-ink-2)}

.facts{--rule:var(--line);--dt:var(--muted);margin-top:2.75rem;font-size:.9375rem;max-width:48rem}
.dark .facts{--rule:var(--line-ink);--dt:var(--on-ink-2)}
.facts div{display:grid;grid-template-columns:minmax(8rem,10rem) 1fr;gap:.35rem 1rem;
  padding:.85rem 0;border-bottom:1px solid var(--rule)}
.facts div:first-child{border-top:1px solid var(--rule)}
.facts dt{font:500 .75rem/1.9 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dt)}
.facts dd{margin:0}
.facts a{border-bottom:1px solid currentColor}
.facts a:hover{border-bottom-color:var(--brass)}
@media (max-width:26rem){
  .facts div{grid-template-columns:1fr}
  .facts dt{line-height:1.4}
}

.footer{background:var(--ink);color:var(--on-ink-2);padding-block:3rem;font-size:.8125rem}
.footer img{width:70px;height:auto;margin-bottom:1.25rem}
.footer-row{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin-top:1.5rem;padding-top:1.25rem;
  border-top:1px solid var(--line-ink)}
.footer a{color:var(--on-ink);border-bottom:1px solid var(--line-ink)}
.footer-row a{display:inline-flex;align-items:center;min-height:1.5rem}
.footer a:hover{border-bottom-color:var(--brass)}
.social{display:flex;gap:1.25rem;margin-top:1.5rem}
.social a{border:0;color:var(--on-ink);display:inline-flex;padding:.25rem}
.social a:hover{color:var(--brass)}
.social svg{width:1.25rem;height:1.25rem}

.header{position:sticky;top:0;z-index:50;background:rgba(247,243,234,.9);
  -webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line)}
.header .wrap{height:3.5rem;display:flex;align-items:center;gap:2rem}
.header-logo,.logo-link{display:inline-flex;align-items:center;min-height:1.5rem}
.header-logo img{width:66px;height:auto}
.header nav{margin-left:auto;display:none;gap:1.6rem;font-size:.8125rem;color:var(--muted)}
.header nav a{display:inline-flex;align-items:center;min-height:1.5rem}
.header nav a:hover{color:var(--ink)}
.header-cta{margin-left:auto;font-size:.8125rem;font-weight:700;
  border-bottom:2px solid var(--brass);padding-bottom:1px}
@media (min-width:52rem){
  .header nav{display:flex}
  .header-cta{margin-left:1.6rem}
}

.actions{display:flex;flex-wrap:wrap;gap:1.25rem 2.25rem;align-items:center;margin-top:2.25rem}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:3rem;
  background:var(--ink);color:var(--on-ink);font-weight:700;font-size:1rem;padding:.85rem 1.6rem;
  transition:background-color .15s}
.button:hover{background:var(--ink-soft)}
.dark .button{background:var(--cream);color:var(--ink)}
.dark .button:hover{background:var(--paper)}
.link{font-weight:700;border-bottom:2px solid var(--brass);padding-bottom:2px}
.link:hover{border-bottom-color:var(--ink)}
.dark .link:hover{border-bottom-color:var(--on-ink)}
.aside{font-size:.875rem;color:var(--muted);max-width:22rem;margin-top:1rem}
@media (max-width:26rem){.actions .button{width:100%}}

.hero{padding-top:clamp(3rem,8vw,5.5rem)}
.pic{display:block;width:100%;height:auto;background:var(--line)}
.pic-cutout{background:none}
.hero-pic{aspect-ratio:4/5;object-fit:cover}
@media (min-width:56rem){.hero .h-hero{font-size:clamp(3rem,4.6vw,4.5rem)}}

.split{display:grid;gap:clamp(2rem,5vw,4rem);align-items:center}
.split-top{align-items:start}
@media (min-width:56rem){.split{grid-template-columns:1fr 1fr}}

.caption{margin-top:1.5rem;font-size:.9375rem;color:var(--on-ink-2);max-width:26rem}
video.video,.video-fija{display:block;width:100%;max-width:18rem;height:auto;
  justify-self:center;background:var(--ink-soft)}
.video-fija{display:none}

.price{font-size:clamp(4rem,14vw,7rem);font-weight:700;letter-spacing:-.05em;line-height:.9}
.price-terms{font-size:clamp(1.0625rem,2vw,1.25rem);color:var(--muted);margin-top:1.25rem;max-width:32rem}

.center{text-align:center;max-width:44rem;margin-inline:auto}
.center .lead,.center .note{margin-inline:auto}

.wins{margin-top:clamp(3rem,7vw,4.5rem);display:grid;gap:2.5rem 3rem}
.wins li{text-align:center}
@media (min-width:52rem){
  .wins{grid-template-columns:repeat(3,1fr);grid-template-rows:auto auto auto;
    row-gap:0;column-gap:clamp(2rem,4vw,3rem)}
  .wins li{display:grid;grid-template-rows:subgrid;grid-row:span 3;row-gap:0}
}
.check{display:block;width:1.75rem;height:1.75rem;color:var(--ink);margin:0 auto .85rem}
.wins h3{font-size:1.125rem;letter-spacing:-.02em;line-height:1.25;align-self:start}
.wins p{margin-top:.6rem;color:var(--muted);font-size:.9375rem;text-wrap:pretty;align-self:start}

.promise{display:flex;align-items:center;gap:1.75rem;max-width:36rem;text-align:left;
  margin:clamp(3rem,7vw,4rem) auto 0;padding-top:2.25rem;border-top:1px solid var(--line)}
.promise img{width:112px;height:112px;border-radius:50%;object-fit:cover;flex:none}
.promise-hook{font-size:1.125rem;font-weight:700;letter-spacing:-.018em;
  line-height:1.35;text-wrap:balance}
.promise p{font-size:1rem;line-height:1.5;color:var(--muted);text-wrap:pretty}
.promise .promise-hook{color:var(--ink)}
.promise p+p{margin-top:.7rem}
.promise .promise-who+p{margin-top:0}
.promise-who{font-size:.8125rem;font-weight:700;letter-spacing:.01em;
  text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
@media (max-width:34rem){
  .promise{flex-direction:column;text-align:center;gap:1.25rem}
}

.offer{margin:clamp(3.5rem,8vw,5rem) auto 0;padding-top:2.25rem;
  border-top:2px solid var(--ink);max-width:30rem;text-align:center}
.offer .offer-price,.offer .included,.offer .actions{justify-content:center}
.offer .launch,.offer .included{margin-inline:auto}
.pill{display:inline-block;background:var(--brass);color:var(--ink);
  font:700 .75rem/1 var(--sans);letter-spacing:.02em;text-transform:uppercase;padding:.5rem .7rem}
.offer-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:.35rem 1rem;margin-top:1rem}
.offer-price b{font-size:clamp(2.75rem,8vw,3.75rem);letter-spacing:-.045em;line-height:1}
.offer-price span{color:var(--muted);font-size:.9375rem}
.launch{margin-top:.9rem;font-size:1rem;color:var(--muted);max-width:26rem}

.included{display:flex;align-items:center;gap:1.25rem;margin-top:1.5rem;
  padding:1.25rem 1.5rem;background:var(--cream);max-width:28rem}
.included img{height:84px;width:auto;flex:none}
.included span{display:flex;align-items:center;font-size:1.125rem;font-weight:700;
  letter-spacing:-.015em;color:var(--ink)}
.gift{width:1.2em;height:1.2em;flex:none;vertical-align:-.2em;margin-right:.45rem}

.nots{margin-top:2.5rem;display:grid;max-width:60rem}
@media (min-width:52rem){.nots{grid-template-columns:1fr 1fr;column-gap:3.5rem}}
.nots li{padding:1rem 0;border-bottom:1px solid var(--line-ink);font-size:.9375rem;color:var(--on-ink-2)}
.nots strong{display:block;color:var(--on-ink);font-weight:700;margin-bottom:.1rem}

.faq{max-width:44rem;margin-top:2rem;border-top:1px solid var(--line)}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;position:relative;padding:1.15rem 2.25rem 1.15rem 0;
  font-weight:700;letter-spacing:-.015em}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";position:absolute;right:.45rem;top:1.5rem;width:.55rem;height:.55rem;
  border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);
  transition:transform .25s,top .25s}
.acc details[open] summary::after{transform:rotate(-135deg);top:1.75rem}
.faq details p{padding:0 0 1.25rem;color:var(--muted);font-size:.9375rem;max-width:40rem}
.specs{margin-top:2rem;max-width:30rem;border-top:1px solid var(--line)}
.specs .facts{margin:0 0 1.25rem}
.acc details::details-content{block-size:0;overflow:clip;opacity:0;
  transition:block-size .38s cubic-bezier(.2,.7,.25,1),opacity .28s ease,
             content-visibility .38s allow-discrete}
.acc details[open]::details-content{block-size:auto;opacity:1}
@media (prefers-reduced-motion:reduce){
  .acc details::details-content,.acc summary::after{transition:none}
  video.video{display:none}
  .video-fija{display:block}
}

.closing{text-align:center}
.closing .lead,.closing .note{margin-inline:auto}
.closing .actions{justify-content:center}

.legal{line-height:1.65}

.bar{border-bottom:1px solid var(--line)}
.bar a{display:inline-block;padding:1rem 0}
.bar img{width:66px}

.inner{width:100%;max-width:40rem;margin-inline:auto;padding-inline:var(--gutter)}

.page{flex:1;width:100%;max-width:40rem;margin-inline:auto;
  padding:clamp(2.5rem,7vw,4.5rem) var(--gutter) clamp(4rem,9vw,6rem)}
.legal h1{font-size:clamp(2rem,6vw,2.75rem);line-height:1.05}
.legal h2{margin:3rem 0 .85rem;font-size:1.25rem;letter-spacing:-.022em;line-height:1.25}
.updated{margin-top:.85rem;color:var(--muted);font-size:.9375rem}
.intro{margin-top:2rem;text-wrap:pretty}
.page p+p{margin-top:1rem}
.page a{color:var(--ink);border-bottom:1px solid currentColor}
.page a:hover{border-bottom-color:var(--brass)}
.legal .facts{margin:1.5rem 0 0}
.legal .footer{padding-block:2.5rem}
.legal .footer-row{margin-top:1.25rem}

@media print{
  .legal .bar,.legal .footer,.legal .skip{display:none}
  .legal{background:#fff;color:#000;font-size:11pt}
  .legal .page{max-width:none;padding:0}
  .legal h2{margin-top:1.5rem;break-after:avoid}
  .legal .page a{border:0;text-decoration:underline}
}

.error{font-family:var(--sistema)}
.error .wrap{width:100%;max-width:34rem;margin:auto;
  padding:4rem clamp(1.25rem,6vw,2rem)}
.error h1{font-size:clamp(2rem,7vw,2.75rem);line-height:1.05}
.error p{margin:1.25rem 0 0;color:var(--muted);text-wrap:pretty}
.logo-link{margin-bottom:3rem}
.logo{width:66px}
.back{display:inline-block;margin-top:2.25rem;font-weight:700;color:var(--ink);
  border-bottom:2px solid var(--brass);padding-bottom:2px}
.back:hover{border-bottom-color:var(--ink)}
.mail{margin-top:1.5rem;font-size:.9375rem}
.mail a{color:var(--muted);border-bottom:1px solid currentColor}
.mail a:hover{border-bottom-color:var(--brass)}