:root { --checkout-max-width: 1180px; --premium-navy: #081f4f; --premium-blue: #0d4fd6; --premium-cyan: #6ee0ff; --premium-mist: rgba(255, 255, 255, 0.66); --premium-line: rgba(13, 79, 214, 0.14); --premium-shadow: 0 40px 120px rgba(8, 31, 79, 0.18); } body:is(.test1-checkout-page, .test1-cart-page) { min-width: 320px; } :is(.test1-checkout-page, .test1-cart-page) { position: relative; } :is(.test1-checkout-page, .test1-cart-page)::after { content: ""; position: fixed; inset: 0; pointer-events: none; background: radial-gradient(circle at 18% 12%, rgba(110, 224, 255, 0.12), transparent 24%), radial-gradient(circle at 84% 18%, rgba(13, 79, 214, 0.14), transparent 22%), linear-gradient(180deg, rgba(255, 255, 255, 0.1), transparent 55%); opacity: 0.9; } .premium-topline { position: relative; z-index: 3; border-bottom: 1px solid rgba(255, 255, 255, 0.24); background: linear-gradient(90deg, rgba(8, 31, 79, 0.96), rgba(10, 43, 109, 0.84)); color: rgba(255, 255, 255, 0.92); } .premium-topline-inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 42px; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 800; } :is(.test1-checkout-page, .test1-cart-page) .checkout-shell { position: relative; display: grid; gap: 28px; align-items: start; z-index: 1; } :is(.test1-checkout-page, .test1-cart-page) .checkout-intro { max-width: 780px; } :is(.test1-checkout-page, .test1-cart-page) .checkout-card { padding: clamp(22px, 3vw, 36px); } :is(.test1-checkout-page, .test1-cart-page) .checkout-back-link { white-space: nowrap; } .premium-stage { position: relative; padding: clamp(18px, 2vw, 28px); border-radius: 36px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.16)); border: 1px solid rgba(255, 255, 255, 0.5); box-shadow: var(--premium-shadow); overflow: hidden; isolation: isolate; } .premium-stage::before { content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(135deg, rgba(255, 255, 255, 0.24), transparent 24%), linear-gradient(180deg, rgba(255, 255, 255, 0.16), transparent 68%); opacity: 0.8; pointer-events: none; } .premium-orb { position: absolute; border-radius: 50%; filter: blur(6px); pointer-events: none; opacity: 0.9; } .premium-orb-one { top: -64px; right: -40px; width: 220px; height: 220px; background: radial-gradient(circle, rgba(110, 224, 255, 0.38), transparent 70%); } .premium-orb-two { bottom: -80px; left: -30px; width: 260px; height: 260px; background: radial-gradient(circle, rgba(13, 79, 214, 0.22), transparent 70%); } .premium-kicker { display: inline-flex; align-items: center; gap: 10px; margin-top: 18px; padding: 8px 14px; border-radius: 999px; background: rgba(8, 31, 79, 0.08); color: var(--premium-navy); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 800; } .premium-kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, var(--premium-cyan), var(--premium-blue)); box-shadow: 0 0 0 6px rgba(110, 224, 255, 0.12); } .premium-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 26px; } .premium-metric { padding: 18px 18px 16px; border-radius: 22px; background: rgba(255, 255, 255, 0.68); border: 1px solid rgba(255, 255, 255, 0.72); box-shadow: 0 18px 44px rgba(8, 31, 79, 0.1); } .premium-metric strong { display: block; margin-bottom: 6px; font-size: 22px; line-height: 1; color: var(--premium-navy); } .premium-metric span { display: block; color: var(--muted); line-height: 1.55; } .premium-note-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 24px; } .premium-note-card { padding: 18px 18px 20px; border-radius: 22px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.56)); border: 1px solid rgba(255, 255, 255, 0.76); box-shadow: 0 18px 50px rgba(8, 31, 79, 0.1); } .premium-note-card span { display: inline-block; margin-bottom: 8px; color: var(--premium-blue); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 800; } .premium-note-card strong { display: block; color: var(--premium-navy); line-height: 1.5; } .premium-stack { display: grid; gap: 20px; } .premium-aside, .premium-form-card { position: relative; overflow: hidden; } .premium-aside::before, .premium-form-card::before, .premium-footer-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(145deg, rgba(255, 255, 255, 0.22), transparent 34%); pointer-events: none; } .premium-aside { padding: 26px; border-radius: 30px; } .premium-aside-head h2 { margin: 16px 0 0; font-size: clamp(28px, 3vw, 38px); line-height: 1.02; letter-spacing: -0.04em; color: var(--premium-navy); } .premium-timeline { display: grid; gap: 14px; margin-top: 24px; } .premium-timeline-item { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; padding: 16px 18px; border-radius: 20px; background: rgba(255, 255, 255, 0.68); border: 1px solid rgba(13, 79, 214, 0.08); } .premium-timeline-item strong { min-width: 44px; height: 44px; display: grid; place-items: center; border-radius: 14px; background: linear-gradient(145deg, rgba(8, 31, 79, 0.96), rgba(13, 79, 214, 0.92)); color: #fff; font-size: 13px; letter-spacing: 0.08em; } .premium-timeline-item span { display: block; padding-top: 6px; color: var(--text); line-height: 1.6; } .premium-badge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 18px; } .premium-badge-card { padding: 18px; border-radius: 20px; background: linear-gradient(160deg, rgba(8, 31, 79, 0.88), rgba(13, 79, 214, 0.78)); color: #fff; box-shadow: 0 24px 60px rgba(8, 31, 79, 0.18); } .premium-badge-card span { display: block; margin-bottom: 8px; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.72); } .premium-badge-card strong { display: block; line-height: 1.45; } .premium-form-card { border-radius: 30px; box-shadow: 0 34px 100px rgba(8, 31, 79, 0.16); } :is(.test1-checkout-page, .test1-cart-page) .entry-content, :is(.test1-checkout-page, .test1-cart-page) .woocommerce, :is(.test1-checkout-page, .test1-cart-page) .wc-block-checkout, :is(.test1-checkout-page, .test1-cart-page) .wc-block-cart, :is(.test1-checkout-page, .test1-cart-page) .is-large { position: relative; z-index: 1; max-width: 100%; } :is(.test1-checkout-page, .test1-cart-page) .woocommerce { color: var(--text); } :is(.test1-checkout-page, .test1-cart-page) .woocommerce a, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-text-input input, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-combobox .components-combobox-control__input, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-textarea, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-text-input label, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-checkbox label { color: var(--text); } :is(.test1-checkout-page, .test1-cart-page) .woocommerce form .form-row input.input-text, :is(.test1-checkout-page, .test1-cart-page) .woocommerce form .form-row textarea, :is(.test1-checkout-page, .test1-cart-page) .woocommerce form .form-row select, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-text-input input, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-text-input select, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-textarea textarea, :is(.test1-checkout-page, .test1-cart-page) .components-text-control__input, :is(.test1-checkout-page, .test1-cart-page) .components-form-token-field__input, :is(.test1-checkout-page, .test1-cart-page) .components-combobox-control__input, :is(.test1-checkout-page, .test1-cart-page) .coupon #coupon_code { min-height: 58px; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--premium-line); background: rgba(255, 255, 255, 0.92); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45); } :is(.test1-checkout-page, .test1-cart-page) .woocommerce form .form-row textarea, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-textarea textarea { min-height: 120px; } :is(.test1-checkout-page, .test1-cart-page) .woocommerce-checkout #payment, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-billing-fields, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-additional-fields, :is(.test1-checkout-page, .test1-cart-page) #order_review, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-sidebar, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-totals-wrapper, :is(.test1-checkout-page, .test1-cart-page) .wc-block-checkout__main, :is(.test1-checkout-page, .test1-cart-page) .wc-block-checkout__sidebar, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-checkout-step, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-order-summary, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-totals-coupon, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-shipping-rates-control, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-address-form, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-cart-form, :is(.test1-checkout-page, .test1-cart-page) .cart_totals, :is(.test1-checkout-page, .test1-cart-page) .cart-collaterals { border-radius: 26px; border: 1px solid rgba(255, 255, 255, 0.78); background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.64)); box-shadow: 0 30px 90px rgba(8, 31, 79, 0.12); } :is(.test1-checkout-page, .test1-cart-page) .woocommerce-checkout #payment, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-billing-fields, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-additional-fields, :is(.test1-checkout-page, .test1-cart-page) #order_review, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-cart-form, :is(.test1-checkout-page, .test1-cart-page) .cart_totals, :is(.test1-checkout-page, .test1-cart-page) .cart-collaterals { padding: 24px; } :is(.test1-checkout-page, .test1-cart-page) .woocommerce form .form-row { margin-bottom: 16px; } :is(.test1-checkout-page, .test1-cart-page) .woocommerce form .form-row label, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-text-input label, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-checkbox label, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-radio-control__option-label { font-weight: 700; color: var(--text); } :is(.test1-checkout-page, .test1-cart-page) .woocommerce button.button, :is(.test1-checkout-page, .test1-cart-page) .woocommerce #payment #place_order, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-button, :is(.test1-checkout-page, .test1-cart-page) .wc-block-cart__submit-button, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-checkout-place-order-button, :is(.test1-checkout-page, .test1-cart-page) .checkout-button, :is(.test1-checkout-page, .test1-cart-page) .actions .button, :is(.test1-checkout-page, .test1-cart-page) .coupon .button { min-height: 56px; padding: 16px 22px; border: 0; border-radius: 999px; color: #fff; background: linear-gradient(135deg, var(--premium-navy), var(--premium-blue)); box-shadow: 0 18px 34px rgba(13, 79, 214, 0.24); font-weight: 800; } :is(.test1-checkout-page, .test1-cart-page) .woocommerce button.button:hover, :is(.test1-checkout-page, .test1-cart-page) .woocommerce #payment #place_order:hover, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-button:hover, :is(.test1-checkout-page, .test1-cart-page) .wc-block-cart__submit-button:hover, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-checkout-place-order-button:hover, :is(.test1-checkout-page, .test1-cart-page) .checkout-button:hover, :is(.test1-checkout-page, .test1-cart-page) .actions .button:hover, :is(.test1-checkout-page, .test1-cart-page) .coupon .button:hover { transform: translateY(-1px); filter: brightness(1.03); } :is(.test1-checkout-page, .test1-cart-page) table.shop_table, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-order-summary-item, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-product-name { color: var(--text); } :is(.test1-checkout-page, .test1-cart-page) table.shop_table { overflow: hidden; border-radius: 18px; border-collapse: separate; border-spacing: 0; } :is(.test1-checkout-page, .test1-cart-page) table.shop_table td, :is(.test1-checkout-page, .test1-cart-page) table.shop_table th, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-checkout-review-order-table th, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-checkout-review-order-table td { border-color: rgba(18, 48, 89, 0.1); } :is(.test1-checkout-page, .test1-cart-page) .shop_table thead th { font-weight: 800; } :is(.test1-checkout-page, .test1-cart-page) .cart_item img { border-radius: 16px; } :is(.test1-checkout-page, .test1-cart-page) .product-remove a.remove { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: rgba(213, 59, 92, 0.08); color: #d53b5c !important; } :is(.test1-checkout-page, .test1-cart-page) .woocommerce-info, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-message, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-error, :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-notice-banner { border-radius: 18px; border: 1px solid rgba(18, 48, 89, 0.1); background: rgba(255, 255, 255, 0.84); color: var(--text); } :is(.test1-checkout-page, .test1-cart-page) .select2-container--default .select2-selection--single, :is(.test1-checkout-page, .test1-cart-page) .select2-container--default .select2-selection--multiple { min-height: 56px; border-radius: 18px; border: 1px solid rgba(18, 48, 89, 0.14); background: rgba(255, 255, 255, 0.9); } :is(.test1-checkout-page, .test1-cart-page) .woocommerce-checkout-review-order-table, :is(.test1-checkout-page, .test1-cart-page) #add_payment_method #payment div.payment_box, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-cart #payment div.payment_box, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-checkout #payment div.payment_box { background: rgba(219, 246, 255, 0.45); border-radius: 18px; } :is(.test1-checkout-page, .test1-cart-page) .coupon { display: flex; flex-wrap: wrap; gap: 12px; } :is(.test1-checkout-page, .test1-cart-page) .cart-collaterals { margin-top: 24px; } :is(.test1-checkout-page, .test1-cart-page) .cart_totals { float: none; width: 100%; } :is(.test1-checkout-page, .test1-cart-page) .wc-proceed-to-checkout { margin-bottom: 0; padding-bottom: 0; } :is(.test1-checkout-page, .test1-cart-page) .wc-block-components-sidebar-layout { gap: 24px; } :is(.test1-checkout-page, .test1-cart-page) .wc-block-checkout__main, :is(.test1-checkout-page, .test1-cart-page) .wc-block-checkout__sidebar { padding: 22px; } .premium-footer { position: relative; z-index: 1; padding-top: 0; } .premium-footer-grid { grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(240px, 0.8fr)); gap: 20px; } .premium-footer-card { position: relative; overflow: hidden; border-radius: 30px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.62)); border: 1px solid rgba(255, 255, 255, 0.8); box-shadow: 0 26px 70px rgba(8, 31, 79, 0.12); } .premium-footer-brand { min-height: 100%; } .premium-footer-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; } .premium-footer-contacts { margin: 0; padding: 0; list-style: none; } .premium-footer-contacts li + li { margin-top: 10px; } .premium-footer-bottom { padding-top: 24px; } @media (min-width: 992px) { :is(.test1-checkout-page, .test1-cart-page) .checkout-shell { grid-template-columns: minmax(0, 0.88fr) minmax(430px, 1.12fr); } } @media (max-width: 991px) { .premium-metrics, .premium-note-row, .premium-badge-grid, .premium-footer-grid { grid-template-columns: 1fr; } } @media (max-width: 781px) { .premium-topline-inner, :is(.test1-checkout-page, .test1-cart-page) .header-row, :is(.test1-checkout-page, .test1-cart-page) .header-actions { flex-wrap: wrap; } .premium-topline-inner { justify-content: center; padding: 8px 0; text-align: center; } :is(.test1-checkout-page, .test1-cart-page) .header-actions { width: 100%; justify-content: stretch; } :is(.test1-checkout-page, .test1-cart-page) .header-actions > * { flex: 1 1 100%; justify-content: center; text-align: center; } .premium-stage { padding: 14px; border-radius: 26px; } :is(.test1-checkout-page, .test1-cart-page) .checkout-card, :is(.test1-checkout-page, .test1-cart-page) .premium-aside, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-checkout #payment, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-billing-fields, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-additional-fields, :is(.test1-checkout-page, .test1-cart-page) #order_review, :is(.test1-checkout-page, .test1-cart-page) .wc-block-checkout__main, :is(.test1-checkout-page, .test1-cart-page) .wc-block-checkout__sidebar, :is(.test1-checkout-page, .test1-cart-page) .woocommerce-cart-form, :is(.test1-checkout-page, .test1-cart-page) .cart_totals, :is(.test1-checkout-page, .test1-cart-page) .cart-collaterals, .premium-footer-card { padding: 18px; } :is(.test1-checkout-page, .test1-cart-page) .coupon { display: grid; } }