/* Pearl hero: one sizing system, three content-driven layout modes. */
:root {
  --page-gutter: clamp(20px, 4.166667vw, 64px);
  --hero-gap: clamp(24px, 2vw, 32px);
  --hero-dark: #1a2329;
  --control-line: #495763;
  --control-radius: 16px;
}
.wide { width: calc(100% - 2 * var(--page-gutter)); max-width: 1560px; margin-inline: auto; }
.section { padding-block: clamp(64px, 7.8vw, 120px); }
.hero {
  --u: calc(min(calc(100vw - 2 * var(--page-gutter)), 1560px) / 1408);
  position: relative;
  isolation: isolate;
  background: radial-gradient(ellipse at 37% 61%, #cadbecb3, transparent 64%), linear-gradient(125deg, #f8fcfe, #f5f9fd 48%, #e7eff8);
  padding-block-end: 40px;
}
.hero-background { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1; visibility: hidden; }
.hero[data-shaped="true"] .hero-background { visibility: visible; }
.header { height: clamp(80px, 7.2vw, 110px); position: relative; z-index: 3; display: flex; align-items: center; gap: clamp(24px, 3vw, 46px); }
.hero .brand { display: inline-flex; gap: 14px; align-items: center; flex-shrink: 0; white-space: nowrap; }
.hero .brand img { width: clamp(46px, 4.2vw, 64px); height: auto; aspect-ratio: 1; object-fit: contain; }
.hero .brand > span { font-size: clamp(22px, 2vw, 30px); font-weight: 700; letter-spacing: -.05em; }
.desktop-nav { display: flex; gap: clamp(22px, 2.4vw, 38px); margin-inline-start: auto; font-size: 14px; font-weight: 500; }
.desktop-nav a { padding-block: 12px; }
.desktop-nav a:hover { color: #586d84; }
.app-link { display: inline-flex; align-items: center; gap: 20px; padding: 13px 22px; border: 1px solid #7f8b99; border-radius: 100px; font-size: 14px; white-space: nowrap; }
.app-link svg { width: 18px; height: 18px; }
.app-link:hover { background: #fff; }
.menu-toggle, .mobile-nav { display: none; }
.hero-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(340px, 1fr);
  grid-template-areas: "intro purchase" "certificate purchase" "benefits purchase";
  grid-template-rows: max-content max-content 1fr;
  column-gap: clamp(28px, 3.1vw, 48px);
  row-gap: var(--hero-gap);
  align-items: start;
  padding-block-start: 16px;
}
.hero-intro { grid-area: intro; min-width: 0; container-type: inline-size; }
.hero-intro h1 { font-size: min(clamp(40px, 7.3vw, 116px), 13cqi); line-height: 1.02; letter-spacing: -.065em; font-weight: 700; overflow-wrap: normal; }
.hero-intro h1 > span { display: inline; }
.hero-intro h2 { font-size: clamp(24px, 4vw, 60px); line-height: 1.1; letter-spacing: -.05em; margin-block-start: 8px; }
.hero-intro p { font-size: clamp(14px, 1.75vw, 24px); line-height: 1.4; letter-spacing: -.025em; color: #5b6370; margin-block-start: 12px; max-width: 88%; }
/* One bounded profile: its shoulder is shared with the surrounding surface. */
.certificate-wrap { margin: 0; grid-area: certificate; min-width: 0; display: flow-root; container-type: inline-size; position: relative; z-index: 2; filter: drop-shadow(0 5px 5px #19345436) drop-shadow(0 15px 20px #40567540); }
.certificate { --cu: calc(100cqi / 902); position: relative; width: 100%; aspect-ratio: 902 / 487; margin-block-start: calc(-100cqi * .07450998); color: #101b2a; isolation: isolate; }
.certificate-material { position: absolute; inset: 0; clip-path: url(#certificate-shape); background: radial-gradient(ellipse at 4% 8%, #ffffffd9, transparent 58%), linear-gradient(124deg, #e8f3ff, #a8c1e4); }
.certificate-material:before { content: ""; position: absolute; inset: 0; background: linear-gradient(123deg, transparent 0 50%, #ffffff30 50.12%, #ffffff00 67%, transparent 67.12%), linear-gradient(127deg, transparent 73%, #ffffff20 73.12%, #ffffff00 86%, transparent 86.12%); }
.certificate-material:after { content: ""; position: absolute; inset: 0; background: url('assets/foil-grain.svg') repeat; background-size: 192px 192px; mix-blend-mode: soft-light; opacity: .7; }
.certificate-edge { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; overflow: visible; pointer-events: none; }
.certificate-top, .certificate-bottom { position: absolute; left: 7.3%; right: 6%; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.certificate-top { top: 21.4%; }
.certificate-top strong { font-size: max(17px, calc(36 * var(--cu))); font-weight: 700; letter-spacing: calc(-1.2 * var(--cu)); line-height: 1.15; }
.certificate-top > span { font-size: max(11px, calc(27 * var(--cu))); letter-spacing: 0; line-height: 1.3; text-align: right; }
.certificate-body { position: absolute; inset-inline: 6.7%; top: 36.5%; bottom: 26.5%; display: grid; grid-template-columns: minmax(0, 48.5fr) minmax(0, 51.5fr); grid-template-rows: minmax(0, 1fr); align-items: center; gap: 0; }
.certificate-body > strong { display: flex; align-items: center; gap: 0; font-family: Arial, Helvetica, sans-serif; font-size: calc(200 * var(--cu)); line-height: 1; letter-spacing: 0; font-weight: 700; white-space: nowrap; }
.certificate-body .face-value { font: inherit; font-family: Onest, Arial, sans-serif; letter-spacing: calc(-10 * var(--cu)); margin-inline-start: calc(-13 * var(--cu)); transform: translateY(calc(1 * var(--cu))); }
.certificate-body .currency { font-family: "Arial Black", Arial, sans-serif; font-weight: 400; font-size: .89em; line-height: 1; transform: translate(calc(-6 * var(--cu)), calc(-14 * var(--cu))) scaleX(.95); letter-spacing: 0; }
.certificate-body > img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; transform: translate(calc(-10 * var(--cu)), calc(25 * var(--cu))); filter: drop-shadow(0 5px 3px #53637e24); }
.certificate[data-long="true"] .certificate-body { grid-template-columns: minmax(0, 60fr) minmax(0, 40fr); }
.certificate[data-long="true"] .certificate-body > strong { font-family: Onest, Arial, sans-serif; font-size: calc(130 * var(--cu)); }
.certificate[data-long="true"] .face-value { letter-spacing: calc(-4 * var(--cu)); margin-inline-start: 0; transform: none; }
.certificate-bottom { left: 7.6%; bottom: 9.5%; font-size: max(12px, calc(24 * var(--cu))); letter-spacing: 0; line-height: 1.3; }
.certificate-bottom > span:last-child { font-size: max(10px, calc(18 * var(--cu))); text-align: right; }
.purchase { grid-area: purchase; position: relative; min-width: 0; padding: 60px 0 32px 32px; color: #eff4fa; background: var(--hero-dark); border-radius: 76px 0 0 76px; }
.hero[data-shaped="true"] .purchase { background: transparent; }
.purchase fieldset { width: 100%; min-width: 0; }
.purchase legend { display: flex; align-items: center; gap: 10px; padding: 0; margin-block-end: 14px; font-size: clamp(15px, 1.2vw, 18px); line-height: 1.4; letter-spacing: -.02em; }
.info-button { position: relative; display: inline-flex; align-items: center; justify-content: center; padding: 0; width: 17px; height: 17px; border: 1px solid #a5b2c3; border-radius: 50%; font-size: 11px; line-height: 1; color: #becad9; flex-shrink: 0; }
.info-button:after { content: ""; position: absolute; inset: -6px; }
.info-button:hover { background: #eff5fc; color: #17202b; }
.region-options { display: flex; gap: 8px; }
.region-options label, .amount-options label, .frequency-options label { position: relative; flex: 1; min-width: 0; cursor: pointer; }
.region-options input, .amount-options input, .frequency-options input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.region-options label > span { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 12px 4px; min-height: 54px; border: 1px solid var(--control-line); border-radius: var(--control-radius); font-size: clamp(13px, 1.05vw, 16px); white-space: nowrap; }
.region-options label > span > span { font-size: 20px; line-height: 1; }
.region-options input:checked + span, .amount-options input:checked + span, .frequency-options input:checked + span { background: var(--silver); color: #0e1520; box-shadow: inset 0 1px #fff; font-weight: 600; }
.region-options input:checked + span { border-color: #f5faff; }
.region-options label:hover > span { border-color: #9aaec4; }
.amount-field { margin-block-start: 30px; }
.amount-options { display: flex; border: 1px solid var(--control-line); border-radius: var(--control-radius); }
.amount-options label + label { border-inline-start: 1px solid #ffffff0b; }
.amount-options span { display: flex; align-items: center; justify-content: center; min-height: 64px; padding-inline: 4px; border-radius: calc(var(--control-radius) - 1px); font-size: clamp(22px, 1.65vw, 26px); line-height: 1.2; letter-spacing: -.035em; font-weight: 600; white-space: nowrap; }
.amount-options:has(input[value="1000"]) span, .amount-options:has(input[value="2000"]) span { font-size: clamp(18px, 1.3vw, 22px); }
.frequency-field { margin-block-start: 28px; }
.frequency-field legend { width: 100%; border-block-start: 1px solid #66738080; padding-block-start: 24px; }
.frequency-options { display: flex; gap: 4px; border: 1px solid var(--control-line); border-radius: var(--control-radius); }
.frequency-options span { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 14px 6px; min-height: 56px; font-size: clamp(13px, 1vw, 16px); border-radius: calc(var(--control-radius) - 1px); white-space: nowrap; }
.frequency-options i { display: block; position: relative; width: 19px; height: 19px; border-radius: 50%; border: 1.5px solid #9bacc0; flex-shrink: 0; }
.frequency-options input:checked + span i { border-color: #142036; }
.frequency-options input:checked + span i:after { content: ""; position: absolute; inset: 4px; background: #142036; border-radius: 50%; }
.frequency-note { font-size: 12px; line-height: 1.5; color: #b4c3d3; min-height: 27px; padding-block-start: 9px; }
.price-block { border-block-start: 1px solid #66738080; margin-block-start: 18px; padding-block-start: 22px; min-width: 0; }
.price-block > span { display: flex; align-items: center; gap: 9px; font-size: 14px; line-height: 1.5; color: #d4dce7; }
.price-block > strong { display: block; font-size: clamp(44px, 4vw, 64px); font-weight: 600; line-height: 1.12; letter-spacing: -.055em; margin-block-start: 6px; white-space: nowrap; }
.price-block > p { margin-block-start: 8px; color: #c5d2e3; font-size: 12px; line-height: 1.5; }
.buy-button { margin-block-start: 18px; width: 100%; min-height: 66px; font-size: 20px; padding: 18px 26px; }
.buy-button svg { width: 24px; height: 24px; }
.purchase-caption { font-size: 11px; color: #b5c4d3; line-height: 1.5; text-align: center; max-width: 360px; margin: 12px auto 0; }
.purchase-safety { display: flex; gap: 22px; margin-block-start: 24px; }
.purchase-safety > button, .purchase-safety > div { display: flex; align-items: center; gap: 12px; padding: 0; flex: 1; min-width: 0; color: #dbe5f0; font-size: 13px; line-height: 1.5; text-align: left; }
.purchase-safety > div { border-inline-start: 1px solid #66738080; padding-inline-start: 20px; }
.purchase-safety svg { width: 27px; height: 27px; color: #b7c9dd; }
.purchase-safety button:hover { text-decoration: underline; text-underline-offset: 4px; }
.hero-benefits { grid-area: benefits; min-width: 0; container-type: inline-size; display: grid; grid-template-columns: 1fr .9fr 1.1fr; align-items: center; padding-block: 12px 0; }
.hero-benefit { display: flex; align-items: flex-start; gap: 12px; min-width: 0; padding-inline-end: 18px; }
.hero-benefit + .hero-benefit { border-inline-start: 1px solid #b6c8db; padding-inline-start: 20px; }
.hero-benefit > span:last-child { min-width: 0; }
.icon-disc { display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; flex-shrink: 0; border: 1px solid #d4dfec; border-radius: 50%; background: linear-gradient(125deg, #e4ecf6, #f9fbfd); }
.icon-disc svg { width: 26px; height: 26px; }
.hero-benefit strong { display: block; font-size: clamp(28px, 7.2cqi, 64px); line-height: 1; letter-spacing: -.065em; font-weight: 650; white-space: nowrap; }
.hero-benefit strong > span { font-size: .72em; }
.hero-benefit b { display: block; font-size: clamp(14px, 2.4cqi, 21px); line-height: 1.25; font-weight: 550; letter-spacing: -.035em; margin-block-start: 6px; }
.hero-benefit small { display: block; font-size: clamp(11px, 1.6cqi, 14px); line-height: 1.5; margin-block-start: 4px; }
.first-gift { align-items: center; }
.first-gift strong { font-size: clamp(23px, 4.9cqi, 44px); }
.first-gift .icon-disc, .auto-benefit .icon-disc { width: 42px; height: 42px; }
.auto-benefit b { font-size: clamp(11px, 1.9cqi, 17px); margin-block: 0 5px; }
.auto-benefit strong { font-size: clamp(28px, 6.4cqi, 58px); }
.hero-benefit:hover .icon-disc { background: #fff; }
@media (max-width: 959px) {
  .hero { padding-block-end: 36px; }
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "intro purchase" "certificate purchase" "benefits purchase"; column-gap: 24px; row-gap: 30px; }
  .hero-intro p { max-width: none; }
  .purchase, .hero[data-shaped="true"] .purchase { background: radial-gradient(ellipse at 0 0, #38465166, transparent 65%), var(--hero-dark); border-radius: 32px 66px 32px 32px; padding: 48px 24px 30px; }
  .hero[data-shaped="true"] .purchase { background: transparent; }
  .purchase legend { font-size: 16px; }
  .amount-options span { min-height: 56px; }
  .frequency-options span { min-height: 52px; }
  .buy-button { min-height: 60px; font-size: 17px; padding: 17px 22px; }
  .price-block > strong { font-size: 46px; }
  .hero-benefit, .first-gift { flex-direction: column; align-items: flex-start; gap: 12px; padding-inline-end: 12px; }
  .hero-benefit + .hero-benefit { padding-inline-start: 15px; }
  .hero-benefit .icon-disc { width: 36px; height: 36px; }
  .icon-disc svg { width: 22px; height: 22px; }
  .desktop-nav, .app-link { display: none; }
  .header { justify-content: space-between; }
  .menu-toggle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 44px; height: 44px; border: 1px solid #a9b9ca; border-radius: 50%; padding: 10px; }
  .menu-toggle span { width: 18px; height: 1px; background: #1a2737; transition: transform .15s; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .mobile-nav:not([hidden]) { display: flex; flex-direction: column; position: absolute; top: calc(100% - 6px); inset-inline: 0; padding: 14px 22px; border: 1px solid #c3cfdd; border-radius: 22px; background: #f6f9fd; box-shadow: 0 16px 32px #1f314020; }
  .mobile-nav a { padding-block: 13px; font-size: 15px; }
  .mobile-nav a + a { border-block-start: 1px solid #d3dde7; }
}
@media (max-width: 959px) {
  .hero-background { display: none; }
  .header { height: 76px; }
  .hero-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "intro" "certificate" "purchase" "benefits"; row-gap: 24px; padding-block-start: 10px; }
  .hero-intro h1 { font-size: min(clamp(40px, 7.3vw, 116px), 13cqi); }
  .hero-intro h2 { margin-block-start: 10px; }
  .hero-intro p { margin-block-start: 9px; }
  .purchase { padding: 24px 20px; }
  .purchase legend { font-size: 15px; margin-block-end: 12px; }
  .region-options label > span { min-height: 49px; font-size: 13px; }
  .region-options label > span > span { font-size: 19px; }
  .amount-field { margin-block-start: 22px; }
  .amount-options span { min-height: 54px; }
  .frequency-field { margin-block-start: 22px; }
  .frequency-field legend { padding-block-start: 20px; }
  .frequency-options span { min-height: 51px; font-size: 13px; gap: 8px; }
  .frequency-note { font-size: 11px; min-height: 25px; }
  .purchase-checkout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 12px; align-items: end; border-block-start: 1px solid #66738080; padding-block-start: 18px; margin-block-start: 16px; }
  .purchase-checkout .price-block { border: 0; margin: 0; padding: 0; }
  .price-block > span { font-size: 12px; gap: 7px; }
  .price-block > strong { font-size: clamp(34px, 9vw, 46px); }
  .price-block > p { font-size: 11px; }
  .buy-button { margin: 0; min-height: 58px; padding: 15px 14px; gap: 8px; font-size: 14px; white-space: nowrap; }
  .buy-button svg { width: 20px; height: 20px; }
  .purchase-safety { gap: 16px; }
  .purchase-safety > button, .purchase-safety > div { font-size: 12px; gap: 10px; }
  .purchase-safety > div { padding-inline-start: 16px; }
  .purchase-safety svg { width: 25px; height: 25px; }
  .hero-benefits { padding-block: 4px 0; }
}
/* A tablet keeps the material and readable controls in a compact two-column form. */
@media (min-width: 720px) and (max-width: 959px) {
  .hero-intro h1 { font-size: clamp(64px, 10.2vw, 92px); }
  .hero-intro h2 { font-size: clamp(36px, 6vw, 56px); }
  .hero-intro p { font-size: 20px; }
  .purchase { padding: 32px; }
  #purchase-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "region checkout" "amount checkout" "frequency checkout" "caption caption"; gap: 22px 32px; }
  #purchase-form > fieldset:first-child { grid-area: region; }
  .amount-field { grid-area: amount; margin: 0; }
  .frequency-field { grid-area: frequency; margin: 0; }
  .purchase-checkout { grid-area: checkout; display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 0; border-block-start: 0; border-inline-start: 1px solid #66738080; margin: 0; padding: 0 0 0 32px; }
  .price-block > span { font-size: 14px; }
  .price-block > strong { font-size: 48px; }
  .price-block > p { font-size: 12px; }
  .buy-button { margin-block-start: 24px; font-size: 17px; }
  .frequency-note { min-height: 0; }
  .purchase-caption { grid-area: caption; margin: 0; font-size: 12px; }
  .purchase-safety { max-width: 500px; margin-inline: auto; margin-block-start: 24px; }
  .hero-benefits { padding-block-start: 12px; }
}
@media (max-width: 359px) {
  :root { --page-gutter: 16px; }
  .hero .brand { gap: 10px; }
  .hero .brand > span { font-size: 21px; }
  .hero .brand img { width: 42px; }
  .purchase { padding-inline: 18px; }
  .region-options { gap: 6px; }
  .region-options label > span { gap: 5px; font-size: 12px; }
  .purchase-checkout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .price-block > strong { font-size: 42px; }
  .buy-button { font-size: 16px; }
  .hero-benefit + .hero-benefit { padding-inline-start: 12px; }
  .hero-benefit { padding-inline-end: 10px; }
  .hero-benefit small { font-size: 10px; }
}

/* The approved 1536 × 1024 composition scales from its 1408 px content frame. */
@media (min-width: 960px) {
  .hero { padding-block-end: calc(54 * var(--u)); min-height: calc(1024 * var(--u)); }
  .header { height: calc(110 * var(--u)); gap: calc(54 * var(--u)); }
  .hero .brand { gap: calc(20 * var(--u)); }
  .hero .brand img { width: calc(72 * var(--u)); }
  .hero .brand > span { font-size: calc(36 * var(--u)); letter-spacing: calc(-1.8 * var(--u)); }
  .desktop-nav { gap: calc(42 * var(--u)); font-size: max(12px, calc(16 * var(--u))); }
  .app-link { width: max(188px, calc(248 * var(--u))); min-height: max(44px, calc(52 * var(--u))); padding: 0 calc(22 * var(--u)); justify-content: space-between; gap: calc(12 * var(--u)); font-size: max(12px, calc(16 * var(--u))); }
  .app-link svg { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }
  .hero-grid { grid-template-columns: minmax(0, 902fr) minmax(0, 460fr); column-gap: calc(46 * var(--u)); row-gap: calc(18 * var(--u)); padding-block-start: calc(4 * var(--u)); }
  .hero-intro { padding-inline-start: calc(4 * var(--u)); }
  .hero-intro h1 { font-size: calc(112 * var(--u)); line-height: 1.02; letter-spacing: calc(-3.8 * var(--u)); transform: translateY(calc(2 * var(--u))); }
  .hero-intro h1[data-store="true"] { font-size: calc(100 * var(--u)); line-height: 1.1424; }
  .hero-intro h2 { font-size: calc(64 * var(--u)); font-weight: 700; line-height: 1; letter-spacing: calc(-2 * var(--u)); margin-block-start: calc(2 * var(--u)); }
  .hero-intro p { font-size: calc(28 * var(--u)); line-height: 1.35; letter-spacing: calc(.5 * var(--u)); margin-block-start: calc(8 * var(--u)); max-width: 100%; }
  .purchase { padding: calc(80 * var(--u)) 0 0; }
  .purchase legend { font-size: max(14px, calc(20 * var(--u))); line-height: 1.2; margin-block-end: calc(14 * var(--u)); gap: calc(12 * var(--u)); }
  .info-button { width: calc(20 * var(--u)); height: calc(20 * var(--u)); font-size: calc(13 * var(--u)); }
  .region-options { gap: calc(8 * var(--u)); }
  .region-options label > span { min-height: max(44px, calc(60 * var(--u))); border-radius: calc(17 * var(--u)); gap: calc(10 * var(--u)); padding: calc(12 * var(--u)) calc(4 * var(--u)); font-size: max(13px, calc(18 * var(--u))); }
  .region-options label > span > span { font-size: calc(24 * var(--u)); }
  .amount-field { margin-block-start: calc(33 * var(--u)); }
  .amount-options { border-radius: calc(19 * var(--u)); }
  .amount-options span { min-height: calc(76 * var(--u)); font-size: calc(28 * var(--u)); border-radius: calc(18 * var(--u)); letter-spacing: calc(-.5 * var(--u)); }
  .amount-options:has(input[value="1000"]) span, .amount-options:has(input[value="2000"]) span { font-size: max(18px, calc(25 * var(--u))); }
  .frequency-field { margin-block-start: calc(26 * var(--u)); }
  .frequency-field legend { padding-block-start: calc(24 * var(--u)); }
  .frequency-options { border-radius: calc(19 * var(--u)); }
  .frequency-options span { min-height: calc(62 * var(--u)); padding: calc(14 * var(--u)) calc(6 * var(--u)); border-radius: calc(18 * var(--u)); font-size: max(13px, calc(18 * var(--u))); gap: calc(14 * var(--u)); }
  .frequency-options i { width: calc(24 * var(--u)); height: calc(24 * var(--u)); }
  .frequency-options input:checked + span i:after { inset: calc(4 * var(--u)); }
  .frequency-note { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .price-block { margin-block-start: calc(24 * var(--u)); padding-block-start: calc(26 * var(--u)); }
  .price-block > span { font-size: calc(16 * var(--u)); line-height: 1.5; }
  .price-block > strong { font-size: calc(64 * var(--u)); line-height: 1.1; letter-spacing: calc(-2 * var(--u)); margin-block-start: 0; }
  .price-block > p { font-size: max(12px, calc(14 * var(--u))); }
  .buy-button { margin-block-start: calc(19 * var(--u)); min-height: calc(76 * var(--u)); padding: 0 calc(28 * var(--u)) 0 0; justify-content: center; gap: calc(44 * var(--u)); font-size: calc(26 * var(--u)); font-weight: 600; }
  .buy-button svg { width: calc(26 * var(--u)); height: calc(26 * var(--u)); }
  .purchase-caption { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); }
  .purchase-safety { margin-block-start: calc(30 * var(--u)); gap: calc(30 * var(--u)); }
  .purchase-safety > button, .purchase-safety > div { font-size: calc(18 * var(--u)); line-height: 1.4; gap: calc(18 * var(--u)); }
  .purchase-safety > div { padding-inline-start: calc(26 * var(--u)); }
  .purchase-safety svg { width: calc(36 * var(--u)); height: calc(36 * var(--u)); }
  .hero-benefits { margin-inline-start: calc(-4 * var(--u)); width: calc(100% + 4 * var(--u)); grid-template-columns: minmax(0,282fr) minmax(0,242fr) minmax(0,382fr); align-items: start; padding-block-start: calc(34 * var(--u)); }
  .hero-benefit { gap: calc(14 * var(--u)); padding-inline-end: calc(18 * var(--u)); }
  .hero-benefit + .hero-benefit { padding-inline-start: calc(14 * var(--u)); }
  .hero-benefit .icon-disc { width: calc(64 * var(--u)); height: calc(64 * var(--u)); margin-block-start: calc(6 * var(--u)); }
  .hero-benefit .icon-disc svg { width: calc(32 * var(--u)); height: calc(32 * var(--u)); }
  .hero-benefit strong { font-size: calc(76 * var(--u)); line-height: .96; letter-spacing: calc(-4 * var(--u)); font-weight: 700; }
  .hero-benefit b { font-size: calc(28 * var(--u)); line-height: 1.1; margin-block-start: 0; }
  .hero-benefit small { font-size: calc(16 * var(--u)); line-height: 1.4; margin-block-start: calc(8 * var(--u)); }
  .first-gift { align-self: start; margin-block-start: calc(24 * var(--u)); align-items: center; gap: calc(10 * var(--u)); }
  .first-gift .icon-disc { width: calc(52 * var(--u)); height: calc(52 * var(--u)); margin-block-start: calc(12 * var(--u)); }
  .first-gift strong { font-size: calc(48 * var(--u)); line-height: 1.1; letter-spacing: calc(-2 * var(--u)); }
  .first-gift small { font-size: calc(14 * var(--u)); margin-block-start: calc(4 * var(--u)); }
  .auto-benefit { padding-inline-start: calc(22 * var(--u)) !important; gap: calc(16 * var(--u)); }
  .auto-benefit .icon-disc { margin-block-start: calc(-10 * var(--u)); }
  .auto-benefit > span:last-child { transform: translateY(calc(-4 * var(--u))); }
  .auto-benefit b { font-size: calc(24 * var(--u)); line-height: 1.15; margin: 0; }
  .auto-benefit strong { font-size: calc(56 * var(--u)); line-height: .96; letter-spacing: calc(-3 * var(--u)); margin: 0; }
  .auto-benefit small { margin-block-start: calc(2 * var(--u)); }
  .benefit-caption { display: block; margin-block-start: calc(14 * var(--u)); font-size: calc(16 * var(--u)); line-height: 1.4; font-style: normal; white-space: nowrap; color: #697586; }
}
.region-options input:checked + span, .amount-options input:checked + span, .frequency-options input:checked + span { background: linear-gradient(135deg, #fff, #e3edfc 42%, #c8d8f0); box-shadow: inset 0 1px 1px #fff, inset 0 -1px 0 #a7bdd75c, 0 5px 15px #08131e12; }
.buy-button { background: linear-gradient(132deg, #fff, #e8effa 38%, #c9d9ef); box-shadow: inset 0 1px 1px #fff, 0 10px 28px #050b131a; }
@media(max-width:959px){.certificate-bottom{align-items:flex-end}.certificate-bottom>span:last-child{max-width:25%;text-wrap:balance}.benefit-caption{display:block;font-size:11px;font-style:normal;color:#697586;line-height:1.4;margin-block-start:8px}.certificate-body>strong{gap:calc(12 * var(--cu))}}