:root{--bg:#FBF9F6;--ink:#2A2623;--accent:#4C6775;--muted:#5A524C;--soft:#6B625B;--line:#E8E2DB;--band:#F3EEE8;--field:#CFC6BD}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Karla',system-ui,sans-serif;line-height:1.6}
a{color:var(--ink);text-decoration:none}a:hover{color:var(--accent)}
img{max-width:100%}
h1,h2,h3{font-family:'Jost',sans-serif;font-weight:400;margin:0;letter-spacing:-.01em}
p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px}
.eyebrow{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}
.muted{color:var(--muted)}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;z-index:10}.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* barra y cabecera */
.topbar{background:var(--ink);color:var(--band);font-size:13px;text-align:center;padding:10px 16px;letter-spacing:.04em}
.site-header{border-bottom:1px solid var(--line);background:var(--bg)}
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;padding-bottom:18px}
.brand{font-family:'Jost',sans-serif;font-size:22px;letter-spacing:.18em}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:26px;font-size:15px}
.nav a[aria-current="page"]{color:var(--accent)}
.nav .cta{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--ink);color:#fff}
.nav .cta:hover{background:var(--accent);color:#fff}

/* botones y campos */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 28px;border:0;border-radius:999px;background:var(--ink);color:#fff;font:inherit;font-size:15px;cursor:pointer}
.btn:hover{background:var(--accent);color:#fff}
.btn-lg{min-height:52px;font-size:16px}
.chip{min-height:44px;padding:0 20px;border-radius:999px;font:inherit;font-size:14px;cursor:pointer;background:transparent;color:var(--ink);border:1px solid var(--field)}
.chip.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
.in{min-height:44px;padding:0 14px;border:1px solid var(--field);border-radius:4px;background:#fff;font:inherit;color:var(--ink);width:100%}
textarea.in{padding:10px 14px;resize:vertical}
label.f{display:flex;flex-direction:column;gap:6px;font-size:14px}
.link-u{font-size:15px;border-bottom:1px solid currentColor;padding:10px 0}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#fff;font-size:12px;letter-spacing:.04em}
.pill i{width:8px;height:8px;border-radius:50%;background:var(--accent)}

/* tarjetas e imágenes */
.card{overflow:hidden;border-radius:6px;position:relative}
.im{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.card:hover .im{transform:scale(1.04)}
.r45{aspect-ratio:4/5;height:auto}
.lift{transition:transform .3s ease}.lift:hover{transform:translateY(-4px)}
.badge{position:absolute;left:12px;top:12px;padding:4px 10px;border-radius:999px;background:#fff;font-size:12px}
.pcard{display:flex;flex-direction:column;gap:10px}
.pcard .row{display:flex;justify-content:space-between;font-size:14px;color:var(--muted)}
.grid-p{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:40px 24px}
.grid-p4{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
[hidden]{display:none!important}

/* vista previa de lámina */
.stage{position:relative;background:#EAE3DB;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.stage::before{content:"";position:absolute;left:0;right:0;bottom:0;height:20%;background:#DDD3C8}
.stage .pill{position:absolute;left:20px;top:20px}
.vase{position:absolute;right:7%;bottom:14%;width:15%;aspect-ratio:1/2;border-radius:40% 40% 6px 6px;background:#C9D3C0}
.print{position:relative;width:58%;aspect-ratio:3/4;background:#F3EADF;border:14px solid #fff;outline:1px solid #D9CFC4;box-shadow:0 30px 50px -20px rgba(42,38,35,.35);margin-bottom:8%;transition:all .4s ease}
.print.digital{border:0}
.print-in{width:100%;height:100%;border:1px solid rgba(42,38,35,.12);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:9% 8% 8%}
.print-in svg{width:78%}
.print-text{text-align:center}
.print-name{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(22px,3.2vw,44px);letter-spacing:.12em;text-transform:uppercase;line-height:1.1;word-break:break-word}
.print-meta{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:14px}
.print-meta+.print-meta{margin-top:4px}
.pal{display:flex;align-items:center;gap:10px}
.pal button{width:44px;height:44px;border-radius:50%;cursor:pointer;border:3px solid #fff;box-shadow:0 0 0 1px var(--field)}
.pal button.is-on{box-shadow:0 0 0 1px var(--ink)}

/* portada */
.hero{display:flex;flex-wrap:wrap;align-items:center;gap:56px;padding-top:72px;padding-bottom:88px}
.hero h1{font-size:clamp(40px,6vw,64px);line-height:1.02;font-weight:300}
.hero h1 em{color:var(--accent)}
.try{display:flex;flex-direction:column;gap:18px;max-width:420px;padding:24px;border:1px solid var(--line);border-radius:8px;background:#fff;margin-top:32px}
.try .in{min-height:48px;font-size:17px;padding:0 16px}
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:22px 0}
.mq{display:flex;gap:48px;width:max-content;animation:mq 38s linear infinite;font-family:'Jost',sans-serif;font-size:28px;font-weight:300}
.mq b{color:var(--accent);font-weight:400}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.sec{padding:96px 0}
.sec h2{font-size:clamp(32px,4vw,44px);font-weight:300;line-height:1.1}
.head-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:40px}
.occ{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.occ .card{display:block;min-height:270px}
.occ .big{grid-row:span 2;min-height:560px}
.occ .im{position:absolute;inset:0}
.occ .cap{position:absolute;left:0;right:0;bottom:0;padding:20px 24px;background:var(--bg);display:flex;justify-content:space-between;align-items:center}
.occ .big .cap{padding:28px}
.occ h3{font-size:22px}.occ .big h3{font-size:28px}
.occ .dark{background:var(--ink)}
.occ .dark .in-dark{position:absolute;inset:0;padding:28px;display:flex;flex-direction:column;justify-content:space-between;color:var(--band)}
.occ .dark h3{font-size:26px;color:#fff}
.band{background:var(--band)}
.split{display:flex;flex-wrap:wrap;align-items:center;gap:64px}
.compare{position:relative;aspect-ratio:4/3;border-radius:8px;overflow:hidden;--pct:50%}
.compare img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.compare .sketch{clip-path:inset(0 calc(100% - var(--pct)) 0 0)}
.compare .handle{position:absolute;top:0;bottom:0;left:var(--pct);width:2px;margin-left:-1px;background:#fff;display:flex;align-items:center;justify-content:center}
.compare .handle span{width:40px;height:40px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:14px}
.compare .pill{position:absolute;bottom:16px}
input[type=range]{accent-color:var(--ink);width:100%;height:44px}
.quiz{background:var(--ink);color:var(--band)}
.quiz h2{color:#fff}
.quiz .eyebrow{color:#B9C9D1}
.quiz .chip{color:var(--band);border-color:var(--soft)}
.quiz .chip.is-on{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.q{margin-bottom:28px}
.q .t{font-size:15px;margin-bottom:12px}.q .t span{color:#B9C9D1;margin-right:10px}
.q .opts{display:flex;flex-wrap:wrap;gap:8px}
.rec{display:flex;flex-wrap:wrap;align-items:center;gap:24px;padding:20px;border-radius:8px;background:var(--bg);color:var(--ink)}
.rec img{width:96px;height:120px;object-fit:cover;border-radius:4px}
.rec .t{font-family:'Jost',sans-serif;font-size:24px}
.reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.reviews figure{margin:0;padding:32px;border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;gap:18px}
.reviews blockquote{margin:0;font-family:'Jost',sans-serif;font-size:19px;font-weight:300;line-height:1.45}
.stars{color:var(--accent);letter-spacing:.2em}
.insta{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:6px;padding:0 6px}

/* pies */
.site-footer{background:var(--band)}
.foot{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;padding-top:64px;padding-bottom:40px;font-size:15px}
.foot .col{display:flex;flex-direction:column;gap:8px}
.foot .col b{font-weight:500;margin-bottom:4px}
.foot form{display:flex;flex-direction:column;gap:10px}
.legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px;padding-bottom:32px;font-size:13px;color:var(--soft)}
.legal.slim{padding-top:32px}

/* páginas interiores */
.page-head{padding-top:80px;padding-bottom:40px}
.page-head h1{font-size:clamp(34px,5vw,48px);font-weight:300;line-height:1.15;max-width:640px}
.toolbar{display:flex;flex-wrap:wrap;gap:8px}
.work{margin:0;display:flex;flex-direction:column;gap:12px}
.work figcaption{display:flex;justify-content:space-between;gap:12px;font-size:15px}
.work figcaption span+span{color:var(--soft)}
.masonry{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;align-items:start}
.cta-band{background:#E4EBED;padding:80px 0}
.cta-band .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px}
.cta-band h2{font-size:32px;font-weight:300;max-width:560px}
.trio{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px;font-size:15px}
.trio h3{font-size:18px;margin-bottom:6px}

/* producto */
.crumbs{padding-top:24px;font-size:14px;color:var(--soft)}.crumbs a{color:var(--soft)}
.prod{display:flex;flex-wrap:wrap;gap:64px;padding-top:32px;padding-bottom:96px}
.prod .gal{flex:1 1 440px;min-width:0;display:flex;flex-direction:column;gap:12px;align-self:flex-start}
@media(min-width:900px){.prod .gal{position:sticky;top:24px}}
.prod .stage{aspect-ratio:4/5}
.prod .print{width:56%;margin-bottom:6%}
.thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.thumbs img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:4px}
.thumbs img:first-child{outline:1px solid var(--ink);outline-offset:2px}
.prod .info{flex:1 1 400px;min-width:0}
.prod h1{font-size:38px;font-weight:300;line-height:1.15}
.price{font-size:22px;margin:12px 0 20px}
.pform{display:flex;flex-direction:column;gap:24px}
.pform fieldset{border:0;padding:0;margin:0}
.pform legend{font-size:14px;font-weight:500;margin-bottom:10px;padding:0}
.pform .chips{display:flex;flex-wrap:wrap;gap:8px}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fgrid .full{grid-column:span 2}
.note{margin-top:-12px;font-size:13px;color:var(--soft);text-align:center}
details{border-top:1px solid var(--line);padding:16px 0}
details:last-child{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:500;min-height:28px}
details p{margin:10px 0 0;color:var(--muted)}

/* encargos y contacto */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:40px}
.steps .n{font-family:'Jost',sans-serif;color:var(--accent);margin-bottom:12px}
.steps h3{font-size:20px;margin-bottom:8px}
.two{display:flex;flex-wrap:wrap;gap:64px}
.cform{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.cform .full{grid-column:span 2}
.contact-list{display:flex;flex-direction:column;gap:14px;font-size:16px}
.contact-list a{display:flex;align-items:center;gap:12px;min-height:44px}
.sent{padding:14px 18px;border-radius:6px;background:#E4EBED;font-size:14px}
@media(prefers-reduced-motion:reduce){.mq{animation:none}.im,.lift,.print{transition:none}html{scroll-behavior:auto}}
@media(max-width:640px){.fgrid,.cform{grid-template-columns:1fr}.fgrid .full,.cform .full{grid-column:auto}.sec{padding:64px 0}.occ .big{min-height:420px}.nav{gap:16px}}