/* Base, tipografía y elementos compartidos */
:root{--paper:#f4f3ec;--ink:#20231f;--muted:#62675e;--line:#d7dacf;--green:#d1ef88;--dark:#262d23;--radius:16px;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0}a{color:inherit}button,input,select,textarea{font:inherit}button,a,select,textarea{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #568333;outline-offset:5px}a{text-decoration:none}button{cursor:pointer}.wrap{max-width:1240px;padding-inline:38px;margin-inline:auto}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;font-weight:700;line-height:1.7;margin:0 0 25px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:600;letter-spacing:-.055em}h2{font-size:clamp(34px,4.1vw,54px);line-height:1.06;margin-bottom:20px}p{line-height:1.65}.button{display:inline-flex;justify-content:space-between;align-items:center;gap:25px;padding:17px 22px;font-size:14px;font-weight:700;border-radius:7px;border:1px solid transparent;line-height:1.4;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.primary{background:var(--green);color:var(--ink)}.primary:hover{background:#bce26b}.secondary{border-color:var(--line);background:transparent;color:var(--ink)}.secondary:hover{background:#e7e9df}.dark{background:var(--ink);color:white;width:100%}.text-link{background:none;border:0;padding:0;font-weight:700;font-size:14px;display:inline-flex;align-items:center;gap:17px;text-decoration:underline;text-underline-offset:5px}.section{padding-block:96px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:36px}.section-heading>p{max-width:330px;color:var(--muted);font-size:15px;margin-bottom:4px}
/* Encabezado y presentación */
.header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:25px}.brand{display:flex;align-items:center;gap:11px;font-weight:700;font-size:18px;letter-spacing:-.5px}.brand-mark{width:40px;height:40px;background:var(--ink);color:var(--green);display:grid;place-items:center;border-radius:50%;font-size:29px;letter-spacing:-2px;padding-bottom:6px}.brand-sub{display:block;font-weight:400;font-size:10px;letter-spacing:.4px;margin-top:4px}.header nav{display:flex;align-items:center;gap:32px;font-size:13px}.nav-contact{border:1px solid var(--ink);padding:12px 17px;border-radius:6px}.hero{padding-block:64px 85px;display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#64833d;margin-right:7px}h1{font-size:clamp(56px,6.7vw,86px);line-height:.99;margin-bottom:28px}.underline{background:linear-gradient(transparent 78%,var(--green) 0);padding-bottom:4px}.hero-text{font-size:17px;max-width:390px;color:var(--muted);margin-bottom:28px}.actions{display:flex;gap:25px;align-items:center;flex-wrap:wrap}.hero-note{font-size:11px;color:var(--muted);margin:23px 0 0}.hero-art{position:relative;padding:24px 18px 58px;background:#e4e7dc;border-radius:22px;transform:rotate(2deg)}.art-caption{display:flex;justify-content:space-between;font-size:8px;font-weight:700;letter-spacing:1.2px;margin-bottom:20px}.browser{background:white;border-radius:9px;overflow:hidden;box-shadow:0 20px 40px #20231f21;transform:rotate(-4deg);border:1px solid #cbd0c3}.browser-top{display:flex;align-items:center;gap:5px;height:31px;background:#fff;padding:0 11px}.browser-top i{width:5px;height:5px;border-radius:50%;background:#d4d7cf}.browser-top span{flex:1;text-align:center;font-size:8px;color:#8b8d88;margin-right:15px}.coffee-preview{background:#ead8bf;padding:22px 25px 0;overflow:hidden;position:relative}.coffee-nav{display:flex;justify-content:space-between;align-items:center}.coffee-nav strong{font:700 25px Georgia,serif;letter-spacing:-2px}.coffee-nav>span{font-size:8px}.coffee-title{font:52px/1.02 Georgia,serif;letter-spacing:-2px;margin-top:36px;position:relative;z-index:1}.coffee-cup{height:150px;position:relative;width:210px;margin:-5px 4px 0 auto;transform:rotate(-8deg)}.cup{width:143px;height:115px;position:absolute;top:15px;left:20px;background:linear-gradient(100deg,#f5f0e1,#c4bea9);border-radius:8px 8px 56px 56px;z-index:2;box-shadow:inset 8px 0 15px #fff8,0 13px 13px #59432920;display:grid;place-items:center}.cup:before{content:"";position:absolute;top:-9px;left:0;width:143px;height:23px;border-radius:50%;background:radial-gradient(ellipse at center,#67412c 50%,#ded5bf 54%,#fff4df 67%)}.cup span{font:700 22px Georgia,serif;color:#60684e;transform:rotate(3deg);letter-spacing:-1px}.cup-handle{position:absolute;top:33px;right:8px;width:58px;height:65px;border:14px solid #d5ceba;border-radius:40%;z-index:1}.saucer{position:absolute;bottom:5px;left:0;width:200px;height:25px;background:#c9c0a6;border-radius:50%;box-shadow:0 10px 15px #47321e30}.coffee-bottom{border-top:1px solid #49332135;padding:16px 0;display:flex;justify-content:space-between;font-size:9px}.small-tag{position:absolute;bottom:21px;right:-15px;display:flex;gap:12px;align-items:center;background:var(--green);padding:16px;border-radius:9px;font-size:12px;font-weight:700;transform:rotate(-2deg);box-shadow:0 8px 22px #29351e12}.small-tag small{display:block;margin-top:5px;font-size:10px;font-weight:400}.tag-icon{font-size:25px}.ribbon{background:var(--dark);color:var(--green);padding:23px 0}.ribbon .wrap{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:10px;font-weight:700;letter-spacing:1.4px}.ribbon span:nth-child(even){font-size:21px}
/* Galería de conceptos */
.examples{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.example-art{height:285px;border-radius:10px;padding:23px;overflow:hidden;position:relative;transition:transform .25s}.example:hover .example-art{transform:translateY(-5px)}.mini-label{font-size:9px;letter-spacing:1.5px;font-weight:700;display:block}.example-art strong{display:block;font-size:31px;line-height:1.08;letter-spacing:-1.2px;margin-top:42px;position:relative;z-index:1}.art-pill{position:absolute;bottom:23px;left:23px;border:1px solid currentColor;border-radius:25px;padding:9px 13px;font-size:10px;z-index:1}.cafe-art{background:#dbc5a7;color:#413126}.cafe-art strong{font-family:Georgia,serif;font-weight:400}.studio-art{background:#d6e0ef;color:#1e3550}.geometry{width:145px;height:145px;border:25px solid #8eaacb;position:absolute;right:-20px;bottom:-30px;transform:rotate(25deg)}.oficio-art{background:#e1e8b1;color:#354326}.oficio-art strong{font-weight:700;max-width:210px}.line-tool{font-size:180px;line-height:1;position:absolute;right:15px;bottom:-30px;transform:rotate(-35deg);opacity:.3}.example-meta{display:flex;justify-content:space-between;align-items:start;gap:10px;margin-top:18px}.example-meta h3{font-size:16px;letter-spacing:-.5px;margin-bottom:5px}.example-meta p{font-size:11px;color:var(--muted);margin-bottom:0}.example-meta>span{font-size:9px;white-space:nowrap;color:var(--muted);padding-top:3px}.section-note{font-size:11px;color:var(--muted);margin:24px 0 0}
/* Servicios, proceso y consulta */
.services{background:#e9ece3}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.service{border:1px solid #cdd3c3;border-radius:12px;padding:26px;display:flex;flex-direction:column}.featured{background:var(--paper);border-color:var(--ink)}.service-top{min-height:38px;display:flex;justify-content:space-between;align-items:start;gap:8px;font-size:8px;font-weight:700;letter-spacing:.6px}.badge{background:var(--green);padding:5px 7px;border-radius:4px;white-space:nowrap}.service h3{font-size:29px;line-height:1.12;margin:18px 0}.service-description{font-size:13px;color:var(--muted);min-height:65px;margin-bottom:17px}.price{font-size:39px;letter-spacing:-2px;line-height:1.2;margin-bottom:10px}.price small{font-size:11px;letter-spacing:1px}.quote-price{font-size:24px;letter-spacing:-1px;line-height:1.9;margin-bottom:10px}.service ul{list-style:none;margin:10px 0 25px;padding:0;flex:1}.service li{position:relative;padding:7px 0 7px 20px;font-size:12px;line-height:1.5}.service li:before{content:"✓";position:absolute;left:0;color:#577332}.service .button{font-size:12px;padding:14px}.service-foot{font-size:10px;color:var(--muted);margin:16px 0 0;line-height:1.55}.process{display:grid;grid-template-columns:1fr 1fr;gap:100px}.process-intro{font-size:15px;color:var(--muted);max-width:355px}.steps{list-style:none;margin:0;padding:0}.steps li{display:flex;gap:24px;padding:24px 0;border-top:1px solid var(--line)}.steps li>span{font-size:11px;color:#6f8458;font-weight:700;padding-top:4px}.steps h3{font-size:20px;letter-spacing:-.6px;margin-bottom:8px}.steps p{font-size:13px;color:var(--muted);margin-bottom:0}.contact-section{background:var(--green);padding:70px 0}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px}.contact-grid h2{font-size:62px}.contact-grid>div>p:not(.eyebrow){max-width:330px;font-size:15px}.email-link{display:inline-flex;gap:25px;margin-top:14px;font-weight:700;border-bottom:1px solid var(--ink);padding-bottom:9px}.email-address{font-size:11px!important;margin-top:12px;overflow-wrap:anywhere}.contact-grid label{display:block;font-size:12px;font-weight:700;margin:0 0 10px}.contact-grid select,.contact-grid textarea{width:100%;background:#f9fff0;border:1px solid #9bb967;border-radius:7px;padding:14px;font-size:14px;color:var(--ink);margin-bottom:20px}.contact-grid textarea{resize:vertical;min-height:125px}.form-note{font-size:11px;margin:12px 0 0;line-height:1.6}.form-fallback{padding-top:15px}.form-fallback p{font-size:12px}.form-fallback textarea{font-size:12px}.payment{padding-block:46px;display:flex;align-items:center;gap:25px}.payment-icon{font-size:26px;width:58px;height:58px;min-width:58px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center}.payment-copy{flex:1}.payment h2{font-size:20px;letter-spacing:-.7px;margin:0 0 10px}.payment p{font-size:12px;max-width:570px;color:var(--muted);margin:0}.alias-box{min-width:180px;border-left:1px solid var(--line);padding-left:30px;display:flex;flex-direction:column;align-items:start;gap:6px}.alias-box>span:first-child{font-size:8px;letter-spacing:1.5px}.alias-box strong{font-size:19px}.alias-box button{background:transparent;border:0;padding:3px 0;text-decoration:underline;text-underline-offset:3px;font-size:11px}.alias-box #copy-status{font-size:10px;min-height:14px}.footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-block:28px}.footer p,.footer>span{font-size:11px;color:var(--muted);margin:0}
/* Encargos digitales y campos de contacto */
.commission{padding-block:60px;display:grid;grid-template-columns:1fr 1fr;gap:80px;border-bottom:1px solid var(--line)}.commission p{font-size:14px;color:var(--muted);max-width:460px}.commission-detail ul{padding-left:20px;font-size:14px;line-height:2.2;margin-bottom:24px}.commission-detail>p{font-size:12px;margin:20px 0 0}.contact-grid input{width:100%;background:#f9fff0;border:1px solid #9bb967;border-radius:7px;padding:14px;font:inherit;font-size:14px;color:var(--ink);margin-bottom:20px}.contact-grid input:focus-visible{outline:3px solid #568333;outline-offset:5px}#discord-contact{margin-top:25px}#discord-contact .button{font-size:12px}#discord-contact .form-note{max-width:350px}@media(max-width:760px){.commission{grid-template-columns:1fr;gap:20px;padding-block:45px}.commission h2{font-size:39px}}
/* Envío del pedido y autorización del contacto */
.contact-grid .consent{display:flex;gap:10px;align-items:start;font-size:12px;line-height:1.5;font-weight:400;margin-bottom:20px}.contact-grid .consent input{width:17px;height:17px;flex:0 0 17px;margin:1px 0 0;accent-color:#344625}.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.button:disabled{opacity:.65;cursor:wait;transform:none}
/* Adaptación a pantallas pequeñas y preferencias de movimiento */
@media(min-width:1500px){.hero{padding-block:95px 110px}}@media(max-width:1000px){.hero{gap:35px}.coffee-title{font-size:44px}.service{padding:22px}.service-top{flex-wrap:wrap}.service h3{font-size:25px}.process,.contact-grid{gap:55px}.section{padding-block:75px}.small-tag{right:-8px}.example-art{padding:20px;height:270px}.example-art strong{font-size:27px}.example-meta{flex-wrap:wrap}}
@media(max-width:760px){.wrap{padding-inline:22px}.header{height:82px}.header nav{gap:18px}.header nav>a:first-child{display:none}.brand{font-size:16px}.brand-mark{width:34px;height:34px;font-size:26px}.hero{grid-template-columns:1fr;padding-block:43px 55px;gap:50px}.hero h1{font-size:clamp(58px,13vw,78px)}.hero-text{max-width:460px;font-size:16px}.hero-art{max-width:500px;width:100%;justify-self:center;margin-inline:6px}.coffee-title{font-size:52px}.small-tag{right:7px}.ribbon .wrap{flex-wrap:wrap;justify-content:center;gap:13px;font-size:8px;letter-spacing:.7px}.ribbon span:nth-child(6){display:none}.section{padding-block:60px}.section-heading{display:block;margin-bottom:28px}.section-heading>p{max-width:450px}.section-heading .eyebrow{margin-bottom:17px}.section-heading h2{font-size:39px}.examples,.service-grid{grid-template-columns:1fr;gap:30px}.example-art{height:275px}.example-art strong{font-size:38px;max-width:none}.example-meta{flex-wrap:nowrap}.service{padding:27px}.service-top{min-height:23px}.service h3{font-size:32px}.service-description{min-height:0}.service-grid{gap:16px}.service .button{font-size:14px}.service li{font-size:14px}.service-foot{font-size:11px}.process,.contact-grid{grid-template-columns:1fr;gap:30px}.process h2{font-size:43px}.process-intro{max-width:none}.contact-section{padding:55px 0}.contact-grid h2{font-size:53px}.contact-grid>div>p:not(.eyebrow){max-width:none}.payment{flex-wrap:wrap;gap:18px;padding-block:35px}.payment-icon{width:45px;height:45px;min-width:45px}.payment-copy{flex-basis:calc(100% - 65px)}.payment h2{font-size:19px;line-height:1.2}.alias-box{margin-left:63px;border-left:0;padding-left:0}.footer{align-items:start;flex-wrap:wrap;padding-block:25px;gap:20px}.footer p{display:none}.footer>span{padding-top:10px}.actions{gap:22px}.eyebrow{font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
