:root{color-scheme:light;--bg:#fff;--surface:#f5f5f3;--surface-2:#ededeb;--text:#111;--muted:#666;--line:#dededb;--strong:#090909;--strong-text:#fff;--accent:#b7f36b;--shadow:0 20px 60px rgba(0,0,0,.06);--radius:5px}
:root[data-theme="dark"]{color-scheme:dark;--bg:#090909;--surface:#141414;--surface-2:#1d1d1d;--text:#f6f6f3;--muted:#a6a6a1;--line:#30302e;--strong:#f6f6f3;--strong-text:#090909;--accent:#b7f36b;--shadow:0 20px 60px rgba(0,0,0,.22)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5;transition:background .25s,color .25s}a{color:inherit;text-decoration:none}button{font:inherit}.site-header{height:82px;padding:0 clamp(22px,6vw,90px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:25px;position:sticky;top:0;z-index:20;background:var(--bg);transition:background .25s,border-color .25s}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:850;font-size:19px;letter-spacing:.14em;white-space:nowrap}.brand-mark{width:31px;height:31px;border:1.5px solid var(--text);display:grid;place-items:center;font-size:17px;font-weight:800;letter-spacing:-.1em}.desktop-nav{display:flex;gap:clamp(18px,3vw,42px);font-size:13px;color:var(--muted)}.desktop-nav a:hover,.mobile-nav a:hover,.footer-right a:hover{color:var(--text)}.header-actions{display:flex;align-items:center;gap:12px}.theme-toggle{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--text);padding:9px 12px;font-size:12px;cursor:pointer}.theme-toggle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.moon-icon{display:none}.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:0 20px;font-size:13px;font-weight:650;border:1px solid transparent;transition:transform .2s,background .2s,color .2s}.button:hover{transform:translateY(-2px)}.button-small{min-height:38px;padding:0 15px;font-size:12px}.button-dark{background:var(--strong);color:var(--strong-text)}.button-light{background:#fff;color:#090909}.mobile-menu-toggle,.mobile-nav{display:none}.section-shell{padding-left:clamp(22px,9vw,140px);padding-right:clamp(22px,9vw,140px)}.hero{min-height:570px;display:grid;grid-template-columns:1.03fr .97fr;align-items:center;gap:7%;padding-top:75px;padding-bottom:78px}.eyebrow{font-size:10px;font-weight:750;letter-spacing:.16em;color:var(--muted);display:flex;align-items:center;gap:10px;margin:0 0 23px}.eyebrow-line{width:25px;height:1px;background:var(--text)}h1,h2,h3,p{margin-top:0}.hero h1{font-size:clamp(42px,5.7vw,78px);line-height:.99;letter-spacing:-.065em;font-weight:650;margin:0 0 26px}.hero h1 span,.section-heading h2 span,.cta h2 span{color:var(--muted)}.hero-description{font-size:15px;line-height:1.8;color:var(--muted);max-width:440px;margin-bottom:28px}.hero-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.text-link{font-size:12px;font-weight:650}.text-link span{margin-left:8px}.hero-note{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);margin-top:42px}.status-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent)}.hero-art{min-height:390px;position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--line);isolation:isolate}.art-topline,.art-bottomline{position:absolute;left:20px;right:20px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.12em;color:var(--muted);z-index:3}.art-topline{top:19px}.art-bottomline{bottom:19px}.art-shape{position:absolute;border:1px solid var(--text);transform:rotate(45deg);left:50%;top:50%;translate:-50% -50%}.shape-one{width:200px;height:200px}.shape-two{width:145px;height:145px;border-color:var(--muted);transform:rotate(0deg)}.art-orbit{position:absolute;border:1px solid var(--line);border-radius:50%;left:50%;top:50%;translate:-50% -50%;width:310px;height:150px}.orbit-one{transform:rotate(55deg)}.orbit-two{transform:rotate(-55deg)}.art-center{position:absolute;left:50%;top:50%;translate:-50% -50%;display:flex;flex-direction:column;align-items:center;z-index:2}.center-symbol{width:76px;height:76px;border:1px solid var(--text);display:grid;place-items:center;font-size:49px;font-weight:300;letter-spacing:-.15em;padding-right:7px}.center-word{font-size:13px;font-weight:800;letter-spacing:.22em;margin-top:13px}.center-caption{font-size:7px;letter-spacing:.16em;color:var(--muted);margin-top:5px}.ticker{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0}.ticker-track{display:flex;align-items:center;justify-content:space-around;gap:28px;white-space:nowrap;font-size:9px;font-weight:750;letter-spacing:.16em}.ticker-track i{font-style:normal;color:var(--muted);font-size:15px}.services,.how{padding-top:105px;padding-bottom:110px}.section-heading{display:grid;grid-template-columns:.65fr 1.35fr;gap:30px;margin-bottom:47px}.section-heading .eyebrow{margin-top:8px}.section-heading h2,.cta h2{font-size:clamp(35px,4.5vw,57px);line-height:1.02;letter-spacing:-.06em;font-weight:620;margin-bottom:18px}.section-heading>div>p{font-size:13px;color:var(--muted);max-width:410px;line-height:1.8;margin-bottom:0}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.service-card{min-height:310px;border:1px solid var(--line);padding:24px;display:flex;flex-direction:column;align-items:flex-start;transition:background .2s,border-color .2s}.service-card:hover{background:var(--surface)}.card-index{display:flex;justify-content:space-between;width:100%;font-size:9px;color:var(--muted);letter-spacing:.12em}.service-icon{height:60px;display:flex;align-items:center;font-size:37px;font-weight:300;margin:22px 0 14px}.icon-window{width:38px;height:28px;border:1px solid var(--text);position:relative}.icon-window:before{content:"";position:absolute;left:0;right:0;top:7px;border-top:1px solid var(--text)}.icon-window span:before,.icon-window span:after{content:"";position:absolute;top:3px;width:2px;height:2px;background:var(--text);border-radius:50%}.icon-window span:before{left:4px}.icon-window span:after{left:9px}.icon-plus{font-size:48px}.service-card h3{font-size:19px;letter-spacing:-.04em;margin-bottom:10px}.service-card p{font-size:12px;line-height:1.8;color:var(--muted);margin-bottom:25px}.card-link{font-size:11px;font-weight:700;margin-top:auto;padding-bottom:5px;border-bottom:1px solid var(--line);width:100%;display:flex;justify-content:space-between}.card-link span{font-size:15px}.how{background:var(--surface);transition:background .25s}.steps{border-top:1px solid var(--line)}.step{display:grid;grid-template-columns:.25fr 1fr;gap:20px;padding:24px 0;border-bottom:1px solid var(--line)}.step-number{font-size:11px;color:var(--muted);letter-spacing:.1em;padding-top:5px}.step h3{font-size:17px;letter-spacing:-.03em;margin-bottom:7px}.step p{font-size:12px;color:var(--muted);margin-bottom:0;line-height:1.8}.cta{padding-top:90px;padding-bottom:90px}.cta-inner{position:relative;background:#101010;color:#fff;padding:clamp(32px,6vw,75px);overflow:hidden}.cta .eyebrow{color:#aaa}.cta .eyebrow:before{content:"";width:25px;height:1px;background:#fff}.cta h2{font-size:clamp(42px,6vw,72px);margin-bottom:18px}.cta h2 span{color:#aaa}.cta-inner>p:not(.eyebrow){max-width:400px;color:#bbb;font-size:13px;line-height:1.8;margin-bottom:25px}.cta small{display:block;color:#888;font-size:10px;margin-top:16px}.cta code{color:#ddd}.cta-stamp{position:absolute;right:8%;top:50%;translate:0 -50%;width:180px;height:180px;border:1px solid #444;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(-12deg);color:#ddd}.cta-stamp:before,.cta-stamp:after{content:"";position:absolute;border:1px solid #444;border-radius:50%;inset:12px}.cta-stamp:after{inset:26px}.cta-stamp>span{font-size:68px;font-weight:300;line-height:1}.cta-stamp small{font-size:7px;letter-spacing:.16em;text-align:center;color:#aaa;margin-top:5px;z-index:1}.site-footer{border-top:1px solid var(--line);padding:25px clamp(22px,6vw,90px);display:flex;align-items:center;gap:25px}.footer-brand{font-size:14px}.footer-brand .brand-mark{width:25px;height:25px;font-size:14px}.site-footer>p{font-size:11px;color:var(--muted);margin:0}.footer-right{margin-left:auto;display:flex;gap:22px;font-size:10px;color:var(--muted)}@media(min-width:1500px){.hero{min-height:660px}.hero-art{min-height:450px}}@media(max-width:900px){.desktop-nav{gap:15px}.site-header{padding:0 24px}.section-shell{padding-left:35px;padding-right:35px}.hero{gap:4%;grid-template-columns:1fr 1fr}.hero h1{font-size:clamp(42px,6vw,62px)}.hero-art{min-height:340px}.service-card{padding:18px}.cta-stamp{right:4%;width:140px;height:140px}.cta-stamp>span{font-size:52px}}@media(max-width:680px){.site-header{height:70px;padding:0 19px}.brand{font-size:16px}.brand-mark{width:28px;height:28px}.desktop-nav,.header-actions>.button{display:none}.mobile-menu-toggle{display:block;border:1px solid var(--line);background:transparent;color:var(--text);width:37px;height:37px;font-size:18px}.theme-toggle{padding:9px}.theme-toggle #themeLabel{display:none}.mobile-nav{padding:0 20px 14px;background:var(--bg);border-bottom:1px solid var(--line);position:sticky;top:70px;z-index:19;flex-direction:column;gap:0}.mobile-nav.open{display:flex}.mobile-nav a{padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.section-shell{padding-left:22px;padding-right:22px}.hero{display:flex;flex-direction:column;align-items:stretch;gap:40px;padding-top:62px;padding-bottom:55px;min-height:0}.hero h1{font-size:clamp(46px,12vw,68px)}.hero-description{font-size:14px}.hero-note{margin-top:29px}.hero-art{min-height:330px}.shape-one{width:170px;height:170px}.shape-two{width:125px;height:125px}.art-orbit{width:260px;height:130px}.ticker-track{justify-content:flex-start;padding-left:22px;gap:22px;font-size:8px}.ticker-track span:nth-of-type(n+4),.ticker-track i:nth-of-type(n+4){display:none}.services,.how{padding-top:70px;padding-bottom:75px}.section-heading{display:block;margin-bottom:30px}.section-heading .eyebrow{margin-bottom:20px}.section-heading h2{font-size:43px}.service-grid{grid-template-columns:1fr}.service-card{min-height:260px;padding:22px}.service-icon{margin:17px 0 10px}.steps .step{grid-template-columns:42px 1fr;gap:12px}.cta{padding-top:55px;padding-bottom:55px}.cta-inner{padding:34px 25px}.cta h2{font-size:49px}.cta-stamp{position:relative;top:auto;right:auto;translate:0 0;width:110px;height:110px;margin:35px 0 0 auto}.cta-stamp:before{inset:8px}.cta-stamp:after{inset:17px}.cta-stamp>span{font-size:40px}.cta-stamp small{font-size:5px}.site-footer{padding:22px;flex-wrap:wrap;gap:12px}.site-footer>p{width:100%;order:3}.footer-right{gap:14px;font-size:9px}}

/* Logotipos oficiales SKRAWER proporcionados por el usuario */
.brand-logo{display:block;width:clamp(112px,12vw,170px);height:auto;max-height:42px;object-fit:contain;object-position:left center}
.logo-for-dark{display:none}
:root[data-theme="dark"] .logo-for-light{display:none}
:root[data-theme="dark"] .logo-for-dark{display:block}
.hero-logo{display:block;width:min(82%,300px);height:auto;max-height:95px;object-fit:contain}
.hero-logo.logo-for-dark{display:none}
:root[data-theme="dark"] .hero-logo.logo-for-light{display:none}
:root[data-theme="dark"] .hero-logo.logo-for-dark{display:block}
.footer-brand{min-width:120px}
.footer-brand .brand-logo{width:125px;max-height:35px}
@media(max-width:680px){.brand-logo{width:115px;max-height:34px}.hero-logo{max-height:75px}}

/* Identidad principal: W oficial girando suavemente en la esquina superior izquierda */
.brand{gap:11px}
.brand-w{display:block;width:35px;height:35px;object-fit:contain;flex:0 0 auto;animation:skrawer-pause-spin 7s ease-in-out infinite;transform-origin:center}
.brand-word{font-weight:850;letter-spacing:.16em}
:root[data-theme="dark"] .brand-w.logo-for-light{display:none}
:root:not([data-theme="dark"]) .brand-w.logo-for-dark{display:none}
@keyframes skrawer-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.brand-w{animation:none}}
.footer-brand .brand-w{width:29px;height:29px}
@media(max-width:680px){.brand-w{width:31px;height:31px}.brand-word{font-size:15px}}


/* Microinteracciones y animaciones globales */
@keyframes skrawer-pause-spin{
  0%,72%{transform:rotate(0deg)}
  86%{transform:rotate(180deg)}
  100%{transform:rotate(360deg)}
}
@keyframes rise-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes soft-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes line-grow{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
@keyframes orbit-breathe{0%,100%{opacity:.45;scale:1}50%{opacity:.9;scale:1.04}}
.hero-copy{animation:rise-in .8s cubic-bezier(.2,.7,.2,1) both}
.hero-art{animation:rise-in .9s .12s cubic-bezier(.2,.7,.2,1) both;transition:background .3s,border-color .3s,transform .4s}
.hero-art:hover{transform:translateY(-4px)}
.art-shape{transition:transform .7s cubic-bezier(.2,.7,.2,1),border-color .3s}
.hero-art:hover .shape-one{transform:translate(-50%,-50%) rotate(60deg) scale(1.06)}
.hero-art:hover .shape-two{transform:translate(-50%,-50%) rotate(12deg) scale(1.08)}
.art-orbit{transition:transform .8s ease,opacity .4s}
.hero-art:hover .orbit-one{transform:translate(-50%,-50%) rotate(68deg)}
.hero-art:hover .orbit-two{transform:translate(-50%,-50%) rotate(-68deg)}
.center-caption{transition:letter-spacing .3s}
.hero-art:hover .center-caption{letter-spacing:.27em}
.service-card{position:relative;overflow:hidden;transform:translateY(0);transition:transform .28s ease,background .25s,border-color .25s,box-shadow .28s}
.service-card:before{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:var(--text);transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.service-card:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:var(--muted)}
.service-card:hover:before{transform:scaleX(1)}
.service-icon{transition:transform .35s ease}
.service-card:hover .service-icon{transform:translateY(-4px) rotate(-5deg)}
.card-link{transition:padding .25s,border-color .25s}
.card-link:hover{padding-left:4px;border-color:var(--text)}
.button{position:relative;overflow:hidden}
.button:after{content:"";position:absolute;inset:0;background:currentColor;opacity:0;transition:opacity .25s;pointer-events:none}
.button:hover:after{opacity:.06}
.text-link span,.card-link span{display:inline-block;transition:transform .25s}
.text-link:hover span,.card-link:hover span{transform:translate(3px,-2px)}
.step{transition:padding-left .3s ease}
.step:hover{padding-left:9px}
.step-number{transition:color .25s}
.step:hover .step-number{color:var(--text)}
.ticker-track i{animation:soft-float 3s ease-in-out infinite}
.ticker-track i:nth-of-type(2){animation-delay:.4s}
.ticker-track i:nth-of-type(3){animation-delay:.8s}
.cta-inner{transition:background .3s}
.cta-inner:hover .cta-stamp{animation:soft-float 3s ease-in-out infinite}
.cta-stamp{transition:transform .5s ease}
.footer-brand:hover .brand-w{animation:skrawer-w-pause-spin 5.5s ease-in-out infinite}
.site-header{transition:background .25s,border-color .25s,box-shadow .25s}
.site-header.scrolled{box-shadow:0 8px 25px rgba(0,0,0,.05)}
/* Las secciones aparecen suavemente al entrar en pantalla. */
.js-reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.js-reveal.is-visible{opacity:1;transform:translateY(0)}
.service-card.js-reveal:nth-child(2){transition-delay:.08s}
.service-card.js-reveal:nth-child(3){transition-delay:.16s}
.step.js-reveal:nth-child(2){transition-delay:.08s}
.step.js-reveal:nth-child(3){transition-delay:.16s}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .js-reveal{opacity:1;transform:none}
}

/* Giro limpio: rotación completa en el plano, sin deformar ni comprimir la W */
.brand{gap:10px}
.brand-w-wrap{width:52px;height:52px;display:inline-grid;place-items:center;flex:0 0 52px;overflow:visible}
.brand-w{width:100%;height:100%;object-fit:contain;display:block;animation:skrawer-w-clean-spin 6s linear infinite;transform-origin:50% 50%;}
.brand-wordmark{display:block;width:clamp(115px,12vw,170px);height:auto;max-height:38px;object-fit:contain;object-position:left center}
:root[data-theme="dark"] .brand-wordmark.logo-for-light{display:none}
:root:not([data-theme="dark"]) .brand-wordmark.logo-for-dark{display:none}
:root[data-theme="dark"] .brand-w.logo-for-light{display:none}
:root:not([data-theme="dark"]) .brand-w.logo-for-dark{display:none}
@keyframes skrawer-w-clean-spin{
  0%,68% { transform:rotate(0deg); }
  88%,100% { transform:rotate(360deg); }
}
.footer-brand .brand-w-wrap{width:44px;height:44px;flex-basis:44px}
.footer-brand .brand-wordmark{width:125px;max-height:30px}
@media(max-width:680px){
  .brand{gap:8px}
  .brand-w-wrap{width:44px;height:44px;flex-basis:44px}
  .brand-wordmark{width:clamp(105px,30vw,135px);max-height:31px}
}
/* Giro sobre el eje vertical: la W no se pone de cabeza. */
.brand-w-wrap{perspective:700px;}
.brand-w{animation:skrawer-vertical-spin 6s ease-in-out infinite;backface-visibility:visible;}
@keyframes skrawer-vertical-spin{
  0%,68% { transform:rotateY(0deg); }
  84% { transform:rotateY(180deg); }
  100% { transform:rotateY(360deg); }
}
.footer-brand .brand-w{animation:skrawer-vertical-spin 6s ease-in-out infinite;}

/* Portfolio conceptual + cotizador interactivo */
.showcase,.quote-section{padding-top:clamp(70px,9vw,120px);padding-bottom:clamp(70px,9vw,120px)}
.showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:38px}
.showcase-card{border:1px solid var(--line,rgba(128,128,128,.28));border-radius:18px;overflow:hidden;background:var(--card-bg,transparent);transition:transform .3s ease,border-color .3s ease}
.showcase-card:hover{transform:translateY(-5px);border-color:currentColor}
.preview-browser{height:34px;display:flex;align-items:center;gap:5px;padding:0 13px;border-bottom:1px solid rgba(128,128,128,.2);font-size:8px;letter-spacing:.13em;opacity:.7}
.preview-browser>span{width:6px;height:6px;border:1px solid currentColor;border-radius:50%}.preview-browser small{margin-left:auto;font-size:8px}
.preview-screen{height:265px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:22px;gap:11px;overflow:hidden}
.preview-kicker{font-size:9px;letter-spacing:.24em}.preview-screen strong{font-size:clamp(27px,3vw,43px);line-height:1.05;font-weight:500}.preview-screen small{font-size:8px;letter-spacing:.18em}.preview-rule{height:1px;width:45px;background:currentColor;opacity:.5}
.wedding-screen{background:linear-gradient(145deg,#f3ede5,#ded0c0);color:#44372f;font-family:Georgia,serif}.wedding-screen strong{font-family:Georgia,serif;font-style:italic}.wedding-screen strong i{font-size:.7em;font-weight:400}
.quince-screen{background:radial-gradient(circle at 50% 25%,#4e4e4e,#171717 75%);color:#f5f2ed}.quince-screen strong{font-family:Georgia,serif;font-style:italic;font-size:38px}.preview-number{font-family:Georgia,serif;font-size:48px;line-height:.8;opacity:.78}
.business-screen{align-items:flex-start;text-align:left;background:#e8e8e5;color:#141414}.business-screen strong{font-weight:650;font-size:36px;letter-spacing:-.06em}.business-screen .preview-kicker{font-size:8px}.business-screen>span{font-size:10px}.preview-pill{padding:9px 12px;border:1px solid #222;border-radius:99px;margin-top:7px}
.showcase-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px}.preview-tag{font-size:9px;letter-spacing:.13em;opacity:.65}.showcase-meta h3{font-size:17px;margin:9px 0 6px}.showcase-meta p{font-size:12px;line-height:1.6;opacity:.7;margin:0}.showcase-arrow{font-size:20px}.showcase-disclaimer{font-size:11px;opacity:.65;margin-top:18px}
.quote-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:26px;margin-top:38px;align-items:start}.quote-form{border:1px solid var(--line,rgba(128,128,128,.28));border-radius:18px;padding:clamp(20px,4vw,34px);display:flex;flex-direction:column;gap:10px}.quote-form>label,.quote-addons legend{font-size:12px;font-weight:650;margin-top:8px}.quote-form textarea{width:100%;min-height:120px;resize:vertical;padding:14px 13px;border:1px solid var(--line,rgba(128,128,128,.3));border-radius:10px;background:var(--input-bg,transparent);color:inherit;font:inherit;font-size:13px;line-height:1.6}.quote-form textarea::placeholder{opacity:.55}.idea-help{font-size:10px;line-height:1.6;opacity:.65;margin-top:-4px}.quote-form select{width:100%;padding:14px 13px;border:1px solid var(--line,rgba(128,128,128,.3));border-radius:10px;background:var(--input-bg,transparent);color:inherit;font:inherit;font-size:13px}.quote-form select option{color:#111;background:#fff}.quote-addons{border:0;padding:0;margin:8px 0 0;display:grid;gap:0}.quote-addons legend{margin-bottom:9px}.check-option{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line,rgba(128,128,128,.18));font-size:13px;cursor:pointer}.check-option input{accent-color:currentColor;width:15px;height:15px}.check-option small{margin-left:auto;opacity:.6;font-size:10px}.currency-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px}.currency-switch label{border:1px solid var(--line,rgba(128,128,128,.28));border-radius:10px;padding:12px 10px;font-size:12px;cursor:pointer}.currency-switch input{accent-color:currentColor;margin-right:5px}.quote-note{font-size:10px;line-height:1.6;opacity:.65;margin:8px 0 0}.quote-result{position:sticky;top:90px;background:#111;color:#fff;border-radius:18px;padding:clamp(23px,4vw,35px)}:root[data-theme="dark"] .quote-result{background:#f1f1ef;color:#111}.quote-result-kicker{font-size:9px;letter-spacing:.18em;opacity:.65}.quote-result h3{font-size:20px;margin:18px 0 8px}.quote-price{font-size:clamp(27px,3vw,40px);letter-spacing:-.05em;font-weight:600;margin:0 0 12px}.quote-result>p:not(.quote-price){font-size:12px;line-height:1.7;opacity:.75}.quote-result ul{padding-left:18px;font-size:12px;line-height:2;margin:22px 0}.quote-result .button{width:100%;justify-content:center;background:#fff;color:#111;border:1px solid #fff}.quote-result small{display:block;font-size:10px;line-height:1.6;opacity:.65;margin-top:14px}
@media(max-width:850px){.showcase-grid{grid-template-columns:1fr 1fr}.showcase-card:last-child{grid-column:1/-1}.showcase-card:last-child .preview-screen{height:230px}.quote-layout{grid-template-columns:1fr}.quote-result{position:static}}
@media(max-width:560px){.showcase-grid{grid-template-columns:1fr}.showcase-card:last-child{grid-column:auto}.preview-screen{height:250px}.showcase-card:last-child .preview-screen{height:250px}.currency-switch{grid-template-columns:1fr}.showcase-meta{padding:17px}}

/* SKRAWER ART DIRECTION 2.0 — tipografía editorial, profundidad y movimiento por toda la experiencia */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&display=swap');
:root{--accent:#c8ff4d;--shadow:0 24px 70px rgba(0,0,0,.12)}
:root[data-theme="dark"]{--accent:#d0ff63;--shadow:0 24px 70px rgba(0,0,0,.34)}
body{font-family:'DM Sans',ui-sans-serif,system-ui,sans-serif;letter-spacing:-.012em}
h1,h2,h3,.quote-price,.center-word,.brand-wordmark{font-family:'Space Grotesk','DM Sans',sans-serif}
.site-header{backdrop-filter:blur(18px);background:color-mix(in srgb,var(--bg) 86%,transparent);box-shadow:0 1px 0 color-mix(in srgb,var(--line) 65%,transparent)}
.desktop-nav a,.mobile-nav a{position:relative;transition:color .25s ease}
.desktop-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:1px;background:var(--text);transition:right .28s ease}
.desktop-nav a:hover:after{right:0}
.hero{position:relative;isolation:isolate}
.hero:before{content:"";position:absolute;width:clamp(260px,35vw,520px);height:clamp(260px,35vw,520px);border-radius:50%;right:4%;top:8%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 17%,transparent),transparent 68%);filter:blur(18px);z-index:-1;animation:glow-drift 9s ease-in-out infinite alternate;pointer-events:none}
.hero h1{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-.075em}
.hero h1 span,.section-heading h2 span,.cta h2 span{background:linear-gradient(100deg,var(--muted),var(--text),var(--muted));background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradient-flow 8s linear infinite}
.hero-art{border-radius:4px;box-shadow:0 25px 65px rgba(0,0,0,.07)}
.art-shape{animation:shape-drift 12s ease-in-out infinite alternate}
.shape-two{animation-delay:-4s}
.art-orbit{animation:orbit-spin 24s linear infinite}
.orbit-two{animation-direction:reverse;animation-duration:31s}
.center-symbol{position:relative;border-radius:50%;animation:symbol-breathe 4s ease-in-out infinite;box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 0%,transparent);transition:box-shadow .35s,border-radius .35s}
.hero-art:hover .center-symbol{border-radius:18px;box-shadow:0 0 0 12px color-mix(in srgb,var(--accent) 12%,transparent)}
.ticker{background:var(--text);color:var(--bg);border-color:var(--text);padding:19px 0}
.ticker-track{width:max-content;justify-content:flex-start;animation:ticker-travel 28s linear infinite;font-size:10px;letter-spacing:.19em}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track i{color:var(--accent);font-size:18px}
.services,.showcase,.quote-section,.how{position:relative}
.section-heading h2,.cta h2{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-.075em}
.eyebrow{font-size:10px;letter-spacing:.2em}
.service-card{border-radius:3px;min-height:330px;transition:transform .4s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s,box-shadow .4s}
.service-card:nth-child(2){transition-delay:.06s}.service-card:nth-child(3){transition-delay:.12s}
.service-card:after{content:"↗";position:absolute;right:22px;top:54px;font-size:24px;color:var(--muted);opacity:0;transform:translate(-8px,8px);transition:opacity .3s,transform .3s}
.service-card:hover:after{opacity:1;transform:translate(0,0)}
.service-icon{width:58px;height:58px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;transition:transform .45s cubic-bezier(.2,.8,.2,1),background .3s,color .3s}
.service-card:hover .service-icon{background:var(--accent);color:#111;border-color:var(--accent);transform:rotate(-12deg) scale(1.08)}
.showcase-card{border-radius:4px;transform:translateY(0);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .4s,border-color .3s}
.showcase-card:hover{transform:translateY(-10px) rotate(-.3deg);box-shadow:0 25px 55px rgba(0,0,0,.13)}
.preview-browser{height:39px;background:color-mix(in srgb,var(--surface) 70%,transparent)}
.preview-screen{position:relative;isolation:isolate;transition:background .4s}
.preview-screen:before{content:"";position:absolute;inset:-30%;border:1px solid currentColor;border-radius:50%;opacity:.13;transform:scale(.7) rotate(-15deg);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.showcase-card:hover .preview-screen:before{transform:scale(1.05) rotate(18deg)}
.wedding-screen{background:radial-gradient(ellipse at 50% 15%,#fffaf3,#e4d4c2 65%,#c8b29b)}
.quince-screen{background:radial-gradient(circle at 50% 30%,#62606a,#17151b 72%)}
.business-screen{background:linear-gradient(135deg,#edeee8,#cfd3c6)}
.preview-pill{transition:background .3s,color .3s,transform .3s}
.showcase-card:hover .preview-pill{background:#171717;color:#fff;transform:translateY(-2px)}
.showcase-arrow{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid var(--line);border-radius:50%;transition:transform .3s,background .3s,color .3s}
.showcase-card:hover .showcase-arrow{transform:rotate(45deg);background:var(--text);color:var(--bg)}
.quote-form,.quote-result{border-radius:4px;box-shadow:0 16px 50px rgba(0,0,0,.045);transition:box-shadow .3s,transform .3s}
.quote-form:focus-within{box-shadow:0 20px 55px rgba(0,0,0,.09)}
.quote-form select,.quote-form textarea,.check-option,.currency-switch label{transition:border-color .25s,background .25s,transform .25s}
.quote-form select:focus,.quote-form textarea:focus{outline:2px solid var(--accent);outline-offset:2px}
.check-option:hover{padding-left:8px;background:color-mix(in srgb,var(--surface) 60%,transparent)}
.currency-switch label:has(input:checked){border-color:var(--text);background:var(--surface);box-shadow:inset 0 0 0 1px var(--text)}
.quote-result{background:linear-gradient(145deg,#111,#292929);position:sticky;overflow:hidden}
.quote-result:before{content:"";position:absolute;width:250px;height:250px;border:1px solid rgba(255,255,255,.13);border-radius:50%;right:-120px;top:-100px;box-shadow:0 0 0 25px rgba(255,255,255,.025),0 0 0 50px rgba(255,255,255,.02);animation:slow-orbit 18s linear infinite;pointer-events:none}
.quote-result>*{position:relative;z-index:1}
.quote-price{font-variant-numeric:tabular-nums;transition:transform .25s}
.quote-result.price-updated .quote-price{animation:price-pop .42s cubic-bezier(.2,.8,.2,1)}
.steps .step{transition:padding .3s ease,border-color .3s}
.steps .step:hover{padding-left:12px;border-color:var(--text)}
.step-number{font-family:'Space Grotesk',sans-serif;font-size:14px}
.cta-inner{border-radius:4px;background:radial-gradient(ellipse at 95% 5%,#343434,#111 56%);isolation:isolate}
.cta-inner:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 32px,rgba(255,255,255,.035) 33px 34px);mask-image:linear-gradient(90deg,transparent,#000);z-index:-1;animation:pattern-drift 22s linear infinite}
.cta-stamp{animation:stamp-float 6s ease-in-out infinite;transition:border-color .3s}
.cta-inner:hover .cta-stamp{border-color:var(--accent)}
.button{transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,background .25s,color .25s}
.button:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(0,0,0,.13)}
.button:active{transform:translateY(0) scale(.98)}
.button-dark:hover{background:var(--accent);color:#111}
.button-light:hover{background:var(--accent);color:#111;border-color:var(--accent)}
.site-footer{position:relative;overflow:hidden}
.site-footer:before{content:"SKRAWER";position:absolute;right:-.02em;bottom:-.52em;font-family:'Space Grotesk',sans-serif;font-size:clamp(65px,15vw,210px);font-weight:700;letter-spacing:-.09em;line-height:1;color:var(--text);opacity:.035;pointer-events:none;white-space:nowrap}
@keyframes ticker-travel{from{transform:translateX(0)}to{transform:translateX(-25%)}}
@keyframes orbit-spin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes shape-drift{from{rotate:-8deg;scale:.96}to{rotate:12deg;scale:1.04}}
@keyframes symbol-breathe{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}50%{box-shadow:0 0 0 8px rgba(255,255,255,.08)}}
@keyframes glow-drift{from{transform:translate(-8%,0) scale(.9);opacity:.55}to{transform:translate(8%,8%) scale(1.12);opacity:1}}
@keyframes gradient-flow{to{background-position:220% center}}
@keyframes slow-orbit{to{transform:rotate(360deg)}}
@keyframes price-pop{0%{transform:translateY(5px);opacity:.55}100%{transform:translateY(0);opacity:1}}
@keyframes stamp-float{0%,100%{translate:0 -50%;rotate:-12deg}50%{translate:0 calc(-50% - 9px);rotate:-7deg}}
@keyframes pattern-drift{to{background-position:120px 120px}}
@media(max-width:680px){.ticker-track{animation-duration:20s}.service-card{min-height:285px}.cta-stamp{animation:none}.site-footer:before{font-size:76px}}
@media(prefers-reduced-motion:reduce){.ticker-track,.art-shape,.art-orbit,.center-symbol,.hero:before,.cta-stamp,.cta-inner:before{animation:none!important}.showcase-card,.service-card,.button{transition:none!important}}

/* SKRAWER ART DIRECTION 3.0 — interfaz editorial, contundente y contemporánea */
:root{--accent:#c8ff45;--line:color-mix(in srgb,var(--text) 17%,transparent)}
.site-header{height:88px;padding-inline:clamp(24px,4.2vw,76px);display:grid;grid-template-columns:1fr auto 1fr;gap:30px;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(22px);border-bottom:1px solid var(--line)}
.brand{gap:14px;justify-self:start}.brand-w-wrap{width:43px;height:43px;display:grid;place-items:center;flex:none}.brand-w{width:100%;height:100%;object-fit:contain}.brand-wordmark{width:112px;max-height:38px;object-fit:contain}
.desktop-nav{align-items:center;gap:clamp(18px,2.2vw,38px);font-size:12px;font-weight:600;color:var(--text);letter-spacing:-.02em}.desktop-nav a{opacity:.68}.desktop-nav a:hover{opacity:1}.desktop-nav a:after{height:2px;bottom:-11px;background:var(--accent)}
.header-actions{justify-self:end;gap:10px}.theme-toggle{border-radius:3px;padding:10px 13px;font-weight:650}.header-actions .button{min-height:42px;border-radius:2px;padding-inline:18px}.button-dark{background:var(--accent);color:#101010}.button-dark:hover{background:var(--text);color:var(--bg)}
.hero{min-height:650px;padding-top:100px;padding-bottom:100px;grid-template-columns:1fr .92fr;gap:8%;align-items:center}.hero-copy{max-width:720px}.eyebrow{font-size:10px;letter-spacing:.22em;font-weight:800}.hero h1{font-size:clamp(58px,7.1vw,108px);line-height:.9;letter-spacing:-.09em;font-weight:700;margin-bottom:32px}.hero-description{font-size:16px;max-width:470px;line-height:1.75}.hero-art{min-height:470px;border-radius:2px;background:var(--surface);box-shadow:12px 12px 0 color-mix(in srgb,var(--accent) 90%,transparent);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .4s}.hero-art:hover{transform:translate(-4px,-4px);box-shadow:18px 18px 0 var(--accent)}.art-topline,.art-bottomline{font-size:9px;letter-spacing:.16em}.center-symbol{width:90px;height:90px;font-size:57px}.center-word{font-size:15px;letter-spacing:.25em}
/* Cinta de servicios: tipográfica, de alto impacto y sin adornos de plantilla */
.ticker{padding:0;background:var(--accent);color:#111;border:0;overflow:hidden;transform:rotate(-1deg) scale(1.015);margin-block:22px;box-shadow:0 8px 0 color-mix(in srgb,var(--accent) 22%,transparent)}.ticker-track{gap:0;min-height:78px;align-items:center;animation-duration:32s;font-size:clamp(15px,1.8vw,24px);font-weight:800;letter-spacing:-.045em}.ticker-track span{padding-inline:30px}.ticker-track i{font-size:24px;font-weight:400;color:#111;opacity:.6}.ticker:hover .ticker-track{animation-play-state:running}.ticker-track i{animation:none}
.section-heading h2,.cta h2{font-weight:700}.services,.showcase,.quote-section,.how{padding-top:125px;padding-bottom:125px}.service-grid{gap:16px}.service-card{border-radius:2px;border-width:1px;position:relative;overflow:hidden}.service-card:before{content:"";position:absolute;left:0;right:100%;bottom:0;height:4px;background:var(--accent);transition:right .45s cubic-bezier(.2,.8,.2,1)}.service-card:hover:before{right:0}.service-card:hover{transform:translateY(-7px);box-shadow:0 18px 42px rgba(0,0,0,.08)}
.showcase-card{overflow:hidden}.preview-browser{border-bottom:1px solid var(--line)}.quote-form,.quote-result{border-radius:2px}.cta-inner{border-radius:2px}.cta-stamp{border-radius:50%}.site-footer{padding-block:35px}
@media(min-width:1500px){.hero{min-height:740px}.hero-art{min-height:520px}}
@media(max-width:1050px){.site-header{grid-template-columns:auto 1fr auto;gap:18px}.desktop-nav{gap:16px}.brand-wordmark{width:95px}.hero{gap:5%;}.hero h1{font-size:clamp(54px,6.5vw,80px)}}
@media(max-width:800px){.site-header{height:76px;display:flex;padding-inline:22px;justify-content:space-between}.brand-w-wrap{width:36px;height:36px}.brand-wordmark{width:90px}.desktop-nav{display:none}.hero{padding-top:75px;padding-bottom:65px;min-height:0}.hero h1{font-size:clamp(54px,10vw,78px)}.hero-art{min-height:390px}.ticker{margin-block:12px}.ticker-track{min-height:64px}.services,.showcase,.quote-section,.how{padding-top:82px;padding-bottom:82px}}
@media(max-width:680px){.site-header{height:70px;padding-inline:17px}.brand{gap:9px}.brand-w-wrap{width:31px;height:31px}.brand-wordmark{width:82px}.header-actions{gap:7px}.theme-toggle{padding:8px}.hero{padding-top:65px;gap:34px}.hero h1{font-size:clamp(49px,12vw,70px);letter-spacing:-.085em}.hero-description{font-size:14px}.hero-art{min-height:320px;box-shadow:7px 7px 0 var(--accent)}.ticker{transform:rotate(-1deg) scale(1.025);margin-block:12px}.ticker-track{min-height:56px;font-size:14px}.ticker-track span{padding-inline:19px}.ticker-track i{font-size:17px}.services,.showcase,.quote-section,.how{padding-top:70px;padding-bottom:70px}}
@media(prefers-reduced-motion:reduce){.ticker-track{animation:none!important}.hero-art,.service-card,.service-card:before{transition:none!important}}

/* SKRAWER monochrome identity: strictly black, white and gray */
:root{--accent:#bdbdbd !important;--line:color-mix(in srgb,var(--text) 17%,transparent)}
:root[data-theme="dark"]{--accent:#bdbdbd !important}
.ticker{background:#e7e7e7 !important;color:#111 !important;box-shadow:0 8px 0 rgba(128,128,128,.14) !important}
.ticker-track i{color:#666 !important}
.status-dot{background:#888 !important;box-shadow:0 0 0 4px rgba(128,128,128,.18) !important}
.button-dark:hover,.button-light:hover{background:#777 !important;border-color:#777 !important;color:#fff !important}
.service-card:hover .service-icon{background:#d8d8d8 !important;color:#111 !important;border-color:#d8d8d8 !important}


/* SKRAWER 2026 — soft geometry, rounded surfaces, monochrome palette */
:root{--accent:#777;--radius:22px;--shadow:0 24px 70px rgba(0,0,0,.09)}
:root[data-theme="dark"]{--accent:#c9c9c9;--shadow:0 24px 70px rgba(0,0,0,.3)}
body{font-family:'Manrope',sans-serif;letter-spacing:-.018em}
h1,h2,h3,.quote-price,.center-word,.brand-wordmark,.brand{font-family:'Outfit','Manrope',sans-serif}
.site-header{height:88px;border-bottom-color:color-mix(in srgb,var(--line) 75%,transparent);padding-inline:clamp(22px,5vw,82px);border-radius:0 0 22px 22px}
.brand{gap:13px;font-size:20px;letter-spacing:.09em}
.brand-mark{border-radius:12px;border-width:1px}
.desktop-nav{gap:clamp(16px,2.5vw,36px);font-size:13px;font-weight:600}
.desktop-nav a{padding:10px 0}
.desktop-nav a:after{height:2px;border-radius:99px;bottom:2px}
.theme-toggle{padding:11px 15px;border-radius:999px;backdrop-filter:blur(10px)}
.button{border-radius:999px;padding-inline:24px;font-weight:750;letter-spacing:-.01em}
.button-small{border-radius:999px}
.button-dark:hover,.button-light:hover{background:#d9d9d9;color:#111;border-color:#d9d9d9}
.section-shell{padding-left:clamp(22px,7vw,112px);padding-right:clamp(22px,7vw,112px)}
.hero{gap:6%;padding-top:85px;padding-bottom:88px}
.hero h1{font-family:'Outfit',sans-serif;font-size:clamp(48px,6.4vw,92px);font-weight:700;letter-spacing:-.075em;line-height:.96}
.hero-description{font-size:16px;max-width:470px}
.hero-art{border-radius:28px;box-shadow:0 28px 80px rgba(0,0,0,.1)}
.art-shape{border-radius:22px}
.shape-two{border-radius:18px}
.center-symbol{border-radius:50%;border-color:var(--text);font-family:'Outfit',sans-serif}
.hero-art:hover .center-symbol{border-radius:50%;box-shadow:0 0 0 9px color-mix(in srgb,var(--text) 8%,transparent)}
.ticker{background:var(--surface);color:var(--text);border-color:var(--line);padding:23px 0}
.ticker-track{font-family:'Outfit',sans-serif;font-size:clamp(12px,1.2vw,15px);font-weight:700;letter-spacing:.11em;gap:38px}
.ticker-track i{color:var(--muted);font-size:19px}
.section-heading h2,.cta h2{font-family:'Outfit',sans-serif;font-weight:700;letter-spacing:-.065em}
.service-grid{gap:18px}
.service-card{position:relative;border-radius:24px;padding:30px;min-height:340px;background:color-mix(in srgb,var(--bg) 88%,var(--surface));overflow:hidden}
.service-card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(145deg,color-mix(in srgb,var(--text) 4%,transparent),transparent 45%);opacity:0;transition:opacity .35s;pointer-events:none}
.service-card:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--text) 25%,var(--line))}
.service-card:hover:before{opacity:1}
.service-card:after{right:28px;top:26px;border:1px solid var(--line);border-radius:50%;width:34px;height:34px;display:grid;place-items:center;font-size:16px}
.service-icon{border-radius:18px;background:var(--surface);border-color:var(--line);width:64px;height:64px;font-size:32px}
.service-card:hover .service-icon{background:var(--text);color:var(--bg);border-color:var(--text);transform:translateY(-2px) rotate(-5deg)}
.service-card h3{font-family:'Outfit',sans-serif;font-size:22px;font-weight:650;letter-spacing:-.045em}
.card-link{border-bottom:0;padding:11px 0 0;border-top:1px solid var(--line)}
.card-link span{border:1px solid var(--line);border-radius:50%;width:30px;height:30px;display:grid;place-items:center;transition:transform .25s,background .25s,color .25s}
.service-card:hover .card-link span{transform:rotate(45deg);background:var(--text);color:var(--bg)}
.how{border-radius:36px 36px 0 0}
.step{padding:28px 0}
.step-number{border:1px solid var(--line);border-radius:999px;width:44px;height:32px;display:grid;place-items:center;padding:0}
.step h3{font-family:'Outfit',sans-serif;font-size:20px}
.cta-inner{border-radius:32px;padding:clamp(34px,6vw,82px);background:radial-gradient(ellipse at 90% 0%,#353535,#111 58%)}
.cta-stamp{border-radius:50%;width:196px;height:196px}
.cta-stamp:before,.cta-stamp:after{border-radius:50%}
.showcase-grid{gap:20px}
.showcase-card{border-radius:26px;overflow:hidden}
.preview-browser{border-radius:18px 18px 0 0}
.preview-screen{border-radius:0 0 18px 18px;overflow:hidden}
.showcase-arrow{border-radius:50%;width:42px;height:42px;flex-basis:42px}
.quote-form,.quote-result{border-radius:26px}
.quote-form select,.quote-form textarea,.check-option,.currency-switch label{border-radius:16px}
.quote-form select,.quote-form textarea{border-color:var(--line);padding:14px 16px}
.quote-form select:focus,.quote-form textarea:focus{outline:2px solid color-mix(in srgb,var(--text) 25%,transparent);outline-offset:2px}
.check-option{padding:13px 15px}
.currency-switch label{border-radius:999px}
.quote-result{border-radius:28px;background:linear-gradient(145deg,#171717,#303030)}
.cta-stamp{border-color:#555}
.site-footer{padding-top:32px;padding-bottom:32px}
.site-footer .brand-mark{border-radius:10px}
@media(max-width:900px){.hero{gap:5%}.service-card{border-radius:20px;padding:24px}.cta-stamp{width:150px;height:150px}}
@media(max-width:680px){.site-header{height:74px;border-radius:0 0 16px 16px}.brand{font-size:16px}.brand-mark{border-radius:9px}.hero{padding-top:58px;padding-bottom:58px}.hero h1{font-size:clamp(47px,12vw,70px)}.hero-art{border-radius:22px}.ticker{padding:19px 0}.ticker-track{gap:24px;font-size:11px}.service-card{border-radius:22px;min-height:290px;padding:24px}.how{border-radius:26px 26px 0 0}.cta-inner{border-radius:26px}.cta-stamp{display:none}.quote-form,.quote-result{border-radius:22px}.site-footer{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* HOME 2026: portfolio primero, accesos directos y previews animadas */
.home-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding-top:0;padding-bottom:46px}
.shortcut-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:9px;min-height:150px;padding:22px 24px;border:1px solid var(--line);border-radius:22px;background:var(--surface);overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),background .3s,border-color .3s;animation:shortcut-enter .8s both}
.shortcut-card:nth-child(2){animation-delay:.1s}.shortcut-card:nth-child(3){animation-delay:.2s}
.shortcut-card:before{content:"";position:absolute;inset:auto -35px -70px auto;width:145px;height:145px;border:1px solid var(--line);border-radius:50%;transition:transform .6s ease}
.shortcut-card:hover{transform:translateY(-6px);border-color:var(--muted)}.shortcut-card:hover:before{transform:scale(1.35)}
.shortcut-number{font-size:10px;letter-spacing:.16em;color:var(--muted)}.shortcut-title{font-family:'Outfit','Manrope',sans-serif;font-size:clamp(19px,2vw,25px);font-weight:650;letter-spacing:-.045em}.shortcut-description{font-size:12px;color:var(--muted)}.shortcut-arrow{position:absolute;right:22px;top:20px;font-size:22px;transition:transform .3s}.shortcut-card:hover .shortcut-arrow{transform:translate(3px,-3px)}
.showcase{padding-top:clamp(50px,7vw,85px)}.showcase-card{animation:showcase-float 7s ease-in-out infinite;transform-origin:center bottom}.showcase-card:nth-child(2){animation-delay:-2.3s}.showcase-card:nth-child(3){animation-delay:-4.6s}.showcase-card:hover{animation-play-state:paused;transform:translateY(-8px) scale(1.012)}
.wedding-screen{position:relative}.wedding-screen:after{content:"";position:absolute;width:180px;height:180px;border:1px solid rgba(68,55,47,.2);border-radius:50%;animation:preview-orbit 18s linear infinite}
.quince-screen{position:relative}.quince-screen:before{content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(255,255,255,.16);border-radius:50%;animation:preview-orbit 22s linear infinite reverse}
.business-screen:after{content:"";position:absolute;right:-35px;bottom:-50px;width:145px;height:145px;border:1px solid rgba(0,0,0,.2);border-radius:28px;transform:rotate(18deg);animation:business-drift 8s ease-in-out infinite alternate}
.preview-screen>*{position:relative;z-index:1;animation:preview-content 1s both}.preview-screen strong{animation:preview-content 1s .12s both}.showcase-card:hover .preview-screen strong{transform:scale(1.06)}
.ticker{background:var(--surface);border-color:var(--line)}.ticker-track{animation:ticker-flow 28s linear infinite;width:max-content;justify-content:flex-start}.ticker-track i{font-size:10px}
@keyframes shortcut-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes showcase-float{0%,100%{translate:0 0}50%{translate:0 -5px}}
@keyframes preview-orbit{from{transform:rotate(0deg) scale(.9)}to{transform:rotate(360deg) scale(1.08)}}
@keyframes business-drift{from{transform:rotate(18deg) translateY(0)}to{transform:rotate(28deg) translateY(-12px)}}
@keyframes preview-content{from{opacity:.2;translate:0 9px}to{opacity:1;translate:0 0}}
@keyframes ticker-flow{from{transform:translateX(0)}to{transform:translateX(-25%)}}
@media(max-width:700px){.home-shortcuts{grid-template-columns:1fr;padding-bottom:25px;gap:10px}.shortcut-card{min-height:112px;padding:18px 20px}.showcase{padding-top:55px}.showcase-card{animation:none}.ticker-track{animation-duration:22s}}
@media(prefers-reduced-motion:reduce){.shortcut-card,.showcase-card,.preview-screen:after,.preview-screen:before,.ticker-track,.preview-screen>*{animation:none!important;transition:none!important}}

/* Portfolio-first homepage: four distinct examples, monochrome art direction */
.portfolio-intro{padding-top:86px;padding-bottom:46px;display:flex;align-items:end;justify-content:space-between;gap:40px}
.portfolio-intro-copy{max-width:850px}
.portfolio-intro h1{font-family:Manrope,Inter,system-ui,sans-serif;font-size:clamp(42px,6vw,82px);line-height:.98;letter-spacing:-.075em;margin:0 0 22px;font-weight:750}
.portfolio-intro h1 span{color:var(--muted)}
.portfolio-intro-copy>p:last-child{max-width:630px;color:var(--muted);line-height:1.8;font-size:15px;margin:0}
.portfolio-intro-links{display:flex;flex-direction:column;gap:9px;min-width:190px;margin-bottom:4px}
.portfolio-intro-links a{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:700;transition:background .25s,color .25s,transform .25s}
.portfolio-intro-links a:hover{background:var(--strong);color:var(--strong-text);transform:translateX(4px)}
.portfolio-heading{margin-top:20px}
.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.portfolio-card{border-radius:24px;overflow:hidden}
.portfolio-mock{height:370px;position:relative;overflow:hidden;padding:22px;display:flex;align-items:center;justify-content:center;isolation:isolate;transition:background .35s}
.mock-label{position:absolute;top:20px;left:22px;font-size:9px;letter-spacing:.16em;font-weight:750;z-index:2}
.mock-chip{position:absolute;right:18px;bottom:18px;border:1px solid currentColor;border-radius:999px;padding:7px 11px;font-size:8px;letter-spacing:.13em;font-weight:800;z-index:2;backdrop-filter:blur(8px)}
.invitation-basic-mock{background:#e8e4df;color:#252321}
.invitation-basic-mock:before{content:"";position:absolute;width:330px;height:330px;border:1px solid #b7b0a8;border-radius:50%;animation:portfolio-orbit 22s linear infinite}
.invitation-frame{position:relative;z-index:1;width:min(75%,330px);min-height:250px;background:#f7f4ef;box-shadow:0 25px 60px #00000014;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;padding:24px;text-align:center;transform:rotate(-2deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.invitation-frame strong{font-family:Georgia,serif;font-weight:400;font-size:clamp(28px,4vw,44px);letter-spacing:-.06em}.invitation-frame strong i{font-weight:400;color:#8d857b}.invitation-frame small{font-size:8px;letter-spacing:.14em}.mock-divider{height:1px;width:46px;background:#aaa096}.invitation-frame b{font-size:10px;letter-spacing:.16em}
.invitation-premium-mock{background:#171717;color:#f5f2ec}
.invitation-premium-mock:before,.invitation-premium-mock:after{content:"";position:absolute;border:1px solid #777;border-radius:50%;width:280px;height:420px;transform:rotate(35deg);animation:premium-float 8s ease-in-out infinite alternate}
.invitation-premium-mock:after{width:370px;height:250px;transform:rotate(-28deg);animation-delay:-4s}
.premium-invite{position:relative;z-index:1;text-align:center;display:flex;align-items:center;flex-direction:column;gap:12px}
.premium-invite small{font-size:8px;letter-spacing:.24em}.premium-invite strong{font-family:Georgia,serif;font-weight:400;font-size:clamp(30px,4.4vw,49px);letter-spacing:.12em}.premium-xv{font-family:Georgia,serif;font-size:64px;line-height:.9;font-style:italic;color:#c9c5bf}.premium-invite>span:not(.premium-xv){font-size:9px;letter-spacing:.18em}
.premium-pills{display:flex;gap:6px;margin-top:10px}.premium-pills b{font-size:7px;letter-spacing:.1em;border:1px solid #777;border-radius:999px;padding:7px 9px}
.ecommerce-mock{background:#e7e7e5;color:#171717;display:block;padding:0}
.shop-top{height:46px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #c9c9c6;font-size:8px;letter-spacing:.1em}
.shop-top b{font-size:12px;letter-spacing:.16em}.shop-hero{height:210px;padding:28px 30px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;position:relative;overflow:hidden}
.shop-hero:after{content:"";position:absolute;right:8%;top:15%;width:145px;height:145px;border-radius:50%;background:linear-gradient(140deg,#c8c8c5,#a2a29f);box-shadow:inset -18px -12px 35px #77777722;animation:product-float 5s ease-in-out infinite alternate}
.shop-hero small,.shop-hero>span{font-size:8px;letter-spacing:.16em;z-index:1}.shop-hero strong{font-size:clamp(26px,4vw,43px);letter-spacing:-.07em;line-height:.95;margin:13px 0;z-index:1}
.shop-products{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#c9c9c6;border-top:1px solid #c9c9c6}.shop-products>div{background:#f0f0ee;padding:10px 12px 12px;display:flex;flex-direction:column;gap:7px}.shop-products small{font-size:7px;letter-spacing:.1em}.product-shape{height:50px;display:block;margin:auto;position:relative;width:50px}.product-one{border-radius:8px 8px 17px 17px;background:linear-gradient(110deg,#bbb,#efefec,#9b9b98);width:33px;height:44px}.product-two{width:38px;height:38px;border-radius:50%;background:#b5b5b2;box-shadow:0 7px 0 -3px #777}.product-three{width:42px;height:24px;border-radius:12px 12px 5px 5px;background:#a8a8a4;transform:translateY(12px)}
.admin-mock{background:#e9e9e7;color:#202020;display:flex;align-items:stretch;justify-content:stretch;padding:0}
.admin-sidebar{width:58px;background:#202020;color:#fff;display:flex;flex-direction:column;align-items:center;gap:22px;padding:18px 0;flex-shrink:0}.admin-mark{font-weight:800;font-size:16px}.admin-sidebar i{width:16px;height:16px;border:1px solid #888;border-radius:5px;display:block}.admin-content{flex:1;padding:20px;min-width:0}.admin-top{display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid #d1d1ce;padding-bottom:13px;font-size:9px}.admin-top small{font-size:8px;letter-spacing:.12em;color:#666}.admin-welcome{font-size:18px;font-weight:750;letter-spacing:-.04em;margin:18px 0}.admin-welcome span{display:block;font-size:9px;color:#777;font-weight:400;letter-spacing:0;margin-top:4px}.admin-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.admin-stats>div{background:#f8f8f6;border:1px solid #d6d6d3;border-radius:10px;padding:10px 8px;min-width:0}.admin-stats small{display:block;font-size:7px;color:#777;letter-spacing:.08em}.admin-stats b{display:block;font-size:clamp(10px,1.3vw,15px);margin:5px 0;white-space:nowrap}.admin-stats em{font-size:7px;color:#555;font-style:normal}.admin-chart{height:95px;margin-top:13px;border:1px solid #d6d6d3;border-radius:10px;background:repeating-linear-gradient(to bottom,#f8f8f6 0,#f8f8f6 23px,#e2e2df 24px);display:flex;align-items:end;gap:4%;padding:12px 15px 0}.admin-chart span{flex:1;background:linear-gradient(to top,#666,#bcbcb8);border-radius:4px 4px 0 0;animation:chart-rise 1.2s cubic-bezier(.2,.8,.2,1) both;transform-origin:bottom}
.portfolio-card:hover .invitation-frame{transform:rotate(0) scale(1.04)}.portfolio-card:hover .shop-hero:after{transform:translateY(-8px) scale(1.07)}.portfolio-card:hover .admin-chart span{animation-duration:.7s}
@keyframes portfolio-orbit{to{transform:rotate(360deg)}}@keyframes premium-float{to{translate:12px -9px;rotate:12deg}}@keyframes product-float{to{transform:translateY(-8px) rotate(8deg)}}@keyframes chart-rise{from{scale:1 .15}to{scale:1 1}}
@media(max-width:800px){.portfolio-intro{display:block;padding-top:65px}.portfolio-intro-links{flex-direction:row;flex-wrap:wrap;margin-top:25px}.portfolio-intro-links a{flex:1;min-width:160px}.portfolio-grid{grid-template-columns:1fr 1fr}.portfolio-mock{height:310px}.admin-content{padding:13px}.admin-sidebar{width:42px}.admin-stats{gap:5px}}
@media(max-width:560px){.portfolio-intro{padding-top:48px;padding-bottom:28px}.portfolio-intro h1{font-size:clamp(39px,11vw,58px)}.portfolio-intro-copy>p:last-child{font-size:13px}.portfolio-intro-links{display:grid;grid-template-columns:1fr 1fr}.portfolio-intro-links a{min-width:0;padding:12px;font-size:11px}.portfolio-grid{grid-template-columns:1fr;gap:17px}.portfolio-mock{height:330px}.admin-content{padding:16px}.admin-sidebar{width:48px}.admin-stats b{font-size:13px}.shop-hero:after{right:9%;width:125px;height:125px}}
@media(prefers-reduced-motion:reduce){.portfolio-mock:before,.portfolio-mock:after,.invitation-basic-mock:before,.shop-hero:after,.admin-chart span{animation:none!important}}


/* Portfolio tipo carrusel: un proyecto protagonista por vez */
.portfolio-grid{display:block;position:relative;margin-top:32px;min-height:500px}
.portfolio-grid .portfolio-card{display:none;width:100%;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);align-items:stretch;gap:0;border-radius:28px;overflow:hidden;animation:portfolio-slide-in .48s cubic-bezier(.2,.8,.2,1) both}
.portfolio-grid .portfolio-card.is-active{display:grid}
.portfolio-grid .portfolio-mock{height:480px;border-radius:0}
.portfolio-grid .showcase-meta{padding:clamp(24px,4vw,58px);display:flex;align-items:center;justify-content:space-between;gap:20px;border:0;background:var(--card-bg,transparent)}
.portfolio-grid .showcase-meta h3{font-size:clamp(28px,4vw,48px);letter-spacing:-.055em;line-height:1.02;margin:13px 0}
.portfolio-grid .showcase-meta p{max-width:390px;font-size:15px;line-height:1.75;color:var(--muted)}
.portfolio-grid .showcase-arrow{flex-shrink:0;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);font-size:20px}
.portfolio-controls{display:flex;align-items:center;gap:16px;margin-top:20px}
.portfolio-controls button{width:46px;height:46px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--text);font-size:21px;cursor:pointer;transition:background .2s,color .2s,transform .2s}
.portfolio-controls button:hover{background:var(--strong);color:var(--strong-text);transform:scale(1.06)}
.portfolio-counter{display:flex;align-items:baseline;gap:7px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.portfolio-counter strong{font-size:22px;color:var(--text)}
.portfolio-progress{height:2px;flex:1;background:var(--line);overflow:hidden;border-radius:10px}.portfolio-progress span{height:100%;width:12.5%;display:block;background:var(--text);transition:width .35s ease}
.portfolio-hint{font-size:9px;letter-spacing:.14em;color:var(--muted)}
@keyframes portfolio-slide-in{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}
.booking-mock{background:#e9e8e5;color:#171717}.booking-window{width:86%;max-width:470px;background:#f8f8f6;border:1px solid #d0cfca;border-radius:22px;padding:22px;box-shadow:0 25px 70px #00000012}.booking-head{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.12em;border-bottom:1px solid #ddd;padding-bottom:15px}.booking-head span{color:#777}.booking-title{font-size:28px;line-height:1.02;letter-spacing:-.05em;margin:24px 0}.booking-title strong{font-weight:800}.booking-days{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;text-align:center;font-size:10px}.booking-days>*{padding:8px 0;border-radius:50%}.booking-days b{font-size:8px;color:#777}.booking-days span:nth-of-type(3){background:#171717;color:#fff}.booking-times{display:flex;gap:8px;margin-top:20px}.booking-times span,.booking-times b{border:1px solid #ddd;border-radius:999px;padding:8px 12px;font-size:9px}.booking-times b{background:#171717;color:#fff}
.landing-mock{background:#dcdcd8;color:#171717}.landing-window{position:relative;width:88%;height:82%;background:#f3f2ee;padding:32px;overflow:hidden;border-radius:20px}.landing-window>small,.personal-window>span{font-size:8px;letter-spacing:.13em}.landing-window h3{position:relative;z-index:1;font-size:clamp(30px,4.4vw,52px);line-height:.95;letter-spacing:-.07em;margin:35px 0 13px}.landing-window h3 i,.personal-window h3 i{font-family:Georgia,serif;font-weight:400}.landing-window p{position:relative;z-index:1;font-size:10px;max-width:170px;color:#666}.landing-cta{position:absolute;bottom:25px;left:32px;font-size:8px;letter-spacing:.1em;border-bottom:1px solid;padding-bottom:8px}.landing-plant{position:absolute;right:8%;bottom:-7%;width:120px;height:220px;border-left:3px solid #888;transform:rotate(17deg)}.landing-plant i,.landing-plant b,.landing-plant em{position:absolute;width:60px;height:27px;background:#9c9e96;border-radius:100% 0 100% 0;transform:rotate(-24deg);left:-54px;top:50px}.landing-plant b{left:0;top:90px;transform:rotate(32deg)}.landing-plant em{left:-50px;top:130px;transform:rotate(-15deg)}
.personal-mock{background:#171717;color:#f6f6f4}.personal-window{width:88%;height:82%;padding:34px;border:1px solid #575757;border-radius:22px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.personal-window:after{content:"";position:absolute;width:260px;height:260px;border:1px solid #555;border-radius:50%;right:-65px;top:-45px;box-shadow:0 0 0 24px #ffffff04,0 0 0 50px #ffffff04;animation:portfolio-orbit 30s linear infinite}.personal-window h3{font-size:clamp(34px,5vw,62px);line-height:.92;letter-spacing:-.07em;margin:35px 0;z-index:1}.personal-bottom{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #555;padding-top:16px;font-size:7px;letter-spacing:.1em;color:#aaa}.cms-mock{background:#e7e7e4;color:#171717}.cms-window{width:88%;background:#fafaf8;border:1px solid #d3d3ce;border-radius:18px;padding:20px;box-shadow:0 22px 50px #00000012}.cms-head{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.1em;border-bottom:1px solid #ddd;padding-bottom:15px}.cms-head span{color:#777}.cms-title{font-size:22px;letter-spacing:-.05em;margin:20px 0}.cms-title strong{display:block}.cms-row{display:flex;align-items:center;gap:10px;border:1px solid #e2e2de;border-radius:12px;padding:10px;margin-top:8px}.cms-thumb{width:40px;height:40px;border-radius:8px;background:linear-gradient(135deg,#b9b9b3,#e8e8e4);flex-shrink:0}.cms-thumb-two{background:linear-gradient(135deg,#aaa,#d9d9d5)}.cms-row div{flex:1;min-width:0}.cms-row b,.cms-row small{display:block;font-size:9px}.cms-row small{font-size:7px;color:#777;margin-top:4px}.cms-row em{font-size:6px;font-style:normal;border:1px solid #bbb;border-radius:99px;padding:5px}.cms-button{margin-top:14px;border-radius:999px;background:#171717;color:#fff;text-align:center;padding:11px;font-size:8px;letter-spacing:.1em}
@media(max-width:760px){.portfolio-grid{min-height:0}.portfolio-grid .portfolio-card.is-active{grid-template-columns:1fr}.portfolio-grid .portfolio-mock{height:330px}.portfolio-grid .showcase-meta{padding:24px}.portfolio-grid .showcase-meta h3{font-size:30px}.portfolio-grid .showcase-meta p{font-size:13px}.portfolio-hint{display:none}.portfolio-controls{gap:10px}.booking-window{padding:17px}.landing-window,.personal-window{padding:24px}}