/* Venusiana landing — tokens from venusiana-brand/brand-guidelines.md v1.1
   ponytail: single light theme on purpose; the brand lives on butter-cream paper */
:root{
  --crema:#FFF9CC; --rosa:#FBA3D9; --rojo:#B4080C; --vino:#5C0E17;
  --rosa-suave:#FDD7D1; --vino-suave:#854944; /* support tints */
  --f-display:"Shrikhand","Cooper Black",Georgia,serif;
  --f-body:"Karla","Helvetica Neue",Arial,sans-serif;
  --f-hand:"Caveat","Bradley Hand","Segoe Print",cursive;
  --wrap:1200px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --radius:32px;
}
*{box-sizing:border-box}
html{color-scheme:light;scroll-behavior:smooth;scroll-padding-top:90px;overflow-x:clip}
body{margin:0;background:var(--crema);color:var(--vino);font:400 17px/1.65 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;line-height:1.05;margin:0;text-wrap:balance;color:var(--rojo)}
h2{font-size:clamp(2.3rem,5vw,4rem)}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(20px,4vw,48px);position:relative}
.eyebrow{font:700 .78rem/1.2 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--vino-suave)}
.hand{font-family:var(--f-hand);font-weight:700;line-height:1.1;font-size:1.9rem}
.defs{position:absolute}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--vino);color:var(--crema);padding:10px 16px;border-radius:999px;font-weight:700}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--vino);outline-offset:3px;border-radius:6px}
section{position:relative}
.sec-head{display:grid;gap:16px;max-width:760px;margin-bottom:clamp(40px,5vw,64px)}
.sec-head>p:not(.eyebrow):not(.hand){font-size:1.1rem;color:var(--vino-suave);max-width:58ch}
.sec-row{max-width:none;grid-template-columns:1.2fr 1fr;align-items:end;gap:32px}

/* hand-drawn elements recolored through CSS masks */
.el{display:block;aspect-ratio:1;background:var(--c,var(--rojo));-webkit-mask:var(--src) center/contain no-repeat;mask:var(--src) center/contain no-repeat}
.float{position:absolute;animation:float var(--t,7s) ease-in-out infinite alternate}
@keyframes float{from{transform:translateY(0) rotate(var(--r0,-6deg))}to{transform:translateY(-16px) rotate(var(--r1,7deg))}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:14px 26px;border-radius:999px;border:0;background:var(--rojo);color:var(--crema);font:700 1rem/1.1 var(--f-body);text-decoration:none;cursor:pointer;transition:transform .3s var(--ease),background-color .25s,color .25s,box-shadow .25s}
.btn:hover{transform:translateY(-2px) rotate(-2deg);background:var(--vino)}
.btn:active{transform:scale(.97)}
.btn .arrow{width:20px;height:20px;transition:transform .3s var(--ease)}
.btn:hover .arrow{transform:translateX(4px)}
.btn-sm{min-height:44px;padding:10px 20px;font-size:.95rem}
.btn-ghost{background:transparent;color:var(--rojo);box-shadow:inset 0 0 0 2px var(--rojo)}
.btn-ghost:hover{background:var(--rojo);color:var(--crema)}
.btn-vino{background:var(--vino)}
.btn-vino:hover{background:var(--rojo)}
.btn-light{background:var(--crema);color:var(--vino)}
.btn-light:hover{background:var(--rosa);color:var(--vino)}
.btn-big{min-height:60px;padding:18px 32px;font-size:1.1rem}
.wa-icon{width:24px;height:24px}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--crema) 86%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:box-shadow .3s}
.nav.scrolled{box-shadow:0 1px 0 var(--rosa-suave)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:78px}
.nav-logo img{width:56px;height:56px;transition:transform .6s var(--ease)}
.nav-logo:hover img{transform:rotate(-20deg)}
.nav-links{display:flex;gap:clamp(18px,3vw,40px)}
.nav-links a{font-weight:700;text-decoration:none;padding:10px 2px}
.nav-links a:hover{text-decoration:underline wavy var(--rosa) 2px;text-underline-offset:7px}

/* ---------- hero ---------- */
.hero{padding:clamp(28px,4vw,56px) 0 clamp(72px,9vw,120px);overflow:hidden}
.hero-blob{position:absolute;z-index:0;right:-14%;top:-18%;width:min(66vw,960px);aspect-ratio:1;background:var(--rosa);border-radius:48% 52% 60% 40%/50% 45% 55% 50%;animation:morph 20s ease-in-out infinite alternate}
.hero-grid{z-index:1;display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(24px,4vw,64px);align-items:center}
.hero-copy{display:grid;gap:26px}
.hero-title{font-size:clamp(3.2rem,8vw,7.2rem);line-height:.9}
.hero-title .line{display:block;overflow:hidden;padding:.02em 0 .1em}
.hero-title .line>span{display:inline-block;animation:rise 1.1s var(--ease) both;animation-delay:calc(var(--i)*.13s + .1s)}
.hero-title .script{display:block;font-family:var(--f-hand);font-weight:700;font-size:.66em;line-height:1;color:var(--vino);transform:rotate(-5deg);margin:-.08em 0 0 1.5em;animation:pop 1s .6s var(--ease) both}
.lead{font-size:clamp(1.08rem,1.4vw,1.25rem);max-width:44ch}
.cta-row{display:flex;flex-wrap:wrap;gap:14px}
@keyframes rise{from{transform:translateY(110%)}}
@keyframes pop{from{opacity:0;transform:rotate(-16deg) scale(.6)}}
@keyframes morph{
  0%{border-radius:48% 52% 60% 40%/50% 45% 55% 50%}
  50%{border-radius:60% 40% 44% 56%/42% 58% 42% 58%}
  100%{border-radius:42% 58% 52% 48%/56% 44% 60% 40%}}

.hero-art{position:relative;width:100%;max-width:560px;aspect-ratio:1/1.1;justify-self:end}
.hero-art .rings{position:absolute;inset:-14%;width:128%;height:128%;color:var(--rojo);opacity:.28;animation:spin 90s linear infinite}
.hero-art .photo-blob{position:absolute;inset:5% 5% 9% 9%;border-radius:58% 42% 50% 50%/46% 55% 45% 54%;animation:morph 14s ease-in-out infinite alternate-reverse;box-shadow:0 30px 60px -30px rgba(92,14,23,.45)}
.seal{position:absolute;left:-3%;bottom:0;width:34%;aspect-ratio:1;border-radius:50%;background:var(--vino);display:grid;place-items:center}
.seal svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 26s linear infinite}
.seal text{fill:var(--rosa);font:700 14.5px var(--f-body);letter-spacing:3.3px;text-transform:uppercase}
.seal .el{width:30%;animation:beat 2.4s ease-in-out infinite}
.flower{width:24%;right:2%;bottom:-2%}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes beat{0%,100%{transform:scale(1)}15%{transform:scale(1.15)}30%{transform:scale(1)}45%{transform:scale(1.1)}}

/* photos: illustrated placeholder until a real photo is dropped into assets/fotos */
.photo{position:relative;display:block;overflow:hidden;margin:0;background:var(--rosa);--ph:var(--rojo)}
.photo::before{content:"";position:absolute;inset:30%;background:var(--ph);-webkit-mask:var(--ph-src,url(assets/elementos/elements-01.svg)) center/contain no-repeat;mask:var(--ph-src,url(assets/elementos/elements-01.svg)) center/contain no-repeat}
.photo img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.ph-rosa{background:var(--rosa);--ph:var(--rojo)}
.ph-suave{background:var(--rosa-suave);--ph:var(--vino)}
.ph-rojo{background:var(--rojo);--ph:var(--rosa)}
.ph-vino{background:var(--vino);--ph:var(--rosa)}
.ph-crema{background:var(--crema);--ph:var(--rojo);box-shadow:inset 0 0 0 2px var(--rosa-suave)}
.photo-wavy{clip-path:url(#wavy);aspect-ratio:4/5}

/* ---------- marquee ---------- */
.marquee{background:var(--rojo);color:var(--rosa);padding:16px 0;overflow:hidden;transform:rotate(-1.6deg);width:106%;margin:-26px 0 0 -3%;position:relative;z-index:2}
.marquee-track{display:flex;align-items:center;gap:28px;width:max-content;animation:marquee 36s linear infinite}
.marquee span{font:400 clamp(1.4rem,2.4vw,2rem)/1 var(--f-display);white-space:nowrap}
.marquee .el{width:34px;background:var(--rosa)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- manifesto ---------- */
.manifesto{padding:clamp(88px,11vw,150px) 0}
.manifesto-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(32px,6vw,96px);align-items:start}
.manifesto h2{font-size:clamp(2.5rem,5.4vw,4.6rem)}
.manifesto-body{display:grid;gap:40px}
.big-p{font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.45;max-width:36ch}
.truths{display:grid;gap:26px}
.truths li{display:grid;grid-template-columns:60px 1fr;gap:18px;align-items:start;padding-top:22px;border-top:2px dashed var(--rosa)}
.truths .el{width:54px;transition:transform .5s var(--ease)}
.truths li:hover .el{transform:rotate(-14deg) scale(1.12)}
.truths h3{font-size:1.5rem;margin-bottom:4px}
.truths p{color:var(--vino-suave)}

/* ---------- about ---------- */
.about{padding:0 0 clamp(88px,11vw,150px)}
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(40px,7vw,110px);align-items:center}
.about-art{position:relative;max-width:500px;width:100%}
.about-art .photo-wavy{transition:transform .8s var(--ease)}
.about-art:hover .photo-wavy{transform:rotate(-2deg)}
.hand-note{position:absolute;left:-2%;top:6%;z-index:2;font:700 2.1rem/1 var(--f-hand);color:var(--vino);background:var(--crema);padding:4px 14px 8px;border-radius:999px;transform:rotate(-9deg);white-space:nowrap}
.about-copy{display:grid;gap:20px;max-width:62ch}
.about-copy h2{font-size:clamp(2.2rem,4.4vw,3.6rem)}
.about-copy>p:not(.eyebrow):not(.sign){font-size:1.08rem}
.pull{margin:10px 0;padding:28px 30px;background:var(--rosa);border-radius:28px 28px 28px 6px;display:grid;grid-template-columns:48px 1fr;gap:18px;align-items:start}
.pull .el{width:44px}
.pull p{font:400 clamp(1.25rem,2vw,1.55rem)/1.3 var(--f-display);color:var(--rojo)}
.sign{font:700 2.8rem/1 var(--f-hand);color:var(--rojo);transform:rotate(-4deg);transform-origin:left}

/* ---------- pause ---------- */
.pause{background:var(--rosa);padding:clamp(88px,11vw,150px) 0;overflow:hidden}
.pause .rings{position:absolute;width:min(90vw,1100px);aspect-ratio:1;right:-30%;top:50%;translate:0 -50%;color:var(--vino);opacity:.14;animation:spin 120s linear infinite}
.pause-in{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:clamp(16px,4vw,56px);row-gap:clamp(14px,2vw,22px)}
.pause-in>p{grid-column:1}
.pause .eyebrow{color:var(--vino);margin-bottom:12px}
.pause-line{font:400 clamp(1.9rem,4.4vw,3.7rem)/1.08 var(--f-display);color:var(--vino);max-width:22ch;text-wrap:balance}
.pause-line:nth-of-type(3){margin-left:clamp(0px,8vw,120px);color:var(--rojo)}
.pause-line:nth-of-type(4){margin-left:clamp(0px,16vw,240px)}
/* heart lives in its own column so it can never cover the lines */
.pause .pause-heart{position:relative;grid-column:2;grid-row:1/span 4;align-self:end;width:clamp(80px,11vw,150px)}
@media (max-width:640px){
  .pause-in{grid-template-columns:1fr}
  .pause .pause-heart{grid-column:1;grid-row:auto;justify-self:end;width:84px}
}

/* ---------- services ---------- */
.services{background:var(--vino);color:var(--crema);padding:clamp(88px,11vw,150px) 0}
.services h2{color:var(--rosa)}
.services .eyebrow{color:var(--rosa-suave)}
.services .sec-head>p:not(.eyebrow):not(.hand){color:var(--rosa-suave)}
.services .sec-head .hand{color:var(--crema);font-size:2.1rem;transform:rotate(-2deg);transform-origin:left}
.services :focus-visible{outline-color:var(--rosa)}
.service-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:24px;align-items:start}
.service{position:relative;overflow:hidden;border-radius:var(--radius);padding:clamp(28px,4vw,52px);display:grid;gap:18px;align-content:start;color:var(--vino);transition:transform .5s var(--ease),opacity .9s var(--ease) var(--d,0s)}
.service:hover{transform:translateY(-6px) rotate(-.6deg)}
.service :focus-visible{outline-color:var(--vino)}
.s-talleres{background:var(--crema)}
.s-piezas{background:var(--rosa);margin-top:clamp(0px,6vw,90px)}
.service h3{font-size:clamp(2rem,3.4vw,2.9rem);max-width:13ch}
.service h4{font-family:var(--f-body);font-weight:700;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vino-suave);margin-top:6px}
.s-piezas h4{color:var(--vino)}
.service-lead{font-size:1.22rem;line-height:1.45;font-weight:500}
.service .btn{justify-self:start;margin-top:8px;position:relative;z-index:1}
.service .hand{color:var(--rojo);font-size:1.8rem}
.tag{justify-self:start;padding:7px 14px;border-radius:999px;background:var(--rosa-suave);color:var(--rojo);font:700 .76rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase}
.s-piezas .tag{background:var(--crema)}
.includes{display:grid;grid-template-columns:1fr 1fr;gap:12px 22px}
.includes li{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;line-height:1.4}
.includes li::before{content:"";width:20px;aspect-ratio:1;margin-top:1px;background:var(--rojo);-webkit-mask:url(assets/elementos/elements-01.svg) center/contain no-repeat;mask:url(assets/elementos/elements-01.svg) center/contain no-repeat;transition:transform .4s var(--ease)}
.includes li:hover::before{transform:scale(1.35) rotate(-12deg)}
.note{font-size:.95rem;color:var(--vino-suave);padding:12px 16px;border-radius:14px;background:var(--rosa-suave)}
.ideas{display:flex;flex-wrap:wrap;gap:10px}
.ideas li{padding:8px 16px;border-radius:999px;background:var(--crema);font-weight:500;transition:transform .3s var(--ease)}
.ideas li:nth-child(odd):hover{transform:rotate(-3deg)}
.ideas li:nth-child(even):hover{transform:rotate(3deg)}
.service-art{position:absolute;width:170px;right:-34px;top:-30px;opacity:.9;transform:rotate(18deg)}
.service-flower{position:absolute;width:150px;right:-18px;top:-22px;transform:rotate(-14deg);transition:transform .8s var(--ease)}
.s-piezas:hover .service-flower{transform:rotate(12deg) scale(1.06)}
.private{margin-top:24px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:22px 22px 22px 34px;border:2px dashed var(--rosa);border-radius:999px}
.private p{font-size:1.1rem}
.private strong{color:var(--rosa)}

/* ---------- steps ---------- */
.steps-sec{padding:clamp(88px,11vw,150px) 0}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;position:relative}
.steps::before{content:"";position:absolute;top:36px;left:6%;right:6%;border-top:3px dashed var(--rosa)}
.steps li{position:relative;display:grid;gap:10px;align-content:start}
.num{width:72px;height:72px;display:grid;place-items:center;background:var(--rosa);color:var(--rojo);font:400 2rem/1 var(--f-display);border-radius:52% 48% 46% 54%/50% 54% 46% 50%;box-shadow:0 0 0 8px var(--crema);transition:transform .5s var(--ease)}
.steps li:hover .num{transform:rotate(-12deg) scale(1.08)}
.steps h3{font-size:1.45rem;margin-top:8px}
.steps p{color:var(--vino-suave)}

/* ---------- gallery ---------- */
.gallery{background:var(--rosa-suave);padding:clamp(88px,11vw,150px) 0}
.gallery .sec-row>p{color:var(--vino-suave);font-size:1.1rem}
.masonry{columns:3 260px;column-gap:22px}
.g-item{break-inside:avoid;margin:0 0 22px}
.g-btn{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;border-radius:26px}
.g-btn:disabled{cursor:default}
.g-btn .photo{aspect-ratio:var(--ar,4/5);border-radius:26px}
.g-item:nth-child(3n+2) .photo{border-radius:120px 120px 26px 26px}
.g-item:nth-child(4n) .photo{border-radius:26px 90px 26px 26px}
.g-btn:not(:disabled):hover .photo img{transform:scale(1.06)}
.g-btn .photo::before{transition:transform .6s var(--ease)}
.g-btn:hover .photo::before{transform:rotate(-10deg) scale(1.08)}
.g-item figcaption{font:700 1.5rem/1.1 var(--f-hand);color:var(--vino);margin:10px 0 0 8px}

.lightbox{border:0;padding:0;background:transparent;max-width:min(92vw,1040px);max-height:92vh;overflow:visible}
.lightbox::backdrop{background:rgba(92,14,23,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.lightbox[open]{animation:lb-in .45s var(--ease)}
.lightbox img{max-height:80vh;width:auto;border-radius:24px;margin:0 auto}
.lb-cap{margin-top:12px;text-align:center;font:700 1.8rem/1 var(--f-hand);color:var(--crema)}
.lb-close{position:absolute;top:-18px;right:-18px;width:48px;height:48px;border-radius:50%;border:0;background:var(--crema);color:var(--vino);display:grid;place-items:center;cursor:pointer}
.lb-close svg{width:22px;height:22px}
@keyframes lb-in{from{opacity:0;transform:scale(.92) rotate(-2deg)}}

/* ---------- instagram ---------- */
.insta{padding:clamp(88px,11vw,150px) 0}
.insta-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,110px);align-items:center}
.insta-copy{display:grid;gap:22px;max-width:56ch}
.insta-copy h2{font-size:clamp(2.3rem,4.6vw,3.8rem)}
.insta-copy>p{font-size:1.12rem}
.insta-copy>p a,.note a{color:var(--rojo);font-weight:700;text-decoration:underline wavy var(--rosa) 2px;text-underline-offset:5px}
.insta-list{display:flex;flex-wrap:wrap;gap:10px}
.insta-list li{display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:var(--rosa-suave);color:var(--vino);font-weight:700}
.insta-list li::before{content:"";width:16px;aspect-ratio:1;background:var(--rojo);-webkit-mask:url(assets/elementos/elements-01.svg) center/contain no-repeat;mask:url(assets/elementos/elements-01.svg) center/contain no-repeat}
.insta-copy .btn{justify-self:start}
.ig-icon{width:22px;height:22px}
.insta-feed{position:relative;display:grid;gap:16px;padding:22px 22px 70px;border-radius:36px;background:var(--rosa);color:var(--vino);text-decoration:none;rotate:2deg;box-shadow:0 30px 60px -34px rgba(92,14,23,.5);transition:rotate .5s var(--ease),transform .5s var(--ease),opacity .9s var(--ease) var(--d,0s)}
.insta-feed:hover{rotate:0deg;transform:translateY(-6px)}
.insta-head{display:flex;align-items:center;gap:12px}
.insta-head img{width:48px;height:48px;border-radius:50%;background:var(--crema);box-shadow:0 0 0 3px var(--crema)} /* pink logo would vanish on the pink card */
.insta-head b{display:block;font-size:1.05rem}
.insta-head small{font-size:.85rem}
.insta-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;border-radius:20px;overflow:hidden}
.insta-tiles span{aspect-ratio:1;overflow:hidden;background:var(--rosa-suave)}
.insta-tiles img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.insta-feed:hover .insta-tiles img{transform:scale(1.06)}
/* note sits in the card's bottom padding, clear of the photos */
.insta-note{position:absolute;right:22px;bottom:16px;font:700 1.7rem/1 var(--f-hand);color:var(--vino);background:var(--crema);padding:6px 16px 10px;border-radius:999px;rotate:-4deg}

/* ---------- experiencias (testimonials as chat bubbles) ---------- */
.love{background:var(--rojo);color:var(--crema);padding:clamp(88px,11vw,150px) 0;overflow:hidden}
.love h2{color:var(--crema)}
.love .eyebrow,.love .sec-head>p:not(.eyebrow):not(.hand){color:var(--rosa-suave)}
.love :focus-visible{outline-color:var(--crema)}
.love-feature{margin:0 0 clamp(48px,6vw,80px);display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:clamp(20px,4vw,64px);align-items:center}
.love-feature blockquote,.love-feature figcaption{grid-column:1;margin:0}
.love-big{font:400 clamp(2.4rem,6vw,5.2rem)/1 var(--f-display);color:var(--crema);text-wrap:balance}
.love-rest{margin-top:18px;font-size:clamp(1.1rem,1.6vw,1.3rem);max-width:48ch;color:var(--rosa-suave)}
.love-feature figcaption{margin-top:14px;font:700 1.7rem/1 var(--f-hand);color:var(--rosa)}
/* heart sits in its own column so it never covers the quote */
.love .love-heart{position:relative;grid-column:2;grid-row:1/span 2;width:clamp(110px,16vw,220px)}
.bubbles{columns:3 290px;column-gap:24px}
/* ponytail: inline-grid + width 100% so the column keeps the bottom margin and the reaction chip isn't clipped */
.bubble{position:relative;break-inside:avoid;margin:0 0 44px;padding:26px 26px 30px;border-radius:30px 30px 30px 6px;display:inline-grid;width:100%;vertical-align:top;gap:14px;transition:transform .5s var(--ease),opacity .9s var(--ease) var(--d,0s)}
.bubble p{font-size:1.06rem;line-height:1.55;font-weight:500}
.bubble .who{font:700 .76rem/1.2 var(--f-body);letter-spacing:.12em;text-transform:uppercase}
.b-crema{background:var(--crema);color:var(--vino)}
.b-crema .who{color:var(--vino-suave)}
.b-rosa{background:var(--rosa);color:var(--vino)}
.b-vino{background:var(--vino);color:var(--crema)}
.b-vino .who{color:var(--rosa-suave)}
.bubble:nth-child(odd):hover{transform:translateY(-4px) rotate(-1.2deg)}
.bubble:nth-child(even):hover{transform:translateY(-4px) rotate(1.2deg)}
.bubble.reveal.pending:not(.in){transform:translateY(34px) scale(.94) rotate(-2deg)}
.react{position:absolute;left:18px;bottom:-18px;width:40px;height:40px;border-radius:50%;background:var(--crema);box-shadow:0 0 0 3px var(--rojo);display:grid;place-items:center}
.react .el{width:22px;background:var(--rojo)}
.bubble:hover .react .el{animation:beat 1.2s ease-in-out}
.shouts{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
.shouts li{padding:12px 20px;border-radius:999px;background:var(--rosa);color:var(--vino);font:400 clamp(1.05rem,1.6vw,1.3rem)/1.2 var(--f-display);transition:transform .4s var(--ease),opacity .9s var(--ease) var(--d,0s)}
.shouts li:nth-child(odd){rotate:-2deg}
.shouts li:nth-child(even){rotate:2deg}
.shouts li:hover{transform:scale(1.05);rotate:0deg}
.shouts span{font:700 .72rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;margin-left:8px;color:var(--vino)}
@media (max-width:640px){
  .love-feature{grid-template-columns:1fr}
  .love .love-heart{grid-column:1;grid-row:auto;justify-self:end;width:96px;margin-top:34px} /* clears the 16px float lift */
  .bubbles{columns:1}
}

/* ---------- final CTA ---------- */
.cta{padding:clamp(88px,11vw,150px) 0}
.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
.checker{position:relative;overflow:hidden;border-radius:44px;min-height:440px;background:var(--rosa);display:grid;place-items:center}
.checker-in{position:absolute;inset:-60px;background:repeating-conic-gradient(var(--rosa) 0 25%,var(--rojo) 0 50%) 0 0/92px 92px;filter:url(#wobble)}
.cta-logo{position:relative;width:48%;max-width:240px;filter:drop-shadow(0 18px 30px rgba(92,14,23,.35));animation:float 6s ease-in-out infinite alternate;--r0:-8deg;--r1:6deg}
.cta-card{background:var(--rosa-suave);border-radius:44px;padding:clamp(32px,5vw,64px);display:grid;gap:18px;align-content:center}
.cta-card h2{font-size:clamp(2.4rem,4.6vw,3.9rem)}
.cta-card .hand{color:var(--vino);font-size:2.2rem;transform:rotate(-3deg);transform-origin:left}
.cta-card>p:not(.hand){font-size:1.12rem;max-width:44ch}
.cta-card .btn{justify-self:start}
.small{font-size:.95rem;color:var(--vino-suave);font-variant-numeric:tabular-nums}

/* ---------- footer ---------- */
.footer{background:var(--vino);color:var(--crema);padding:56px 0 110px}
.footer-in{display:grid;grid-template-columns:1.2fr 1fr auto;gap:32px;align-items:center}
.footer-brand{display:flex;align-items:center;gap:20px}
.footer-brand .hand{color:var(--rosa);font-size:1.9rem}
.footer ul{display:flex;flex-wrap:wrap;gap:8px 24px}
.footer a{font-weight:700;text-decoration:none;padding:8px 0;display:inline-block}
.footer a:hover{color:var(--rosa)}
.footer :focus-visible{outline-color:var(--rosa)}
.copy{color:var(--rosa-suave);font-size:.9rem}

/* ---------- floating WhatsApp ---------- */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:60;display:flex;align-items:center;gap:10px;min-height:60px;padding:8px 22px 8px 8px;border-radius:999px;background:var(--rojo);color:var(--crema);text-decoration:none;font-weight:700;box-shadow:0 14px 30px -10px rgba(92,14,23,.55);transition:transform .35s var(--ease),background-color .25s}
.wa-float svg{width:44px;height:44px;padding:9px;border-radius:50%;background:var(--vino)}
.wa-float::before{content:"";position:absolute;left:8px;top:8px;width:44px;height:44px;border-radius:50%;box-shadow:0 0 0 0 rgba(251,163,217,.8);animation:ring 2.8s ease-out infinite}
.wa-float:hover{transform:translateY(-3px) rotate(-2deg);background:var(--vino)}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(251,163,217,.75)}70%,100%{box-shadow:0 0 0 18px rgba(251,163,217,0)}}

/* ---------- scroll reveal (only below-the-fold elements start hidden; see site.js) ---------- */
.reveal{transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.reveal.pending:not(.in){opacity:0;transform:translateY(34px)}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .hero-grid,.manifesto-grid,.about-grid,.service-grid,.cta-grid,.sec-row,.insta-grid{grid-template-columns:1fr}
  .hero-art{justify-self:center;max-width:460px;margin-top:12px}
  .hero-blob{width:110vw;right:-50%;top:auto;bottom:-10%}
  .about-art{justify-self:center}
  .s-piezas{margin-top:0}
  .steps{grid-template-columns:1fr 1fr;row-gap:44px}
  .steps::before{display:none}
  .footer-in{grid-template-columns:1fr}
  .checker{min-height:340px}
}
@media (max-width:640px){
  body{font-size:16px}
  .nav-links{display:none}
  .nav-in{height:68px}
  .hero-title .script{margin-left:.6em}
  .includes{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .masonry{columns:2 140px;column-gap:14px}
  .g-item{margin-bottom:14px}
  .g-item figcaption{font-size:1.2rem}
  .private{border-radius:28px;padding:22px}
  .service-art,.service-flower{width:110px}
  .wa-float{padding:8px}
  .wa-float span{display:none}
  .lb-close{top:8px;right:8px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal.pending:not(.in){opacity:1;transform:none}
}