/* Soy propietario: maquetación en código según diseño (lienzo 1024px) */
.sp-page { background:#fdfcfa; --gold:#b8832f; --or:#b87820; --navy:#14305f; --sans:'Inter',-apple-system,sans-serif; --pf:'Playfair Display',Georgia,serif; --cor:'Cormorant Garamond',Georgia,serif;}
.sp-page main > section, .sp-page .sf { container-type:inline-size; position:relative; width:100%; overflow:hidden;}
:where(.sp-page main > section > *, .sp-page .sf > *) { margin:0;}
.sp-page main > section > *:not(ul):not(ol), .sp-page .sf > * { position:absolute;}
.sp-page i { display:block;}
/* HERO */
.sh { aspect-ratio:1024/411; background:#fff var(--img-sp-hero-bg) center/100% 100% no-repeat;}
.sh-rule { left:5.078cqw;top:2.344cqw;width:3.711cqw;height:0.195cqw; background:var(--gold);}
.sh-eb { left:9.668cqw; top:1.660cqw; font:400 1.025cqw/1.172cqw var(--sans); letter-spacing:.2em; text-transform:uppercase; color:#3a4766; white-space:nowrap;}
.sh-h1 { left:5.078cqw; top:4.248cqw; font:500 4.463cqw/4.160cqw var(--pf); color:#14213d; text-transform:uppercase; letter-spacing:-.005em; white-space:nowrap; text-shadow:0 0 10px rgba(255,255,255,.7);}
.sh-h1 span { display:block;}
.sh-p { left:5.176cqw; top:17.773cqw; font:300 1.475cqw/2.021cqw var(--sans); color:#1c2b45; white-space:nowrap;}
.sh-q { left:77.148cqw; top:-0.293cqw; font:italic 500 2.100cqw/2.539cqw var(--cor); font-weight:500; color:#26324e; white-space:nowrap; text-indent:0;}
.sh-q i { position:absolute; left:0.488cqw; top:9.082cqw; width:5.859cqw; height:2px; background:var(--gold);}
.sh-q cite { position:absolute; left:0.488cqw; top:10.840cqw; font:500 1.416cqw/1 var(--cor); font-style:normal; letter-spacing:.16em; text-transform:uppercase; color:#26324e;}
.sh-sts { position:absolute; inset:0; pointer-events:none;}
.h-st { position:absolute; border-radius:50%; background:#fdeedc; display:grid; place-items:center; color:var(--or);}
.h-st span { width:54%; height:54%; display:block;} .h-st svg { width:100%; height:100%; display:block;}
.h-stp { position:absolute; font:400 1.035cqw/1.514cqw var(--sans); color:#3b4663; white-space:nowrap;}
.h-sep { position:absolute; top:33.398cqw; width:1px; height:3.906cqw; background:#e8e0d4;}
/* ANTES DE VENDER */
.sa { aspect-ratio:1024/484; background:#fdfcfa;}
.sa-rule { left:5.078cqw;top:2.246cqw;width:3.711cqw;height:0.195cqw; background:var(--gold);}
.sa-eb { left:9.766cqw; top:1.660cqw; font:400 0.977cqw/1.172cqw var(--sans); letter-spacing:.22em; text-transform:uppercase; color:#3a4766; white-space:nowrap;}
.sa-h2 { left:5.273cqw; top:3.223cqw; font:500 2.637cqw/3.320cqw var(--pf); color:#14213d; text-transform:uppercase; white-space:nowrap; letter-spacing:-.002em;}
.sa-h2 span { display:block;}
.sa-p { left:5.371cqw; top:10.889cqw; font:300 1.323cqw/1.807cqw var(--sans); color:#5a6479; white-space:nowrap;}
.sa-l { position:absolute; inset:0; list-style:none; padding:0; margin:0;}
.sa-l li { position:absolute; left:5.078cqw; height:3.320cqw; display:flex; align-items:center; white-space:nowrap;}
.sa-l span { flex:none; width:3.320cqw; height:3.320cqw; border-radius:50%; background:#fdeedc; color:var(--or); display:grid; place-items:center;}
.sa-l span svg { width:1.953cqw; height:1.953cqw; stroke-width:1.9;}
.sa-l p { margin:0 0 0 1.367cqw; font:300 1.128cqw/1.660cqw var(--sans); color:#46526b;}
.sa-img { left:54.297cqw;top:0.098cqw;width:45.703cqw;height:27.539cqw; background:#2c3a1c var(--img-sp-act-bg) center/100% 100% no-repeat;}
.sa-it { position:absolute; left:2.832cqw; top:8.398cqw; color:#fff; font-family:var(--pf);}
.sa-it b { display:block; font:500 1.602cqw/2.002cqw var(--pf); text-transform:uppercase; letter-spacing:.01em; white-space:nowrap;}
.sa-it i { width:3.320cqw; height:2px; background:#d9a441; margin:1.172cqw 0 1.270cqw;}
.sa-it em { display:block; font:500 1.230cqw/1.660cqw var(--pf); font-style:normal; text-transform:uppercase; letter-spacing:.02em; white-space:nowrap;}
.sa-box { left:57.617cqw;top:28.809cqw;width:38.867cqw;height:16.797cqw; background:linear-gradient(180deg,#f8f2e9,#f6eee4);}
.sa-box p { position:absolute; left:2.148cqw; top:1.465cqw; font:300 1.309cqw/1.934cqw var(--sans); color:#4b566d; white-space:nowrap;}
/* TRES PASOS */
.sp { aspect-ratio:1024/261; background:#8a6a45 var(--img-sp-pro-bg) center/100% 100% no-repeat;}
.sp-rule { left:5.078cqw;top:3.418cqw;width:3.711cqw;height:0.195cqw; background:#e0b25a;}
.sp-eb { left:9.473cqw; top:2.881cqw; font:400 0.977cqw/1.172cqw var(--sans); letter-spacing:.2em; text-transform:uppercase; color:#fff; white-space:nowrap;}
.sp-h2 { left:5.273cqw; top:4.688cqw; font:500 2.734cqw/3.076cqw var(--pf); color:#fff; text-transform:uppercase; white-space:nowrap; text-shadow:0 1px 8px rgba(0,0,0,.25);}
.sp-h2 span { display:block;}
.sp-c { position:absolute; inset:0; list-style:none; margin:0; padding:0;}
.sp-c li { position:absolute; top:1.953cqw; height:20.410cqw; background:rgba(255,253,250,.95); border-radius:0.293cqw; box-shadow:0 1px 8px rgba(40,30,20,.08);}
.sp-c li:nth-child(1) { left:45.801cqw; width:16.699cqw;} .sp-c li:nth-child(2) { left:63.184cqw; width:16.992cqw;} .sp-c li:nth-child(3) { left:80.957cqw; width:16.992cqw;}
.ci { position:absolute; top:1.367cqw; width:5.859cqw; height:5.859cqw; border-radius:50%; background:#fdeedc; color:var(--or); display:grid; place-items:center;}
.ci svg { width:3.711cqw; height:3.711cqw; stroke-width:3;}
.sp-c li:nth-child(1) .ci { left:6.836cqw;} .sp-c li:nth-child(2) .ci { left:6.641cqw;} .sp-c li:nth-child(3) .ci { left:6.641cqw;}
.cn { position:absolute; top:3.125cqw; font:500 3.418cqw/1 var(--cor); font-variant-numeric:lining-nums; color:#b5822f;}
.sp-c li:nth-child(1) .cn { left:2.246cqw;} .sp-c li:nth-child(2) .cn { left:1.855cqw;} .sp-c li:nth-child(3) .cn { left:2.051cqw;}
.sp-c h3 { position:absolute; left:1.855cqw; top:8.203cqw; font:500 1.367cqw/1.602cqw var(--pf); text-transform:uppercase; color:#1b2a4a; white-space:nowrap; letter-spacing:.005em;}
.sp-c p { position:absolute; left:1.855cqw; font:300 1.074cqw/1.621cqw var(--sans); color:#6f788c; white-space:nowrap;}
.sp-c li:nth-child(1) p { top:12.207cqw;} .sp-c li:nth-child(2) p { top:15.430cqw;} .sp-c li:nth-child(3) p { top:14.160cqw;}
/* BANNER */
.sb { aspect-ratio:1024/187; background:#5b6b3a var(--img-sp-ban-bg) center/100% 100% no-repeat;}
.sb-rule { left:3.711cqw;top:2.539cqw;width:3.516cqw;height:0.195cqw; background:#d9a441;}
.sb h2 { left:5.078cqw; top:4.199cqw; font:500 2.197cqw/2.539cqw var(--pf); text-transform:uppercase; color:#1f2a44; white-space:nowrap;}
.sb h2 span { display:block;}
.sb::after { content:''; position:absolute; left:0; top:8.984cqw; width:41.016cqw; height:6.641cqw; background:linear-gradient(90deg,rgba(22,34,12,.5),rgba(22,34,12,.28) 70%,rgba(22,34,12,0)); filter:blur(6px); pointer-events:none;}
.sb > * { z-index:1;}
.sb p { left:5.078cqw; top:10.059cqw; font:400 1.484cqw/1.953cqw var(--sans); color:#fff; white-space:nowrap; text-shadow:0 1px 6px rgba(0,0,0,.45);}
/* PIE */
.sf { aspect-ratio:1024/104; background:#fefcfa;}
.sf-logo { left:4.492cqw; top:2.539cqw; display:block; text-decoration:none; width:12.695cqw; height:5.469cqw;}
.sf-logo .n { position:absolute; left:0; top:-0.098cqw; font:500 2.588cqw/1 var(--pf); color:#c07a1e; letter-spacing:.02em;}
.sf-logo .t { position:absolute; left:0.098cqw; top:2.734cqw; font:400 0.908cqw/1 var(--sans); color:#c07a1e; letter-spacing:.3em; text-transform:uppercase; white-space:nowrap;}
.sf-s1 { left:20.996cqw; top:2.734cqw; width:1px; height:4.297cqw; background:#e8e0d4;} .sf-s2 { left:76.465cqw; top:2.734cqw; width:1px; height:4.297cqw; background:#e8e0d4;}
.sf-c { left:22.461cqw; width:52.734cqw; top:3.906cqw; text-align:center; font:400 1.035cqw/1 var(--sans); letter-spacing:.265em; text-transform:uppercase; color:#46557a; white-space:nowrap;}
.sf-c b { font-weight:400; color:var(--gold); padding:0 0.879cqw;}
.sf-r { left:81.641cqw; top:3.320cqw; display:flex; align-items:center; gap:0.781cqw; white-space:nowrap;}
.sf-r span { width:1.758cqw; height:2.148cqw; color:var(--or); display:block;} .sf-r svg { width:100%; height:100%; display:block;}
.sf-r em { font:400 1.270cqw/1 var(--sans); font-style:normal; color:#3b4663;}
/* MÓVIL */
@media (max-width:760px) {
  .sp-page main > section, .sp-page .sf { aspect-ratio:auto; container-type:normal; height:auto;}
  .sp-page main > section > *:not(ul):not(ol), .sp-page .sf > * { position:static;}
  .sp-page br.bd { display:none;}
  .sp-page main > section > * { white-space:normal !important;}
  .sh { padding:26px 22px 250px; background-image:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.93) 62%,rgba(255,255,255,0)),var(--img-sp-hero-bg); background-size:100% 100%,cover; background-position:0 0,68% bottom;}
  .sh-eb { font-size:11px; margin-bottom:12px;}
  .sh-h1 { font-size:34px; line-height:39px; margin-bottom:14px;} .sh-p { font-size:16px; line-height:24px; margin-bottom:18px;}
  .sh-q { font-size:20px; line-height:26px; margin-bottom:20px;} .sh-q i { position:static; display:block; width:56px; margin:10px 0;} .sh-q cite { position:static; font-size:14px;}
  .sh-sts { position:static; display:grid; grid-template-columns:auto 1fr; gap:12px 14px; align-items:center;} .h-st { position:static; width:46px; height:46px; flex:none;} .h-st span { width:24px; height:24px;}
  .h-stp { position:static !important; font-size:13px; line-height:17px;}
  .sa, .sp, .sb { padding:28px 22px;}
  .sp-page i.sa-rule, .sp-page i.sp-rule, .sp-page i.sb-rule, .sp-page i.sh-rule, .sp-page i.h-sep, .sp-page i.sf-s1, .sp-page i.sf-s2 { display:none;}
  .sa-eb, .sp-eb { font-size:10.5px; margin-bottom:10px;}
  .sa-h2 { font-size:26px; line-height:33px; margin-bottom:14px;} .sa-p { font-size:15px; line-height:22px; margin-bottom:20px;}
  .sa-l { position:static; display:grid; gap:14px; margin-bottom:24px;} .sa-l li { position:static !important; height:auto; align-items:center;}
  .sa-l span { width:38px; height:38px;} .sa-l span svg { width:19px; height:19px;}
  .sa-l p { white-space:normal; font-size:14px; line-height:20px; margin-left:12px;}
  .sa-img { position:relative !important; left:auto; top:auto; width:auto; height:240px; margin:0 -22px 22px; background-position:center;}
  .sa-it b, .sa-it em, .sa-box p { white-space:normal !important;} .sa-it br.bd { display:inline;}
  .sa-it { position:absolute !important; left:22px; top:50px;} .sa-it b { font-size:19px; line-height:24px;} .sa-it em { font-size:14px; line-height:19px;}
  .sa-box { left:auto; top:auto; width:auto; height:auto; padding:20px;} .sa-box p { position:static; font-size:15px; line-height:22px;}
  .sp { background-image:linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 100%),var(--img-sp-pro-bg); background-size:cover; background-position:left center; background-color:#6f5a3e;}
  .sp-eb { color:#fff;} .sp-h2 { font-size:27px; line-height:33px; margin-bottom:22px;}
  .sp-c { position:static; display:grid; gap:14px;} .sp-c li, .sp-c li:nth-child(n) { position:relative; left:auto; top:auto; width:auto; height:auto; padding:18px 20px 20px; display:grid; grid-template-columns:auto 1fr; column-gap:14px; align-items:center;}
  .ci, .sp-c li:nth-child(n) .ci { position:static; width:56px; height:56px; grid-column:2; grid-row:1; justify-self:end;} .ci svg { width:30px; height:30px;}
  .cn, .sp-c li:nth-child(n) .cn { position:static; grid-column:1; grid-row:1; font-size:32px;}
  .sp-c h3, .sp-c p, .sp-c li:nth-child(n) p { position:static; grid-column:1/-1; white-space:normal; margin-top:12px;}
  .sp-c h3 { font-size:15px; line-height:20px;} .sp-c p { font-size:14px; line-height:21px;}
  .sb { background-position:30% center; padding:34px 22px 110px; background-size:cover;} .sb::before { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.1));}
  .sb > * { position:relative !important; z-index:1;}
  .sb h2 { font-size:25px; line-height:31px; margin-bottom:10px;} .sb::after { content:''; position:absolute; left:0; top:8.984cqw; width:41.016cqw; height:6.641cqw; background:linear-gradient(90deg,rgba(22,34,12,.5),rgba(22,34,12,.28) 70%,rgba(22,34,12,0)); filter:blur(6px); pointer-events:none;}
.sb > * { z-index:1;}
.sb p { color:#1f2a44; text-shadow:none; font-size:15px; line-height:22px; font-weight:500;}
  .sf { padding:24px 22px; text-align:center;} .sf-s1, .sf-s2 { display:none;}
  .sf-logo { display:block; width:auto; height:auto; margin:0 auto 14px;} .sf-logo .n, .sf-logo .t { position:static; display:block;} .sf-logo .n { font-size:28px; margin-bottom:6px;}
  .sf-c { width:auto; font-size:11px; line-height:19px; letter-spacing:.16em; white-space:normal; margin-bottom:14px;}
  .sf-r { justify-content:center;} .sf-r em { font-size:14px;} .sf-r span { width:18px; height:20px;}
}
