/* Sinoflex — sistema de diseño compartido (VSL + oferta). COD build. */
*,*::before,*::after{box-sizing:border-box}
:root{
  --ink:#191317;
  --ink-soft:#4a4046;
  --muted:#7b7078;
  --cream:#fbf7f5;
  --cream-2:#f4ece9;
  --white:#fff;
  --plum:#962d65;
  --plum-deep:#6d1e49;
  --plum-soft:#f7e9f1;
  --amber:#f4b400;
  --amber-deep:#c98f00;
  --green:#177a52;
  --green-soft:#e6f4ee;
  --danger:#c0392b;
  --line:#e7dcd8;
  --line-strong:#d3c3bd;
  --shadow-sm:0 1px 2px rgba(25,19,23,.06),0 2px 8px rgba(25,19,23,.05);
  --shadow-md:0 4px 12px rgba(25,19,23,.08),0 12px 32px rgba(25,19,23,.07);
  --shadow-lg:0 8px 24px rgba(25,19,23,.10),0 24px 60px rgba(25,19,23,.10);
  --r-sm:10px; --r-md:16px; --r-lg:22px; --r-pill:999px;
  --wrap:1080px; --wrap-narrow:720px;
  --f-sans:"Inter","Helvetica Neue",Helvetica,Arial,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-display:"Fraunces","Iowan Old Style","Palatino Linotype",Georgia,"Times New Roman",serif;
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--f-sans);
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:700;line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(30px,6.2vw,52px)}
h2{font-size:clamp(25px,4.6vw,38px)}
h3{font-size:clamp(20px,3.2vw,26px)}
h4{font-size:clamp(17px,2.4vw,20px)}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
strong,b{font-weight:700}
small{font-size:13px}
hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}
.wrap-narrow{max-width:var(--wrap-narrow)}
.section{padding:clamp(40px,7vw,72px) 0}
.section-tight{padding:clamp(28px,5vw,48px) 0}
.bg-white{background:var(--white)}
.bg-cream2{background:var(--cream-2)}
.bg-ink{background:var(--ink);color:var(--cream)}
.bg-plum{background:var(--plum);color:#fff}
.center{text-align:center}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.eyebrow{font-family:var(--f-sans);font-size:12px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--plum);margin:0 0 12px}
.bg-ink .eyebrow{color:var(--amber)}
.lead{font-size:clamp(18px,2.4vw,21px);line-height:1.55;color:var(--ink-soft)}
.muted{color:var(--muted)}
.tiny{font-size:13px;line-height:1.5;color:var(--muted)}
.hl{color:var(--plum);font-weight:700}
.mark{background:linear-gradient(transparent 62%,rgba(244,180,0,.55) 0);padding:0 2px}
/* ---------- botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border:0;border-radius:var(--r-pill);padding:17px 34px;font-family:var(--f-sans);
  font-size:17px;font-weight:700;line-height:1.1;text-decoration:none;cursor:pointer;
  transition:transform .15s ease,box-shadow .2s ease,background-color .2s ease;
  min-height:56px;text-align:center}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--amber);color:#2b1d00;box-shadow:0 6px 0 var(--amber-deep),var(--shadow-md)}
.btn-primary:hover{background:#ffc422}
.btn-primary:active{box-shadow:0 3px 0 var(--amber-deep),var(--shadow-sm)}
.btn-plum{background:var(--plum);color:#fff;box-shadow:0 6px 0 var(--plum-deep),var(--shadow-md)}
.btn-plum:hover{background:#a83672}
.btn-ghost{background:transparent;color:var(--plum);border:2px solid var(--plum);box-shadow:none;padding:15px 30px}
.btn-block{display:flex;width:100%}
.btn-lg{font-size:19px;padding:20px 38px;min-height:64px}
.btn-sm{font-size:15px;padding:11px 20px;min-height:44px;box-shadow:none}
.btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.btn-note{font-size:13px;color:var(--muted);margin-top:10px;text-align:center}
/* ---------- badges / pills ---------- */
.pill{display:inline-flex;align-items:center;gap:7px;border-radius:var(--r-pill);
  padding:7px 14px;font-size:13px;font-weight:600;line-height:1}
.pill-green{background:var(--green-soft);color:var(--green);border:1px solid rgba(23,122,82,.25)}
.pill-plum{background:var(--plum-soft);color:var(--plum);border:1px solid rgba(150,45,101,.25)}
.pill-amber{background:rgba(244,180,0,.18);color:#7a5a00;border:1px solid rgba(244,180,0,.5)}
.pill-ink{background:rgba(255,255,255,.1);color:var(--cream);border:1px solid rgba(255,255,255,.22)}
.badges{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:18px 0 0;padding:0;list-style:none}
.badges li{display:inline-flex}
/* ---------- tarjetas ---------- */
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:24px;box-shadow:var(--shadow-sm)}
.card-flat{box-shadow:none}
.grid{display:grid;gap:18px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:860px){.grid-3,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
.split{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,4vw,48px);align-items:center}
.split-rev{grid-template-columns:.85fr 1.15fr}
@media (max-width:820px){.split,.split-rev{grid-template-columns:1fr}}
/* ---------- listas ---------- */
.checks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.checks li{position:relative;padding-left:32px;line-height:1.5}
.checks li::before{content:"";position:absolute;left:0;top:2px;width:21px;height:21px;border-radius:50%;
  background:var(--green-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23177a52' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/13px no-repeat;
  border:1px solid rgba(23,122,82,.25)}
.crosses{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.crosses li{position:relative;padding-left:32px;line-height:1.5;color:var(--ink-soft)}
.crosses li::before{content:"";position:absolute;left:0;top:2px;width:21px;height:21px;border-radius:50%;
  background:#fbe9e7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c0392b' stroke-width='3.2' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E") center/12px no-repeat;
  border:1px solid rgba(192,57,43,.22)}
.steps{list-style:none;margin:0;padding:0;counter-reset:s;display:grid;gap:18px}
.steps li{position:relative;padding-left:52px;counter-increment:s}
.steps li::before{content:counter(s);position:absolute;left:0;top:-2px;width:36px;height:36px;
  border-radius:50%;background:var(--plum);color:#fff;font-family:var(--f-display);font-weight:700;
  font-size:18px;display:flex;align-items:center;justify-content:center}
/* ---------- media ---------- */
.media{border-radius:var(--r-md);overflow:hidden;background:var(--cream-2);border:1px solid var(--line)}
.media img{width:100%;height:100%;object-fit:cover}
.media-contain{background:linear-gradient(160deg,#f7eff2,#ede2e6)}
.media-contain img{object-fit:contain;padding:14px}
.ratio-1{aspect-ratio:1/1}.ratio-43{aspect-ratio:4/3}.ratio-169{aspect-ratio:16/9}.ratio-34{aspect-ratio:3/4}
.figcap{font-size:12.5px;color:var(--muted);margin-top:8px;line-height:1.45}
/* ---------- estrellas ---------- */
.stars{display:inline-flex;gap:2px;color:var(--amber);font-size:15px;letter-spacing:1px}
.rating-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;color:var(--ink-soft)}
/* ---------- avatar de iniciales ---------- */
.av{width:44px;height:44px;border-radius:50%;flex:0 0 44px;display:flex;align-items:center;
  justify-content:center;font-family:var(--f-display);font-weight:700;font-size:17px;color:#fff}
.av-sm{width:34px;height:34px;flex-basis:34px;font-size:14px}
/* ---------- acordeón ---------- */
.acc{border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--white)}
.acc+.acc{margin-top:12px}
.acc summary{list-style:none;cursor:pointer;padding:18px 52px 18px 20px;position:relative;
  font-weight:700;font-family:var(--f-display);font-size:18px}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";position:absolute;right:20px;top:50%;width:12px;height:12px;
  margin-top:-8px;border-right:2.5px solid var(--plum);border-bottom:2.5px solid var(--plum);
  transform:rotate(45deg);transition:transform .2s}
.acc[open] summary::after{transform:rotate(-135deg);margin-top:-3px}
.acc .acc-body{padding:0 20px 20px;color:var(--ink-soft)}
/* ---------- barra sticky ---------- */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(255,255,255,.97);
  backdrop-filter:blur(8px);border-top:1px solid var(--line-strong);padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  box-shadow:0 -6px 24px rgba(25,19,23,.10);transform:translateY(115%);transition:transform .28s ease}
.sticky-cta.on{transform:none}
.sticky-inner{max-width:var(--wrap);margin:0 auto;display:flex;align-items:center;gap:14px}
.sticky-inner .sticky-text{flex:1;min-width:0}
.sticky-inner .sticky-text b{display:block;font-size:15px;line-height:1.2}
.sticky-inner .sticky-text span{font-size:12.5px;color:var(--muted)}
@media (max-width:520px){.sticky-inner .sticky-text{display:none}.sticky-cta .btn{width:100%}}
/* ---------- formularios ---------- */
.field{margin-bottom:16px}
.field label{display:block;font-size:14px;font-weight:700;margin-bottom:6px}
.field .hint{font-size:12.5px;color:var(--muted);margin-top:5px}
.field input,.field select,.field textarea{width:100%;min-height:52px;border:1.5px solid var(--line-strong);
  border-radius:var(--r-sm);background:var(--white);padding:13px 14px;font-family:var(--f-sans);
  font-size:16px;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.field textarea{min-height:88px;resize:vertical;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--plum);
  box-shadow:0 0 0 3px rgba(150,45,101,.14)}
.field.err input,.field.err select,.field.err textarea{border-color:var(--danger);background:#fff9f8}
.field .msg{display:none;font-size:13px;color:var(--danger);margin-top:5px;font-weight:600}
.field.err .msg{display:block}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:520px){.row2{grid-template-columns:1fr}}
/* ---------- utilidades ---------- */
.stack-sm>*+*{margin-top:10px}
.stack>*+*{margin-top:18px}
.stack-lg>*+*{margin-top:32px}
.hide{display:none!important}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}}
/* ---------- pie ---------- */
.site-foot{background:var(--ink);color:rgba(251,247,245,.72);padding:36px 0;font-size:13.5px;line-height:1.6}
.site-foot .wrap{display:grid;gap:14px}
.site-foot b{color:var(--cream)}

/* fix-inline-blocks */
.rev .top b,.review .top b,.author b{color:var(--ink)}


  
    /* ---- específico de la oferta ---- */
    .announce {
      background: var(--plum);
      color: #fff;
      text-align: center;
      padding: 9px 16px;
      font-size: 13px;
      font-weight: 600
    }
  
    .nav {
      position: sticky;
      top: 0;
      z-index: 50;
      background: rgba(251, 247, 245, .96);
      backdrop-filter: blur(8px);
      border-bottom: 1px solid var(--line)
    }
  
    .nav .wrap {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      padding-top: 12px;
      padding-bottom: 12px
    }
  
    .nav .brand {
      font-family: var(--f-display);
      font-size: 22px;
      font-weight: 700
    }
  
    .nav .brand span {
      color: var(--plum)
    }
  
    .hero-o {
      padding: clamp(24px, 4vw, 44px) 0 clamp(28px, 5vw, 48px)
    }
  
    .gal {
      display: grid;
      gap: 12px
    }
  
    .gal .main {
      border-radius: var(--r-lg);
      overflow: hidden;
      background: linear-gradient(155deg, #f7eff2, #ece0e5);
      border: 1px solid var(--line);
      aspect-ratio: 1/1
    }
  
    .gal .main img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      padding: 18px
    }
  
    .gal .thumbs {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 10px
    }
  
    .gal .thumbs button {
      padding: 0;
      border: 2px solid var(--line);
      border-radius: var(--r-sm);
      overflow: hidden;
      background: #f7eff2;
      cursor: pointer;
      aspect-ratio: 1/1
    }
  
    .gal .thumbs button.on {
      border-color: var(--plum)
    }
  
    .gal .thumbs img {
      width: 100%;
      height: 100%;
      object-fit: cover
    }
  
    .price-now {
      font-family: var(--f-display);
      font-size: clamp(34px, 6vw, 46px);
      font-weight: 700;
      line-height: 1;
      color: var(--plum)
    }
  
    .price-was {
      font-size: 19px;
      color: var(--muted);
      text-decoration: line-through;
      margin-left: 10px
    }
  
    .price-line {
      display: flex;
      align-items: baseline;
      flex-wrap: wrap;
      gap: 6px;
      margin: 6px 0 4px
    }
  
    .save-tag {
      display: inline-block;
      background: var(--amber);
      color: #2b1d00;
      font-weight: 700;
      font-size: 13px;
      border-radius: var(--r-pill);
      padding: 5px 12px;
      margin-left: 4px
    }
  
    /* ---- цена и мини-форма (версия под колл-центр) ---- */
    .offer-price {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      flex-wrap: wrap;
      background: var(--white);
      border: 1px solid var(--line);
      border-left: 5px solid var(--plum);
      border-radius: var(--r-md);
      padding: 16px 18px;
      box-shadow: var(--shadow-sm);
      margin-bottom: 8px
    }
  
    .op-now {
      display: block;
      font-family: var(--f-display);
      font-size: clamp(32px, 6vw, 44px);
      font-weight: 700;
      color: var(--plum);
      line-height: 1
    }
  
    .op-was {
      display: block;
      font-size: 17px;
      color: var(--muted);
      text-decoration: line-through;
      margin-top: 4px
    }
  
    .op-tag {
      background: var(--amber);
      color: #2b1d00;
      font-family: var(--f-display);
      font-weight: 700;
      font-size: 19px;
      border-radius: var(--r-pill);
      padding: 8px 18px;
      line-height: 1;
      white-space: nowrap;
      box-shadow: 0 4px 0 var(--amber-deep)
    }
  
    .op-note {
      font-size: 13px;
      color: var(--muted);
      margin: 0 0 20px
    }
  
    .lead-form {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      padding: 18px;
      box-shadow: var(--shadow-sm)
    }
  
    .lead-form .btn {
      margin-top: 4px
    }
  
    .lead-form.sent {
      opacity: .55;
      pointer-events: none
    }
  
    /* packs (не используются в этой версии, стили оставлены на всякий) */
    .packs {
      display: grid;
      gap: 14px
    }
  
    .pack {
      position: relative;
      display: grid;
      grid-template-columns: 64px 1fr auto;
      gap: 16px;
      align-items: center;
      background: var(--white);
      border: 2px solid var(--line);
      border-radius: var(--r-md);
      padding: 18px;
      cursor: pointer;
      transition: border-color .18s, box-shadow .18s, background-color .18s;
      text-align: left;
      width: 100%;
      font: inherit
    }
  
    .pack:hover {
      border-color: var(--line-strong)
    }
  
    .pack.on {
      border-color: var(--plum);
      box-shadow: 0 0 0 3px rgba(150, 45, 101, .12);
      background: #fffdfe
    }
  
    .pack .thumb {
      width: 64px;
      height: 64px;
      border-radius: 12px;
      background: #f7eff2;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden
    }
  
    .pack .thumb img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      padding: 5px
    }
  
    .pack .name {
      display: block;
      font-family: var(--f-display);
      font-size: 19px;
      font-weight: 700;
      line-height: 1.2
    }
  
    .pack .sub {
      display: block;
      font-size: 13.5px;
      color: var(--muted);
      margin-top: 3px
    }
  
    .pack .right {
      text-align: right;
      white-space: nowrap
    }
  
    .pack .p-now {
      display: block;
      font-family: var(--f-display);
      font-size: 22px;
      font-weight: 700;
      color: var(--plum);
      line-height: 1
    }
  
    .pack .p-unit {
      display: block;
      font-size: 12.5px;
      color: var(--muted);
      margin-top: 4px
    }
  
    .pack .tag {
      position: absolute;
      top: -11px;
      left: 16px;
      background: var(--plum);
      color: #fff;
      font-size: 11.5px;
      font-weight: 700;
      letter-spacing: .06em;
      text-transform: uppercase;
      border-radius: var(--r-pill);
      padding: 4px 12px
    }
  
    .pack .tag.alt {
      background: var(--green)
    }
  
    @media (max-width:520px) {
      .pack {
        grid-template-columns: 52px 1fr;
        row-gap: 10px
      }
  
      .pack .thumb {
        width: 52px;
        height: 52px
      }
  
      .pack .right {
        grid-column: 1/-1;
        text-align: left;
        display: flex;
        align-items: baseline;
        gap: 10px
      }
  
      .pack .p-unit {
        margin-top: 0
      }
    }
  
    .bump {
      display: flex;
      gap: 14px;
      align-items: flex-start;
      background: #fffbef;
      border: 2px dashed var(--amber);
      border-radius: var(--r-md);
      padding: 16px;
      margin-top: 16px;
      cursor: pointer
    }
  
    .bump input {
      width: 22px;
      height: 22px;
      margin-top: 2px;
      accent-color: var(--plum);
      flex: 0 0 22px
    }
  
    .bump b {
      display: block;
      font-size: 15.5px;
      margin-bottom: 3px
    }
  
    .bump>span {
      flex: 1
    }
  
    .bump span span {
      display: block;
      font-size: 13.5px;
      color: var(--ink-soft)
    }
  
    /* resumen */
    .summary {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      padding: 20px;
      box-shadow: var(--shadow-sm)
    }
  
    .summary .row {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      padding: 9px 0;
      font-size: 15px;
      border-bottom: 1px dashed var(--line)
    }
  
    .summary .row:last-of-type {
      border-bottom: 0
    }
  
    .summary .row.total {
      font-family: var(--f-display);
      font-size: 21px;
      font-weight: 700;
      padding-top: 14px;
      margin-top: 6px;
      border-top: 2px solid var(--line);
      border-bottom: 0
    }
  
    .summary .row .g {
      color: var(--green);
      font-weight: 700
    }
  
    /* pasos */
    .stepbar {
      display: flex;
      gap: 8px;
      margin-bottom: 22px
    }
  
    .stepbar div {
      flex: 1;
      font-size: 12.5px;
      font-weight: 700;
      color: var(--muted);
      text-align: center;
      padding-top: 10px;
      border-top: 3px solid var(--line)
    }
  
    .stepbar div.on {
      color: var(--plum);
      border-top-color: var(--plum)
    }
  
    /* ventajas */
    .vent {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      padding: 24px;
      text-align: center;
      box-shadow: var(--shadow-sm)
    }
  
    .vent img {
      width: 74px;
      height: 74px;
      object-fit: contain;
      margin: 0 auto 14px
    }
  
    .vent b {
      display: block;
      font-family: var(--f-display);
      font-size: 17px;
      margin-bottom: 8px;
      line-height: 1.25
    }
  
    .vent p {
      font-size: 14.5px;
      color: var(--ink-soft);
      margin: 0
    }
  
    .ingr {
      text-align: center
    }
  
    .ingr img {
      width: 104px;
      height: 104px;
      border-radius: 50%;
      object-fit: cover;
      margin: 0 auto 12px;
      box-shadow: 0 4px 14px rgba(25, 19, 23, .18);
      border: 3px solid var(--white)
    }
  
    .ingr b {
      display: block;
      font-family: var(--f-display);
      font-size: 17px;
      margin-bottom: 5px
    }
  
    .ingr p {
      font-size: 14px;
      color: var(--ink-soft);
      line-height: 1.5;
      margin: 0
    }
  
    .rev {
      background: var(--white);
      border: 1px solid var(--line);
      border-radius: var(--r-md);
      padding: 18px;
      box-shadow: var(--shadow-sm);
      break-inside: avoid
    }
  
    .rev-ph {
      width: 100%;
      aspect-ratio: 4/3;
      object-fit: cover;
      border-radius: 10px;
      margin-bottom: 12px;
      background: #f1ece9
    }
  
    .rev .top {
      display: flex;
      gap: 11px;
      align-items: center;
      margin-bottom: 9px
    }
  
    .rev .top b {
      display: block;
      font-size: 14.5px;
      font-family: var(--f-sans);
      color: var(--ink)
    }
  
    .rev .top>span:last-child {
      flex: 1
    }
  
    .rev .top span span {
      display: block;
      font-size: 12px;
      color: var(--muted)
    }
  
    .rev p {
      font-size: 14.5px;
      color: var(--ink-soft);
      margin: 6px 0 0
    }
  
    .rev .ver {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: 11.5px;
      color: var(--green);
      font-weight: 700;
      margin-top: 9px
    }
  
    .revgrid {
      columns: 3 280px;
      column-gap: 16px
    }
  
    .revgrid>* {
      margin-bottom: 16px
    }
  
    .cmp {
      width: 100%;
      border-collapse: collapse;
      background: var(--white);
      border-radius: var(--r-md);
      overflow: hidden;
      border: 1px solid var(--line);
      font-size: 15px
    }
  
    .cmp th,
    .cmp td {
      padding: 14px 12px;
      text-align: center;
      border-bottom: 1px solid var(--line)
    }
  
    .cmp th {
      background: var(--cream-2);
      font-family: var(--f-display);
      font-size: 15px
    }
  
    .cmp th:first-child,
    .cmp td:first-child {
      text-align: left;
      font-weight: 600
    }
  
    .cmp .yes {
      color: var(--green);
      font-weight: 700
    }
  
    .cmp .no {
      color: var(--muted)
    }
  
    .cmp tr:last-child td {
      border-bottom: 0
    }
  
    .cmp .hi {
      background: #fffdfe
    }
  
    /* thank you */
    .tybox {
      max-width: 620px;
      margin: 0 auto
    }
  
    .tycheck {
      width: 76px;
      height: 76px;
      border-radius: 50%;
      background: var(--green-soft);
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 20px;
      border: 2px solid rgba(23, 122, 82, .3)
    }
  
    .tycheck::after {
      content: "";
      width: 30px;
      height: 16px;
      border-left: 5px solid var(--green);
      border-bottom: 5px solid var(--green);
      transform: rotate(-45deg);
      margin-top: -8px
    }
  
    #mapBox {
      height: 260px;
      border-radius: var(--r-md);
      overflow: hidden;
      border: 1px solid var(--line);
      background: var(--cream-2)
    }
  
    .trust-row {
      display: flex;
      flex-wrap: wrap;
      gap: 18px;
      justify-content: center;
      align-items: center;
      margin-top: 22px
    }
  
    .trust-row .t {
      display: flex;
      gap: 9px;
      align-items: center;
      font-size: 13.5px;
      color: var(--ink-soft);
      font-weight: 600
    }
  
    .trust-row .t i {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      background: var(--plum-soft);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-style: normal;
      color: var(--plum);
      font-size: 15px
    }
  