/* /scrapling: landing for the Scrapling README sponsorship */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Dark grain-shader surfaces from /register (approved for this page 2026-10-26) */
.sl-shader{position:absolute;inset:0;z-index:-1;pointer-events:none}
.sl-shader .signup-shader-canvas{position:absolute;inset:0}

/* Hero: the applied code under the CTA */
.sl-offer{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;gap:16px;margin-top:24px;padding:12px;border-radius:18px;background:#07110f;color:#fff;box-shadow:rgba(0,0,0,.15) 0 4px 20px 0}
.sl-offer:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#07110fcc 0%,#07110f33 100%);pointer-events:none}
.sl-offer-logo{display:grid;place-items:center;flex-shrink:0;width:52px;height:52px;border-radius:14px;background:#fff}
.sl-offer-logo img{width:34px;height:34px;object-fit:contain}
.sl-offer-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.sl-offer-code{display:inline-flex;align-items:center;gap:6px;font:600 13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;color:#00f2e6}
.sl-offer-code svg{width:15px;height:15px;stroke-width:2.5}
.sl-offer-price{display:flex;align-items:baseline;gap:8px;font-variant-numeric:tabular-nums;white-space:nowrap}
.sl-offer-price s{font-size:16px;color:#ffffff8c}
.sl-offer-price b{font-size:30px;font-weight:600;letter-spacing:-.03em;line-height:1.1;color:#fff}
.sl-offer-price small{font-size:14px;color:#ffffffb3}
.sl-offer-badge{display:grid;place-items:center;align-self:stretch;min-width:84px;padding:0 14px;border-radius:12px;background:#ffffff1f;border:1px solid #ffffff33;font-size:26px;font-weight:700;letter-spacing:-.03em;color:#00f2e6}
.sl-guide-list svg{width:20px;height:20px}

/* Promo price column on the reused Mobile Lane price table */
.sl-has-promo .mobile-price-row{grid-template-columns:minmax(0,.8fr) minmax(0,.6fr) minmax(0,1.3fr) 144px 116px;padding:0 22px}
.sl-has-promo .mobile-price-select i{min-width:108px}
/* Variant "column" (default): one dark highlighted column through the table */
.sl-promo--column .mobile-price-row{position:relative}
.sl-promo--column .sl-promo-head,.sl-promo--column .sl-promo-price{position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:0 18px;background:#07110f;font-variant-numeric:tabular-nums}
.sl-promo--column .sl-promo-head{border-radius:14px 14px 0 0;color:#00f2e6;white-space:nowrap}
.sl-promo--column .sl-promo-head:before,.sl-promo--column .sl-promo-price:before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:#07110f}
.sl-promo--column .sl-promo-head:before{display:none}
.sl-promo--column .mobile-price-row:last-of-type .sl-promo-price{border-radius:0 0 14px 14px}
.sl-promo--column .sl-promo-price b{font-size:24px;font-weight:600;letter-spacing:-.03em;line-height:1.1;color:#fff}
.sl-promo--column .sl-promo-price small{margin-top:2px;font-size:12px;font-weight:500;color:#00f2e6}
.sl-promo--column .mobile-price-row[aria-checked=true] .sl-promo-price{background:linear-gradient(90deg,#0d5a55,#0e2a26)}
.sl-promo--column .mobile-price-row[aria-checked=true] .sl-promo-price:after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#00f2e6}
.sl-promo--column .mobile-price-row[aria-checked=true] .sl-promo-price b{color:#00f2e6}

/* Variant "pills" (first version): a dark pill per row, kept for comparison via ?promo_style=pills */
.sl-promo--pills .sl-promo-head{color:#0d7f8c}
.sl-promo--pills .sl-promo-price{display:inline-flex;flex-direction:column;justify-self:start;min-width:112px;padding:7px 12px;border-radius:10px;background:#07110f;line-height:1.15;font-variant-numeric:tabular-nums}
.sl-promo--pills .sl-promo-price b{font-size:22px;font-weight:600;letter-spacing:-.02em;color:#00f2e6}
.sl-promo--pills .sl-promo-price small{font-size:12px;font-weight:500;color:#ffffffb3}
.sl-promo--pills .mobile-price-row[aria-checked=true] .sl-promo-price{box-shadow:0 0 0 2px #00f2e6,0 0 18px rgba(0,242,230,.35)}

/* Order summary as a dark shader panel */
.sl-summary{position:relative;isolation:isolate;overflow:hidden;background:#07110f!important;border-left:0!important;color:#fff}
.sl-summary:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#07110f33 0%,#07110fcc 100%);pointer-events:none}
.sl-summary h3{color:#fff}
.sl-summary dt,.sl-summary .mobile-price-pay small{color:#ffffffb3}
.sl-summary s{color:#ffffff73!important}
.sl-summary .is-saving dd{color:#00f2e6!important}
.sl-summary .mobile-price-total{border-color:#ffffff26}
.sl-summary .mobile-price-total b{color:#fff}
.sl-summary .mobile-price-cta{background:#fff;color:#1b1b1b;box-shadow:none}
.sl-summary .mobile-price-cta:hover{background:#ffffffe6}
.sl-summary .mobile-price-pay i{border-color:#ffffff26}
@media (max-width:760px){
    .sl-has-promo .mobile-price-row{grid-template-columns:minmax(0,.8fr) minmax(0,1.1fr) 112px;padding:0 16px}
    .sl-promo--column .mobile-price-row[aria-checked=true] .sl-promo-price{grid-column:3;grid-row:1/3}
    .sl-promo--column .mobile-price-row[aria-checked=true] .mobile-price-select{grid-column:1/3;grid-row:2}
    .sl-promo--column .sl-promo-head,.sl-promo--column .sl-promo-price{padding:0 14px}
    .sl-promo--column .sl-promo-head{white-space:normal}
    .sl-has-promo .mobile-price-discount{display:none}
    .sl-has-promo .mobile-price-row.is-head>span:nth-child(2){display:none}
}
@media (max-width:640px){
    .sl-offer{display:flex;gap:12px}
    .sl-offer-logo{width:44px;height:44px}.sl-offer-logo img{width:28px;height:28px}
    .sl-offer-price b{font-size:24px}
    .sl-offer-badge{min-width:68px;margin-left:auto;font-size:22px}
    .sl-offer-price small{display:none}
}
.sl-eyebrow-logo img{width:20px;height:20px;object-fit:contain}
.sl-page .sc-logo img[src*="scrapling"]{object-fit:contain}

/* Price card reuses the Mobile Lane order block */
.sl-price-note{margin:auto 0 0!important;padding:24px 22px 28px;text-align:left}

/* Guide card */
.sl-guide{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;align-items:center;padding:48px;background:#fff;border:1px solid #e0e1e6;border-radius:20px}
.sl-guide h2{font-size:clamp(36px,4vw,52px);letter-spacing:-.045em}
.sl-guide-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.sl-guide-list{display:flex;flex-direction:column;gap:14px;margin:0;padding:0;list-style:none}
.sl-guide-list li{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border:1px solid #eeeff2;border-radius:12px;font-size:15px;line-height:1.45;color:#60646c}
.sl-guide-list svg{flex-shrink:0;color:#0d7f8c}
.sl-guide-list b{color:#1b1b1b;font-weight:600}

@media (max-width:900px){
    .sl-guide{grid-template-columns:1fr;gap:28px;padding:28px}
}
@media (max-width:640px){
    .sl-guide h2{font-size:36px}
}