:root {
  --cream: #F4FAFD;
  --cream-2: #E9F4FA;
  --cream-3: #B9DFEF;
  --paper: #FFFFFF;
  --paper-soft: #F4FAFD;
  --navy: #062248;
  --navy-deep: #04182F;
  --ink: #183249;
  --muted: #536A7B;
  --teal: #008D9C;
  --teal-deep: #006C79;
  --coral: #087FC7;
  --coral-deep: #075A91;
  --gold: #F19A13;
  --gold-deep: #B86806;
  --green: #1FA75C;
  --green-deep: #16894a;
  --green-glow: rgba(31,167,92,.35);
  --red: #D91E36;
  --red-deep: #A90E27;
  --font-display: 'Poppins',system-ui,sans-serif;
  --font-body: 'Poppins',system-ui,sans-serif;
  --r-sm: 14px;
  --r: 22px;
  --r-lg: 34px;
  --pill: 999px;
  --sh-sm: 0 2px 8px rgba(34,55,71,.08);
  --sh: 0 10px 30px -12px rgba(34,55,71,.22);
  --sh-lg: 0 28px 60px -22px rgba(34,55,71,.32);
  --sh-card: 0 14px 34px -16px rgba(34,55,71,.28);
  --maxw: 1160px;
}

* {box-sizing: border-box;}
html {scroll-behavior: smooth; text-size-adjust: 100%;}
body {margin: 0px; font-family: var(--font-body); color: var(--ink); background: var(--cream); font-size: 18px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden;}
img {max-width: 100%; height: auto; display: block;}
h1,  h2,  h3,  h4 {font-family: var(--font-display); color: var(--navy); line-height: 1.08; margin: 0px; letter-spacing: -0.01em;}
p {margin: 0px; text-wrap: pretty;}
a {color: inherit; text-decoration: none;}
.wrap {max-width: var(--maxw); margin: 0px auto; padding: 0px 22px;}
section {position: relative;}
.btn {display: inline-flex; align-items: center; justify-content: center; gap: 12px; font-family: var(--font-display); font-weight: 600; font-size: clamp(17px, 2.2vw, 22px); line-height: 1.15; text-align: center; padding: 20px 38px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: var(--pill); cursor: pointer; background: var(--green); color: rgb(255, 255, 255); box-shadow: 0 12px 26px -10px var(--green-glow), inset 0 -3px 0 rgba(0,0,0,.13); transition: transform 0.18s cubic-bezier(0.3, 1.4, 0.5, 1), box-shadow 0.18s, filter 0.18s; position: relative; text-wrap: balance;}
.btn:hover {transform: translateY(-3px) scale(1.015); filter: brightness(1.05); box-shadow: 0 20px 38px -12px var(--green-glow), inset 0 -3px 0 rgba(0,0,0,.13);}
.btn:active {transform: translateY(0px) scale(0.99);}
.btn .arr {font-size: 1.1em; transform: translateX(0px); transition: transform 0.2s;}
.btn:hover .arr {transform: translateX(4px);}
.btn--lg {padding: 24px 46px;}
.btn--block {display: flex; width: 100%;}
.btn--ghost {background: var(--paper); color: var(--navy); box-shadow: inset 0 0 0 2.5px var(--navy);}
.btn--ghost:hover {background: var(--navy); color: rgb(255, 255, 255);}
.btn-pulse {animation: 2.6s ease-in-out 0s infinite normal none running pulse;}
@keyframes pulse { 
  0%, 100% { box-shadow: 0 12px 26px -10px var(--green-glow), inset 0 -3px 0 rgba(0,0,0,.13), 0 0 0 0 var(--green-glow); }
  50% { box-shadow: 0 12px 26px -10px var(--green-glow), inset 0 -3px 0 rgba(0,0,0,.13), 0 0 0 14px rgba(31,167,92,0); }
}
.offerbar {background: var(--red); color: rgb(255, 255, 255); text-align: center; font-family: var(--font-display); font-weight: 500; letter-spacing: 0.04em; font-size: 15px; padding: 11px 16px; position: relative; z-index: 60;}
.offerbar b {color: rgb(255, 255, 255); font-weight: 600;}
.hero {background: linear-gradient(180deg, var(--paper-soft) 0%, var(--cream) 100%); padding: 50px 0px 60px; overflow: hidden;}
.hero-grid {display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 880px; margin: 0px auto;}
.badge-pill {display: inline-flex; align-items: center; gap: 9px; background: var(--paper); color: var(--teal-deep); font-family: var(--font-display); font-weight: 600; font-size: 15px; padding: 9px 18px; border-radius: var(--pill); box-shadow: var(--sh-sm); border: 1.5px solid rgba(77, 101, 112, 0.25);}
.badge-pill .dot {width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: rgba(31, 167, 92, 0.18) 0px 0px 0px 4px;}
.hero h1 {font-size: clamp(31px, 4.4vw, 52px); font-weight: 600; margin: 22px 0px 30px; max-width: 20ch;}
.hero h1 .hl {color: var(--teal-deep);}
.hero .lead {font-size: clamp(17px, 1.6vw, 20px); color: var(--ink); max-width: 56ch; margin: 0px auto 26px;}
.hero-art {position: relative; width: 100%; max-width: 560px; margin: 0px auto 32px;}
.hero-art img {width: 100%; height: auto; margin: 0px auto; filter: drop-shadow(rgba(34, 55, 71, 0.28) 0px 36px 50px); animation: 6s ease-in-out 0s infinite normal none running floaty;}
@keyframes floaty { 
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-14px); }
}
.hero-copy {width: 100%; max-width: 760px; margin: 0px auto;}
.bullets {list-style: none; padding: 0px; margin: 0px auto 30px; display: grid; width: fit-content; max-width: 100%; gap: 13px; text-align: left;}
.bullets li {display: flex; align-items: flex-start; gap: 13px; font-weight: 600; color: var(--navy); font-size: 17px;}
.hero-copy > .btn {display: flex; width: fit-content; max-width: 100%; margin: 0px auto;}
.check {flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; background: var(--green); display: grid; place-items: center; margin-top: 1px; box-shadow: 0 4px 10px -3px var(--green-glow);}
.check svg {width: 14px; height: 14px; stroke: rgb(255, 255, 255);}
.delivery {display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 22px; color: var(--muted); font-size: 15px; font-weight: 600; text-align: left;}
.delivery .ico {display: inline-flex; gap: 6px;}
.delivery .ico span {width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--paper); box-shadow: var(--sh-sm);}
.delivery .ico svg {width: 17px; height: 17px;}
.sec {padding: 78px 0px;}
.sec--cream2 {background: var(--cream-2);}
.sec--plans-cream {background: rgb(244, 240, 231);}
.sec-head {text-align: center; max-width: 760px; margin: 0px auto 46px;}
.sec-head h2 {font-size: clamp(27px, 3.4vw, 42px); font-weight: 600; text-wrap: balance;}
.sec-head p {color: var(--muted); margin-top: 14px; font-size: 18px;}
.marquee {position: relative; overflow: hidden; mask-image: linear-gradient(90deg, transparent, rgb(0, 0, 0) 6%, rgb(0, 0, 0) 94%, transparent);}
.marquee-track {display: flex; gap: 30px; width: max-content; animation: 34s linear 0s infinite normal none running marquee-right;}
.marquee-track.is-reverse {animation-direction: reverse;}
.marquee-track.is-fast {animation-duration: 14s !important;}
.marquee:hover .marquee-track {animation-play-state: paused;}
@keyframes marquee-right { 
  0% { transform: translateX(calc(-50% - 15px)); }
  100% { transform: translateX(0px); }
}
.gal-card {flex: 0 0 auto; width: clamp(240px, 26vw, 330px); background: var(--paper); border-radius: var(--r); box-shadow: var(--sh-card); overflow: hidden; border: 1px solid rgba(34, 55, 71, 0.06); transition: transform 0.25s, box-shadow 0.25s;}
.gal-card:hover {transform: translateY(-6px) scale(1.02); box-shadow: var(--sh-lg);}
.gal-card .ph {aspect-ratio: 4 / 5; overflow: hidden; background: var(--cream-2);}
.gal-card .ph img {width: 100%; height: 100%; object-fit: contain; object-position: center top;}
.photo-marquee .marquee-track {animation-duration: 29s;}
.photo-card {flex: 0 0 auto; width: clamp(230px, 24vw, 300px); border-radius: var(--r); overflow: hidden; box-shadow: var(--sh-card); border: 4px solid rgb(255, 255, 255); background: var(--cream-2);}
.photo-card .ph {aspect-ratio: 4 / 5; overflow: hidden;}
.photo-card .ph img {width: 100%; height: 100%; object-fit: contain;}
.navbtn {width: 50px; height: 50px; border-radius: 50%; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; background: rgb(255, 255, 255); color: var(--navy); box-shadow: var(--sh); display: grid; place-items: center; transition: transform 0.15s, background 0.15s, color 0.15s;}
.navbtn:hover {background: var(--navy); color: rgb(255, 255, 255); transform: scale(1.06);}
.navbtn svg {width: 20px; height: 20px;}
.marquee-ctrl {display: flex; justify-content: center; gap: 14px; margin-top: 22px;}
.marquee-ctrl .navbtn {width: 46px; height: 46px;}
.feat-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px;}
.feat-card {background: var(--paper); border-radius: var(--r); padding: 30px 26px; box-shadow: var(--sh-card); text-align: center; border: 1px solid rgba(34, 55, 71, 0.05); transition: transform 0.2s;}
.feat-card:hover {transform: translateY(-6px);}
.feat-ico {width: 64px; height: 64px; border-radius: 18px; margin: 0px auto 18px; display: grid; place-items: center; background: rgba(77, 101, 112, 0.12);}
.feat-ico svg {width: 32px; height: 32px; stroke: var(--teal-deep);}
.feat-card h3 {font-size: 20px; font-weight: 600; margin-bottom: 9px;}
.feat-card p {color: var(--muted); font-size: 15.5px;}
.feat-close {text-align: center; margin-top: 40px;}
.feat-close .big {font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: clamp(22px, 3vw, 30px); margin-bottom: 26px;}
.benefit-block {background: linear-gradient(155deg, var(--navy) 0%, var(--navy-deep) 100%); border-radius: var(--r-lg); padding: clamp(36px, 5vw, 68px); color: rgb(255, 255, 255); box-shadow: var(--sh-lg); position: relative; overflow: hidden; text-align: center;}
.benefit-block::before {content: ""; position: absolute; width: 360px; height: 360px; border-radius: 50%; background: radial-gradient(circle, rgba(184, 137, 50, 0.16), transparent 70%); top: -120px; right: -90px;}
.benefit-block::after {content: ""; position: absolute; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, rgba(161, 43, 36, 0.12), transparent 70%); bottom: -130px; left: -80px;}
.benefit-block h2 {color: rgb(255, 255, 255); font-size: clamp(24px, 3.2vw, 38px); font-weight: 600; max-width: 24ch; margin: 0px auto; position: relative;}
.benefit-block .blist {list-style: none; padding: 0px; margin: 34px auto 40px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px 38px; max-width: 880px; position: relative; text-align: left;}
.benefit-block .blist li {display: flex; gap: 14px; align-items: flex-start; font-size: 17.5px; font-weight: 600; background: rgba(255, 255, 255, 0.06); padding: 16px 20px; border-radius: var(--r-sm);}
.benefit-block .blist li:last-child:nth-child(2n+1) {grid-column: 1 / -1; max-width: 56%; margin: 0px auto;}
.benefit-block .check {background: var(--green); box-shadow: 0 4px 10px -3px var(--green-glow);}
.benefit-block .check svg {stroke: rgb(255, 255, 255);}
.urgency {background: linear-gradient(120deg, var(--coral-deep) 0%, var(--coral) 100%); color: rgb(255, 255, 255); text-align: center; padding: 60px 0px; box-shadow: var(--sh); position: relative; overflow: hidden;}
.urgency::after {content: ""; position: absolute; inset: 0px; background: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.05) 0px, rgba(255, 255, 255, 0.05) 22px, transparent 22px, transparent 44px); pointer-events: none;}
.urgency .wrap {position: relative; z-index: 1;}
.urgency h2 {color: rgb(255, 255, 255); font-size: clamp(24px, 3.6vw, 40px); font-weight: 600; max-width: 20ch; margin: 0px auto 14px; position: relative;}
.urgency p {font-size: 18px; opacity: 0.95; margin-bottom: 30px; position: relative;}
.urgency .btn {background: rgb(255, 255, 255); color: var(--coral); position: relative;}
.urgency .btn:hover {background: var(--navy); color: rgb(255, 255, 255);}
.whom-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;}
.whom-card {background: var(--paper); border-radius: var(--r); padding: 28px 26px; box-shadow: var(--sh-card); border: 1px solid rgba(34, 55, 71, 0.05); transition: transform 0.2s, box-shadow 0.2s; position: relative;}
.whom-card:hover {transform: translateY(-6px); box-shadow: var(--sh-lg);}
.whom-card .check {width: 34px; height: 34px; margin-bottom: 16px;}
.whom-card .check svg {width: 18px; height: 18px;}
.whom-card h3 {font-size: 18.5px; font-weight: 600; margin-bottom: 9px; line-height: 1.25;}
.whom-card p {color: var(--muted); font-size: 15.5px;}
.receive-card {background: var(--paper); border-radius: var(--r-lg); padding: clamp(30px, 4vw, 56px); box-shadow: var(--sh-lg); display: flex; flex-direction: column; align-items: center; text-align: center; border: 1px solid rgba(34, 55, 71, 0.05); position: relative; overflow: hidden; max-width: 860px; margin: 0px auto;}
.receive-card .art {position: relative; width: 100%; max-width: 480px; margin-bottom: 8px;}
.receive-card .art img {margin: 0px auto; filter: drop-shadow(rgba(34, 55, 71, 0.26) 0px 24px 40px);}
.flash-badge {display: inline-flex; align-items: center; gap: 7px; background: var(--green); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 600; font-size: 14px; padding: 8px 16px; border-radius: var(--pill); box-shadow: 0 10px 22px -10px var(--green-glow); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 22px;}
.receive-card .sub {color: var(--navy); font-family: var(--font-display); font-weight: 600; margin: 4px 0px 6px; font-size: clamp(19px, 2.4vw, 24px);}
.receive-card .txt {color: var(--muted); margin-bottom: 30px;}
.recv-list {list-style: none; padding: 0px; margin: 0px auto; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 30px; text-align: left; max-width: 720px;}
.recv-list li {display: flex; gap: 12px; align-items: flex-start; font-weight: 600; color: var(--navy); font-size: 16px;}
.recv-list li:last-child:nth-child(2n+1) {grid-column: 1 / -1;}
.recv-list .check {width: 24px; height: 24px;}
.recv-list .check svg {width: 13px; height: 13px;}
.bonus-tease {text-align: center; margin-bottom: 14px;}
.bonus-tease .t1 {font-family: var(--font-display); font-weight: 600; color: var(--coral); letter-spacing: 0.12em; font-size: 16px;}
.bonus-tease .t2 {font-family: var(--font-display); font-weight: 700; color: var(--navy); font-size: clamp(30px, 4.5vw, 52px); line-height: 1; margin: 4px 0px 10px;}
.bonus-tease .t3 {color: var(--muted); font-size: 18px;}
.bonus-flag {display: inline-flex; align-items: center; gap: 8px; margin: 18px auto 44px; background: linear-gradient(120deg, var(--coral-deep), var(--coral)); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 600; font-size: 17px; padding: 12px 26px; border-radius: var(--pill); box-shadow: var(--sh);}
.bonus-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px;}
.bonus-card {background: var(--paper); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-card); border: 0px; position: relative; display: flex; flex-direction: column; transition: transform 0.22s, box-shadow 0.22s;}
.bonus-card::after {content: ""; position: absolute; inset: 6px; pointer-events: none; z-index: 6; border: 2.6px dashed rgba(31, 167, 92, 0.82); border-radius: calc(var(--r-lg) - 6px);}
.bonus-card:hover {transform: translateY(-8px); box-shadow: var(--sh-lg);}
.bonus-card .top {background: linear-gradient(180deg, #FFF8EA, var(--paper-soft)); padding: 24px 22px 6px; text-align: center; position: relative; display: flex; flex-direction: column; align-items: center;}
.bonus-num {background: var(--red); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 600; font-size: 13px; padding: 7px 18px; border-radius: var(--pill); letter-spacing: 0.05em; margin-bottom: 16px; box-shadow: rgba(158, 36, 31, 0.65) 0px 10px 20px -10px; position: relative; z-index: 2;}
.bonus-card .top img {margin: 0px auto; filter: drop-shadow(rgba(34, 55, 71, 0.24) 0px 16px 26px); max-height: 230px; width: auto;}
.bonus-card .body {padding: 24px 24px 26px; display: flex; flex-direction: column; flex: 1 1 0%;}
.bonus-card h3 {font-size: 20px; font-weight: 600; margin-bottom: 10px; line-height: 1.2;}
.bonus-card .desc {color: var(--muted); font-size: 15px; margin-bottom: 16px;}
.bonus-card ul {list-style: none; padding: 0px; margin: 0px 0px 20px; display: grid; gap: 9px;}
.bonus-card ul li {display: flex; gap: 10px; align-items: flex-start; font-size: 15px; font-weight: 600; color: var(--navy);}
.bonus-card ul .check {width: 22px; height: 22px;}
.bonus-card ul .check svg {width: 12px; height: 12px;}
.value-tag {margin-top: auto; display: flex; align-items: center; justify-content: center; gap: 10px; background: rgba(31, 167, 92, 0.1); border: 1.5px dashed var(--green); border-radius: var(--r-sm); padding: 12px; font-family: var(--font-display); font-weight: 600;}
.value-tag .strike {color: var(--muted); text-decoration: line-through; font-size: 16px;}
.value-tag .free {color: var(--green-deep); font-size: 19px;}
.urg-badge {display: inline-flex; align-items: center; gap: 8px; background: var(--red); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 600; font-size: 15px; padding: 10px 22px; border-radius: var(--pill); box-shadow: rgba(158, 36, 31, 0.5) 0px 10px 22px -10px; letter-spacing: 0.03em; animation: 2s ease-in-out 0s infinite normal none running blink;}
@keyframes blink { 
  0%, 100% { opacity: 1; }
  50% { opacity: 0.75; }
}
.plans-grid {display: grid; grid-template-columns: 1fr 1.18fr; gap: 30px; align-items: start; max-width: 980px; margin: 0px auto;}
.plan {background: var(--paper); border-radius: var(--r-lg); padding: 38px 34px; box-shadow: var(--sh-card); border: 1.5px solid rgba(34, 55, 71, 0.08); display: flex; flex-direction: column; position: relative; text-align: center;}
.plan h3 {font-family: var(--font-display); font-weight: 600; font-size: 22px; text-transform: uppercase; letter-spacing: 0.03em; text-align: center;}
.plan .plan-sub {color: var(--muted); font-weight: 600; font-size: 14px; margin: 4px 0px 16px; text-transform: uppercase; letter-spacing: 0.08em;}
.plan .art {text-align: center; margin: 8px 0px 16px;}
.plan .art img {max-height: 225px; width: auto; margin: 0px auto; filter: drop-shadow(rgba(34, 55, 71, 0.2) 0px 16px 26px);}
.plan ul {list-style: none; padding: 0px; margin: 0px 0px 22px; display: grid; gap: 10px; align-content: start; text-align: left;}
.plan ul li {display: flex; gap: 11px; align-items: flex-start; font-size: 15.5px; font-weight: 600; color: var(--navy); text-align: left;}
.plan ul .check {width: 22px; height: 22px;}
.plan ul .check svg {width: 12px; height: 12px;}
.price-old {color: var(--muted); font-size: 15px; text-align: center;}
.price-old s {color: var(--coral);}
.price-now {font-family: var(--font-display); font-weight: 700; color: var(--green); font-size: clamp(42px, 6vw, 60px); line-height: 1; margin: 4px 0px; text-align: center;}
.price-inst {color: var(--muted); font-size: 15px; margin-bottom: 8px; text-align: center;}
.save-chip {display: inline-flex; align-self: center; background: rgba(31, 167, 92, 0.12); color: var(--green-deep); font-family: var(--font-display); font-weight: 600; padding: 7px 16px; border-radius: var(--pill); font-size: 14px; margin-bottom: 22px;}
.plan--feature {border: 2.5px solid var(--green); background: linear-gradient(rgb(255, 255, 255) 0%, rgb(243, 251, 246) 100%); box-shadow: rgba(31, 167, 92, 0.5) 0px 36px 70px -24px; transform: scale(1.04); z-index: 3; padding-top: 46px;}
.plan--feature::before {content: "⚡ MAIS VENDIDO"; position: absolute; top: -18px; left: 50%; transform: translateX(-50%); background: var(--green); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 700; font-size: 15px; padding: 11px 30px; border-radius: var(--pill); white-space: nowrap; box-shadow: 0 14px 26px -8px var(--green-glow); letter-spacing: 0.04em;}
.plan--feature .mini-urg {display: inline-flex; align-self: center; background: rgba(158, 36, 31, 0.1); color: var(--red-deep); font-family: var(--font-display); font-weight: 600; font-size: 12.5px; padding: 6px 14px; border-radius: var(--pill); margin-bottom: 14px;}
.plan-flag3x {display: flex; align-items: center; justify-content: center; gap: 8px; background: var(--green); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 700; font-size: 17px; padding: 11px 18px; border-radius: var(--pill); margin: 10px 0px 20px; box-shadow: 0 10px 22px -10px var(--green-glow); letter-spacing: 0.02em;}
.plan--feature .art {text-align: center; margin: 6px 0px 18px;}
.plan--feature .art img {max-height: 200px; width: auto; margin: 0px auto; filter: drop-shadow(rgba(34, 55, 71, 0.22) 0px 18px 30px);}
.bonus-line strong {font-weight: 800;}
.bonus-icon {flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: rgba(31, 167, 92, 0.13); color: var(--green); margin-top: -1px;}
.bonus-icon svg {width: 15px; height: 15px; stroke: currentcolor;}
.social-arrow {text-align: center; margin: 30px auto 4px; max-width: 600px;}
.social-arrow .pill {display: inline-flex; align-items: center; gap: 10px; background: var(--navy); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 500; font-size: 16px; padding: 12px 26px; border-radius: var(--pill); box-shadow: var(--sh);}
.social-arrow .pill b {color: var(--gold); flex: 0 0 auto; white-space: nowrap;}
.social-arrow .pill .copy {min-width: 0px; text-align: left; line-height: 1.2;}
.social-arrow .down {display: block; margin: 10px auto 0px; width: 30px; height: 30px; color: var(--green); animation: 1.6s ease-in-out 0s infinite normal none running bob;}
.plan > .social-arrow {margin: 18px 0px 0px; max-width: none; display: flex; align-items: center; justify-content: center; gap: 10px;}
.plan > .social-arrow .pill {flex: 1 1 auto; justify-content: center; padding: 11px 16px; font-size: 14px; border-radius: 18px;}
.plan > .social-arrow .pill b {font-size: 16px;}
.plan > .social-arrow .down {flex: 0 0 auto; width: 28px; height: 28px; margin: 0px;}
@keyframes bob { 
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(7px); }
}
.pay-seals {display: flex; gap: 10px; align-items: center; justify-content: center; flex-wrap: wrap; margin-top: 18px;}
.pay-seals span {font-family: var(--font-display); font-weight: 600; font-size: 12px; color: var(--muted); background: var(--cream-2); padding: 7px 13px; border-radius: 9px; letter-spacing: 0.02em;}
.pay-seals img {display: block; width: min(100%, 480px); height: auto; margin: 0px auto;}
.plans-close {text-align: center; max-width: 620px; margin: 46px auto 0px;}
.plans-close p {font-family: var(--font-display); font-weight: 500; color: var(--navy); font-size: clamp(19px, 2.4vw, 24px); line-height: 1.35;}
.plans-close p + p {color: var(--muted); font-weight: 400; font-size: 18px; margin-top: 8px;}
.testi-shell {max-width: 760px; margin: 0px auto;}
.testi-viewport {overflow: hidden; border-radius: var(--r-lg);}
.testi-track {display: flex; transition: transform 0.5s cubic-bezier(0.5, 0, 0.2, 1);}
.testi-card {flex: 0 0 100%; padding: 6px;}
.testi-inner {background: var(--paper); border-radius: var(--r-lg); padding: clamp(28px, 4vw, 46px); box-shadow: var(--sh-card); text-align: center; border: 1px solid rgba(34, 55, 71, 0.05);}
.stars {display: flex; gap: 5px; justify-content: center; margin-bottom: 20px; color: var(--gold);}
.stars svg {width: 24px; height: 24px;}
.testi-quote {font-size: clamp(18px, 2.4vw, 23px); color: var(--navy); font-weight: 600; line-height: 1.5; margin-bottom: 22px;}
.testi-author {font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: 18px;}
.testi-role {color: var(--muted); font-size: 15px;}
.testi-ctrl {display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 26px;}
.dots-nav {display: flex; gap: 9px;}
.dots-nav button {width: 11px; height: 11px; border-radius: 50%; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: rgba(34, 55, 71, 0.2); cursor: pointer; padding: 0px; transition: 0.2s;}
.dots-nav button.on {background: var(--teal); width: 30px; border-radius: 6px;}
.guarantee {display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 50px; align-items: center;}
.seal {display: grid; place-items: center;}
.seal-medal {width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle at 50% 38%, var(--paper) 0 58%, var(--gold) 58% 72%, var(--gold-deep) 72% 100%); display: grid; place-items: center; text-align: center; box-shadow: var(--sh-lg), inset 0 0 0 8px rgba(255,255,255,.5); position: relative;}
.seal-medal::before {content: ""; position: absolute; inset: 14px; border-radius: 50%; border: 3px dashed rgba(255, 255, 255, 0.7);}
.seal-medal .inner {width: 150px; height: 150px; border-radius: 50%; background: var(--navy); color: rgb(255, 255, 255); display: grid; place-items: center; align-content: center; gap: 2px; box-shadow: var(--sh);}
.seal-medal .inner .big {font-family: var(--font-display); font-weight: 700; font-size: 30px; line-height: 0.95; color: var(--gold);}
.seal-medal .inner small {font-family: var(--font-display); font-weight: 600; font-size: 12px; letter-spacing: 0.12em;}
.guarantee h2 {font-size: clamp(24px, 3vw, 34px); font-weight: 600; margin-bottom: 18px;}
.guarantee p {color: var(--ink); margin-bottom: 12px;}
.guarantee .gl {list-style: none; padding: 0px; margin: 8px 0px 16px; display: grid; gap: 8px;}
.guarantee .gl li {padding-left: 22px; position: relative; color: var(--ink);}
.guarantee .gl li::before {content: "•"; position: absolute; left: 4px; color: var(--coral); font-weight: 700;}
.guarantee .emph {font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: 19px; margin: 4px 0px;}
.guarantee .stack {display: flex; gap: 10px; flex-wrap: wrap; margin: 14px 0px;}
.guarantee .stack span {background: var(--cream-2); color: var(--navy); font-family: var(--font-display); font-weight: 600; padding: 8px 18px; border-radius: var(--pill); font-size: 15px;}
.steps-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; counter-reset: step 0;}
.step-card {background: var(--paper); border-radius: var(--r); padding: 30px 26px; box-shadow: var(--sh-card); border: 1px solid rgba(34, 55, 71, 0.05); position: relative;}
.step-num {width: 52px; height: 52px; border-radius: 16px; background: var(--teal); color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 700; font-size: 24px; display: grid; place-items: center; margin-bottom: 18px; box-shadow: rgba(77, 101, 112, 0.5) 0px 8px 18px -6px;}
.step-card h3 {font-size: 19px; font-weight: 600; margin-bottom: 10px;}
.step-card p {color: var(--muted); font-size: 15px; margin-bottom: 8px;}
.step-card ul {list-style: none; padding: 0px; margin: 6px 0px 0px; display: grid; gap: 7px;}
.step-card ul li {display: flex; gap: 9px; align-items: flex-start; font-size: 14.5px; font-weight: 600; color: var(--navy);}
.step-card ul .check {width: 19px; height: 19px;}
.step-card ul .check svg {width: 11px; height: 11px;}
.faq {max-width: 820px; margin: 0px auto; display: grid; gap: 14px;}
.faq-item {background: var(--paper); border-radius: var(--r); box-shadow: var(--sh-sm); border: 1px solid rgba(34, 55, 71, 0.06); overflow: hidden;}
.faq-q {width: 100%; text-align: left; background: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; padding: 22px 26px; display: flex; align-items: center; justify-content: space-between; gap: 18px; font-family: var(--font-display); font-weight: 600; color: var(--navy); font-size: 18px;}
.faq-q .tog {flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; background: var(--cream-2); display: grid; place-items: center; transition: transform 0.3s, background 0.25s;}
.faq-q .tog svg {width: 16px; height: 16px; stroke: var(--teal-deep);}
.faq-item.open .faq-q .tog {transform: rotate(45deg); background: var(--teal);}
.faq-item.open .faq-q .tog svg {stroke: rgb(255, 255, 255);}
.faq-a { max-height: none; overflow: visible; transition: max-height .35s ease; }
.faq-a p {padding: 0px 26px 24px; color: var(--ink); font-size: 16.5px;}
.footer {background: var(--navy-deep); color: rgba(255, 255, 255, 0.7); padding: 52px 0px; text-align: center; font-size: 13.5px; line-height: 1.7;}
.footer .wrap {max-width: 820px;}
.footer p {margin-bottom: 14px;}
.footer .cr {color: rgb(255, 255, 255); font-family: var(--font-display); font-weight: 600; font-size: 16px;}
[data-reveal] { opacity: 1; transform: none; transition: opacity .6s ease, transform .6s cubic-bezier(.2,.7,.3,1); }
[data-reveal].in {opacity: 1; transform: none;}
@media (prefers-reduced-motion: reduce) {
[data-reveal] {opacity: 1; transform: none; transition: none;}
.hero-art img,  .btn-pulse,  .urg-badge,  .social-arrow .down {animation: auto ease 0s 1 normal none running none !important;}
}
@media (max-width: 980px) {
.feat-grid {grid-template-columns: repeat(2, 1fr);}
.whom-grid {grid-template-columns: repeat(2, 1fr);}
.bonus-grid {grid-template-columns: 1fr; max-width: 460px; margin: 0px auto;}
.recv-list {grid-template-columns: 1fr;}
.benefit-block .blist {grid-template-columns: 1fr;}
.benefit-block .blist li:last-child:nth-child(2n+1) {max-width: none;}
.plans-grid {grid-template-columns: 1fr; max-width: 480px;}
.plan--feature {transform: none;}
.plan > .social-arrow {flex-direction: column;}
.plan > .social-arrow .pill {width: 100%;}
.plan > .social-arrow .down {rotate: 90deg;}
.steps-grid {grid-template-columns: repeat(2, 1fr);}
.guarantee {grid-template-columns: 1fr; gap: 30px; text-align: center;}
.seal {margin: 0px auto;}
.guarantee .gl li {text-align: left;}
.guarantee .stack {justify-content: center;}
}
@media (max-width: 620px) {
body {font-size: 17px;}
.sec {padding: 56px 0px;}
.feat-grid,  .whom-grid,  .steps-grid {grid-template-columns: 1fr;}
.btn {width: 100%;}
.offerbar {font-size: 12px; line-height: 1.25; padding: 9px 14px;}
.wrap {padding: 0px 18px;}
.hero {padding: 40px 0px 48px;}
.hero-grid,  .hero-copy,  .hero-art,  .hero h1,  .badge-pill,  .delivery {min-width: 0px; max-width: 100%;}
.badge-pill {justify-content: center; text-align: center; white-space: normal; line-height: 1.25;}
.hero h1 {font-size: 31px; max-width: 18ch; margin: 20px auto 24px; overflow-wrap: normal;}
.hero .lead {font-size: 17px; max-width: 100%;}
.hero-art {max-width: 340px;}
.hero-art img {width: 100%;}
}
@media (max-width: 380px) {
.hero h1 {font-size: 29px;}
.badge-pill {font-size: 14px; padding: 8px 14px;}
}

.offerbar {background: none rgb(217, 30, 54);}
.hero h1 {max-width: 28ch;}
.badge-pill {border-color: rgba(0, 141, 156, 0.25);}
.sec--plans-cream {background: rgb(233, 244, 250);}
.feat-ico {background: rgba(8, 127, 199, 0.1); color: rgb(8, 127, 199);}
.bonus-card .top {background: linear-gradient(180deg,#E9F4FA,var(--paper-soft));}
.copy-intro {margin: 16px 0px 24px; color: inherit; line-height: 1.6;}
.receive-intro {margin: 16px 0px; color: var(--navy); font-weight: 600;}
.receive-detail {margin-top: 16px; color: var(--muted); font-size: 16px;}
.guarantee .responsible-note {margin-top: 24px; padding: 16px; background: rgb(233, 244, 250); border-left: 3px solid rgb(0, 141, 156); border-radius: 8px; font-size: 14px; line-height: 1.6;}
html.reveal-ready [data-reveal]:not(.in) { opacity:0; transform:translateY(26px); }
html.faq-ready .faq-a { max-height:0; overflow:hidden; }
.btn:focus-visible, button:focus-visible { outline:3px solid var(--teal-deep); outline-offset:4px; }
.marquee:focus-within .marquee-track { animation-play-state:paused; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  html.reveal-ready [data-reveal]:not(.in) { opacity:1; transform:none; transition:none; }
  .marquee { overflow-x:auto; mask-image:none; -webkit-mask-image:none; }
  .marquee-track { animation:none !important; transform:none; }
  .marquee-track > [aria-hidden="true"] { display:none; }
  .testi-track, .faq-a, .btn, .navbtn, .dots-nav button { transition:none; }
}