/* NÜA — soft lavender, generous space, considered details. */
:root {
  --ink:#242339;
  --muted:#737184;
  --purple:#6655df;
  --line:#e9e6f2;
  --surface:#fff;
  --bg:#f7f6fc;
  font-family: "Avenir Next", Avenir, "Segoe UI", sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-synthesis:none;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:108px;
}

body {
  margin:0;
}

a {
  color:inherit;
  text-decoration:none;
}

button,input,select,textarea {
  font:inherit;
}

button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent;
}

button,a {
  touch-action:manipulation;
}

button {
  cursor:pointer;
}

a:focus-visible,button:focus-visible,[tabindex]:focus-visible {
  outline:3px solid #8a7cf0;
  outline-offset:5px;
}

img {
  max-width:100%;
  display:block;
}

h1,h2,h3,p {
  margin-top:0;
}

p {
  line-height:1.7;
}

h2 {
  font-size:clamp(28px,3.2vw,42px);
  line-height:1.17;
  letter-spacing:-1.5px;
  font-weight:600;
}

h3 {
  font-weight:600;
}

main {
  overflow:hidden;
}

.section {
  width:min(1180px,calc(100% - 80px));
  margin:0 auto;
  padding:64px 0;
}

.eyebrow {
  font-size:10px;
  letter-spacing:2px;
  font-weight:700;
  color:var(--purple);
  text-transform:uppercase;
  margin-bottom:19px;
}

.status-dot {
  display:inline-block;
  width:6px;
  height:6px;
  background:#8172e8;
  border-radius:50%;
  margin-right:9px;
  vertical-align:middle;
}

.site-header {
  position:sticky;
  top:0;
  z-index:30;
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  padding:23px max(40px,calc((100vw - 1180px)/2));
  background:#f7f6fcee;
  backdrop-filter:blur(20px);
  border-bottom:1px solid transparent;
  transition:border-color .2s;
}

.site-header.is-scrolled {
  border-color:var(--line);
}

.brand-mark {
  font-size:32px;
  font-weight:800;
  letter-spacing:-2px;
}

.nav {
  display:flex;
  gap:34px;
  align-items:center;
}

.nav a {
  font-size:12px;
  font-weight:500;
  color:#666477;
}

.nav a:hover,.nav a.is-active {
  color:var(--purple);
}

.nav a:last-child {
  background:white;
  padding:13px 23px;
  border-radius:30px;
  color:var(--purple);
  box-shadow:0 4px 18px #51447808;
}

.hero {
  display:grid;
  grid-template-columns:1fr 1.05fr;
  align-items:center;
  gap:60px;
  padding-top:42px;
  padding-bottom:55px;
}

.hero-content {
  padding:15px 0;
}

.hero h1 {
  font-size:clamp(40px,4.3vw,60px);
  line-height:1.13;
  letter-spacing:-2.8px;
  font-weight:600;
  margin-bottom:25px;
}

.hero h1 em {
  font-style:normal;
  color:var(--purple);
}

.hero-copy {
  color:var(--muted);
  font-size:15px;
  max-width:390px;
  margin-bottom:30px;
}

.hero-actions {
  display:flex;
  align-items:center;
  gap:24px;
}

.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:22px;
  border:0;
  border-radius:30px;
  min-height:49px;
  padding:14px 24px;
  font-size:12px;
  font-weight:600;
  transition:transform .2s,box-shadow .2s;
}

.btn-primary {
  background:linear-gradient(115deg,#7868ed,#5948d8);
  color:white;
  box-shadow:0 8px 18px #6655df24;
}

.btn:hover {
  transform:translateY(-2px);
  box-shadow:0 10px 24px #6655df30;
}

.btn span {
  font-size:19px;
}

.text-link {
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
}

.text-link span {
  margin-left:7px;
}

.hero-signals {
  display:flex;
  gap:17px;
  margin-top:29px;
  font-size:10px;
  color:#858294;
}

.hero-visual {
  position:relative;
  min-width:0;
  border:7px solid white;
  border-radius:34px;
  box-shadow:0 20px 60px #4035750a;
}

.hero-visual>img {
  width:100%;
  height:435px;
  object-fit:cover;
  object-position:43% center;
  border-radius:27px;
}

.image-label {
  position:absolute;
  left:21px;
  right:21px;
  bottom:23px;
  padding:17px;
  background:#ffffffec;
  backdrop-filter:blur(15px);
  border-radius:19px;
  display:flex;
  gap:14px;
  align-items:center;
}

.image-label strong {
  display:block;
  font-size:12px;
  font-weight:600;
}

.image-label div>span {
  display:block;
  font-size:10px;
  color:var(--muted);
  margin-top:4px;
}

.sparkle {
  font-size:35px;
  color:var(--purple);
}

.floating-service {
  position:absolute;
  right:-23px;
  top:28px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 17px;
  background:white;
  border-radius:18px;
  box-shadow:0 10px 40px #29234512;
}

.mini-icon {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:13px;
  background:#f0edff;
  color:var(--purple);
  font-size:27px;
}

.floating-service small {
  display:block;
  font-size:7px;
  letter-spacing:1px;
  color:#898494;
  margin-bottom:4px;
}

.floating-service strong {
  font-size:11px;
  font-weight:600;
}

.floating-service b {
  font-size:18px;
  font-weight:400;
  color:var(--purple);
  margin-left:12px;
}

.intro-band {
  padding:25px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.intro-band p {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:0;
  font-size:14px;
  font-weight:500;
}

.intro-detail {
  color:var(--muted);
  font-size:11px;
  font-weight:400;
}

.intro-detail a {
  margin-left:18px;
  color:var(--purple);
  font-size:20px;
}

.section-heading {
  margin-bottom:32px;
}

.section-heading h2 {
  margin-bottom:13px;
}

.section-heading>p:last-child:not(.eyebrow) {
  font-size:13px;
  color:var(--muted);
}

.service-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:14px;
}

.service-card {
  position:relative;
  background:white;
  border:1px solid #eeecf5;
  border-radius:23px;
  padding:23px 19px;
  cursor:pointer;
  transition:transform .2s,box-shadow .2s,border-color .2s;
}

.service-card:hover {
  transform:translateY(-5px);
  box-shadow:0 15px 30px #4035750b;
  border-color:#cfc7fa;
}

.service-card:after {
  content:'↗';
  position:absolute;
  right:17px;
  top:19px;
  color:#aaa4bd;
  font-size:16px;
}

.service-icon {
  display:grid;
  place-items:center;
  width:47px;
  height:47px;
  border-radius:15px;
  background:#f1eeff;
  color:var(--purple);
  margin-bottom:25px;
}

.service-icon svg {
  width:25px;
  height:25px;
}

.service-card:nth-child(3n+2) .service-icon {
  background:#edf5f4;
  color:#55948d;
}

.service-card:nth-child(3n) .service-icon {
  background:#fcf3e9;
  color:#bb9669;
}

.service-card h3 {
  font-size:13px;
  letter-spacing:-.2px;
  margin-bottom:8px;
}

.service-card p {
  font-size:11px;
  line-height:1.65;
  color:var(--muted);
  margin:0;
}

.process {
  padding-top:35px;
}

.steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
}

.step {
  border-top:1px solid #ded9ef;
  padding-top:22px;
}

.step>span {
  display:inline-grid;
  place-items:center;
  width:36px;
  height:36px;
  background:#ebe7fb;
  border-radius:50%;
  color:var(--purple);
  font-size:11px;
  margin-bottom:18px;
}

.step h3 {
  font-size:16px;
  margin-bottom:9px;
}

.step p {
  font-size:12px;
  max-width:290px;
  color:var(--muted);
}

.why {
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:65px;
  padding-top:35px;
  padding-bottom:60px;
}

.why h2 {
  max-width:360px;
}

.benefits {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  align-items:center;
}

.benefit small {
  display:block;
  color:#aaa2c1;
  font-size:10px;
  margin-bottom:13px;
}

.benefit strong {
  display:block;
  font-size:15px;
  margin-bottom:10px;
}

.benefit span {
  font-size:12px;
  line-height:1.7;
  color:var(--muted);
  display:block;
}

.referral-promo {
  position:relative;
  display:grid;
  grid-template-columns:1.25fr 1fr;
  align-items:center;
  gap:75px;
  background:linear-gradient(120deg,#7766e9,#5844cb);
  border-radius:30px;
  padding:40px;
  color:white;
  overflow:hidden;
}

.referral-promo .eyebrow {
  color:#e0d9ff;
}

.referral-copy h2 {
  font-size:32px;
  letter-spacing:-1px;
  margin-bottom:13px;
  max-width:400px;
}

.referral-copy>p:last-child {
  font-size:12px;
  color:#eeebff;
  max-width:440px;
  margin:0;
}

.referral-share-box {
  border-radius:20px;
  padding:23px;
  background:#ffffff13;
  border:1px solid #ffffff25;
}

.referral-share-box label {
  font-size:11px;
  display:block;
  margin-bottom:10px;
}

.referral-share-row {
  display:flex;
  gap:8px;
}

.referral-share-row input {
  min-width:0;
  width:100%;
  border:0;
  background:white;
  border-radius:30px;
  padding:13px 15px;
  font-size:11px;
  color:var(--ink);
}

.referral-btn {
  background:white;
  color:var(--purple);
  box-shadow:none;
  padding:12px 17px;
  min-height:43px;
}

.referral-helper {
  font-size:10px;
  color:#e4ddff;
  margin:12px 0 0;
}

.testimonials {
  padding-top:80px;
}

.testimonial-track {
  display:flex;
  overflow-x:auto;
  gap:16px;
  scroll-snap-type:x mandatory;
  padding-bottom:16px;
}

.testimonial-line {
  display:contents;
}

.testimonial-line[aria-hidden] {
  display:none;
}

.testimonial {
  flex:0 0 285px;
  scroll-snap-align:start;
  background:white;
  border:1px solid var(--line);
  border-radius:23px;
  padding:25px;
}

.testimonial>span {
  font-size:12px;
  color:#b39952;
  letter-spacing:3px;
}

.testimonial p {
  font-size:13px;
  margin:16px 0 20px;
}

.testimonial strong {
  font-size:11px;
  font-weight:500;
  color:var(--muted);
}

.booking {
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:85px;
  align-items:start;
  padding-top:35px;
  padding-bottom:85px;
}

.booking-copy {
  padding-top:28px;
}

.booking-copy h2 {
  max-width:370px;
}

.booking-assurance {
  display:flex;
  flex-direction:column;
  gap:14px;
  font-size:12px;
  color:var(--muted);
}

.booking-assurance span:before {
  content:'✓';
  color:var(--purple);
  margin-right:10px;
}

.booking-form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px 16px;
  padding:30px;
  background:white;
  border:1px solid var(--line);
  border-radius:27px;
  box-shadow:0 15px 45px #40357505;
}

.booking-form label {
  display:grid;
  gap:8px;
  font-size:11px;
  font-weight:500;
  min-width:0;
}

.booking-form input,.booking-form select,.booking-form textarea {
  width:100%;
  min-width:0;
  min-height:46px;
  padding:12px 14px;
  border:1px solid #e8e5f0;
  border-radius:12px;
  background:#faf9fd;
  color:var(--ink);
  outline:none;
  font-size:12px;
}

.booking-form textarea {
  resize:vertical;
}

.booking-form input:focus,.booking-form select:focus,.booking-form textarea:focus,.referral-share-row input:focus {
  outline:3px solid #b8aefa70;
  border-color:var(--purple);
}

.full {
  grid-column:1/-1;
}

.booking-form .privacy-consent {
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:10px;
  line-height:1.6;
  color:var(--muted);
}

.booking-form .privacy-consent input {
  flex:0 0 16px;
  width:16px;
  min-height:16px;
  margin:2px 0;
  accent-color:var(--purple);
}

.privacy-consent a {
  color:var(--purple);
  text-decoration:underline;
}

.form-note {
  font-size:10px;
  color:var(--muted);
  text-align:center;
  margin:0;
}

.footer {
  width:min(1180px,calc(100% - 80px));
  margin:auto;
  padding:32px 0 40px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:40px;
}

.footer strong {
  font-size:26px;
  letter-spacing:-1px;
}

.footer p {
  font-size:10px;
  max-width:290px;
  color:var(--muted);
  margin:12px 0 0;
}

.legal-links {
  display:flex;
  gap:22px;
  align-items:center;
  font-size:10px;
  color:var(--muted);
}

.whatsapp-float {
  position:fixed;
  bottom:22px;
  right:24px;
  z-index:25;
  padding:13px 20px;
  border-radius:30px;
  background:white;
  border:1px solid var(--line);
  box-shadow:0 6px 30px #40357515;
  color:var(--purple);
  font-size:11px;
  font-weight:600;
}

.cookie-banner {
  position:fixed;
  bottom:18px;
  left:18px;
  width:min(365px,calc(100% - 36px));
  padding:20px;
  background:#fffffffa;
  border:1px solid var(--line);
  border-radius:22px;
  box-shadow:0 15px 50px #29234518;
  z-index:80;
}

.cookie-banner[hidden] {
  display:none;
}

.cookie-banner strong {
  font-size:12px;
}

.cookie-banner p {
  font-size:10px;
  color:var(--muted);
  margin:8px 0 12px;
}

.cookie-actions {
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.cookie-btn {
  border:0;
  border-radius:20px;
  padding:10px 17px;
  font-size:11px;
}

.cookie-btn-primary {
  background:var(--purple);
  color:white;
}

.cookie-btn-ghost {
  background:#f1eefb;
  color:var(--purple);
}

@media(min-width:1500px) {
  .hero {
    padding-top:65px;
    padding-bottom:75px;
  }
  .hero-visual>img {
    height:485px;
  }
}

@media(max-width:1000px) {
  .hero {
    gap:30px;
  }
  .hero h1 {
    font-size:43px;
  }
  .hero-actions {
    align-items:flex-start;
    flex-direction:column;
    gap:18px;
  }
  .hero-signals {
    flex-wrap:wrap;
    gap:9px;
  }
  .service-grid {
    grid-template-columns:repeat(3,1fr);
  }
  .why {
    gap:35px;
    grid-template-columns:1fr;
  }
  .referral-promo {
    gap:30px;
  }
  .booking {
    gap:35px;
  }
  .nav {
    gap:20px;
  }
}

@media(max-width:650px) {
  html {
    scroll-padding-top:88px;
  }
  .section {
    width:calc(100% - 36px);
    padding:36px 0;
  }
  .site-header {
    padding:16px 20px;
  }
  .brand-mark {
    font-size:28px;
  }
  .nav {
    gap:17px;
  }
  .nav a {
    font-size:10px;
  }
  .nav a:nth-child(2),.nav a:nth-child(3) {
    display:none;
  }
  .nav a:last-child {
    padding:11px 18px;
  }
  .hero {
    display:flex;
    flex-direction:column;
    gap:26px;
    padding-top:23px;
    padding-bottom:30px;
  }
  .hero-content {
    width:100%;
    padding:0 5px;
  }
  .eyebrow {
    font-size:8px;
    letter-spacing:1.5px;
    margin-bottom:17px;
  }
  .hero h1 {
    font-size:clamp(35px,9.3vw,53px);
    letter-spacing:-1.9px;
    margin-bottom:17px;
  }
  .hero-copy {
    font-size:13px;
    max-width:330px;
    margin-bottom:22px;
  }
  .hero-actions {
    flex-direction:row;
    align-items:center;
    gap:18px;
  }
  .btn {
    padding:13px 18px;
    font-size:11px;
    gap:14px;
    min-height:46px;
  }
  .text-link {
    font-size:10px;
  }
  .hero-signals {
    font-size:9px;
    margin-top:21px;
    gap:15px;
  }
  .hero-visual {
    width:100%;
    border-width:5px;
    border-radius:29px;
  }
  .hero-visual>img {
    height:280px;
    border-radius:24px;
  }
  .floating-service {
    right:10px;
    top:13px;
    padding:10px 12px;
    border-radius:15px;
  }
  .floating-service small {
    font-size:6px;
  }
  .floating-service strong {
    font-size:10px;
  }
  .mini-icon {
    width:33px;
    height:33px;
    font-size:24px;
  }
  .image-label {
    left:12px;
    right:12px;
    bottom:13px;
    padding:12px 15px;
    border-radius:16px;
  }
  .image-label strong {
    font-size:11px;
  }
  .intro-band {
    padding:19px 3px;
  }
  .intro-band p {
    display:block;
    font-size:12px;
  }
  .intro-detail {
    display:block;
    font-size:10px;
    margin-top:5px;
  }
  .intro-detail a {
    margin-left:8px;
  }
  .section-heading {
    margin-bottom:23px;
  }
  h2 {
    font-size:29px;
    letter-spacing:-1px;
  }
  .section-heading>p:last-child:not(.eyebrow) {
    font-size:12px;
  }
  .service-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .service-card {
    padding:18px 15px;
    border-radius:20px;
  }
  .service-icon {
    width:42px;
    height:42px;
    border-radius:13px;
    margin-bottom:20px;
  }
  .service-card h3 {
    font-size:12px;
  }
  .service-card p {
    font-size:10px;
  }
  .steps {
    grid-template-columns:1fr;
    gap:16px;
  }
  .step {
    display:grid;
    grid-template-columns:38px 1fr;
    gap:5px 16px;
    padding-top:18px;
  }
  .step>span {
    grid-row:span 2;
    margin:0;
  }
  .step h3 {
    margin:0;
    font-size:14px;
  }
  .step p {
    margin:0;
    max-width:none;
    font-size:11px;
  }
  .why {
    gap:13px;
  }
  .why h2 {
    max-width:270px;
  }
  .benefits {
    gap:16px;
  }
  .benefit strong {
    font-size:13px;
  }
  .benefit span {
    font-size:10px;
  }
  .referral-promo {
    padding:27px 22px;
    grid-template-columns:1fr;
    gap:23px;
    border-radius:25px;
  }
  .referral-copy h2 {
    font-size:29px;
  }
  .referral-copy>p:last-child {
    font-size:11px;
  }
  .referral-share-box {
    padding:17px;
  }
  .referral-helper {
    font-size:9px;
  }
  .testimonial {
    flex-basis:260px;
  }
  .booking {
    grid-template-columns:1fr;
    gap:24px;
  }
  .booking-copy {
    padding:0;
  }
  .booking-copy h2 {
    max-width:300px;
  }
  .booking-assurance {
    gap:10px;
    font-size:11px;
  }
  .booking-form {
    padding:21px 17px;
    gap:17px 12px;
    border-radius:23px;
  }
  .booking-form input,.booking-form select,.booking-form textarea {
    font-size:16px;
    padding:11px;
  }
  .footer {
    width:calc(100% - 40px);
    flex-direction:column;
    gap:22px;
    padding-bottom:90px;
  }
  .legal-links {
    flex-wrap:wrap;
    gap:18px;
  }
  .whatsapp-float {
    bottom:15px;
    right:15px;
  }
  .cookie-banner {
    bottom:12px;
    left:12px;
    width:calc(100% - 24px);
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
}

/* Calendario NUA */
.date-picker {
  position: relative;
  z-index: 1;
  display: block;
  font-weight: 700;
}

.booking-form label:focus-within {
  position: relative;
  z-index: 50;
}

.booking-form label:has(.date-picker-trigger[aria-expanded="true"]) {
  position: relative;
  z-index: 50;
}

.date-picker-trigger {
  width: 100%;
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 14px;
  border: 1px solid rgba(17, 17, 17, 0.08);
  border-radius: 16px;
  color: #111;
  background: linear-gradient(180deg, rgba(250, 249, 245, 0.9), rgba(255, 255, 255, 0.68));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86), 0 12px 26px rgba(17, 17, 17, 0.05);
  font: inherit;
  cursor: pointer;
}

.date-picker-trigger[aria-expanded="true"] {
  border-color: rgba(73, 157, 255, 0.55);
  box-shadow: 0 0 0 4px rgba(73, 157, 255, 0.12);
}

.date-picker-icon {
  color: #2383ed;
  font-size: 0.82rem;
}

.date-picker-popover {
  position: absolute;
  z-index: 100;
  top: calc(100% + 8px);
  right: 0;
  width: min(310px, calc(100vw - 64px));
  padding: 14px;
  border: 1px solid rgba(17, 17, 17, 0.09);
  border-radius: 20px;
  color: #111;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 24px 70px rgba(17, 17, 17, 0.18), inset 0 1px 0 #fff;
  backdrop-filter: blur(24px) saturate(1.15);
}

.date-picker-popover[hidden] {
  display: none;
}

.date-picker-header,
.date-picker-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.date-picker-header strong {
  font-size: 0.92rem;
  text-transform: capitalize;
}

.date-picker-header button,
.date-picker-footer button,
.date-picker-days button {
  border: 0;
  font: inherit;
  cursor: pointer;
}

.date-picker-header button {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #f4f3ef;
  font-size: 1rem;
}

.date-picker-weekdays,
.date-picker-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 3px;
}

.date-picker-weekdays {
  margin: 12px 0 6px;
  color: #77736c;
  font-size: 0.68rem;
  text-align: center;
}

.date-picker-days button,
.date-picker-spacer {
  aspect-ratio: 1;
}

.date-picker-days button {
  border-radius: 10px;
  color: #222;
  background: transparent;
  font-size: 0.76rem;
  font-weight: 750;
}

.date-picker-days button:hover {
  color: #075cac;
  background: #e9f4ff;
  transform: translateY(-1px);
}

.date-picker-days button.is-today {
  box-shadow: inset 0 0 0 1px rgba(35, 131, 237, 0.5);
}

.date-picker-days button.is-selected {
  color: #fff;
  background: linear-gradient(135deg, #2997ff, #176fd0);
  box-shadow: 0 8px 18px rgba(35, 131, 237, 0.28);
}

.date-picker-footer {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(17, 17, 17, 0.07);
}

.date-picker-footer button {
  padding: 5px 7px;
  color: #1671c8;
  background: transparent;
  font-size: 0.75rem;
  font-weight: 800;
}

@media (max-width: 620px) {
  .date-picker-trigger {
    min-height: 44px;
  }
  .date-picker-popover {
    position: fixed;
    top: 50%;
    left: 50%;
    right: auto;
    width: min(330px, calc(100vw - 32px));
    transform: translate(-50%, -50%);
  }
}

.date-picker-trigger {
  background:#faf9fd;
  border:1px solid #e8e5f0;
  border-radius:12px;
  box-shadow:none;
  min-height:46px;
  font-size:12px;
  font-weight:400;
  color:var(--ink);
}

.date-picker-icon,.date-picker-footer button {
  color:var(--purple);
}

.date-picker-days button.is-selected {
  background:var(--purple);
  box-shadow:none;
}

.date-picker-trigger[aria-expanded="true"] {
  border-color:var(--purple);
  box-shadow:0 0 0 3px #b8aefa70;
}


/* First screen: a quiet, portrait welcome inspired by the reference. */
.welcome {
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 28px 20px;
  background: #e9e8f5;
  scroll-margin-top: 0;
}
.welcome-card {
  width: min(390px, 100%);
  overflow: hidden;
  border: 5px solid white;
  border-radius: 39px;
  background: white;
  box-shadow: 0 24px 75px #4b42680b;
}
.welcome-photo {
  position: relative;
  height: clamp(270px, 49svh, 430px);
  overflow: hidden;
  border-radius: 33px 33px 0 0;
}
.welcome-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 76% center;
}
.welcome-photo::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 95px;
  background: linear-gradient(transparent, #ffffffa8 60%, white);
}
.welcome-brand {
  position: absolute;
  left: 20px;
  top: 17px;
  color: #302b42;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -1.5px;
}
.welcome-content {
  position: relative;
  padding: 0 28px 25px;
  text-align: center;
}
.welcome-content h1 {
  margin: -7px 0 14px;
  font-size: 29px;
  font-weight: 650;
  letter-spacing: -1px;
  line-height: 1.14;
}
.welcome-content > p {
  margin: 0 0 25px;
  color: #85818e;
  font-size: 12px;
  line-height: 1.6;
}
.welcome-explore {
  width: 100%;
  min-height: 46px;
  padding: 12px 20px;
  font-size: 13px;
  font-weight: 500;
}
.welcome-account {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  margin-top: 12px;
  color: #918b9d;
  font-size: 10px;
}
.welcome-account button {
  padding: 5px 3px;
  border: 0;
  color: #7b70b3;
  background: transparent;
  font-size: 10px;
  cursor: default;
}
.welcome-active .whatsapp-float {
  visibility: hidden;
  pointer-events: none;
}
@media (max-width: 650px) {
  .welcome { padding: 22px 23px; }
  .welcome-card { max-width: 360px; border-radius: 35px; }
  .welcome-photo { height: clamp(255px, 48svh, 430px); border-radius: 29px 29px 0 0; }
  .welcome-content { padding: 0 24px 22px; }
  .welcome-content h1 { font-size: 27px; }
}
@media (max-height: 650px) {
  .welcome { padding-block: 16px; }
  .welcome-photo { height: 240px; }
  .welcome-content > p { margin-bottom: 18px; }
}

/* Standalone welcome: the service website lives on servicios.html. */
.welcome-page .welcome {
  min-height: 100svh;
  padding: 24px;
}
.welcome-page .welcome-card {
  width: min(1160px, 100%);
  min-height: min(760px, calc(100svh - 48px));
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  align-items: center;
  border-radius: 38px;
}
.welcome-page .welcome-photo {
  height: 100%;
  min-height: 500px;
  border-radius: 32px 0 0 32px;
}
.welcome-page .welcome-photo::after {
  inset: 0 0 0 auto;
  width: 90px;
  height: auto;
  background: linear-gradient(90deg, transparent, white);
}
.welcome-page .welcome-content {
  padding: 40px;
}
.welcome-page .welcome-content h1 {
  font-size: clamp(32px, 3.5vw, 48px);
  margin-bottom: 22px;
}
.welcome-page .welcome-content > p {
  font-size: 14px;
  margin-bottom: 34px;
}
.welcome-page .welcome-explore {
  min-height: 52px;
  font-size: 14px;
}
.welcome-page .welcome-account,
.welcome-page .welcome-account button {
  font-size: 12px;
}
@media (max-width: 700px) {
  .welcome-page .welcome { padding: 12px; }
  .welcome-page .welcome-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: calc(100svh - 24px);
    border-radius: 30px;
  }
  .welcome-page .welcome-photo {
    width: 100%;
    height: max(260px, calc(100svh - 285px));
    min-height: 0;
    border-radius: 24px 24px 0 0;
  }
  .welcome-page .welcome-photo::after {
    inset: auto 0 0;
    width: auto;
    height: 85px;
    background: linear-gradient(transparent, white);
  }
  .welcome-page .welcome-content {
    width: 100%;
    margin-block: auto;
    padding: 0 25px 18px;
  }
  .welcome-page .welcome-content h1 { font-size: 30px; margin-bottom: 12px; }
  .welcome-page .welcome-content > p { font-size: 12px; margin-bottom: 20px; }
  .welcome-page .welcome-explore { min-height: 47px; }
  .welcome-page .welcome-account,
  .welcome-page .welcome-account button { font-size: 11px; }
}

/* The welcome image meets the card edge without a white frame. */
.welcome-page .welcome-card {
  border: 0;
}

/* Show the supplied welcome illustration without cropping its silhouette. */
.welcome-page .welcome-photo img {
  object-position: center;
  object-fit: contain;
}
.welcome-page .welcome-brand {
  color: #302b42;
  text-shadow: none;
}

/* Let the smaller character float above the card instead of clipping it. */
.welcome-page .welcome {
  padding: 85px 24px 28px;
  overflow: visible;
}
.welcome-page .welcome-card {
  min-height: 540px;
  overflow: visible;
}
.welcome-page .welcome-photo {
  min-height: 0;
  height: 540px;
  overflow: visible;
}
.welcome-page .welcome-photo::after {
  display: none;
}
.welcome-page .welcome-photo img {
  position: relative;
  width: 86%;
  height: 570px;
  margin: -65px auto 0;
  object-fit: contain;
  filter: drop-shadow(0 18px 15px #302b4215);
}
.welcome-page .welcome-brand {
  top: 22px;
  left: 24px;
  z-index: 1;
}
@media (max-width: 700px) {
  .welcome-page .welcome { padding: 75px 18px 24px; }
  .welcome-page .welcome-card { min-height: 0; }
  .welcome-page .welcome-photo { height: clamp(260px, 48svh, 430px); }
  .welcome-page .welcome-photo img {
    width: 88%;
    height: clamp(305px, 54svh, 480px);
    margin-top: -60px;
  }
  .welcome-page .welcome-content { padding: 10px 25px 25px; }
  .welcome-page .welcome-brand { top: 20px; left: 18px; font-size: 22px; }
}

/* Larger character, still floating freely above the welcome card. */
.welcome-page .welcome-photo img {
  width: 100%;
  height: 640px;
  margin-top: -90px;
}
@media (max-width: 700px) {
  .welcome-page .welcome-photo img {
    width: 100%;
    height: clamp(355px, 62svh, 555px);
    margin-top: -80px;
  }
}

/* Oversized silhouette: hands extend past the card edges. */
.welcome-page .welcome-photo img {
  max-width: none;
  width: 124%;
  height: 720px;
  margin-left: -12%;
  margin-top: -110px;
}
@media (max-width: 700px) {
  .welcome-page .welcome { padding-inline: 28px; }
  .welcome-page .welcome-photo {
    height: clamp(370px, 57svh, 540px);
  }
  .welcome-page .welcome-photo img {
    width: 128%;
    height: clamp(465px, 76svh, 690px);
    margin-left: -14%;
    margin-top: -100px;
  }
}

/* Standalone Ü brand mark, tucked into the clear upper-right corner. */
.welcome-page .welcome-brand {
  top: 20px;
  right: 20px;
  left: auto;
}
.welcome-page .welcome-photo .welcome-brand img {
  position: static;
  display: block;
  width: 28px;
  height: 35px;
  max-width: 100%;
  margin: 0;
  filter: none;
  object-fit: contain;
}

/* Fade the lower shoe gently into the white card. */
.welcome-page .welcome-photo > img {
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 72%, rgba(0, 0, 0, 0.35) 83%, transparent 92%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 72%, rgba(0, 0, 0, 0.35) 83%, transparent 92%);
}

/* Google account access on the welcome screen. */
.welcome-page [hidden],
.services-page [hidden] { display: none !important; }
.welcome-account button:not(:disabled) { cursor: pointer; }
.welcome-account button:not(:disabled):hover { color: #5142bf; text-decoration: underline; text-underline-offset: 3px; }
.welcome-signed-in { display: grid; justify-items: center; gap: 8px; margin-top: 15px; font-size: 12px; }
.welcome-signed-in span { color: #45405a; font-weight: 600; }
.welcome-signed-in a { color: #5f50d2; font-weight: 650; }
.welcome-signed-in button { border: 0; background: transparent; color: #888298; font-size: 11px; padding: 4px; cursor: pointer; }
.auth-message:empty { display: none; }
.auth-message { margin: 10px 0 0; color: #6953b4; font-size: 11px; line-height: 1.5; text-align: center; }

/* Registration is a separate step after choosing a Google account. */
.registration-dialog {
  box-sizing: border-box;
  width: min(460px, calc(100% - 28px));
  max-height: calc(100dvh - 28px);
  padding: 31px;
  border: 1px solid #ffffffd9;
  border-radius: 30px;
  background: #fff;
  color: #292b43;
  box-shadow: 0 30px 90px #242b523d;
  overflow-y: auto;
}
.registration-dialog::backdrop { background: #20233c78; backdrop-filter: blur(9px); }
.registration-close { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #e6e6f2; border-radius: 50%; background: white; color: #666a84; font-size: 25px; cursor: pointer; }
.registration-mark { display: grid; place-items: center; width: 57px; height: 57px; margin-bottom: 21px; border-radius: 17px; background: #f0efff; }
.registration-mark img { width: 24px; height: 30px; object-fit: contain; }
.registration-kicker { margin: 0 0 8px; color: #6658cc; font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.registration-dialog h2 { margin: 0 0 10px; color: #292b43; font-size: clamp(25px, 5vw, 32px); line-height: 1.12; letter-spacing: -.04em; }
.registration-intro { margin: 0 0 25px; color: #777b91; font-size: 13px; line-height: 1.5; }
.registration-intro strong { color: #4d4b67; overflow-wrap: anywhere; }
.registration-form { display: grid; gap: 9px; }
.registration-form label { color: #34364e; font-size: 12px; font-weight: 700; }
.registration-form input { box-sizing: border-box; width: 100%; min-height: 48px; margin-bottom: 9px; padding: 0 15px; border: 1px solid #dfe1ed; border-radius: 15px; outline: none; background: #fafaff; color: #292b43; font: inherit; font-size: 13px; }
.registration-form input:focus { border-color: #6658dc; box-shadow: 0 0 0 3px #6658dc1a; }
.registration-form input::placeholder { color: #a5a6b6; }
.registration-privacy { margin: 2px 0 10px; color: #7b7e93; font-size: 11px; line-height: 1.5; }
.registration-privacy a { color: #6252cc; text-decoration: underline; }
.registration-form .btn { width: 100%; min-height: 48px; border: 0; cursor: pointer; }
.registration-form .btn:disabled { opacity: .6; cursor: wait; }
@media (max-width: 500px) { .registration-dialog { padding: 26px 22px; border-radius: 24px; } }

/* Keep the welcome controls visible on shorter phones. */
@media (max-width: 700px) and (max-height: 740px) {
  .welcome-page .welcome { padding: 10px 20px; }
  .welcome-page .welcome-card { min-height: calc(100dvh - 20px); }
  .welcome-page .welcome-photo { height: clamp(275px, 45dvh, 340px); }
  .welcome-page .welcome-photo img { height: clamp(355px, 57dvh, 430px); margin-top: -12px; }
  .welcome-page .welcome-content { padding: 0 21px 17px; }
  .welcome-page .welcome-content h1 { font-size: 26px; margin-bottom: 9px; }
  .welcome-page .welcome-content > p { font-size: 11px; margin-bottom: 14px; }
  .welcome-page .welcome-explore { min-height: 43px; }
  .welcome-page .welcome-account { margin-top: 7px; }
}
