@import 'tailwindcss';
:root{--ink:#262323;--cream:#fff7e8;--pink:#ff78bc;--hot:#f456a5;--blush:#ffc6df;--line:#292525}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f1e8d8;color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}.shell{width:min(1120px,100%);margin-inline:auto}.cream{background:var(--cream)}.dark{background:var(--ink);color:#fff}.pinkwash{background:linear-gradient(150deg,var(--cream) 8%,#ffb8d8 64%,var(--pink))}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;background:var(--cream);font-size:12px;font-weight:800;position:sticky;top:0;z-index:30;border-bottom:2px solid var(--ink)}.brand{letter-spacing:.05em}.navlinks{display:flex;gap:30px}.navlinks a{border-bottom:2px solid transparent;padding:5px 0}.navlinks a:hover{border-color:var(--pink)}.mobile-menu{display:none}.hero{height:520px;position:relative;overflow:hidden;display:flex;align-items:center;padding:50px 7%}.hero:after{content:"";position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(0deg,var(--pink),transparent);opacity:.5}.hero-copy{position:relative;z-index:2;width:52%}.eyebrow{font-weight:900;font-size:12px;letter-spacing:.14em}.hero h1,.section-title h2{margin:8px 0;font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(64px,8vw,105px);letter-spacing:-.02em;line-height:.78}.hero h1 span{color:var(--pink);display:block}.hero h1 em,.section-title em{font-family:'Brush Script MT','Segoe Script',cursive;font-weight:400;color:var(--ink);font-size:.62em;display:block;margin:-3px 0 0 1.3em;transform:rotate(-7deg)}.lead{max-width:430px;font-size:16px;line-height:1.5}.socials{display:flex;gap:14px;margin-top:20px}.hero-person{position:absolute;z-index:2;height:112%;right:4%;bottom:-24%;object-fit:contain;filter:drop-shadow(0 18px 22px #49253644)}.doodle{position:absolute;font-family:'Brush Script MT',cursive;font-size:52px}.doodle-arrow{top:80px;left:47%;transform:rotate(15deg)}.doodle-star{right:5%;top:50px}.about{min-height:440px;padding:62px 8%;display:grid;grid-template-columns:34% 1fr;gap:7%;align-items:center}.portrait-card{height:330px;border:4px solid var(--pink);border-radius:12px;overflow:hidden;background:var(--cream)}.portrait-card img{width:100%;height:135%;object-fit:cover;object-position:50% 18%}.about h2,.audience h2,.testimonials h2{font-family:Impact,'Arial Narrow',sans-serif;font-size:46px;margin:4px 0 18px;letter-spacing:.01em}.about p{font-size:14px;line-height:1.55;max-width:620px}.script-label{font-family:'Brush Script MT','Segoe Script',cursive;color:var(--pink);font-size:25px;margin:0}.stats{display:flex;gap:14%;margin-top:25px}.stats div{display:flex;flex-direction:column;text-align:center}.stats b{font-size:30px}.stats span{font-size:10px;text-transform:uppercase;line-height:1.2}.audience{padding:60px 10%;display:grid;grid-template-columns:1fr 1fr;align-items:center}.pink{color:var(--hot)}.audience-list{max-width:360px}.audience-list p{margin:0;padding:9px 0;border-bottom:2px solid var(--line);display:flex;justify-content:space-between;font-size:15px}.chart{width:260px;aspect-ratio:1;border-radius:50%;margin:auto;background:conic-gradient(var(--pink) 0 55%,#ff8e96 55% 70%,#f9c85d 70% 85%,#ba82e8 85%);display:grid;place-items:center;box-shadow:0 0 0 18px #fff4 inset}.chart span{background:var(--cream);border-radius:50%;padding:26px 19px;font-weight:900}.niches{min-height:470px;padding:58px 7%;position:relative;overflow:hidden}.section-title{text-align:center;position:relative;z-index:2}.section-title h2{font-size:clamp(56px,7vw,86px);color:var(--pink)}.section-title em{color:#fff;font-size:52px;margin:-19px 0 0 34%}.niche-grid{display:grid;grid-template-columns:220px 220px;gap:18px;justify-content:space-between;margin-top:54px;position:relative;z-index:2}.niche-grid span{background:var(--pink);color:var(--ink);font-weight:900;font-size:13px;padding:10px 14px;border:2px solid var(--cream);border-radius:4px}.niche-person{position:absolute;height:108%;left:50%;bottom:-39%;transform:translateX(-50%)}.featured{padding:65px 7%}.section-title.left{text-align:left}.section-title.left em{margin-left:15%}.phone-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:50px auto 30px}.phone-card{height:260px;border:7px solid var(--pink);border-radius:24px;background:linear-gradient(145deg,#f5d9d4,#bf7d86);position:relative;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}.phone-card:after{content:"";position:absolute;inset:20% 15%;border-radius:50%;background:radial-gradient(circle,var(--cream),transparent 68%);opacity:.45}.phone-card.fashion{background:linear-gradient(145deg,#845266,#eac2ce)}.phone-card.lifestyle{background:linear-gradient(145deg,#a7b78f,#f2c48b)}.phone-card.wellness{background:linear-gradient(145deg,#94ad9d,#e5d4b8)}.phone-notch{position:absolute;top:0;width:55%;height:14px;background:var(--pink);border-radius:0 0 10px 10px}.tile-icon{position:absolute;z-index:2;inset:50% auto auto 50%;transform:translate(-50%,-50%);font-size:64px;color:#fff8}.phone-card p{position:relative;z-index:3;margin:0 0 18px;font-weight:900;text-transform:uppercase;font-size:11px;background:#000a;padding:6px 10px}.selected{text-align:center;font-size:11px;line-height:1.5}.collabs{padding:50px 7%}.collabs .section-title h2{color:var(--ink)}.collabs .section-title em{color:#fff}.logo-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:32px;border:2px solid var(--cream)}.logo-grid b{height:82px;display:grid;place-items:center;border:1px solid var(--cream);font-size:20px;letter-spacing:.06em}.performance{padding:56px 7%}.performance .section-title em{margin-left:46%}.performance>p{text-align:center;font-size:11px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:34px;text-align:center}.metrics div{display:flex;align-items:center;flex-direction:column;gap:7px}.metrics b{background:var(--pink);color:var(--ink);border-radius:999px;padding:7px 20px;font-size:18px}.metrics span{font-size:11px;color:var(--pink);font-weight:800}.services{padding:60px 7%}.services .section-title h2{color:var(--pink)}.services .section-title em{color:var(--ink)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:42px}.service-grid article{border:2px solid var(--ink);padding:22px;background:#fff0f6;display:flex;flex-direction:column;gap:12px}.service-grid b{font-size:14px}.service-grid span{font-size:12px;line-height:1.4}.testimonials{padding:60px 7%;border-top:2px solid var(--ink)}.quotes{display:grid;grid-template-columns:1fr 1fr;gap:24px}.quotes blockquote{margin:0;background:#fff;border:2px solid var(--ink);box-shadow:7px 7px 0 var(--pink);padding:28px;font-family:Georgia,serif;font-style:italic;line-height:1.55}.quotes footer{font-family:Arial,sans-serif;font-style:normal;font-size:11px;font-weight:900;margin-top:18px}.contact{padding:80px 7%;text-align:center;position:relative}.contact h2{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(62px,9vw,105px);line-height:.8;margin:18px}.contact h2 em{font-family:'Brush Script MT',cursive;font-weight:400}.contact a{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:#fff;padding:16px 28px;font-size:12px;font-weight:900;letter-spacing:.08em;border:2px solid var(--ink);box-shadow:6px 6px 0 var(--cream)}.footer{padding:24px 5%;display:flex;justify-content:space-between;font-size:10px;font-weight:800;letter-spacing:.08em}
@media(max-width:760px){.shell{width:100%}.nav{height:64px;padding:0 18px}.navlinks{display:none}.mobile-menu{display:block}.hero{height:670px;align-items:flex-start;padding:65px 24px}.hero-copy{width:100%;text-align:center}.hero h1{font-size:68px}.lead{font-size:14px}.socials{justify-content:center}.hero-person{height:75%;right:50%;transform:translateX(50%);bottom:-16%}.doodle-arrow{display:none}.about{padding:45px 24px;grid-template-columns:1fr}.portrait-card{height:360px}.about h2{font-size:40px}.stats{justify-content:space-between;gap:5%}.audience{padding:48px 24px;grid-template-columns:1fr;gap:40px}.chart{width:230px}.niches{min-height:650px;padding:45px 18px}.niche-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:35px}.niche-grid span{font-size:11px;padding:9px}.niche-person{height:72%;bottom:-15%}.featured{padding:50px 18px}.section-title h2{font-size:54px}.section-title em{font-size:42px}.phone-grid{grid-template-columns:1fr 1fr;gap:12px;margin-top:35px}.phone-card{height:250px;border-width:5px}.collabs{padding:45px 18px}.logo-grid b{height:65px;font-size:13px}.performance{padding:50px 18px}.metrics{grid-template-columns:1fr 1fr;gap:30px 12px}.service-grid{grid-template-columns:1fr}.quotes{grid-template-columns:1fr}.contact{padding:65px 18px}.footer{flex-direction:column;gap:8px;text-align:center}}
.socials{flex-wrap:wrap;gap:9px}.socials a{border:2px solid var(--ink);padding:8px 12px;font-size:10px;font-weight:900;text-transform:uppercase;background:var(--cream);box-shadow:3px 3px 0 var(--pink)}.contact>a{display:inline-flex;align-items:center;gap:9px;background:var(--ink);color:#fff;padding:16px 28px;font-size:12px;font-weight:900;letter-spacing:.08em;border:2px solid var(--ink);box-shadow:6px 6px 0 var(--cream)}.contact-socials{display:flex;justify-content:center;gap:22px;margin-top:28px;flex-wrap:wrap}.contact-socials a{font-size:12px;font-weight:900;text-transform:uppercase;border-bottom:2px solid var(--ink);padding-bottom:3px}
.shell{width:100%;max-width:none}.hero h1{font-size:clamp(82px,9.5vw,150px)}
@media(max-width:760px){.hero h1{font-size:80px}}
.hero-person.real-photo{height:86%;width:min(34vw,520px);right:7%;bottom:0;object-fit:cover;object-position:50% 24%;border-radius:160px 160px 0 0;box-shadow:0 18px 55px #6b294333}.niche-person{width:min(32vw,430px);height:72%;bottom:0;object-fit:cover;object-position:50% 35%;border:4px solid var(--pink);border-radius:150px 150px 0 0}.phone-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:920px}.phone-card{height:420px}.phone-card:after,.phone-card .tile-icon{display:none}.phone-card video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}.phone-card:hover video{transform:scale(1.035)}.portrait-card img{height:100%;object-position:center 18%;transition:transform .55s ease}.portrait-card:hover img{transform:scale(1.04)}
@keyframes float-soft{0%,100%{translate:0 0}50%{translate:0 -10px}}@keyframes reveal-up{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:translateY(0)}}.motion-float{animation:float-soft 5s ease-in-out infinite}.reveal{animation:reveal-up both;animation-timeline:view();animation-range:entry 5% cover 30%}
@media(max-width:760px){.hero-person.real-photo{height:51%;width:74%;right:13%;bottom:0;border-radius:110px 110px 0 0;transform:none}.niche-person{width:68%;height:55%;bottom:0}.phone-grid{grid-template-columns:1fr 1fr}.phone-card{height:320px}.motion-float{animation-duration:7s}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.motion-float,.reveal{animation:none!important}.phone-card video,.portrait-card img{transition:none!important}}

/* Las fuentes locales se declaran una sola vez en assets/fonts.css. */
.hero h1,.section-title h2,.about h2,.audience h2,.testimonials h2,.contact h2{font-family:'Anton',Impact,'Arial Narrow',sans-serif;font-weight:400}
.hero h1 em,.section-title em,.script-label,.contact h2 em,.doodle{font-family:'Allura','Brush Script MT',cursive;font-weight:400}

.reveal{animation:none}
.motion-ready .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.motion-ready .reveal.is-visible{opacity:1;transform:translateY(0)}

html,body{max-width:100%;overflow-x:hidden}
.hero{height:auto;min-height:clamp(620px,70vh,820px)}
.about,.audience,.niches,.featured,.collabs,.performance,.services,.testimonials,.contact{overflow:visible}
.hero h1,.section-title h2,.about h2,.audience h2,.testimonials h2,.contact h2{overflow-wrap:anywhere}

@media(max-width:760px){
  .hero{height:auto;min-height:760px;padding:56px 22px 390px}
  .hero-person.real-photo{height:370px;width:min(86%,360px);left:50%;right:auto;bottom:0;transform:translateX(-50%);object-position:center 22%}
  .about{height:auto;min-height:0}
  .portrait-card{height:min(112vw,430px)}
  .niches{height:auto;min-height:720px;padding-bottom:390px}
  .niche-person{height:360px;width:min(78%,340px);bottom:0}
  .section-title h2,.collabs .section-title h2,.performance .section-title h2{font-size:clamp(42px,13vw,58px);line-height:.88}
  .section-title em{font-size:clamp(36px,11vw,48px)}
  .phone-card{height:82vw;min-height:300px;max-height:390px}
  .metrics b{font-size:14px;padding:7px 12px}
  .contact h2{font-size:clamp(54px,16vw,78px)}
}

@media(max-width:380px){
  .phone-grid{grid-template-columns:1fr}
  .phone-card{height:150vw;max-height:520px}
  .logo-grid{grid-template-columns:1fr 1fr}
}

@media(prefers-reduced-motion:reduce){.motion-ready .reveal{opacity:1;transform:none;transition:none}}

.offer-copy{max-width:720px;margin:18px auto 30px;text-align:center;font-size:16px;line-height:1.65}
.brand-types{grid-template-columns:repeat(3,minmax(0,1fr))}
.pricing{padding:80px 7%;color:var(--ink)}
.price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1100px;margin:42px auto 0}
.price-grid article{position:relative;min-height:190px;padding:28px;background:var(--cream);border:2px solid var(--ink);box-shadow:7px 7px 0 var(--pink);display:flex;flex-direction:column;align-items:flex-start}
.price-grid article.recommended{background:var(--ink);color:#fff;box-shadow:7px 7px 0 #fff}
.price-grid small{position:absolute;right:14px;top:14px;background:var(--pink);color:var(--ink);padding:5px 8px;font-size:9px;font-weight:900;letter-spacing:.08em}
.price-grid span{font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;padding-right:75px}
.price-grid h3{font-family:'Anton',Impact,sans-serif;font-size:34px;font-weight:400;margin:16px 0 8px;color:var(--pink)}
.price-grid p{font-size:13px;line-height:1.5;margin:auto 0 0}
.rate-note{max-width:800px;margin:32px auto 0;text-align:center;font-size:12px;font-weight:700}

@media(max-width:760px){
  .offer-copy{font-size:14px;margin:14px auto 24px}
  .brand-types{grid-template-columns:1fr 1fr}
  .pricing{padding:55px 18px}
  .price-grid{grid-template-columns:1fr;gap:16px;margin-top:30px}
  .price-grid article{min-height:0;padding:24px}
  .price-grid h3{font-size:32px}
}

/* El video y su rotulo comparten el mismo marco sin competir por ancho. */
.phone-card{display:block}
.phone-card video{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;object-position:center;z-index:1}
.phone-card p{position:absolute;left:0;right:0;bottom:0;z-index:3;margin:0;padding:9px 10px;text-align:center;background:linear-gradient(transparent,#000 40%);color:#fff;white-space:normal}
.phone-notch{z-index:4}

/* En escritorio, acerca el texto y la imagen principal al eje central. */
.rates-contact{text-align:center;margin-top:24px}
.rates-contact a{display:inline-block;max-width:100%;padding:16px 24px;background:var(--ink);color:#fff;font-size:15px;font-weight:700;border:2px solid var(--ink);box-shadow:5px 5px 0 var(--cream);line-height:1.5}
.rates-contact a:hover,.rates-contact a:focus-visible{background:var(--cream);color:var(--ink)}
.price-grid article{min-height:145px;gap:20px}
.hero .doodle-star{display:none}
.pricing .section-title em{color:var(--ink)}
.city-chart{background:conic-gradient(#ff70bf 0% 14.7%,#ff99ca 14.7% 20.2%,#ffc15c 20.2% 25.6%,#ad80db 25.6% 30.5%,#7853a6 30.5% 34.4%,#e4dfd4 34.4% 100%)}
.city-note{text-align:center;font-size:12px;line-height:1.5;margin:18px auto 0;max-width:300px}
@media(max-width:760px){
  .about{padding-bottom:72px;height:auto;max-height:none}
  .about .stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:28px 0 16px;align-items:start}
  .about .stats div{min-width:0;gap:8px}
  .about .stats b{font-size:clamp(24px,7vw,30px);line-height:1.2}
  .about .stats span{font-size:10px;line-height:1.5;overflow-wrap:anywhere;white-space:normal}
  .collabs .section-title em{margin:10px 0 0;width:100%;color:var(--ink);font-size:clamp(30px,9vw,42px);line-height:1.2;transform:none;white-space:nowrap}
}
@media(min-width:1000px){
  .hero-copy{width:min(44%,650px);margin-left:5%}
  .hero-person.real-photo{right:12%;width:min(32vw,500px)}
}
