:root {
  --red: #f54247;
  --red-strong: #ef252c;
  --red-soft: #fff0f0;
  --red-line: #ff656a;
  --ink: #060606;
  --muted: #667085;
  --track: #fbe5e6;
  --radius: 11px;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; background: #fff; }

body {
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
}

button, audio { font: inherit; }

.app {
  width: min(100%, 390px);
  min-height: 100svh;
  margin: 0 auto;
  background: #fff;
  overflow: hidden;
}

.progress-wrap {
  position: fixed;
  z-index: 20;
  top: max(8px, env(safe-area-inset-top));
  left: 50%;
  width: min(calc(100% - 32px), 358px);
  height: 6px;
  border-radius: 999px;
  background: var(--track);
  transform: translateX(-50%);
  overflow: hidden;
}

.progress-bar {
  width: 4%;
  height: 100%;
  border-radius: inherit;
  background: var(--red);
  transition: width .45s cubic-bezier(.2,.8,.2,1);
}

.screen {
  min-height: 100svh;
  padding: 42px 16px max(18px, env(safe-area-inset-bottom));
  display: flex;
  opacity: 1;
  transform: translateX(0);
  transition: opacity .18s ease, transform .22s ease;
}

.screen.leaving { opacity: 0; transform: translateX(-15px); }
.screen.entering { opacity: 0; transform: translateX(15px); }

.content {
  width: 100%;
  align-self: center;
  text-align: center;
}

.content.top { align-self: flex-start; padding-top: clamp(18px, 7vh, 66px); }
.content.intro { padding-top: clamp(48px, 9vh, 78px); align-self: flex-start; }

h1, h2, p { margin-top: 0; }

.title {
  margin-bottom: 11px;
  font-size: clamp(20px, 5.3vw, 23px);
  line-height: 1.03;
  font-weight: 800;
}

.question-title {
  margin: 0 auto 16px;
  max-width: 350px;
  font-size: clamp(17px, 4.6vw, 20px);
  line-height: 1.08;
  font-weight: 800;
}

.red { color: var(--red-strong); }
.highlight { color: var(--red-strong); font-weight: 800; }
.marker { display: inline; color: #fff; background: var(--red-strong); padding: 1px 3px; }

.subtitle {
  margin: 0 auto 14px;
  max-width: 335px;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 700;
}

.microcopy {
  margin: 10px auto;
  max-width: 340px;
  font-size: 11px;
  line-height: 1.3;
  color: var(--muted);
}

.hero-image,
.story-image,
.altar-image,
.proof-image,
.video-poster {
  display: block;
  max-width: 100%;
  margin-inline: auto;
  object-fit: cover;
}

.hero-image { width: 100%; height: 100%; border-radius: 12px; }
.story-image { width: 224px; border-radius: 10px; }
.proof-image { width: min(100%, 310px); border-radius: 4px; }
.altar-image { width: min(100%, 340px); max-height: 190px; border-radius: 10px; }
.profile-image { width: min(100%, 300px); height: auto; margin: 10px auto 8px; display: block; }

.hero-question { margin: 13px 0 12px; font-size: 23px; line-height: 1; font-weight: 800; }

.answers { display: grid; gap: 7px; width: 100%; }
.answers.two { grid-template-columns: 1fr 1fr; }

.answer {
  width: 100%;
  min-height: 46px;
  padding: 8px 11px;
  display: grid;
  grid-template-columns: 28px 21px 1fr;
  align-items: center;
  gap: 5px;
  border: 1px solid var(--red-line);
  border-radius: var(--radius);
  background: var(--red-soft);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
  -webkit-tap-highlight-color: transparent;
}

.answer:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(245,66,71,.13); }
.answer:active { transform: scale(.985); }
.answer.selected { background: #ffdfe0; box-shadow: 0 0 0 2px rgba(245,66,71,.18); }
.answer .emoji { font-size: 21px; line-height: 1; text-align: center; }
.answer .radio { width: 19px; height: 19px; border: 1.6px solid var(--red); border-radius: 50%; background: #fff; }
.answer.selected .radio { border: 5px solid var(--red); }
.answer .label { font-size: 12px; line-height: 1.18; }

.gender-answer {
  grid-template-columns: 22px 1fr;
  min-height: 46px;
  background: var(--red);
  color: #fff;
  font-weight: 800;
  border-color: var(--red);
}
.gender-answer .radio { border-color: #fff; background: transparent; }

.zodiac-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.zodiac {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--red);
  border-radius: 11px;
  background: #fff;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
}
.zodiac:hover { transform: translateY(-2px); box-shadow: 0 5px 12px rgba(245,66,71,.15); }
.zodiac-icon { display: grid; place-items: center; height: 72px; font-size: 52px; background: #fff8f8; }
.zodiac-name { min-height: 38px; padding: 7px 2px; display: grid; grid-template-columns: 17px 1fr; align-items: center; gap: 2px; color: #fff; background: var(--red); font-size: 10px; font-weight: 700; overflow: hidden; }
.zodiac-name::before { content: '›'; display: grid; place-items: center; width: 17px; height: 17px; border: 1px solid #fff; border-radius: 50%; }

.continue {
  width: 100%;
  min-height: 44px;
  margin-top: 12px;
  border: 0;
  border-radius: 9px;
  background: var(--red);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 3px 0 #d92f34;
  animation: softPulse 2.2s infinite;
}
.continue:active { transform: translateY(2px); box-shadow: 0 1px 0 #d92f34; }

.video-shell {
  position: relative;
  width: 100%;
  min-height: 360px;
  margin: 10px auto 0;
  border-radius: 10px;
  overflow: hidden;
  background: #050505;
}
.video-shell .video-poster { width: 100%; height: 100%; min-height: 360px; object-fit: cover; }
.play-button {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 74px;
  height: 74px;
  border: 2px solid #fff;
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: #b8092e;
  color: #fff;
  transform: translate(-50%, -50%);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  cursor: pointer;
  animation: playPulse 1.7s infinite;
}
.play-button span { margin-left: 5px; font-size: 38px; line-height: 1; }
.play-button small { position: absolute; bottom: 6px; font-size: 6px; font-weight: 800; }

.bio-copy { margin: 9px auto 0; font-size: 12px; line-height: 1.22; font-weight: 700; }
.bio-detail { margin: 8px auto 0; max-width: 340px; font-size: 11px; line-height: 1.28; }

.audio-card {
  width: min(100%, 340px);
  margin: 12px auto 8px;
  padding: clamp(8px, 3vw, 12px);
  border-radius: 9px;
  background:
    radial-gradient(circle at 12% 24%, rgba(255,255,255,.72) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 72%, rgba(255,255,255,.55) 0 1px, transparent 2px),
    #f3efe8;
}
.audio-player {
  display: grid;
  grid-template-columns: clamp(17px, 6vw, 22px) minmax(0, 1fr) clamp(30px, 12vw, 48px);
  grid-template-rows: 24% 54% 22%;
  column-gap: clamp(4px, 2vw, 8px);
  width: 100%;
  height: clamp(46px, 18vw, 66px);
  padding: clamp(4px, 1.7vw, 6px) clamp(7px, 2.8vw, 10px);
  border-radius: clamp(7px, 2.5vw, 10px);
  background: #fff;
  box-shadow: 0 1px 4px rgba(32,38,44,.04);
}
.audio-name { grid-column: 1 / 3; grid-row: 1; align-self: start; color: #41bf7c; font-size: clamp(6px, 2.2vw, 8px); line-height: 1; font-weight: 700; text-align: left; }
.audio-toggle { grid-column: 1; grid-row: 2; align-self: center; justify-self: center; width: 100%; height: 100%; padding: 0; border: 0; color: #a5a6aa; background: transparent; font-size: clamp(13px, 4.8vw, 19px); line-height: 1; cursor: pointer; }
.audio-track, .audio-fill {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 28' preserveAspectRatio='none'%3E%3Cpath d='M2 11v6M8 8v12M14 4v20M20 7v14M26 2v24M32 6v16M38 9v10M44 5v18M50 1v26M56 4v20M62 8v12M68 10v8M74 6v16M80 3v22M86 7v14M92 9v10M98 5v18M104 2v24M110 6v16M116 10v8M122 8v12M128 4v20M134 1v26M140 5v18M146 9v10M152 7v14M158 3v22M164 6v16M170 10v8M176 8v12M182 4v20M188 2v24M194 6v16M200 9v10M206 5v18M212 1v26M218 4v20M224 8v12M230 6v16M236 10v8' stroke='black' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 28' preserveAspectRatio='none'%3E%3Cpath d='M2 11v6M8 8v12M14 4v20M20 7v14M26 2v24M32 6v16M38 9v10M44 5v18M50 1v26M56 4v20M62 8v12M68 10v8M74 6v16M80 3v22M86 7v14M92 9v10M98 5v18M104 2v24M110 6v16M116 10v8M122 8v12M128 4v20M134 1v26M140 5v18M146 9v10M152 7v14M158 3v22M164 6v16M170 10v8M176 8v12M182 4v20M188 2v24M194 6v16M200 9v10M206 5v18M212 1v26M218 4v20M224 8v12M230 6v16M236 10v8' stroke='black' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
}
.audio-track { position: relative; grid-column: 2; grid-row: 2; align-self: center; width: 100%; height: 72%; overflow: hidden; background: #dde1e5; cursor: pointer; }
.audio-fill { position: absolute; inset: 0 auto 0 0; width: 0; height: 100%; background: #70c9e8; }
.audio-time { grid-column: 2; grid-row: 3; align-self: end; color: #a2a9b0; font-size: clamp(5.5px, 1.9vw, 7px); line-height: 1; text-align: left; }
.audio-avatar { position: relative; grid-column: 3; grid-row: 1 / 4; align-self: center; justify-self: center; width: 100%; aspect-ratio: 1; padding: 0; overflow: hidden; border: 2px solid #fff; border-radius: 50%; background: #eceff1; box-shadow: 0 0 0 1px #e2e4e7; }
.audio-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }

.big-note { margin: 8px 0 6px; font-size: 20px; font-weight: 900; }
.body-copy { margin: 7px auto; max-width: 350px; color: #667085; font-size: 11px; line-height: 1.3; }

.testimonial-title { margin: 12px 0 6px; font-size: 14px; font-weight: 900; text-transform: uppercase; }
.vturb-slot { width: 100%; }
.vturb-placeholder { min-height: 330px; display: grid; place-items: center; border-radius: 7px; background: #0d6388; color: #fff; text-align: center; font-size: 11px; line-height: 1.45; }
.vturb-placeholder strong { display: block; font-size: 13px; }

@keyframes softPulse {
  0%, 100% { box-shadow: 0 3px 0 #d92f34, 0 0 0 0 rgba(245,66,71,.25); }
  50% { box-shadow: 0 3px 0 #d92f34, 0 0 0 7px rgba(245,66,71,0); }
}
@keyframes playPulse {
  0%,100% { transform: translate(-50%,-50%) scale(1); }
  50% { transform: translate(-50%,-50%) scale(1.06); }
}

@media (max-width: 330px) {
  .screen { padding-inline: 8px; }
  .answer .label { font-size: 10px; }
  .zodiac-grid { gap: 5px; }
  .zodiac-icon { height: 61px; font-size: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* English rebuilds for visual assets */
.intro-title { margin-inline: auto; max-width: 330px; font-size: clamp(18px, 5vw, 21px); line-height: 1.04; text-align: center; }
.intro-subtitle { max-width: 330px; font-size: clamp(10px, 2.8vw, 11px); line-height: 1.3; text-align: center; }
.hero-visual { position: relative; width: 208px; height: 386px; margin: 0 auto; }

.dark { color: #111 !important; }
.bold { font-weight: 700; }
.left { text-align: left; }
.green { color: #0a9e42; }
.pink { color: #f44b74; }

.proof-content { width: calc(100% + 16px); margin-inline: -8px; padding-top: 8px !important; }
.proof-title { margin-bottom: 8px; max-width: none; font-size: clamp(12px, 3.7vw, 14px); line-height: 1; white-space: nowrap; }
.proof-title .marker { padding: 1px 2px; }
.proof-intro { max-width: 330px; margin: 0 auto 8px; font-size: clamp(8px, 2.45vw, 9px); line-height: 1.18; }
.social-proof-card { width: min(100%, 320px); margin: 0 auto 9px; padding: 8px 9px 6px; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; background: #fff; text-align: left; }
.social-head { display: flex; align-items: center; min-width: 0; height: 20px; font-size: 8px; line-height: 1; }
.choquei-logo { display: inline-grid; place-items: center; flex: 0 0 18px; width: 18px; height: 18px; margin-right: 5px; border-radius: 50%; color: #ffe900; background: #090909; font-size: 8px; font-weight: 900; }
.social-head strong { font-size: 8px; font-weight: 900; }
.social-verified { display: inline-grid; place-items: center; width: 9px; height: 9px; margin-left: 2px; border-radius: 50%; color: #fff !important; background: #1d9bf0; font-size: 6px; font-weight: 900 !important; }
.social-handle { overflow: hidden; margin-left: 3px; color: #70757d !important; font-weight: 400 !important; text-overflow: ellipsis; white-space: nowrap; }
.social-more { margin-left: auto; padding-left: 4px; color: #777 !important; font-size: 7px; letter-spacing: 1px; }
.social-proof-card p { margin: 4px 0 6px 23px; font-size: 7.5px; line-height: 1.22; }
.social-proof-card img { display: block; width: 100%; border-radius: 5px; }
.proof-caption { margin: 0 auto 7px; color: var(--muted); font-size: 8px; line-height: 1.25; }
.proof-caption p { margin: 0 0 6px; }
.proof-content .vturb-empty, .proof-content .vturb-slot { margin-top: 0; }

.story-wrap { position: relative; width: 224px; margin: auto; }
.story-wrap span { position: absolute; left: 20px; right: 20px; bottom: 8px; padding: 5px 3px; color: #fff; background: rgba(0,0,0,.85); font-size: 9px; }
.instagram-profile { width: min(100%, 292px); margin: 10px auto 12px; padding: 9px 10px 8px; border: 1px solid #e6e6e6; border-radius: 4px; color: #101010; background: #fff; font-family: Arial, Helvetica, sans-serif; text-align: left; box-shadow: 0 1px 2px rgba(0,0,0,.025); }
.ig-profile-header { display: flex; align-items: center; gap: 12px; }
.ig-avatar-ring { flex: 0 0 58px; width: 58px; height: 58px; padding: 2px; border-radius: 50%; background: conic-gradient(from 205deg, #ffd600, #ff7a00 18%, #ff0169 45%, #d300c5 68%, #7638fa 84%, #ffd600); }
.ig-avatar-ring img { display: block; width: 100%; height: 100%; border: 2px solid #fff; border-radius: 50%; object-fit: cover; background: #f1f1f1; }
.ig-account { flex: 1; min-width: 0; }
.ig-username-row { display: flex; align-items: center; min-width: 0; margin-bottom: 9px; line-height: 1; }
.ig-username-row strong { overflow: hidden; font-size: 11px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.ig-verified { display: inline-grid; place-items: center; flex: 0 0 12px; width: 12px; height: 12px; margin-left: 3px; border-radius: 50%; color: #fff; background: #3897f0; font-size: 8px; font-weight: 900; }
.ig-menu { margin-left: auto; padding-left: 6px; font-size: 10px; letter-spacing: 1px; }
.ig-stats { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 7px; }
.ig-stats span { display: block; min-width: 0; text-align: center; }
.ig-stats strong, .ig-stats small { display: block; white-space: nowrap; }
.ig-stats strong { font-size: 10px; line-height: 1.05; }
.ig-stats small { margin-top: 2px; color: #343434; font-size: 7px; line-height: 1; }
.ig-profile-bio { margin-top: 7px; font-size: 8px; line-height: 1.32; }
.ig-profile-bio strong, .ig-profile-bio span { display: block; }
.ig-profile-bio strong { margin-bottom: 2px; font-size: 8.5px; }

.audio-instruction { margin-top: 10px; }
.explanation-head { margin-top: 10px; }

/* Clean Vturb-only slots: no fake video thumbnails */
.vturb-empty { width: 100%; min-height: 240px; margin: 10px auto; display: grid; place-content: center; gap: 8px; padding: 20px; border: 2px dashed #c9ccd3; border-radius: 10px; color: #777; background: #f8f8f9; text-align: center; }
.vturb-empty strong { color: #333; font-size: 15px; }
.vturb-empty span { max-width: 260px; font-size: 11px; line-height: 1.35; }
.vturb-empty code { font-size: 10px; }
.vturb-slot { width: 100%; min-height: 1px; }

/* Lead forms */
.form-content { transform: translateY(-1vh); }
.lead-form { width: 100%; }
.lead-form .question-title { margin-bottom: 18px; font-size: 19px; }
.form-notes { margin: 0 auto 13px; max-width: 350px; color: #707783; font-size: 12px; line-height: 1.35; font-style: italic; }
.form-notes p { margin: 0 0 8px; }
.lead-form input { width: 100%; height: 45px; padding: 0 14px; border: 1px solid #c9cbd0; border-radius: 12px; outline: 0; color: #111; background: #fff; font-size: 13px; }
.lead-form input:focus { border-color: var(--red); box-shadow: 0 0 0 3px rgba(245,66,71,.12); }
.lead-form input::placeholder { color: #a0a5b1; font-style: italic; }
.field-error { margin: 6px 3px 0; color: #d92028; font-size: 11px; text-align: left; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Personalized loading */
.loading-content .question-title { margin-bottom: 42px; }
.loading-content .question-title small { display: inline-block; margin-top: 4px; font-size: 13px; line-height: 1.15; }
.loading-row { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 11px; }
.loading-track { width: 100%; height: 9px; border-radius: 99px; background: #f5dfe1; overflow: hidden; }
.loading-track div { width: 0; height: 100%; border-radius: inherit; background: var(--red); transition: width .18s linear; }
.loading-message { margin-top: 12px; font-size: 14px; line-height: 1.25; }

/* Final VSL and timed button */
.final-vsl-content { padding-top: clamp(0px, 1vh, 8px) !important; }
.vsl-copy { margin: 10px auto; max-width: 350px; font-size: 12px; line-height: 1.3; }
.unlock-box { padding: 4px 0 10px; }
.unlock-timer { margin: 10px 0; color: #8b3034; font-size: 13px; font-weight: 800; }
.offer-unlock, .checkout-button { width: 100%; min-height: 46px; padding: 10px 12px; border: 0; border-radius: 8px; color: #fff; background: #0cad4d; font-size: 11px; line-height: 1.2; font-weight: 900; cursor: pointer; box-shadow: 0 3px 0 #087f39; animation: softGreenPulse 2s infinite; }
.offer-unlock[hidden] { display: none; }

/* Final VSL and long-form offer share one continuous page */
.final-combined-mode { max-width: 430px; overflow: visible; }
.final-combined-mode .screen { min-height: 100vh; padding: 42px 12px 28px; display: block; overflow: visible; }
.final-combined-page { width: 100%; }
.embedded-offer[hidden] { display: none; }
.embedded-offer.revealed { margin-top: 8px; animation: revealOffer .35s ease both; }
.offer-page { width: 100%; color: #111; text-align: center; }
.offer-page h2 { margin: 15px 0 8px; font-size: 20px; line-height: 1.08; }
.offer-page h3 { margin: 10px 0 7px; font-size: 14px; line-height: 1.15; }
.offer-page p, .offer-page li { font-size: 12px; line-height: 1.4; }
.offer-page section { margin-top: 22px; }
.love-callout { margin: 10px 0 12px; padding: 10px; border: 1px solid #ff777a; border-radius: 8px; color: #d82a30; background: #fff1f1; font-size: 16px; line-height: 1.15; }
.chat-card, .review-card { width: min(100%, 340px); margin: 8px auto; padding: 12px 9px; border: 1px solid #e5e5e5; border-radius: 8px; background: #f3efec; text-align: left; }
.chat-date { margin-bottom: 7px; color: #888; font-size: 9px; text-align: center; }
.bubble { width: fit-content; max-width: 82%; margin: 5px 0; padding: 7px 9px; border-radius: 8px; font-size: 10px; line-height: 1.25; }
.bubble.incoming { background: #fff; }
.bubble.outgoing { margin-left: auto; background: #d9fdd3; }
.caption { margin: 4px 0; color: #999; font-size: 9px !important; }
.product-badge { display: inline-block; margin: 4px 0 8px; padding: 5px 9px; color: #fff; background: var(--red); font-size: 11px; line-height: 1.15; }
.bonus-card { margin: 16px 0; text-align: left; }
.bonus-card p { margin: 5px 0; }
.bonus-card ul { margin: 6px 0; padding-left: 18px; }
.bonus-visual { position: relative; width: 100%; height: 155px; overflow: hidden; border-radius: 8px; background: #21150e; }
.bonus-visual img { width: 100%; height: 100%; object-fit: cover; image-rendering: auto; }
.bonus-visual span { position: absolute; left: 0; right: 0; bottom: 0; min-height: 42px; padding: 11px 5px 5px; color: #fff; background: rgba(170,29,25,.96); font-size: 14px; font-weight: 900; text-align: center; }
.old-price { color: #e3363c; font-weight: 800; }
.free-price { color: #04a348; font-weight: 800; }
.price-card { width: min(100%, 330px); margin: 10px auto; padding: 16px; border: 2px solid #ff777a; border-radius: 12px; background: #fff; box-shadow: 0 6px 18px rgba(239,37,44,.12); }
.price-card h3 { padding: 8px; border-radius: 7px; color: #fff; background: #ff686d; font-size: 16px; }
.price-card ul { margin: 12px 0; padding: 0; list-style: none; text-align: left; }
.price-card li { margin: 6px 0; }
.price-card li::before { content: '✓'; margin-right: 7px; color: #0aae4c; font-weight: 900; }
.total-label { margin-bottom: 2px !important; font-weight: 800; }
.today-price { margin: 6px 0 0 !important; color: #f14b50; font-weight: 800; }
.price { display: block; margin: 2px 0; color: #0cad4d; font-size: 50px; line-height: 1; }
.price-card small { color: #555; font-size: 10px; }
.payment-line { margin-top: 9px; color: #77808a; font-size: 10px; }
.personal-note { padding: 8px; border: 1px solid #ffb6b7; border-radius: 7px; color: #e33a42; background: #fff4f4; }
.wide-chat { background: #efebe7; }
.review-card { margin-bottom: 12px; }
.about-section img { width: 130px; height: 155px; object-fit: cover; border-radius: 12px; }
.about-section p { max-width: 360px; margin: 10px auto; }
.guarantee-seal { width: 180px; height: 180px; margin: 22px auto 10px; display: grid; place-content: center; border: 14px solid #f5c83e; border-radius: 50%; color: #4b3608; background: radial-gradient(circle,#fff9b8 0,#f2be28 70%); box-shadow: inset 0 0 0 4px #8d6713, 0 6px 15px rgba(0,0,0,.2); transform: rotate(-4deg); }
.guarantee-seal span { font-size: 22px; font-weight: 900; }
.guarantee-seal strong { margin-top: 5px; font-size: 16px; line-height: 1.1; }
.about-section .checkout-button { margin-top: 14px; }

@keyframes softGreenPulse {
  0%,100% { box-shadow: 0 3px 0 #087f39, 0 0 0 0 rgba(12,173,77,.25); }
  50% { box-shadow: 0 3px 0 #087f39, 0 0 0 8px rgba(12,173,77,0); }
}

@keyframes revealOffer {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}