/* Original storefront direction. Presentation only, built on the existing demo. */
:root { --ink:#111a4b; --muted:#58657c; --orange:#ff711c; --orange-dark:#bd4300; --orange-soft:#fff4e9; --purple:#7528d4; --purple-dark:#5f21b4; --purple-soft:#f3eafe; --line:#e7e8ee; --cream:#fffbf6; --shadow:0 12px 44px #502c1010; }
body { background-color:var(--cream); background-image:radial-gradient(circle,transparent 44%,#ffbd7c14 44%,#ffbd7c14 55%,transparent 55%,#ffd2a315 62%,transparent 62%),radial-gradient(circle,transparent 40%,#ffbd7c14 40%,#ffbd7c14 55%,transparent 55%); background-size:430px 430px,490px 490px; background-position:calc(100% + 190px) 220px,-240px 900px; background-repeat:no-repeat; }
.page { position:relative; isolation:isolate; max-width:1096px; padding:26px 28px 24px; }
.page::before,.page::after { content:none; }
.page::before { top:210px; right:-150px; }
.page::after { top:890px; left:-155px; width:310px; height:310px; }
body { overflow-x:clip; }
.site-header { background:#fff; border-bottom:1px solid #eee8e1; box-shadow:none; }
.header-inner { max-width:1200px; min-height:82px; }
.brand { gap:8px; }
.brand strong { color:var(--ink); font-size:1.75rem; font-weight:700; letter-spacing:-.04em; }
.brand svg { width:42px; height:32px; }
.desktop-nav { gap:30px; }
.desktop-nav a { font-weight:500; color:var(--ink); }
.desktop-nav a:hover { color:var(--orange-dark); }
.header-actions>.header-help { border:1px solid #ffe0c7; background:#fff5eb; color:var(--ink); }
.header-help svg { color:var(--orange-dark); }
.icon-button { border-color:var(--line); }
.menu-button { color:var(--purple); background:#faf5ff; }
.intro { display:block; text-align:center; margin:0 0 22px; }
.intro::before { content:none; }
.intro-mark { display:none; }
.intro .eyebrow { color:var(--orange-dark); font-size:.8125rem; letter-spacing:.025em; margin-bottom:0; }
.intro h1 { font-size:2.5rem; line-height:1.5; color:var(--ink); letter-spacing:-.035em; }
.intro h1::after { content:""; display:block; margin:5px auto 10px; width:38px; height:3px; border-radius:2px; background:var(--orange); }
.intro p { color:var(--muted); font-size:.9375rem; }
.order-workspace { padding:27px 30px 28px; border:1px solid #e9e6e2; border-radius:22px; background:#fff; box-shadow:var(--shadow); }
.order-type-block { margin-bottom:22px; padding-bottom:22px; border-bottom:1px solid var(--line); }
.type-heading { font-size:1.125rem; font-weight:700; margin-bottom:12px; }
.order-type { gap:12px; padding:0; border:0; background:transparent; border-radius:0; }
.order-type button { position:relative; justify-content:flex-start; gap:11px; min-height:67px; padding:12px 16px; color:var(--ink); border:1px solid var(--line); border-radius:12px; background:#fff; }
.order-type button[aria-pressed="true"] { border-color:#ff842f; color:var(--ink); background:#fff8f0; box-shadow:inset 0 0 0 .5px #ff842f; }
.order-type button[aria-pressed="true"]::after { content:"✓"; display:flex; align-items:center; justify-content:center; width:20px; height:20px; margin-inline-start:auto; border-radius:50%; background:#e65a00; color:white; font:700 12px Arial,sans-serif; flex:0 0 20px; }
.mode-icon { color:var(--orange-dark); background:var(--orange-soft); border-radius:9px; flex-basis:36px; width:36px; height:36px; }
.order-type button[aria-pressed="true"] .mode-icon { color:var(--orange-dark); }
.mode-copy strong { font-weight:700; }
.mode-copy small,.order-type button[aria-pressed="true"] .mode-copy small { color:var(--muted); font-size:.8125rem; }
#mode-description { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.order-layout { gap:24px; }
.order-panel { gap:22px; }
.order-panel>.section-block+.section-block { padding-top:22px; }
.section-heading { margin-bottom:14px; }
.section-heading h2,.summary-heading h2 { font-size:1.1875rem; font-weight:700; gap:10px; }
.step-number { border:0; color:var(--purple-dark); background:#f1e7ff; width:31px; height:31px; flex-basis:31px; font-size:.9375rem; font-weight:700; }
.section-heading>span,.section-subtitle { color:var(--muted); font-size:.8125rem; }
.platform-grid { gap:10px; }
.platform-button { flex-direction:column; min-height:91px; padding:12px 14px; border-color:var(--line); gap:7px; color:var(--ink); font-weight:600; }
.platform-button[aria-pressed="true"] { color:var(--ink); border-color:#ff842f; background:#fff8f0; box-shadow:inset 0 0 0 .5px #ff842f; }
.platform-button:hover { border-color:#fbb37b; }
.platform-button[aria-pressed="true"] .platform-check { background:#df5900; inset-inline-start:auto; inset-inline-end:8px; top:8px; }
.platform-button .platform-icon,.platform-button[aria-pressed="true"] .platform-icon { flex-basis:30px; width:30px; height:30px; padding:2px; border-radius:8px; background:transparent; }
.platform-icon-instagram,.platform-button .platform-icon-instagram,.platform-button[aria-pressed="true"] .platform-icon-instagram { color:white; background:linear-gradient(145deg,#7c32db 4%,#e82291 48%,#fb7738 75%,#f4bd4a 100%); border-radius:8px; }
.platform-icon-tiktok,.platform-button[aria-pressed="true"] .platform-icon-tiktok { color:#101322; background:transparent; }
.platform-icon-tiktok svg { filter:drop-shadow(1px 1px 0 #ff4467) drop-shadow(-1px -1px 0 #4bd6d3); }
.platform-icon-snapchat,.platform-button .platform-icon-snapchat,.platform-button[aria-pressed="true"] .platform-icon-snapchat { color:#171719; background:#ffed2b; border-radius:8px; }
.platform-icon-x,.platform-button[aria-pressed="true"] .platform-icon-x { color:#121420; background:transparent; }
.plan-grid { gap:14px; }
.plan-card { padding:18px 18px 12px; border-color:#e3e5ec; border-radius:14px; background:white; box-shadow:none; }
.plan-card:hover { border-color:#f6b07c; box-shadow:0 4px 14px #693b0810; }
.plan-card[aria-pressed="true"] { border-color:#f97822; background:linear-gradient(180deg,#fff7ec 0%,#fffcf8 75%); box-shadow:0 0 0 .5px #f97822,0 5px 15px #f68a1a0c; }
.plan-header { flex-wrap:nowrap; gap:8px; align-items:center; }
.plan-name { padding:0; gap:7px; }
.plan-name strong { font-size:1.25rem; font-weight:700; }
.radio-mark { width:19px; height:19px; flex-basis:19px; border-color:#bdc4d2; }
[aria-pressed="true"] .radio-mark { background:#e65a00; border-color:#e65a00; }
.plan-price b { color:var(--orange-dark); font-size:1.875rem; font-weight:700; }
.plan-price small { margin-top:0; color:var(--muted); }
.plan-followers { margin-top:12px; gap:9px; }
.follower-icon { background:#fff0df; color:var(--orange-dark); width:30px; height:30px; flex-basis:30px; border-radius:8px; }
.follower-number { font-size:1.625rem; color:var(--ink); font-weight:700; }
.follower-label { color:var(--ink); font-size:.8125rem; font-weight:500; }
.plan-benefits { grid-template-columns:1fr; gap:10px; padding-top:13px; margin:12px 0; border-color:#ece8e2; }
.plan-benefit { grid-template-columns:18px minmax(0,1fr); gap:8px; }
.benefit-icon { color:var(--purple); margin-top:2px; }
.benefit-likes .benefit-icon { color:#d72f66; }
.plan-benefit strong { font-size:.875rem; font-weight:500; line-height:1.55; }
.benefit-quantity { display:inline; font-size:1rem; color:var(--ink); font-weight:700; }
.benefit-label { display:inline; font-size:.875rem; }
.plan-benefit small { margin-top:0; font-size:.8125rem; line-height:1.5; }
.plan-footer { min-height:31px; padding-top:7px; border-color:#ece8e2; }
.plan-choice { color:var(--muted); font-size:.8125rem; }
.plan-card[aria-pressed="true"] .plan-choice { color:var(--orange-dark); }
.plan-choice-mark { color:var(--orange-dark); }
.optional-pill { background:#f4f2f8; color:#605376; }
.addon-grid { gap:9px 14px; }
.addon-row { border-color:var(--line); padding:12px; gap:9px; border-radius:11px; }
.addon-row.is-selected { border-color:#ef9b5b; background:#fff8ef; }
.addon-row>input { accent-color:var(--purple); }
.addon-icon { color:var(--purple); flex-basis:25px; width:25px; }
.addon-row[for="addon-likes"] .addon-icon { color:#d72f66; }
.addon-price b { color:var(--orange-dark); font-weight:700; }
.addon-copy strong { font-weight:600; }
.addon-price small,.addon-copy small { color:var(--muted); }
.order-summary { border:0; border-top:1px solid var(--line); padding:24px 0 0; border-radius:0; box-shadow:none; background:transparent; }
.summary-heading { border:0; padding-bottom:0; margin-bottom:16px; }
.summary-heading .section-subtitle { margin-inline-start:41px; }
.summary-platform { color:var(--ink); }
.summary-grand { border-color:var(--line); }
.order-summary .summary-grand { background:#fff5e8; border:1px solid #ffe1c2; border-radius:11px; padding:12px 16px; }
.summary-grand strong,.summary-price,.purchase-total>strong { color:var(--orange-dark); font-weight:700; }
.summary-title { font-weight:700; }
.summary-addon { color:var(--muted); }
.summary-actions { margin-top:14px; }
.primary-button { background:#cf4800; color:white; border-radius:10px; font-weight:600; box-shadow:0 4px 12px #ec620019; }
.primary-button:hover { background:#bd4200; box-shadow:0 5px 15px #ec62002a; }
.primary-button:active { background:#a73c00; }
.service-button { border-color:var(--line); }
.service-button[aria-pressed="true"] { border-color:#ff842f; background:#fff8f0; box-shadow:inset 0 0 0 .5px #ff842f; }
.service-icon { background:#fff3e8; color:var(--orange-dark); }
[data-service="likes"] .service-icon { color:#d72f66; background:#fff0f5; }
[data-service="comments"] .service-icon { color:var(--purple); background:#f5effe; }
.preset-card { position:relative; border-color:#e3e5ec; }
.preset-card[aria-pressed="true"] { border-color:#f97822; background:#fff8ef; box-shadow:inset 0 0 0 .5px #f97822; }
.preset-price,.custom-price { color:var(--orange-dark); font-weight:700; }
.preset-card[aria-pressed="true"] .preset-check { display:flex; position:absolute; left:6px; top:6px; align-items:center; justify-content:center; width:15px; height:15px; border-radius:50%; font:10px Arial,sans-serif; background:#e65a00; color:white; }
.preset-quantity { font-weight:700; }
.custom-quantity { margin-top:16px; border:1px solid #e9dfd3; border-radius:12px; background:#fffcf8; transition:border-color .15s,background .15s; }
.custom-quantity:hover { border-color:#e9b78e; }
.custom-quantity>summary { color:var(--ink); justify-content:flex-start; gap:12px; min-height:76px; padding:14px 16px; border-radius:12px; }
.custom-trigger-icon { display:flex; align-items:center; justify-content:center; flex:0 0 38px; width:38px; height:38px; border-radius:10px; background:#fff0df; color:var(--orange-dark); }
.custom-trigger-icon svg { width:23px; height:23px; }
.custom-trigger-copy { display:block; min-width:0; }
.custom-trigger-copy strong { display:block; font-size:.9375rem; font-weight:600; line-height:1.6; }
.custom-trigger-copy small { display:block; margin-top:2px; font-size:.8125rem; line-height:1.6; font-weight:400; color:var(--muted); }
.custom-quantity .details-arrow { display:flex; flex:0 0 29px; align-items:center; justify-content:center; width:29px; height:29px; margin-inline-start:auto; border:1px solid #eadbcc; background:white; color:var(--orange-dark); border-radius:50%; transition:transform .15s; }
.custom-quantity .details-arrow svg { width:18px; height:18px; }
.custom-quantity[open] { border-color:#f6a970; background:white; }
.custom-quantity[open]>summary { background:#fff8ef; border-radius:12px 12px 0 0; border-bottom:1px solid #f0e4d8; }
.custom-quantity .custom-content { padding:18px 16px; }
input[type="range"] { accent-color:#cf4800; }
.checkout-summary,#success-summary { background:#fff8ef; border-color:#f0dfce; }
.dialog-top { background:#fffcf8; }
.dialog-top h2 { font-weight:700; }
.mobile-menu { border-color:#eee0d3; box-shadow:0 18px 48px #34251320; }
.purchase-bar { border-top-color:#eadbcb; box-shadow:0 -5px 25px #422b0d0d; }
@media (min-width:701px) and (max-width:1000px) {
 .plan-card { display:flex; }
 .plan-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
 .plan-card { padding:14px 12px 10px; }
 .plan-header { flex-wrap:wrap; }
 .plan-price b { font-size:1.625rem; }
 .plan-name strong { font-size:1.125rem; }
 .plan-benefits { margin:12px 0; padding-top:11px; border-top:1px solid #ece8e2; align-self:stretch; }
 .plan-footer { margin-top:auto; }
 .follower-copy { gap:0 5px; }
 .plan-followers { gap:6px; }
 .follower-icon { display:none; }
}
@media (max-width:700px) {
 .page { --page-gutter:12px; padding:16px 12px 18px; }
 .page::before { width:150px; height:150px; border-width:22px; right:-115px; top:180px; }
 .page::after { width:190px; height:190px; border-width:26px; left:-155px; top:1000px; }
 .header-inner { min-height:67px; padding:9px 16px; }
 .brand strong { font-size:1.75rem; }
 .brand svg { width:42px; height:32px; }
 .header-actions { gap:8px; }
 .header-actions>a { padding:7px 10px; }
 .intro { margin-bottom:16px; }
 .intro .eyebrow { font-size:.75rem; }
 .intro h1 { font-size:1.875rem; line-height:1.45; }
 .intro h1::after { margin:5px auto 8px; width:30px; }
 .intro p { font-size:.8125rem; line-height:1.65; }
 .order-workspace { padding:16px 14px 18px; border-radius:17px; }
 .type-heading { font-size:1.0625rem; margin-bottom:10px; }
 .order-type-block { margin-bottom:17px; padding-bottom:17px; }
 .order-type { gap:8px; }
 .order-type button { gap:7px; min-height:61px; padding:9px 10px; border-radius:10px; }
 .mode-icon { display:none; }
 .mode-copy strong { font-size:.875rem; }
 .mode-copy small { font-size:.75rem; }
 .order-type button[aria-pressed="true"]::after { width:16px; height:16px; flex-basis:16px; font-size:10px; }
 .section-heading { margin-bottom:12px; gap:5px; }
 .section-heading h2,.summary-heading h2 { font-size:1.0625rem; gap:8px; }
 .step-number { width:27px; height:27px; flex-basis:27px; font-size:.8125rem; }
 .section-heading>span { font-size:.75rem; }
 .order-panel { gap:18px; }
 .order-panel>.section-block+.section-block { padding-top:18px; }
 .platform-grid { gap:7px; }
 .platform-button { flex-direction:column; min-height:70px; gap:4px; padding:9px 2px 7px; font-size:.75rem; }
 .platform-button .platform-icon { width:25px; height:25px; flex-basis:25px; }
 .platform-button[aria-pressed="true"] .platform-check { inset-inline-end:3px; top:3px; width:12px; height:12px; font-size:8px; }
 .plan-grid { gap:10px; }
 .plan-card { padding:12px 14px 11px; }
 .plan-name strong { font-size:1.125rem; }
 .plan-price b { font-size:1.625rem; }
 .plan-price small { font-size:.75rem; }
 .plan-followers { margin-top:7px; gap:8px; }
 .follower-number { font-size:1.5rem; }
 .follower-icon { width:27px; height:27px; flex-basis:27px; }
 .follower-icon svg { width:18px; height:18px; }
 .follower-label { font-size:.8125rem; }
 .plan-benefits { gap:6px; margin:8px 0 0; padding-top:9px; }
 .plan-benefit { grid-template-columns:17px minmax(0,1fr); gap:7px; }
 .benefit-copy { display:flex; flex-wrap:wrap; align-items:baseline; gap:0 8px; }
 .plan-benefit small { margin-inline-start:auto; font-size:.75rem; }
 .plan-benefit strong,.benefit-label { font-size:.8125rem; }
 .benefit-quantity { font-size:.9375rem; }
 .benefit-icon { display:flex; width:17px; }
 .plan-footer { display:none; }
 .fine-print { font-size:.75rem; }
 .addons-section .section-subtitle { font-size:.8125rem; }
 .addon-grid { gap:8px; }
 .addon-row { padding:10px 9px; gap:7px; }
 .addon-row>input { flex-basis:18px; width:18px; height:18px; }
 .addon-icon { display:none; }
 .addon-copy strong { font-size:.8125rem; }
 .addon-copy small { font-size:.75rem; margin-top:1px; }
 .addon-price b { font-size:1rem; }
 .addon-price small { font-size:.6875rem; }
 .order-layout { gap:21px; }
 .order-summary { padding:20px 0 0; }
 .summary-heading .section-subtitle { margin-inline-start:35px; font-size:.8125rem; }
 .summary-platform { margin-bottom:12px; }
 .order-summary .summary-grand { padding:9px 12px; }
 .summary-grand strong { font-size:1.75rem; }
 .summary-actions>.fine-print { font-size:.75rem; }
 .purchase-bar { padding-inline:14px; }
 .purchase-total>strong { font-size:1.625rem; }
 .purchase-inner>.primary-button { min-height:48px; font-weight:700; }
 .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .service-button { gap:6px; padding:9px 7px; }
 .service-icon { width:27px; height:27px; flex-basis:27px; }
 .service-name { font-size:.8125rem; }
 .preset-card { padding:13px 8px 10px; }
 .preset-quantity { font-size:1.25rem; }
 .preset-price { font-size:1.25rem; }
 .custom-value-row>.stepper { flex:0 1 auto; }
 .custom-quantity>summary { min-height:72px; gap:9px; padding:12px; }
 .custom-trigger-icon { flex-basis:32px; width:32px; height:32px; border-radius:8px; }
 .custom-trigger-icon svg { width:20px; height:20px; }
 .custom-trigger-copy strong { font-size:.875rem; }
 .custom-trigger-copy small { font-size:.75rem; }
 .custom-quantity .details-arrow { flex-basis:26px; width:26px; height:26px; }
 .custom-quantity .custom-content { padding:15px 12px; }
 .custom-price { font-size:1.375rem; }
 .custom-price-block>span { font-size:.6875rem; }
 .stepper input { width:62px; }
 .stepper button { flex-basis:36px; width:36px; }
}
@media (max-width:370px) {
 .page { padding-inline:8px; }
 .order-workspace { padding-inline:11px; }
 .platform-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
 .platform-button { flex-direction:column; font-size:.6875rem; }
 .plan-card { padding-inline:11px; }
 .plan-name strong { font-size:1.0625rem; }
 .mode-copy strong { font-size:.8125rem; }
 .order-type button { padding-inline:8px; }
 .order-type button[aria-pressed="true"]::after { display:none; }
 .benefit-copy { gap:0 6px; }
 .preset-quantity,.preset-price { font-size:1.125rem; }
}
@media print { .page::before,.page::after { display:none; } .order-workspace { box-shadow:none; } }