/* Usability baseline: text, focus, safe areas and progressive enhancement. */
:root{color-scheme:light}html{scroll-padding-bottom:110px}body{overflow-wrap:break-word}h2,h3{text-wrap:balance}button,a,input,select,textarea,summary{touch-action:manipulation}a,button,input,select,textarea,summary{scroll-margin-block:125px 130px}dialog{overscroll-behavior:contain}button:disabled{opacity:.7;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex="-1"]:focus-visible{outline:3px solid #008578;outline-offset:5px}.contact-section :focus-visible,.custom-service :focus-visible{outline-color:#91f5df}.contact-grid>*{min-width:0}.contact-email{overflow-wrap:anywhere}.price-line,.estimate-total,.package-total{font-variant-numeric:tabular-nums}.package-total{font-size:12px;margin-top:8px;color:var(--navy)}.price-card ul{font-size:13px}.price-card .hosting{font-size:12px}.aside-logo{width:45px;height:50px;color:var(--navy);margin-bottom:22px}.project-preview[data-project="shop"]{--project-bg:#e3edc8}.project-preview[data-project="didi"]{--project-bg:#e1ecf7}.project-preview[data-project="daniela"]{--project-bg:#dedcf8}.project-preview[data-project="santo"]{--project-bg:#f6d6bc}.project-preview[data-project="norma"]{--project-bg:#dce5df}.project-preview[data-project="toca"]{--project-bg:#f2dfcc}.project-preview[data-project="momo"]{--project-bg:#f6e6ad}.project-preview[data-project="enrique"]{--project-bg:#dfe9dd}.project-preview[data-project="price"]{--project-bg:#f4ebad}
.field-error{color:#ffcfbd;font-size:12px;display:block;margin-top:7px}input[aria-invalid="true"],textarea[aria-invalid="true"],select[aria-invalid="true"]{border:2px solid #ffcfbd}.contact-grid form .form-note{font-size:12px;line-height:1.7}.contact-grid label{font-size:12px}.form-note a,.contact-preview a:not(.button){color:#b7fff1;text-decoration:underline;text-underline-offset:3px}.contact-preview{border-top:1px solid #4c6275;margin-top:24px;padding-top:23px}.contact-preview h4{font-size:20px;line-height:1.4;margin:0}.contact-preview textarea{font-size:13px;min-height:155px;line-height:1.65}.contact-preview-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}.contact-preview-actions .button{width:auto;margin-top:0;flex:1;min-width:140px}.contact-preview-actions .outline{color:#e9ffff;border-color:#71999e}.contact-preview-actions .outline:hover{background:#234963}.contact-focused .whatsapp-float{visibility:hidden}.gallery-error{padding:24px;border:1px solid var(--line);border-radius:12px;background:var(--ice)}.gallery-error p{font-size:14px;margin-bottom:16px}.hero-visual:before{animation-name:shape-shift}.about-mark:before{animation-name:shape-turn}.steps article:before{width:100%;transform:scaleX(0);transform-origin:left;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}.process-section.in-view .steps article:before{transform:scaleX(1)}
@keyframes shape-shift{to{transform:rotate(8deg) scale(.97)}}@keyframes shape-turn{to{transform:rotate(-10deg)}}
/* The initial content and direct contacts remain useful without JavaScript. */
html:not(.enhanced) .portfolio-toolbar,html:not(.enhanced) #show-more,html:not(.enhanced) .select-package,html:not(.enhanced) #resumen,html:not(.enhanced) #contact-form{display:none}html:not(.enhanced) .hero-copy{animation:none;opacity:1}html:not(.enhanced) .header nav{display:flex}html:not(.enhanced) .menu-toggle{display:none}
.document-page{background:#f4f8fa}.document-header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:26px;border-bottom:1px solid var(--line)}.document-header img{width:230px;height:auto}.document-header .button{min-height:44px}.document-main{max-width:850px;padding-block:45px 75px}.document-main h1{font-size:clamp(36px,5vw,64px);margin-top:30px;line-height:1.12}.document-main .document-intro{font-size:19px;line-height:1.7;margin-top:23px;max-width:720px}.document-date{font-size:13px;margin-top:20px}.document-main section{margin-top:40px;padding-top:26px;border-top:1px solid var(--line)}.document-main h2{font-size:28px;letter-spacing:-.04em;line-height:1.3}.document-main section p{margin-top:16px;line-height:1.8;font-size:16px}.document-main a:not(.button){text-decoration:underline;text-underline-offset:4px}.document-main section .button{margin-top:20px}.terms-prices{margin-top:24px}.terms-prices article{padding:18px 0;border-bottom:1px solid var(--line)}.terms-prices h3{font-size:20px}.document-main .terms-prices p{font-size:14px;margin-top:9px}.document-footer{padding:25px 0 42px;border-top:1px solid var(--line)}.document-footer> a{font-weight:800;font-size:23px;letter-spacing:-.05em}.document-footer nav{display:flex;gap:16px;align-items:center;flex-wrap:wrap;font-size:13px;margin-top:16px}.document-footer p{font-size:13px;margin-top:17px}.document-footer a:hover{color:var(--deep-teal)}.error-code{font-size:clamp(80px,18vw,170px);font-weight:800;line-height:1;color:#00776e;letter-spacing:-.08em;display:block}.error-actions{display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:30px}.footer-bottom{align-items:center;flex-wrap:wrap;font-size:11px}.footer-bottom a,.footer-bottom .privacy-link{min-height:32px;display:inline-flex;align-items:center}.cookie-settings-heading{position:sticky;top:-28px;background:white;padding-block:12px;z-index:2}.cookie-settings .cookie-detail{font-size:12px}.cookie-actions button{font-size:12px}.consent-category p{font-size:12px}
@media(max-width:760px){.section-heading h2{font-size:clamp(32px,8.4vw,39px)}input,select,textarea{font-size:16px;min-height:46px}.contact-section p{font-size:15px}.contact-section h2{font-size:clamp(42px,12vw,58px)}.hero-note{font-size:11px}.hero h1{font-size:clamp(22px,9.3cqw,68px)}.headline-line{white-space:normal}.promises p{font-size:12px}.motion-toggle{font-size:12px;min-height:44px}.faq-list summary{font-size:15px;padding-block:22px}.faq-list details p,.steps p{font-size:14px}.step-number{font-size:14px}.project-info p,.project-type{font-size:12px}.filters .filter{font-size:12px;min-height:44px}.about-grid p{font-size:15px}.custom-service p{font-size:14px}.document-header img{width:180px}.document-header .button{font-size:12px;padding:12px 14px}.document-header{gap:15px}.document-main .document-intro{font-size:17px}.document-main h2{font-size:26px}.document-main section p{font-size:15px}.document-footer p{line-height:1.8}.cookie-settings-heading{top:-22px}.cookie-settings h2{font-size:25px}html:not(.enhanced) .header nav{position:static;flex-wrap:wrap;box-shadow:none;border:0;padding:0;font-size:12px}html:not(.enhanced) .nav-wrap{flex-wrap:wrap}.footer-bottom>a{margin-left:0}}
@media(max-width:360px){.brand img{width:165px}.nav-wrap{padding-inline:10px}.menu-toggle{padding-inline:10px}.hero-actions .button{font-size:12px}.cookie-actions{gap:5px}.cookie-actions button{padding-inline:9px}.document-header img{width:155px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
.contact-section-visible .whatsapp-float{visibility:hidden}

body:has(:focus-visible:not(.whatsapp-float)) .whatsapp-float{visibility:hidden}
@media(min-width:761px){.contact-section{overflow:clip}.contact-grid>div:first-child{position:sticky;top:130px;align-self:start}}
@media(max-width:760px){.contact-preview textarea{font-size:16px}}

/* Portfolio: every example is visible; detailed images load only on demand. */
.project-preview[data-project="gramaje"]{--project-bg:#dce3f0}.project-preview[data-project="pulso"]{--project-bg:#c3e7e9}.project-preview[data-project="yunuhen"]{--project-bg:#e6e1d2}.project-preview[data-project="menu"]{--project-bg:#efdbad}.project-preview[data-project="pines"]{--project-bg:#e4d9f6}.project-preview[data-project="invitacion"]{--project-bg:#d8dff2}.project-preview[data-project="atlas"]{--project-bg:#dbe8dd}.project-preview[data-project="lado-b"]{--project-bg:#c9dfcd}
.preview-count{position:absolute;left:16px;bottom:16px;background:var(--navy);color:white;border:1px solid #ffffff50;padding:6px 11px;border-radius:20px;font-size:11px;font-weight:650}.project-links{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:15px;border-top:1px solid var(--line);padding-top:8px}.project-links a{min-height:44px;display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:750}.project-links a:hover{color:var(--deep-teal)}.project-links .brand-glyph{width:16px;height:18px}.project-links a>span:not(.brand-glyph){font-size:22px;color:var(--deep-teal)}.project-info{flex-wrap:wrap;gap:10px}.project-type{white-space:normal}.portfolio-toolbar .project-count{font-size:12px}
/* Promotion applies to creation, keeping hosting and initial totals explicit. */
.promotion-banner{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:32px;background:var(--navy);color:white;border-radius:16px;padding:28px 32px;margin-bottom:24px}.promotion-banner:after{content:'';position:absolute;width:240px;height:240px;right:-65px;top:-90px;border:1px solid #5ddacc55;border-radius:50%;z-index:-1}.promotion-banner h3{font-size:clamp(23px,2.4vw,32px);line-height:1.15;letter-spacing:-.04em;max-width:340px}.promotion-eyebrow{display:block;color:#76e9d9;font-size:11px;font-weight:700;margin-bottom:8px}.promotion-banner p{color:#dce8ef;max-width:350px;font-size:13px;line-height:1.7;margin-left:auto}.promotion-seal{display:grid;place-items:center;background:#64e4cf;color:var(--navy);width:90px;height:90px;flex:0 0 90px;border-radius:50%;font-size:28px;font-weight:850;letter-spacing:-.05em;transform:rotate(-9deg)}.promotion-price{display:flex;align-items:center;gap:12px;justify-content:space-between;margin-top:22px;font-size:12px;color:var(--ink);font-variant-numeric:tabular-nums}.promotion-price s{font-size:16px;font-weight:650;display:inline-block;margin-left:4px;text-decoration-thickness:1.5px}.discount-badge{font-size:12px;background:#d4f6eb;color:#075c50;border:1px solid #9cdbc9;border-radius:6px;padding:4px 7px;white-space:nowrap}.price-card .price-line{margin-top:10px;gap:11px}.price-line span{line-height:1.6}.package-examples{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.package-examples a{display:inline-flex;align-items:center;gap:5px;min-height:40px}.package-examples .brand-glyph{width:13px;height:15px}
/* Dedicated image viewport prevents tall screenshots from pushing controls away. */
#project-dialog{width:calc(100% - 40px);max-width:1480px;height:92dvh;max-height:92dvh;overflow:hidden}#project-dialog[open]{display:flex;flex-direction:column}#project-dialog .dialog-header{flex:0 0 auto;padding:17px 24px}#project-dialog .dialog-body{display:grid;grid-template-columns:260px minmax(0,1fr);gap:26px;padding:22px;min-height:0;flex:1;overflow:hidden}.dialog-overview{min-height:0;overflow:auto;overscroll-behavior:contain;padding-right:5px}.dialog-overview>p{font-size:13px;line-height:1.8}.dialog-overview .dialog-actions{flex-direction:column;align-items:stretch;gap:17px}.dialog-overview .button{font-size:13px;padding:15px 17px;justify-content:space-between}.dialog-overview .text-link{font-size:13px;align-self:flex-start}.dialog-overview .gallery-hint{font-size:12px;border-top:1px solid var(--line);padding-top:19px}.project-navigation{margin-top:24px}.project-navigation>span{font-size:11px;color:var(--deep-teal);font-weight:750}.project-navigation>div{display:grid;gap:7px;margin-top:10px}.project-navigation button,.gallery-buttons button{border:1px solid var(--line);background:white;color:var(--navy);border-radius:7px;min-height:40px;padding:8px 10px;font-size:12px;font-weight:650}.project-navigation button:hover:not(:disabled),.gallery-buttons button:hover:not(:disabled){background:var(--ice);border-color:#72beb7}#project-dialog button:disabled{cursor:default;opacity:.4}.gallery-workspace{min-width:0;min-height:0;display:flex;flex-direction:column;gap:12px}.gallery-controls{flex:0 0 auto}.gallery-controls label{color:var(--ink);margin:0 0 6px;font-size:11px}.gallery-controls select{background:white;color:var(--navy);border-color:var(--line);font-size:13px;min-height:42px}.gallery-buttons{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:9px}.gallery-buttons>div{display:flex;gap:6px}.gallery-buttons>a{margin-left:auto;font-size:12px;text-decoration:underline;text-underline-offset:4px;min-height:40px;display:flex;align-items:center}.gallery-buttons button[aria-pressed=true]{background:var(--navy);color:white}.gallery-caption{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:11px;margin-top:8px;color:var(--ink)}.gallery-viewport{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border:1px solid var(--line);border-radius:9px;background:#eaf0f3;position:relative}.gallery-viewport img{display:block;width:auto;max-width:100%;height:auto;margin:0 auto}.gallery-viewport.enlarged img{max-width:none;margin:0}.gallery-viewport:focus-visible{outline-offset:2px}#gallery-loading{padding:30px;color:var(--ink);font-size:13px}
@media(max-width:1000px){#project-dialog .dialog-body{grid-template-columns:210px minmax(0,1fr);gap:18px}.promotion-banner{gap:22px;padding:24px}.promotion-seal{width:72px;height:72px;flex-basis:72px;font-size:24px}}
@media(max-width:760px){.promotion-banner{flex-wrap:wrap;padding:24px;gap:18px}.promotion-banner>div{flex:1;min-width:180px}.promotion-banner p{order:3;margin:0;max-width:none;width:100%}.promotion-seal{width:65px;height:65px;flex-basis:65px}.promotion-price{font-size:12px}.project-info{display:block}.project-type{display:inline-block;margin-top:10px}.project-links a{font-size:12px}#project-dialog{width:calc(100% - 16px);height:96dvh;max-height:96dvh}#project-dialog .dialog-header{padding:12px 16px}#project-dialog .dialog-header h2{font-size:24px}#project-dialog .dialog-body{display:flex;flex-direction:column;padding:14px;gap:14px;overflow:auto}.dialog-overview{overflow:visible;flex-shrink:0;padding:0}.dialog-overview>p{font-size:13px}.dialog-overview .dialog-actions{flex-direction:row;align-items:center;flex-wrap:wrap;margin:12px 0;gap:18px}.dialog-overview .gallery-hint{display:none}.project-navigation{margin-top:13px}.project-navigation>div{display:flex;gap:10px}.project-navigation button{flex:1;font-size:11px}.gallery-workspace{min-height:520px;flex:1;overflow:visible}.gallery-controls select{font-size:16px}.gallery-viewport{min-height:320px;max-height:65dvh;flex:1}.gallery-buttons{gap:6px}.gallery-buttons button{font-size:11px;min-height:44px}.gallery-buttons>a{font-size:11px;margin-left:0}.gallery-caption{font-size:11px}.gallery-caption>span:last-child{max-width:220px}}

.gallery-viewport.is-mobile:not(.enlarged) img{max-width:min(100%,420px)}

.dialog-overview details summary{padding:0 0 12px;font-size:12px}.dialog-overview details p{font-size:13px;line-height:1.8}.dialog-overview details summary span{font-size:18px}
@media(max-width:760px){.dialog-overview .dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0}.dialog-overview .button{font-size:11px;padding:12px 10px;gap:5px}.dialog-overview .text-link{font-size:11px;gap:6px;align-self:center}.dialog-overview .dialog-actions .brand-glyph{width:15px;height:17px}.project-navigation{margin-top:10px}.dialog-overview details summary{padding-bottom:10px}}
