/* HablaLora marketing site — kooky brand. Self-contained, no external deps. */

@font-face { font-family:'Recoleta'; src:url('assets/fonts/Recoleta-Regular.woff2') format('woff2'); font-weight:400; font-display:swap; }
@font-face { font-family:'Recoleta'; src:url('assets/fonts/Recoleta-Medium.woff2')  format('woff2'); font-weight:500; font-display:swap; }
@font-face { font-family:'Recoleta'; src:url('assets/fonts/Recoleta-Bold.woff2')    format('woff2'); font-weight:700; font-display:swap; }
@font-face { font-family:'Recoleta'; src:url('assets/fonts/Recoleta-Black.woff2')   format('woff2'); font-weight:900; font-display:swap; }

:root{
  --teal:#00abad; --teal-deep:#0085b1;
  --yellow:#ffdd00; --pink:#ff0088;
  --cream:#fffef9; --ink:#101c1c; --ink-soft:#2b3a3a;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --display:'Recoleta',Georgia,serif;
  --maxw:1140px; --radius:28px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--sans);color:var(--ink);background:var(--cream);line-height:1.6;-webkit-font-smoothing:antialiased;}
h1,h2,h3,.display{font-family:var(--display);font-weight:900;line-height:1.05;letter-spacing:-.02em;}
a{color:var(--teal-deep);text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-weight:700;
  font-size:16px;padding:14px 26px;border-radius:99px;cursor:pointer;border:none;white-space:nowrap;
  box-shadow:0 4px 0 rgba(0,0,0,.18);transition:transform .12s ease,box-shadow .12s ease;}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 rgba(0,0,0,.18);}
.btn-yellow{background:var(--yellow);color:var(--ink);}
.btn-ink{background:var(--ink);color:var(--cream);}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:none;border:2px solid rgba(16,28,28,.15);}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,254,249,.9);backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(16,28,28,.07);}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:900;font-size:22px;color:var(--ink);}
.brand img{width:34px;height:34px;border-radius:9px;}
.nav-links{display:flex;align-items:center;gap:26px;}
.nav-links a{color:var(--ink-soft);font-weight:600;font-size:15px;}
.nav-links a:hover{color:var(--ink);}
.nav .btn{padding:9px 18px;font-size:14px;}
@media(max-width:640px){ .nav-links a:not(.btn){display:none;} .nav .btn{padding:8px 14px;font-size:13px;} .brand{font-size:19px;} }

/* hero */
.hero{position:relative;background:var(--teal);color:var(--cream);overflow:hidden;padding:84px 0 96px;}
.blob{position:absolute;border-radius:60% 40% 55% 45%/55% 60% 40% 45%;z-index:0;}
.blob.y{background:var(--yellow);width:340px;height:340px;top:-90px;right:-90px;transform:rotate(14deg);}
.blob.p{background:var(--pink);width:300px;height:300px;bottom:-120px;left:-110px;opacity:.9;}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;}
.tag{display:inline-block;background:var(--yellow);color:#231d00;font-weight:700;font-size:13px;
  letter-spacing:1.5px;text-transform:uppercase;padding:7px 16px;border-radius:99px;transform:rotate(-2deg);
  box-shadow:0 3px 0 rgba(0,0,0,.16);margin-bottom:22px;}
.hero h1{font-size:clamp(48px,7vw,78px);text-shadow:4px 4px 0 rgba(0,0,0,.12);margin-bottom:16px;}
.hero .lede{font-size:clamp(18px,2.4vw,22px);color:rgba(255,254,249,.92);max-width:30ch;margin-bottom:32px;}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;}
.price-note{font-size:14px;color:rgba(255,254,249,.8);}
.hero-shot{justify-self:center;}
.hero-shot img{width:min(300px,72vw);border-radius:34px;box-shadow:0 24px 60px rgba(0,0,0,.34);transform:rotate(2deg);}
@media(max-width:820px){ .hero .wrap{grid-template-columns:1fr;text-align:center;} .hero .lede{margin-inline:auto;} .hero-cta{justify-content:center;} .hero-shot{margin-top:20px;} }

/* generic section */
.section{padding:88px 0;}
.section h2{font-size:clamp(34px,4.4vw,52px);text-align:center;margin-bottom:12px;}
.section .sub{text-align:center;color:var(--ink-soft);font-size:18px;max-width:52ch;margin:0 auto 52px;}

/* feature grid */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.card{background:#fff;border:1px solid rgba(16,28,28,.08);border-radius:var(--radius);padding:30px 26px;
  box-shadow:0 8px 24px rgba(16,28,28,.05);}
.card .ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:26px;margin-bottom:16px;}
.card h3{font-size:22px;margin-bottom:8px;}
.card p{color:var(--ink-soft);font-size:15.5px;}
.i-teal{background:rgba(0,171,173,.14);}
.i-yellow{background:rgba(255,221,0,.22);}
.i-pink{background:rgba(255,0,136,.12);}
@media(max-width:860px){ .features{grid-template-columns:1fr;} }

/* screenshots strip */
.shots{background:var(--yellow);}
.shots h2{color:var(--ink);}
.shot-row{display:flex;gap:22px;overflow-x:auto;padding:8px 4px 20px;scroll-snap-type:x mandatory;}
.shot-row img{width:230px;flex:0 0 auto;border-radius:26px;scroll-snap-align:center;
  box-shadow:0 16px 40px rgba(16,28,28,.22);}

/* privacy band */
.privacy-band{background:var(--ink);color:var(--cream);}
.privacy-band h2{color:var(--cream);}
.privacy-band .sub{color:rgba(255,254,249,.7);}
.pill-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}
.pill{background:rgba(255,254,249,.08);border:1px solid rgba(255,254,249,.16);border-radius:99px;
  padding:12px 22px;font-weight:600;font-size:15px;}

/* final CTA */
.cta{background:var(--teal);color:var(--cream);text-align:center;}
.cta h2{color:var(--cream);}
.cta .big-price{font-family:var(--display);font-weight:900;font-size:clamp(52px,9vw,96px);
  text-shadow:4px 4px 0 rgba(0,0,0,.12);margin:6px 0 4px;}
.cta p{color:rgba(255,254,249,.9);margin-bottom:28px;}

/* footer */
footer{background:var(--cream);border-top:1px solid rgba(16,28,28,.08);padding:40px 0;}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;}
footer .brand{font-size:18px;}
footer nav{display:flex;gap:22px;}
footer nav a{color:var(--ink-soft);font-weight:600;font-size:15px;}
footer .fine{width:100%;color:var(--ink-soft);font-size:13px;opacity:.8;}

/* legal / support article pages */
.doc{max-width:760px;margin:0 auto;padding:64px 24px 88px;}
.doc h1{font-size:clamp(38px,6vw,56px);margin-bottom:8px;}
.doc .updated{color:var(--ink-soft);margin-bottom:36px;font-size:15px;}
.doc h2{font-size:26px;margin:34px 0 10px;}
.doc h3{font-size:19px;margin:22px 0 6px;font-family:var(--sans);font-weight:700;}
.doc p,.doc li{color:var(--ink-soft);margin-bottom:12px;}
.doc ul{padding-left:22px;margin-bottom:12px;}
.doc a{font-weight:600;}
.back{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--teal-deep);margin-bottom:24px;}
.callout{background:rgba(0,171,173,.09);border:1px solid rgba(0,171,173,.25);border-radius:18px;padding:18px 22px;margin:18px 0;color:var(--ink);}