<style> /* ========================================================= 90° RIGHT-ANGLE DRILL ADAPTER Shopify High-Conversion CRO Mobile First / Detailed / Theme Font Inherited ========================================================= */ #ra-drill-page{ --ra-ink:#202326; --ra-text:#697078; --ra-red:#d81919; --ra-red-dark:#9d1010; --ra-red-soft:#fff0ee; --ra-black:#15191c; --ra-black2:#272d31; --ra-silver:#e9edef; --ra-soft:#f6f7f7; --ra-line:#e0e4e6; --ra-white:#ffffff; width:100%; max-width:920px; margin:0 auto; padding:6px 6px 46px; color:var(--ra-ink); line-height:1.65; container-type:inline-size; container-name:rightangle; } #ra-drill-page, #ra-drill-page *, #ra-drill-page *::before, #ra-drill-page *::after{ box-sizing:border-box; } #ra-drill-page img{ display:block; width:100%; height:auto; margin:0; } #ra-drill-page h1, #ra-drill-page h2, #ra-drill-page h3, #ra-drill-page p{ margin-top:0; } /* ========================================================= BASE ========================================================= */ .ra-card{ margin:0 0 12px; overflow:hidden; border:1px solid var(--ra-line); border-radius:22px; background:#fff; box-shadow: 0 13px 36px rgba(24,28,31,.06); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; } @media(hover:hover){ .ra-card:hover{ transform:translateY(-2px); border-color:#d4d9dc; box-shadow: 0 18px 42px rgba(24,28,31,.10); } } .ra-inner{ padding:29px 19px; } .ra-center{ text-align:center; } .ra-kicker{ position:relative; display:inline-block; margin-bottom:10px; padding:6px 11px; overflow:hidden; border-radius:999px; background:#ffe7e3; color:#9c1515; font-size:10.5px; line-height:1.3; font-weight:900; letter-spacing:.09em; text-transform:uppercase; } .ra-kicker::after{ content:""; position:absolute; top:-55%; left:-50%; width:28%; height:210%; background: linear-gradient( 90deg, transparent, rgba(255,255,255,.75), transparent ); transform:rotate(18deg); animation:raShine 5s infinite; } @keyframes raShine{ 0%,72%{ left:-50%; } 100%{ left:135%; } } .ra-title{ max-width:790px; margin:0 auto 11px!important; color:#202326; font-size:30px; line-height:1.08; letter-spacing:-.7px; font-weight:950; } .ra-title span{ color:var(--ra-red); } .ra-copy{ max-width:700px; margin:0 auto!important; color:var(--ra-text); font-size:14.5px; line-height:1.72; } /* ========================================================= HERO ========================================================= */ .ra-hero{ text-align:center; color:#fff; border-color:#252b2f; background: radial-gradient( circle at 88% 0%, rgba(216,25,25,.24), transparent 36% ), linear-gradient( 145deg, #262b2f, #111416 ); } .ra-hero .ra-inner{ padding:45px 19px 30px; } .ra-hero .ra-kicker{ color:#ffaaa3; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.07); } .ra-hero h1{ max-width:830px; margin:0 auto 13px!important; color:#fff; font-size:39px; line-height:1.03; letter-spacing:-1px; font-weight:950; } .ra-hero h1 span{ display:block; color:#ff4e45; } .ra-lead{ max-width:700px; margin:0 auto!important; color:#e7ebed; font-size:15.5px; line-height:1.68; } /* ========================================================= PILLS / STATS ========================================================= */ .ra-pills{ display:flex; flex-wrap:wrap; justify-content:center; gap:7px; margin-top:18px; } .ra-pill{ padding:8px 11px; border:1px solid rgba(255,255,255,.12); border-radius:999px; background:rgba(255,255,255,.07); color:#fff; font-size:11px; font-weight:850; } .ra-stats{ display:grid; grid