/* Dstudio-inspired wave/rolling label, independently implemented for this site. */
@font-face { font-family:AP Wordmark;src:url('fonts/geist-sans-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap; }
:root {
  --button-solid:var(--accent);
  --button-bg: var(--accent);
  --button-fg: #fff;
  --button-wave: #fff;
  --button-hover-fg: var(--accent-dark);
  --button-border: var(--accent);
  --roll-ease: cubic-bezier(.16,1,.3,1);
  --wave-ease: cubic-bezier(.4,0,0,1);
}
html[data-home-motion-paused='true'] { scroll-behavior:auto; }
.logo { font-family:AP Wordmark,Satoshi,Arial,sans-serif;font-size:24px;font-weight:500;letter-spacing:-.04em;line-height:1.1;color:#202425;display:inline-block;word-spacing:.015em; }
.hero-ctas { gap:14px;flex-wrap:wrap; }
.btn-secondary {
  --button-bg:rgba(255,255,255,.72);--button-fg:var(--button-solid);
  --button-border:var(--button-solid);--button-wave:var(--button-solid);--button-hover-fg:#fff;
}
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; }
.btn {
  position:relative;isolation:isolate;overflow:hidden;border-radius:999px;
  border-color:var(--button-border);background:var(--button-bg);color:var(--button-fg);
  box-shadow:none;gap:18px;transition:none;
}
.btn:hover,.btn:active { background:var(--button-bg);box-shadow:none;transform:none;color:var(--button-fg); }
.links>a.btn,.links>a.btn:hover { color:var(--button-fg); }
.btn::before {
  content:'';position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:var(--button-wave);border-radius:50% 50% 0 0;
  transform:translateY(102%);
  /* Stop painting the displaced layer once its exit ends, avoiding edge remnants. */
  visibility:hidden;
  transition:transform .5s var(--wave-ease),border-radius .5s var(--wave-ease),visibility 0s .5s;
}
.button-label,.button-icon { display:block;position:relative;overflow:hidden;height:1.45em;line-height:1.45; }
.button-label { white-space:nowrap; }
.button-copy,.button-icon-track { display:flex;flex-direction:column;transition:transform .8s var(--roll-ease); }
.button-copy>span { display:block;height:1.45em;line-height:1.45;flex:none; }
.button-copy>span+span { color:var(--button-hover-fg); }
.button-icon { width:20px;flex:0 0 20px; }
.ui-icon { display:block;width:20px;height:20px;flex:none;aspect-ratio:1; }
.button-icon-track>span { display:flex;align-items:center;justify-content:center;height:1.45em;flex:none; }
.button-icon-track>span+span { color:var(--button-hover-fg); }
.button-icon .ui-icon { transition:none;transform:none; }
.nav-label { display:block;position:relative;overflow:hidden;height:1.5em;line-height:1.5; }
.nav-copy { display:flex;flex-direction:column;transition:transform .38s cubic-bezier(.4,0,.2,1); }
.nav-copy>span { display:block;height:1.5em;line-height:1.5; }
@media(hover:hover) and (pointer:fine) {
  .btn:hover::before { transform:translateY(0);border-radius:0;visibility:visible;transition-delay:0s; }
  .btn:hover .button-copy,.btn:hover .button-icon-track { transform:translateY(-50%); }
  .links>a:hover .nav-copy { transform:translateY(-50%); }
}
.btn:focus-visible::before { transform:translateY(0);border-radius:0;visibility:visible;transition-delay:0s; }
.btn:focus-visible .button-copy,.btn:focus-visible .button-icon-track { transform:translateY(-50%); }
.links>a:focus-visible .nav-copy { transform:translateY(-50%); }
/* All motion controls live together in the footer. */
.footer-utilities { display:flex;align-items:center;gap:24px;flex-wrap:wrap; }
.motion-toggle { display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:5px 0;border:0;background:none;color:inherit;cursor:pointer;font-size:12px; }
.motion-toggle[hidden] { display:none; }
.motion-toggle:hover { color:var(--ink); }
.motion-toggle::before { content:'';width:6px;height:8px;border-inline:1.5px solid currentColor; }
.motion-toggle[aria-pressed='true']::before { width:0;height:0;border:0;border-left:6px solid currentColor;border-top:4px solid transparent;border-bottom:4px solid transparent; }
.integrations-mount { min-height:80px; }
.service-card-featured .service-copy h3 { max-width:none; }
.service-card-featured .service-picture { height:376px; }
/* A quiet closing composition; project details open only on request. */
section#contacto { background:#fff;padding:12px 0 42px; }
.contact-layout {
  --contact-ink:#17212b;--contact-muted:#536372;
  position:relative;isolation:isolate;display:block;
  padding:64px 74px;border-radius:24px;background:#edf3f7;
}
/* Clip the static artwork, leaving animated controls outside the panel's clip. */
.contact-art { position:absolute;z-index:0;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;background:url('assets/hero-blue-flow-web.webp') center 60% / cover no-repeat;opacity:.54; }
.contact-art::after { content:'';position:absolute;inset:0;background:linear-gradient(90deg,#edf3f7 15%,rgba(237,243,247,.97) 38%,rgba(237,243,247,.28) 74%,rgba(237,243,247,.05)); }
.contact-content { position:relative;z-index:1;max-width:540px;min-width:0; }
.contact-layout h2 { font-size:clamp(42px,4.3vw,60px);line-height:1.06;letter-spacing:-.035em; }
.contact-content>p { color:var(--contact-muted);font-size:17px;line-height:1.55;margin-top:22px; }
.contact-action { display:flex;flex-direction:row;align-items:center;gap:24px;margin-top:28px; }
.contact-action .btn { min-width:208px; }
/* Use explicit foreground/background layers inside this artwork composition. */
.contact-action .btn::before { z-index:0; }
.contact-action .btn .button-label,.contact-action .btn .button-icon { z-index:1; }
.contact-call { display:inline-flex;align-items:center;gap:7px;min-height:40px;color:var(--contact-muted);font-size:13px;line-height:1.5;white-space:nowrap; }
.contact-call .ui-icon { width:17px;height:17px; }
.contact-call:hover { color:var(--contact-ink);text-decoration:underline;text-underline-offset:4px; }
.contact-direct { display:flex;align-items:center;gap:6px;margin-top:18px; }
.contact-direct .contact-email { font-size:13px;margin:0;color:var(--contact-muted); }
.contact-email:hover { text-decoration:underline;text-underline-offset:4px; }
.contact-copy { display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:7px;background:transparent;color:var(--contact-muted);cursor:pointer; }
.contact-copy:hover { background:rgba(110,139,156,.1);color:var(--contact-ink); }
.contact-copy[hidden],.contact-copy-status[hidden],.contact-status[hidden] { display:none; }
.copy-symbol { position:relative;width:11px;height:12px;border:1px solid currentColor;border-radius:2px; }
.copy-symbol::before { content:'';position:absolute;width:8px;height:9px;left:-4px;top:-4px;border-left:1px solid currentColor;border-top:1px solid currentColor;border-radius:2px 0 0; }
.contact-content>.contact-copy-status { font-size:12px;margin-top:3px;line-height:1.4; }
/* Native dialog provides modal focus containment and an inert page underneath. */
html[data-home-dialog-open='true'] { overflow:hidden;padding-right:var(--dialog-scrollbar,0px); }
html[data-home-dialog-open='true'] #hdr { padding-right:var(--dialog-scrollbar,0px); }
.contact-dialog {
  --contact-field:#fff;--contact-border:#d7e1e7;--contact-ink:#17212b;--contact-muted:#536372;--contact-placeholder:#74818b;
  margin:auto;padding:0;width:604px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 48px);
  overflow:hidden;overscroll-behavior:contain;border:1px solid #dfe7ec;border-radius:20px;
  background:#f9fbfc;color:var(--contact-ink);box-shadow:0 24px 100px -24px rgb(8 28 40 / 36%);
  font-family:var(--sans);font-size:16px;line-height:1.5;
}
.contact-dialog::backdrop { background:rgb(17 30 40 / 38%);backdrop-filter:blur(7px); }
.contact-dialog[open] .contact-dialog__surface { animation:contact-dialog-enter .24s cubic-bezier(.22,1,.36,1); }
.contact-dialog__surface { position:relative;padding:35px 36px 30px;max-height:calc(100dvh - 50px);overflow-y:auto;overscroll-behavior:contain;border-radius:inherit;scrollbar-width:thin; }
.contact-dialog__heading { padding-right:28px;margin-bottom:26px; }
.contact-dialog__heading h2 { font-size:31px;font-weight:500;letter-spacing:-.035em;line-height:1.15;text-wrap:initial; }
.contact-dialog__heading h2:focus { outline:none; }
.contact-dialog__heading>p { font-size:14px;line-height:1.5;color:var(--contact-muted);margin-top:10px; }
.contact-dialog__close { display:grid;place-items:center;position:absolute;top:17px;right:16px;z-index:2;width:38px;height:38px;background:var(--dialog-bg,#f9fbfc);border:0;border-radius:50%;color:var(--contact-muted);cursor:pointer; }
.contact-dialog__close:hover { background:rgba(110,139,156,.1);color:var(--contact-ink); }
.contact-dialog__close>span { position:relative;width:14px;height:14px; }
.contact-dialog__close>span::before,.contact-dialog__close>span::after { content:'';position:absolute;width:16px;height:1.5px;left:-1px;top:6px;background:currentColor;transform:rotate(45deg); }
.contact-dialog__close>span::after { transform:rotate(-45deg); }
.contact-form { min-width:0;position:relative;display:flex;flex-direction:column;gap:18px; }
.contact-fields { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px; }
.contact-field { display:flex;flex-direction:column;gap:7px;min-width:0; }
.contact-field label { color:var(--contact-ink);font-size:13px;line-height:1.5;font-weight:500; }
.contact-field input,.contact-field textarea {
  width:100%;min-width:0;border:1px solid var(--contact-border);border-radius:8px;
  background:var(--contact-field);color:var(--contact-ink);font:inherit;font-size:15px;line-height:1.5;
  padding:11px 13px;transition:border-color .18s,box-shadow .18s;
}
.contact-field input { height:47px; }
.contact-field textarea { min-height:100px;resize:vertical; }
.contact-field input::placeholder,.contact-field textarea::placeholder { color:var(--contact-placeholder);opacity:1; }
.contact-field input:focus,.contact-field textarea:focus { outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent); }
.contact-field [aria-invalid='true'] { border-color:#aa4845; }
.contact-field [aria-invalid='true']:focus { box-shadow:0 0 0 3px rgba(170,72,69,.12); }
.contact-field__error { color:#aa4845;font-size:12.5px;line-height:1.45; }
/* Budget: one-tap ranges. The real radio sits invisible on top of each option. */
.contact-budget { margin:0;padding:0;border:0;min-width:0; }
.contact-budget legend { padding:0;margin-bottom:7px;color:var(--contact-ink);font-size:13px;line-height:1.5;font-weight:500; }
.budget-options { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px; }
.budget-option { position:relative;display:block;min-width:0;cursor:pointer;-webkit-tap-highlight-color:transparent; }
.phone-country,.phone-country-list__option { -webkit-tap-highlight-color:transparent; }
.budget-option input { position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer; }
.budget-option span {
  display:flex;align-items:center;justify-content:center;height:47px;padding:0 8px;
  border:1px solid var(--contact-border);border-radius:8px;background:var(--contact-field);color:var(--contact-ink);
  font-size:14px;line-height:1.2;white-space:nowrap;transition:border-color .18s,box-shadow .18s,background .18s,color .18s;
}
.budget-option:hover span { border-color:color-mix(in srgb,var(--accent) 45%,var(--contact-border)); }
.budget-option input:checked + span { border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,#fff);color:var(--accent);font-weight:500; }
.budget-option input:focus-visible + span { border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent); }
.contact-budget[data-invalid] .budget-option span { border-color:#aa4845; }
@media (max-width:600px) { .budget-options { grid-template-columns:repeat(2,minmax(0,1fr)); } }
/* WhatsApp: country picker (combobox button + listbox) next to the number. */
.phone-input { position:relative;display:flex;gap:8px;min-width:0; }
.phone-input input { flex:1 1 auto; }
.phone-country {
  flex:none;display:flex;align-items:center;gap:8px;height:47px;padding:0 12px;
  border:1px solid var(--contact-border);border-radius:8px;background:var(--contact-field);color:var(--contact-ink);
  font:inherit;font-size:15px;line-height:1;white-space:nowrap;cursor:pointer;transition:border-color .18s,box-shadow .18s;
}
.phone-country::after { content:'';width:6px;height:6px;margin:-4px 0 0 2px;border-right:1.5px solid var(--contact-muted);border-bottom:1.5px solid var(--contact-muted);transform:rotate(45deg); }
.phone-country[aria-expanded='true']::after { margin-top:3px;transform:rotate(225deg); }
.phone-country:hover { border-color:color-mix(in srgb,var(--accent) 45%,var(--contact-border)); }
.phone-country:focus-visible,.phone-country[aria-expanded='true'] { outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent); }
.phone-country__flag { flex:none;display:block;width:20px;height:20px; }
.phone-country__globe { color:var(--contact-muted); }
.phone-country-list {
  position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:5;margin:0;padding:6px;list-style:none;
  max-height:272px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
  background:#fff;border:1px solid var(--contact-border);border-radius:12px;
  box-shadow:0 18px 50px -18px rgb(8 28 40 / 32%),0 2px 6px rgb(8 28 40 / 6%);
  animation:phone-country-enter .16s cubic-bezier(.22,1,.36,1);
}
.phone-country-list[hidden] { display:none; }
.phone-country-list__option { display:flex;align-items:center;gap:10px;min-height:38px;padding:7px 10px;border-radius:8px;color:var(--contact-ink);font-size:14px;line-height:1.3;cursor:pointer; }
.phone-country-list__option.is-active { background:color-mix(in srgb,var(--accent) 8%,transparent); }
.phone-country-list__option[aria-selected='true'] { color:var(--accent);font-weight:500; }
.phone-country-list__name { flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.phone-country-list__dial { flex:none;color:var(--contact-muted);font-variant-numeric:tabular-nums; }
.phone-country-list__option[aria-selected='true'] .phone-country-list__dial { color:inherit; }
@keyframes phone-country-enter { from { opacity:0;transform:translateY(-4px); } to { opacity:1;transform:none; } }
/* Confirmation after sending: replaces the form inside the dialog. */
.contact-dialog__heading[hidden],.contact-form[hidden],.contact-success[hidden] { display:none; }
.contact-dialog__surface.is-sent { display:flex;flex-direction:column;justify-content:center; }
.contact-success { display:flex;flex-direction:column;align-items:center;padding:28px 8px 12px;text-align:center;animation:contact-success-enter .45s cubic-bezier(.22,1,.36,1); }
.contact-success__mark {
  position:relative;display:grid;place-items:center;width:76px;height:76px;margin-bottom:24px;border-radius:50%;
  background:var(--accent);color:#fff;box-shadow:0 12px 28px -12px color-mix(in srgb,var(--accent) 70%,transparent);
  animation:contact-success-pop .55s cubic-bezier(.34,1.56,.64,1) .05s backwards;
}
.contact-success__mark::after { content:'';position:absolute;inset:0;border:2px solid var(--accent);border-radius:50%;opacity:0;animation:contact-success-ring 1s ease-out .45s; }
.contact-success__mark svg { overflow:visible; }
.contact-success__check { fill:none;stroke:currentColor;stroke-width:4.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:41;stroke-dashoffset:41;animation:contact-success-check .42s cubic-bezier(.65,0,.35,1) .35s forwards; }
.contact-success__title { font-size:31px;font-weight:500;letter-spacing:-.035em;line-height:1.15;color:var(--contact-ink); }
.contact-success__title:focus { outline:none; }
.contact-success__text { max-width:38ch;margin-top:12px;color:var(--contact-muted);font-size:16px;line-height:1.55; }
.contact-success__close { min-width:150px;margin-top:28px;cursor:pointer; }
@keyframes contact-success-enter { from { opacity:0;transform:translateY(10px); } to { opacity:1;transform:none; } }
@keyframes contact-success-pop { from { opacity:0;transform:scale(.5); } to { opacity:1;transform:scale(1); } }
@keyframes contact-success-check { to { stroke-dashoffset:0; } }
@keyframes contact-success-ring { from { opacity:.4;transform:scale(1); } to { opacity:0;transform:scale(1.55); } }
@media (prefers-reduced-motion:reduce) {
  .contact-success,.contact-success__mark,.contact-success__mark::after { animation:none; }
  .contact-success__check { animation:none;stroke-dashoffset:0; }
}
html[data-home-motion-manually-paused='true'] .contact-success,
html[data-home-motion-manually-paused='true'] .contact-success__mark,
html[data-home-motion-manually-paused='true'] .contact-success__mark::after { animation:none; }
html[data-home-motion-manually-paused='true'] .contact-success__check { animation:none;stroke-dashoffset:0; }
@media (prefers-reduced-motion:reduce) { .phone-country-list { animation:none; } }
.contact-form-actions { display:flex;align-items:flex-start;flex-direction:column;gap:12px;margin-top:4px; }
.contact-form-actions .btn { cursor:pointer;min-width:190px; }
.contact-form-actions .btn:disabled { cursor:not-allowed;opacity:.5; }
#contact-privacy-note,.contact-service-note { color:var(--contact-muted);font-size:12px;line-height:1.5; }
#contact-privacy-note a { text-decoration:underline;text-underline-offset:3px; }
.contact-honeypot { position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden; }
.contact-service-note[hidden],.contact-retry[hidden] { display:none; }
.contact-retry { padding:6px 0;border:0;background:none;color:var(--contact-ink);font:inherit;font-size:13px;text-align:left;text-decoration:underline;text-underline-offset:3px;cursor:pointer; }
.contact-status:focus { outline:none; }
.footer-content nav { flex-wrap:wrap; }
.contact-status { color:var(--contact-ink);font-size:13px;line-height:1.6; }
.contact-status a { text-decoration:underline; }
@keyframes contact-dialog-enter { from { opacity:0;transform:translateY(8px); } to { opacity:1;transform:translateY(0); } }
@media(max-width:900px) {
  .contact-layout { padding:52px 48px; }
  .contact-content { max-width:470px; }
  .footer-utilities { gap:12px 24px; }
}
@media(max-width:700px) {
  .logo { font-size:22px; }
  .service-card-featured .service-picture { height:315px;padding-top:12px; }
  section#contacto { padding:0 0 16px; }
  .contact-layout { padding:36px 26px 42px;border-radius:18px; }
  .contact-layout h2 { font-size:42px; }
  .contact-content>p { font-size:16px;margin-top:20px; }
  .contact-action { flex-direction:column;align-items:flex-start;gap:9px;margin-top:26px; }
  .contact-action .btn { min-width:205px; }
  .contact-direct { margin-top:17px;gap:2px; }
  .contact-direct .contact-email { font-size:12px; }
  .contact-art { opacity:.2;background-position:65% 50%; }
  .contact-art::after { background:linear-gradient(90deg,#edf3f7 5%,rgba(237,243,247,.78) 60%,rgba(237,243,247,.05)); }
  .footer-content { gap:22px; }
  .footer-utilities { align-items:flex-start;gap:4px;flex-direction:column; }
}
@media(max-width:540px) {
  .contact-dialog { max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:16px; }
  .contact-dialog__surface { padding:28px 22px 24px;max-height:calc(100dvh - 26px); }
  .contact-dialog__heading { padding-right:24px;margin-bottom:24px; }
  .contact-dialog__heading h2 { font-size:29px;max-width:10ch; }
  .contact-dialog__close { right:10px;top:13px; }
  .contact-fields { grid-template-columns:1fr;gap:18px; }
  .contact-field input,.contact-field textarea { font-size:16px; }
  .contact-form-actions .btn { width:100%; }
}
@media(max-width:360px) {
  .contact-layout { padding:32px 22px 36px; }
  .contact-layout h2 { font-size:36px; }
  .contact-direct .contact-email { font-size:11px; }
  .contact-dialog__surface { padding-inline:18px; }
  .contact-dialog__heading h2 { font-size:28px; }
}
@media(prefers-reduced-motion:reduce) { .contact-dialog[open] .contact-dialog__surface { animation:none; } }
html[data-home-motion-manually-paused='true'] .contact-dialog[open] .contact-dialog__surface { animation:none; }
@media(max-width:540px) {
  .hero-ctas { display:grid;grid-template-columns:minmax(0,1fr);width:fit-content;max-width:100%;gap:12px; }
  .hero-ctas .btn { width:100%; }
}
@media(prefers-reduced-motion:reduce) {
  .btn::before,.button-copy,.button-icon-track,.nav-copy { transition:none; }
  .motion-toggle { display:none; }
}
html[data-home-motion-paused='true'] .btn::before,
html[data-home-motion-paused='true'] .button-copy,
html[data-home-motion-paused='true'] .button-icon-track,
html[data-home-motion-paused='true'] .nav-copy { transition:none; }