@font-face{font-family:Inter;src:url('assets/inter-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-700.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Inter;src:url('assets/inter-800.ttf') format('truetype');font-weight:800;font-display:swap}
:root{--navy:#142744;--ink:#080f29;--body:#4b5e7e;--blue:#006afa;--line:#cbdcf6;--radius:18px;--width:1184px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:26px}body{margin:0;background:#eaf5ff;font-family:Inter,'Segoe UI',sans-serif;font-size:16px;line-height:1.55;color:var(--body);-webkit-font-smoothing:antialiased}button,a,input{font:inherit}button{cursor:pointer}a{color:var(--blue)}button{color:inherit}img{display:block;max-width:100%;height:auto}figure,p,h1,h2,h3,dl,dd{margin:0}h1,h2,h3{color:var(--ink);letter-spacing:-.035em;line-height:1.2}h1{font-size:46px;font-weight:800;line-height:1.05}h2{font-size:32px;font-weight:750}h3{font-size:22px;font-weight:700}p+p{margin-top:22px}a{text-decoration:none}a:hover{text-decoration:underline}button{border:0}button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #1778fb;outline-offset:5px}button::-moz-focus-inner{border:0}.container{width:calc(100% - 80px);max-width:var(--width);margin-inline:auto}.section{padding:55px 0}.section-intro{margin-top:8px;font-size:17px;line-height:1.5}.three-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;border-radius:9px;background:var(--blue);box-shadow:0 2px 1px #0a5de40c;color:white;font-weight:600;font-size:16px;padding:14px 24px;min-height:48px;line-height:1.2;transition:background .18s,transform .18s}.button:hover{background:#005ee3;text-decoration:none;transform:translateY(-1px)}.button svg{height:25px;width:25px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.button>span{font-size:25px;line-height:.8}.eyebrow{font-size:14px;font-weight:600;color:#627493}.small-print{font-size:13px;line-height:1.6}.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}.skip-link{position:fixed;left:20px;top:-80px;padding:10px 18px;background:white;color:#123b73;z-index:100;border-radius:8px}.skip-link:focus{top:10px}
/* Approved header and hero */
.site-header{background:linear-gradient(110deg,#13233e,#1c3257);color:#fff}.header-inner{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:32px}.brand{display:inline-flex;align-items:center;gap:13px;flex-shrink:0;font-size:29px;letter-spacing:-.04em;line-height:1;font-weight:750;color:#fff}.brand:hover{text-decoration:none}.brand-mark{width:40px;height:46px;object-fit:contain}.site-header nav{display:flex;gap:32px;align-items:center;font-size:14px}.site-header nav a{color:white}.menu-toggle{display:none;background:transparent;padding:9px;color:white}.menu-toggle span{display:block;background:currentColor;width:22px;height:2px;margin:5px}.hero{background:linear-gradient(110deg,#e0f1ff 0%,#e7f3ff 48%,#dfddff 100%);position:relative;overflow:hidden}.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:.62fr 1fr;align-items:center;gap:32px;padding-top:42px;padding-bottom:36px}.hero-copy{padding-left:0}.swatches{width:168px;margin-bottom:12px;mix-blend-mode:multiply}.hero h1{margin-top:14px;margin-bottom:22px}.hero-description{font-size:16px;line-height:1.6;max-width:415px}.hero-button{margin-top:24px;font-size:18px;padding:15px 25px}.status-note{font-size:12.5px;margin-top:12px;color:#617391}.hero-visual{min-width:0;position:relative}.image-zoom{background:none;border:0;padding:0;display:block;width:100%;border-radius:12px;cursor:zoom-in}.hero-visual .image-zoom img{width:100%;border-radius:13px;box-shadow:0 10px 17px #616d9130}.hero-visual figcaption{text-align:right;font-family:'Segoe Print','Bradley Hand',cursive;color:#8082b6;font-size:17px;font-style:italic;line-height:1.4;margin-top:8px;padding-right:8px}.hero-visual figcaption span{font-size:30px;margin-right:5px}.hero-grid-pattern{position:absolute;inset:20px 0 18px 40%;background-image:linear-gradient(#8e99e91c 1px,transparent 1px),linear-gradient(90deg,#8e99e91c 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent)}.hero-decor{position:absolute;pointer-events:none;mix-blend-mode:multiply;opacity:.65}.crystal{width:90px;left:0;top:25px}.sheet{width:150px;left:0;bottom:0}.orb{width:78px;right:0;top:75px}.triangle{width:90px;right:0;bottom:35px}.benefits{padding:18px 0 38px;background:#eaf5ff}.benefit-card,.compare-card{overflow:hidden;border-radius:18px}.tint-0{background:#d2e9ff}.tint-1{background:#e6dcff}.tint-2{background:#ffe7d9}.card-art{width:100%;aspect-ratio:2.2;object-fit:cover}.card-copy{padding:7px 28px 24px}.benefit-card h2{font-size:23px;font-weight:700;letter-spacing:-.04em}.card-copy p{margin-top:8px;line-height:1.5;font-size:16px}
/* Download availability */
.download{background:radial-gradient(ellipse at 75% 45%,#e6e6fc 0,transparent 40%),linear-gradient(110deg,#e6f4ff,#eaf5ff)}.download-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}.download-copy h2{font-size:33px;line-height:1.15}.download-copy>p{margin-top:24px;font-size:17px;line-height:1.55}.notice{display:flex;align-items:center;gap:17px;background:linear-gradient(120deg,#ffe9cd,#fff0dc);padding:16px 18px;border-radius:14px;color:#82500f;line-height:1.5;font-size:15px}.notice p{margin:0}.warning-icon{width:29px;height:29px;background:#ff950c;color:#fff;clip-path:polygon(50% 0,100% 95%,0 95%);display:inline-flex;align-items:center;justify-content:center;padding-top:5px;font-size:20px;font-weight:700;flex-shrink:0}.download .notice{margin:25px 0 22px}.facts-card{background:linear-gradient(120deg,#efedff,#f4f5ff);border-radius:18px;overflow:hidden}.download-art{width:100%;aspect-ratio:2.5;object-fit:cover}.facts{padding:0 24px}.facts>div{display:grid;grid-template-columns:42px minmax(130px,.9fr) 1.2fr;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #d7dbf3;font-size:14px;line-height:1.4}.small-icon{width:40px}.facts dt{font-weight:600;color:#10183e;letter-spacing:-.02em}.facts dd{font-size:14px;color:#465783}.source-link{display:inline-block;margin:10px 24px 17px;font-size:12px;color:#62779b}
/* Overview */
.introduction{background:linear-gradient(110deg,#e9ecff,#e7e5fc);padding-top:35px}.page-nav{display:flex;align-items:center;background:#ffffff5e;border:1px solid #ffffffab;border-radius:13px;padding:14px 6px;gap:0;margin-bottom:45px}.page-nav a{flex:1;text-align:center;color:#4a5b81;font-size:14px;font-weight:500;line-height:1.1;position:relative;padding:2px 12px;border-right:1px solid #bac7e4;white-space:nowrap}.page-nav a:last-child{border:0}.page-nav a.current{color:#0062ed}.page-nav a.current:after{content:'';height:3px;position:absolute;left:25%;right:25%;bottom:-13px;background:#006afa}.intro-grid{display:grid;grid-template-columns:1fr 1.06fr;align-items:center;gap:42px}.intro-grid p{margin-top:21px;font-size:17px;line-height:1.55}.intro-art{width:100%;mix-blend-mode:multiply}.use-tags{list-style:none;margin:25px 0 0;padding:0;display:flex;gap:10px;flex-wrap:wrap}.use-tags li{display:flex;align-items:center;gap:8px;border-radius:50px;padding:8px 13px;background:#cfe5ff;color:#13284b;font-size:13px;white-space:nowrap}.use-tags li:nth-child(2){background:#e0d4ff}.use-tags li:nth-child(3){background:#ffe6cd}.use-tags .small-icon{width:23px;mix-blend-mode:multiply}
/* Functional tool tabs */
.tools{background:#edf6ff;padding:42px 0}.tool-panel{border:1px solid #d6ddfa;background:linear-gradient(135deg,#e5eeff,#e5e9ff);border-radius:23px;padding:25px 29px 29px}.tool-panel h2{font-size:29px}.tool-tabs{display:flex;gap:7px;margin:21px 0 20px;flex-wrap:wrap}.tool-tabs button{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;background:#ffffffb0;color:#111c3f;padding:11px 15px;white-space:nowrap;font-size:14px;line-height:1.25;transition:background .15s}.tool-tabs button:hover{background:#fff}.tool-tabs button[aria-selected=true]{background:var(--blue);color:white}.tab-symbol{font-size:23px;line-height:1;width:23px;display:inline-block}.tool-content{display:grid;grid-template-columns:1.85fr 1fr;gap:30px;align-items:center}.tool-image img{width:100%;border-radius:15px}.tool-description h3{font-size:27px}.tool-description>p{margin-top:10px;font-size:16px}.tool-steps{list-style:none;counter-reset:tool;padding:0;margin:17px 0 12px}.tool-steps li{display:flex;gap:14px;align-items:flex-start;counter-increment:tool;margin-top:13px}.tool-steps li:before{content:counter(tool);width:34px;height:34px;flex-shrink:0;border-radius:50%;background:#c6d4fb;color:#091d49;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:17px}.tool-steps strong{font-size:15px;color:#111c3f;letter-spacing:-.02em;display:block}.tool-steps p{font-size:13px;line-height:1.45;margin-top:3px}.tools-art{width:100%;mix-blend-mode:multiply;max-height:147px;object-fit:contain;margin-top:8px}
/* Installation checklist */
.installation{background:linear-gradient(120deg,#eaf6ff,#e5f2ff)}.install-grid{display:grid;grid-template-columns:1.73fr 1fr;gap:28px;align-items:start}.install-grid h2{font-size:30px}.install-grid .section-intro{font-size:16px}.install-steps{padding:0;list-style:none;display:flex;flex-direction:column;gap:11px;margin:23px 0 0}.install-steps>li{display:flex;align-items:center;gap:16px;position:relative}.step-number{flex-shrink:0;width:43px;height:43px;background:#c7e4ff;color:#112442;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:650;position:relative;z-index:1}.install-steps>li:after{content:'';position:absolute;left:21px;top:calc(50% + 27px);height:calc(50% + 10px);border-left:2px dotted #bdd7f8}.install-steps>li:last-child:after{display:none}.install-steps>li:nth-child(even) .step-number{background:#d2d4ff}.install-step{padding:10px 14px 10px 13px;display:flex;gap:18px;align-items:center;background:#ffffffa6;min-height:77px;border-radius:16px;flex:1}.install-icon{width:57px;flex-shrink:0;mix-blend-mode:multiply}.install-step h3{font-size:21px}.install-step p{font-size:15px;margin-top:4px;line-height:1.4}.compatibility-card{background:linear-gradient(120deg,#284b7b,#1d355d);color:white;border-radius:18px;overflow:hidden}.install-art{width:100%}.compatibility-copy{padding:3px 26px 21px}.compatibility h3{color:#fff;font-size:25px;letter-spacing:-.03em}.compatibility ul{list-style:none;margin:14px 0 0;padding:0}.compatibility li{display:flex;gap:15px;align-items:center;padding:9px 0;border-bottom:1px solid #ffffff22;font-size:17px;line-height:1.35}.compatibility li:last-child{border:0}.compatibility li span{background:#83e4fc;color:#132844;display:flex;align-items:center;justify-content:center;width:29px;height:29px;font-size:22px;font-weight:700;border-radius:50%;flex-shrink:0}.compatibility .notice{margin-top:11px;color:#425774;font-size:14px;padding:17px}
/* First project */
.tutorial{background:linear-gradient(110deg,#e9e8ff,#f0edff)}.tutorial-grid{display:grid;grid-template-columns:1.18fr 1fr;gap:30px;align-items:center}.tutorial-app{border-radius:15px;width:100%;box-shadow:0 7px 12px #555b8030}.tutorial-visual figcaption{font-family:'Segoe Print','Bradley Hand',cursive;color:#8581b8;font-style:italic;text-align:center;font-size:15px;margin-top:10px}.tutorial-copy{position:relative}.tutorial-copy h2{font-size:27px;position:relative;z-index:1;max-width:95%}.tutorial-scissors{position:absolute;right:-12px;top:-40px;width:84px;mix-blend-mode:multiply;opacity:.9}.tutorial .section-intro{font-size:15px;position:relative;z-index:1}.tutorial-steps{list-style:none;margin:21px 0 13px;padding:0;display:flex;flex-direction:column;gap:9px}.tutorial-steps li{display:flex;gap:13px;align-items:center;border-radius:15px;background:#ffffffb0;padding:12px 10px 12px 13px;min-height:75px}.tutorial-steps .step-number{width:38px;height:38px;font-size:21px}.tutorial-steps li:nth-child(2) .step-number{background:#e0d4ff}.tutorial-steps li:nth-child(3) .step-number{background:#ffe0ce}.tutorial-steps h3{font-size:18px;line-height:1.3}.tutorial-steps p{font-size:13px;line-height:1.45;margin-top:4px}.tutorial-icon{width:57px;margin-left:auto;mix-blend-mode:multiply}.tutorial-steps li>div{flex:1}.tutorial-tip{background:#e2dcff;display:flex;align-items:center;gap:11px;padding:12px 13px;border-radius:15px;flex-wrap:wrap}.tip-bulb{width:29px;height:29px;border-radius:50%;background:#ab8bec;color:#fff;display:flex;align-items:center;justify-content:center;font-size:23px;flex-shrink:0}.tutorial-tip p{font-size:12px;line-height:1.5;flex:1;min-width:220px;color:#263254}.small-button{font-size:12px;min-height:38px;padding:10px 13px;gap:8px;margin-left:auto}.small-button>span{font-size:20px}
/* Saving table */
.saving{background:linear-gradient(120deg,#ecf7ff,#e4f2ff)}.saving-grid{display:grid;grid-template-columns:2.65fr 1fr;gap:25px;align-items:center;margin-top:27px}.formats-wrap{min-width:0}.formats{width:100%;border-spacing:0;border-radius:13px;overflow:hidden;table-layout:fixed;text-align:left;font-size:14px;line-height:1.45}.formats th,.formats td{padding:12px 15px;border-right:1px solid #d5e2f8;border-bottom:1px solid #ffffffc4}.formats thead th{color:#fff;background:#1d3558;font-size:15px;line-height:1.2;padding:16px 19px;border-right-color:#ffffff24;font-weight:600}.formats thead th:first-child{width:27%}.formats thead th:nth-child(2){width:35%}.formats tr>:last-child{border-right:0}.formats tbody tr:nth-child(odd){background:#e5f2ff}.formats tbody tr:nth-child(even){background:#f0edff}.formats tbody th{color:#101b3e;font-weight:650;font-size:14px}.formats tbody th span{display:flex;align-items:center;gap:15px}.file-icon{width:44px;max-height:53px;object-fit:contain;mix-blend-mode:multiply}.saving-art{width:100%;mix-blend-mode:multiply}.format-note{display:flex;align-items:center;gap:13px;font-size:12px;line-height:1.5;margin-top:17px}.format-note span{font-size:25px;line-height:1;color:#6f9bff}
/* Alternatives and troubleshooting */
.comparison{background:#eaf5ff}.compare-cards{margin-top:25px}.compare-art{width:100%;aspect-ratio:1.78;object-fit:cover}.compare-card .card-copy{padding:6px 24px 24px}.compare-card h3{font-size:23px}.compare-card p{font-size:16px;line-height:1.5}.older-guides{display:flex;align-items:center;gap:22px;background:linear-gradient(110deg,#1c385e,#203e66);border-radius:14px;padding:19px 24px;color:#fff;margin-top:19px;font-size:15px;line-height:1.5}.older-guides>span{font-size:31px;padding-right:22px;border-right:1px solid #ffffff38;line-height:1.1;flex-shrink:0}.troubleshooting{background:linear-gradient(120deg,#edf8ff,#e5f3ff)}.problem-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:26px}.problem-card{display:grid;grid-template-columns:145px 1fr;align-items:center;gap:15px;padding:22px 24px 22px 16px;border-radius:19px;min-height:185px}.problem-art{width:100%;mix-blend-mode:multiply}.problem-card h3{font-size:21px;line-height:1.3}.problem-card p{font-size:16px;line-height:1.5;margin-top:10px}
/* FAQs and footer */
.faq{background:linear-gradient(115deg,#e4e8ff,#eaeafe);padding-bottom:32px}.faq-grid{display:grid;grid-template-columns:1fr 1.8fr;gap:40px;align-items:start}.faq h2{font-size:29px}.faq-grid>div>p{font-size:16px;margin-top:15px;line-height:1.6}.faq-art{width:100%;max-width:370px;mix-blend-mode:multiply;margin-top:25px}.faq-list{display:flex;flex-direction:column;gap:9px}.faq-list details{border:1px solid #cfdcff;border-radius:13px;background:#ffffffc9;box-shadow:0 2px 5px #8599db06;overflow:hidden}.faq-list summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;cursor:pointer;padding:16px 18px;font-size:16px;color:#0e183b;font-weight:650;letter-spacing:-.025em;line-height:1.4}.faq-list summary::-webkit-details-marker{display:none}.faq-list details[open] summary{background:#dfedff9e}.faq-indicator{position:relative;width:20px;height:20px;flex-shrink:0}.faq-indicator:before,.faq-indicator:after{position:absolute;content:'';height:2px;background:#006afa;top:9px;left:1px;right:1px;border-radius:3px}.faq-indicator:after{transform:rotate(90deg)}details[open] .faq-indicator:after{display:none}.faq-answer{padding:15px 18px 18px;font-size:15px;line-height:1.55}.related-links{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:35px;font-size:15px;color:var(--blue)}.related-links button{padding:0;background:none;color:var(--blue)}.related-links button:hover{text-decoration:underline}.site-footer{background:linear-gradient(100deg,#132642,#192e50);color:#c8d7ec;padding:20px 0}.footer-inner{display:flex;align-items:center;gap:30px}.site-footer .brand{font-size:28px;gap:12px;padding-right:28px;border-right:1px solid #ffffff30}.site-footer .brand-mark{width:36px;height:43px}.footer-inner>p{font-size:12px;line-height:1.5;max-width:470px}.site-footer nav{display:flex;gap:25px;white-space:nowrap;margin-left:auto}.site-footer nav button{background:none;padding:4px 0;color:#fff;font-size:13px}.site-footer nav button:hover{text-decoration:underline}
/* Dialogs */
dialog{border:1px solid #d6e1f5;border-radius:20px;box-shadow:0 25px 100px #071b4950;background:#f2f7ff;color:var(--body);max-width:680px;width:calc(100% - 40px);padding:35px;max-height:85dvh;overflow:auto}dialog::backdrop{background:#091d3bcc;backdrop-filter:blur(5px)}dialog h2{font-size:27px;padding-right:25px;margin-bottom:18px}dialog p{font-size:15px;line-height:1.7}dialog .button{margin-top:20px}dialog .small-print{margin-top:20px;font-size:12px}.dialog-close{position:absolute;top:10px;right:12px;font-size:27px;line-height:1;width:36px;height:36px;background:#e0e9fa;border-radius:50%;color:#19385e}.image-dialog{width:calc(100% - 60px);max-width:1400px;padding:15px;background:#162d4d;overflow:visible}.image-dialog>img{width:100%;max-height:80dvh;object-fit:contain}.image-dialog .dialog-close{top:-15px;right:-15px;background:white;z-index:1}.guide-steps{padding-left:23px;margin-top:24px}.guide-steps>li{padding-left:8px;margin:20px 0}.guide-steps h3{font-size:18px;margin-bottom:8px}.guide-steps>li::marker{font-weight:700;color:var(--blue)}
@media(min-width:1600px){.hero-inner{padding-top:46px;padding-bottom:40px}.hero-decor{opacity:.55}}
@media(max-width:1100px){.container{width:calc(100% - 56px)}.hero-inner{grid-template-columns:.72fr 1fr;gap:25px}.hero-description{font-size:15px}h1{font-size:40px}.hero-button{font-size:16px;padding:14px 20px}.hero-visual figcaption{font-size:14px}.hero-decor{opacity:.35}.card-copy{padding:7px 19px 21px}.benefit-card h2{font-size:21px}.card-copy p{font-size:14px}.download-grid{gap:30px}.download-copy h2{font-size:29px}.download-copy>p{font-size:16px}.facts{padding:0 17px}.facts>div{grid-template-columns:33px 1fr 1.2fr;gap:9px;font-size:12px}.facts dd{font-size:12px}.small-icon{width:33px}.source-link{margin-left:17px}.intro-grid{gap:25px}.intro-grid p{font-size:16px}.use-tags{gap:7px}.use-tags li{font-size:11px;padding:7px 9px;gap:5px}.use-tags .small-icon{width:20px}.tool-panel{padding:23px}.tool-tabs{gap:6px}.tool-tabs button{font-size:12px;padding:10px 12px;gap:7px}.tool-content{gap:24px;grid-template-columns:1.6fr 1fr}.tool-description h3{font-size:24px}.tool-description>p{font-size:14px}.tool-steps p{font-size:12px}.tool-steps strong{font-size:14px}.tool-steps li{gap:10px}.tool-steps li:before{width:30px;height:30px;font-size:15px}.install-grid{grid-template-columns:1.65fr 1fr;gap:24px}.install-step{gap:12px}.install-step h3{font-size:18px}.install-step p{font-size:13px}.install-icon{width:47px}.compatibility-copy{padding:5px 20px 18px}.compatibility h3{font-size:22px}.compatibility li{font-size:15px;gap:12px}.compatibility .notice{font-size:12px;gap:10px}.tutorial-grid{gap:24px;grid-template-columns:1fr 1fr}.tutorial-copy h2{font-size:25px}.tutorial-steps li{gap:10px}.tutorial-icon{width:43px}.tutorial-steps h3{font-size:16px}.tutorial-steps p{font-size:12px}.tutorial-steps .step-number{width:32px;height:32px;font-size:17px}.tutorial .section-intro{font-size:13px}.tutorial-tip p{min-width:170px}.saving-grid{gap:17px;grid-template-columns:3fr 1fr}.formats{font-size:12px}.formats th,.formats td{padding:10px}.formats tbody th{font-size:12px}.formats tbody th span{gap:8px}.file-icon{width:33px}.compare-card .card-copy{padding:8px 20px 23px}.compare-card h3{font-size:20px}.compare-card p{font-size:14px}.problem-card{grid-template-columns:105px 1fr;padding:18px;gap:15px;min-height:170px}.problem-card h3{font-size:18px}.problem-card p{font-size:14px}.faq-grid{gap:30px}.faq h2{font-size:26px}.faq-list summary{font-size:14px;padding:15px}.faq-answer{font-size:14px}.footer-inner{gap:20px}.footer-inner>p{max-width:350px}.site-footer nav{gap:18px}.site-footer .brand{font-size:25px;padding-right:20px}}
@media(max-width:800px){.section{padding:42px 0}.container{width:calc(100% - 40px)}.header-inner{min-height:62px;gap:20px}.brand{font-size:25px;gap:9px}.brand-mark{width:34px;height:41px}.site-header nav{gap:20px;font-size:12px}.hero-inner{padding-top:34px;padding-bottom:29px;gap:22px;grid-template-columns:.9fr 1fr}h1{font-size:35px}.hero h1{margin-top:12px;margin-bottom:16px}.eyebrow{font-size:11px}.swatches{width:130px;margin-bottom:9px}.hero-description{font-size:13px;line-height:1.6}.hero-button{font-size:13px;padding:12px 15px;min-height:43px;gap:11px;margin-top:19px}.hero-button svg{width:21px;height:21px}.status-note{font-size:10px}.hero-visual figcaption{font-size:12px}.hero-visual figcaption span{font-size:23px}.hero-decor{opacity:.25}.benefits{padding-top:15px;padding-bottom:25px}.three-cards{gap:12px}.benefit-card,.compare-card{border-radius:14px}.card-copy{padding:7px 17px 21px}.benefit-card h2{font-size:18px}.card-copy p{font-size:12px;line-height:1.5}.download-grid{gap:24px}.download-copy h2{font-size:25px}.download-copy>p{font-size:14px;margin-top:16px}.notice{padding:13px;gap:12px;font-size:12px}.download .notice{margin:19px 0}.download-copy .button{font-size:12px;padding:13px;gap:10px}.facts{padding:0 13px}.facts>div{grid-template-columns:27px 1fr 1.2fr;gap:7px;font-size:10px;padding:9px 0}.facts dd{font-size:10px}.facts .small-icon{width:27px}.source-link{margin-left:13px;font-size:10px}.page-nav{margin-bottom:32px;padding:12px 4px}.page-nav a{font-size:11px;padding:2px 9px}.intro-grid{gap:20px}h2{font-size:27px}.intro-grid p{font-size:14px;margin-top:16px}.use-tags{margin-top:20px;gap:5px}.use-tags li{font-size:10px}.intro-art{width:100%}.tool-panel{padding:20px}.tool-panel h2{font-size:26px}.section-intro{font-size:15px}.tool-tabs{margin:18px 0}.tool-tabs button{padding:9px 11px;font-size:11px}.tab-symbol{font-size:20px;width:20px}.tool-content{grid-template-columns:1.4fr 1fr;gap:19px}.tool-description h3{font-size:22px}.tool-description>p{font-size:12px}.tool-steps{margin-top:11px}.tool-steps strong{font-size:12px}.tool-steps p{font-size:11px}.tool-steps li{margin-top:10px}.tool-steps li:before{width:26px;height:26px;font-size:13px}.tools-art{max-height:90px}.install-grid{gap:20px;grid-template-columns:1.6fr 1fr}.install-grid h2{font-size:26px}.install-grid .section-intro{font-size:13px}.install-steps>li{gap:11px}.step-number{width:31px;height:31px;font-size:16px}.install-steps>li:after{left:15px;top:calc(50% + 20px)}.install-step{padding:10px;gap:9px;min-height:72px}.install-icon{width:38px}.install-step h3{font-size:15px}.install-step p{font-size:11px}.compatibility-copy{padding:8px 16px 15px}.compatibility h3{font-size:18px}.compatibility li{font-size:12px;gap:9px}.compatibility li span{width:23px;height:23px;font-size:17px}.compatibility .notice{font-size:11px}.tutorial-grid{gap:20px;grid-template-columns:1fr 1.1fr}.tutorial-copy h2{font-size:23px}.tutorial .section-intro{font-size:12px}.tutorial-icon{width:34px}.tutorial-steps{gap:7px}.tutorial-steps li{padding:10px;gap:8px;min-height:65px}.tutorial-steps h3{font-size:14px}.tutorial-steps p{font-size:11px}.tutorial-steps .step-number{width:28px;height:28px;font-size:15px}.tutorial-tip{padding:10px;gap:8px}.tutorial-tip p{font-size:10px;min-width:140px}.tutorial-scissors{width:60px;top:-24px}.tutorial-visual figcaption{font-size:12px}.saving h2{font-size:26px}.saving-grid{grid-template-columns:3fr 1fr;gap:12px}.formats{font-size:10px}.formats thead th{font-size:12px;padding:12px}.formats tbody th{font-size:11px}.formats th,.formats td{padding:10px 8px}.file-icon{width:27px}.formats tbody th span{gap:6px}.format-note{font-size:10px}.compare-card h3{font-size:18px}.compare-card p{font-size:12px}.compare-card .card-copy{padding:6px 16px 20px}.older-guides{font-size:12px;padding:15px 17px;gap:15px}.older-guides>span{font-size:26px;padding-right:15px}.problem-card{grid-template-columns:85px 1fr;padding:16px 14px;gap:12px;min-height:165px}.problem-card h3{font-size:16px}.problem-card p{font-size:12px}.problem-grid{gap:13px}.faq-grid{grid-template-columns:1fr 1.65fr;gap:23px}.faq h2{font-size:24px}.faq-grid>div>p{font-size:13px}.faq-list summary{font-size:12px;gap:12px;padding:13px}.faq-answer{font-size:12px;padding:13px}.faq-indicator{width:17px}.related-links{font-size:12px;gap:13px}.footer-inner{gap:18px;flex-wrap:wrap}.site-footer .brand{font-size:24px}.footer-inner>p{font-size:10px;max-width:300px}.site-footer nav{gap:18px}.site-footer nav button{font-size:11px}}
@media(max-width:600px){html{scroll-padding-top:15px}.container{width:calc(100% - 36px)}.header-inner{position:relative}.menu-toggle{display:block;margin-right:-7px}.site-header nav{display:none;position:absolute;top:62px;left:-18px;right:-18px;background:#142744;z-index:10;padding:17px 23px 22px;flex-direction:column;align-items:flex-start;font-size:15px;border-top:1px solid #ffffff1c;gap:19px;box-shadow:0 15px 20px #14274425}.site-header nav.open{display:flex}.brand{font-size:25px}.hero-inner{grid-template-columns:1fr;padding-top:28px;padding-bottom:23px;gap:26px}.hero-copy{max-width:440px}.swatches{width:145px}.eyebrow{font-size:12px}h1{font-size:42px}.hero h1{margin-top:13px;margin-bottom:16px}.hero-description{font-size:15px;max-width:355px}.hero-button{font-size:16px;padding:14px 20px;margin-top:21px;min-height:48px}.status-note{font-size:11px}.hero-visual{width:100%;max-width:500px;margin:auto}.hero-visual figcaption{font-size:14px;margin-top:7px}.hero-grid-pattern{inset:350px 0 0 0}.hero-decor.sheet{display:none}.crystal{width:48px;opacity:.18;left:auto;right:0;top:36px}.orb{width:45px;opacity:.3;top:280px}.triangle{display:none}.benefits{padding:17px 0 30px}.three-cards{grid-template-columns:1fr;gap:15px}.benefit-card{display:grid;grid-template-columns:120px 1fr;align-items:center;min-height:137px}.card-art{width:120px;height:110px;object-fit:cover;aspect-ratio:auto;mix-blend-mode:multiply}.benefit-card .card-copy{padding:17px 19px 17px 9px}.benefit-card h2{font-size:20px}.card-copy p{font-size:13px;margin-top:7px}.section{padding:38px 0}h2{font-size:27px}.download-grid{grid-template-columns:1fr;gap:26px}.download-copy h2{font-size:29px;line-height:1.18}.download-copy>p{font-size:15px;margin-top:19px}.notice{font-size:13px;padding:15px}.download-copy .button{font-size:14px;padding:14px 19px}.facts{padding:0 20px}.facts>div{grid-template-columns:34px minmax(100px,.9fr) 1.2fr;gap:10px;font-size:12px;padding:11px 0}.facts dd{font-size:12px}.facts .small-icon{width:34px}.source-link{font-size:11px;margin:12px 20px 18px}.download-art{max-height:190px;object-fit:cover}.introduction{padding-top:25px}.page-nav{justify-content:flex-start;overflow-x:auto;scrollbar-width:thin;padding:14px 3px 15px;margin-bottom:30px}.page-nav a{flex:none;font-size:12px;min-width:101px;padding-inline:16px}.page-nav a.current:after{bottom:-14px}.intro-grid{grid-template-columns:1fr;gap:24px}.intro-grid p{font-size:15px;margin-top:18px}.intro-art{width:100%;max-width:450px;margin:auto}.use-tags{gap:8px}.use-tags li{font-size:11px;padding:8px 10px}.tools{padding:27px 0}.tool-panel{padding:21px 17px;border-radius:18px}.tool-panel h2{font-size:25px}.section-intro{font-size:15px}.tool-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:20px 0}.tool-tabs button{justify-content:flex-start;font-size:12px;padding:10px 12px;gap:8px}.tool-content{grid-template-columns:1fr;gap:23px}.tool-description h3{font-size:25px}.tool-description>p{font-size:15px}.tool-steps{margin-top:16px}.tool-steps li{gap:12px;margin-top:13px}.tool-steps li:before{width:32px;height:32px;font-size:16px}.tool-steps strong{font-size:14px}.tool-steps p{font-size:13px}.tools-art{max-height:145px;margin:19px auto 0}.install-grid{grid-template-columns:1fr;gap:25px}.install-grid h2{font-size:27px}.install-grid .section-intro{font-size:14px}.install-steps{gap:12px}.install-steps>li{gap:10px}.install-step{padding:12px;min-height:85px;gap:11px}.install-icon{width:45px}.install-step h3{font-size:17px}.install-step p{font-size:12px;line-height:1.5}.install-steps .step-number{width:31px;height:31px}.compatibility{max-width:450px;width:100%;margin:auto}.install-art{max-height:230px;object-fit:cover}.compatibility-copy{padding:5px 24px 22px}.compatibility h3{font-size:25px}.compatibility li{font-size:16px;padding:11px 0;gap:13px}.compatibility li span{width:27px;height:27px;font-size:20px}.compatibility .notice{font-size:13px;padding:16px}.tutorial-grid{grid-template-columns:1fr;gap:28px}.tutorial-copy{grid-row:1}.tutorial-copy h2{font-size:27px;max-width:88%}.tutorial .section-intro{font-size:14px}.tutorial-scissors{right:-4px;width:63px;top:-12px}.tutorial-steps{gap:10px;margin:22px 0 13px}.tutorial-steps li{min-height:85px;padding:13px 11px;gap:11px}.tutorial-steps .step-number{width:34px;height:34px;font-size:19px}.tutorial-steps h3{font-size:17px}.tutorial-steps p{font-size:12px}.tutorial-icon{width:46px}.tutorial-tip{padding:15px 13px;gap:10px}.tutorial-tip p{font-size:12px;min-width:210px}.small-button{font-size:12px;margin-top:2px;min-height:40px;padding:11px 14px}.tutorial-visual figcaption{font-size:13px}.saving h2{font-size:27px}.saving-grid{grid-template-columns:1fr;margin-top:24px;gap:19px}.formats{font-size:11px}.formats thead th{font-size:12px;padding:13px 10px}.formats th,.formats td{padding:12px 9px;vertical-align:top}.formats thead th:first-child{width:28%}.formats thead th:nth-child(2){width:33%}.formats tbody th{font-size:11px}.formats tbody th span{align-items:flex-start;flex-direction:column;gap:6px}.file-icon{width:32px;height:36px}.format-note{font-size:11px;align-items:flex-start;gap:9px}.saving-art{width:220px;max-height:270px;object-fit:contain;margin:auto}.compare-cards{gap:17px;margin-top:24px}.compare-card{display:grid;grid-template-columns:120px 1fr;align-items:center;min-height:155px}.compare-art{width:120px;height:128px;aspect-ratio:auto;object-fit:cover;mix-blend-mode:multiply}.compare-card .card-copy{padding:18px 18px 18px 8px}.compare-card h3{font-size:20px}.compare-card p{font-size:13px}.older-guides{font-size:13px;gap:14px;align-items:flex-start;padding:17px}.older-guides>span{font-size:26px;padding-right:13px}.problem-grid{grid-template-columns:1fr;gap:13px;margin-top:24px}.problem-card{grid-template-columns:103px 1fr;min-height:165px;padding:18px 17px 18px 12px;gap:13px}.problem-card h3{font-size:19px}.problem-card p{font-size:13px;margin-top:9px}.faq{padding-bottom:29px}.faq-grid{grid-template-columns:1fr;gap:25px}.faq h2{font-size:27px}.faq-grid>div>p{font-size:15px;max-width:350px;margin-top:13px}.faq-art{display:none}.faq-list{gap:10px}.faq-list summary{font-size:14px;padding:17px 15px;gap:15px}.faq-answer{font-size:14px;padding:15px}.faq-indicator{width:18px}.related-links{margin-top:26px;gap:10px 12px;font-size:12px;line-height:1.6}.related-links>span{font-size:9px}.site-footer{padding:25px 0}.footer-inner{display:grid;grid-template-columns:1fr;gap:18px}.site-footer .brand{font-size:27px;border:0;padding:0}.site-footer .brand-mark{width:35px}.footer-inner>p{max-width:340px;font-size:12px}.site-footer nav{margin:0;gap:25px}.site-footer nav button{font-size:13px}dialog{padding:29px 23px;border-radius:17px}dialog h2{font-size:24px}dialog p{font-size:14px}.image-dialog{width:calc(100% - 25px);padding:7px}.image-dialog .dialog-close{right:-5px;top:-25px}}
.tab-icon{width:23px;height:23px;object-fit:contain;flex-shrink:0}.tool-tabs button[aria-selected=true] .tab-icon{filter:brightness(0) invert(1)}.tool-tabs button:not([aria-selected=true]) .tab-icon{filter:brightness(0) saturate(100%) invert(10%) sepia(20%) saturate(2000%) hue-rotate(190deg)}.hero-decor{mix-blend-mode:normal}.brand-mark{object-fit:contain}.intro-art,.tools-art,.install-icon,.tutorial-icon,.tutorial-scissors,.file-icon,.saving-art,.problem-art,.faq-art,.use-tags .small-icon,.card-art,.compare-art{mix-blend-mode:normal}
html{scroll-behavior:auto}
@media(max-width:600px){.card-art,.compare-art{object-fit:contain;padding:7px}.hero .hero-decor{opacity:.4}}
@media(max-width:1100px){.tab-icon{width:20px;height:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Layout for the expanded article copy. */
.hero h1 {
  font-size: clamp(2rem, 3.6vw, 3.25rem);
  line-height: 1.1;
}

.hero-description {
  max-width: 48ch;
}

.hero-description p + p,
.card-copy p + p,
.install-step p + p,
.tutorial-steps p + p {
  margin-top: 0.75em;
}

.status-note {
  max-width: 56ch;
}

.benefits h2 {
  margin: 0 0 20px;
}

.facts-copy {
  padding: clamp(14px, 2vw, 24px);
}

.facts-copy h3 {
  margin: 0 0 12px;
}

.facts-copy .source-link {
  margin: 12px 0 0;
}

.content-table thead th:first-child {
  width: 38%;
}

.content-table thead th:nth-child(2) {
  width: auto;
}

.tool-panel > p,
.install-grid h2 + p,
.install-grid h2 + p + p,
.tutorial h2 + p,
.tutorial h2 + p + p,
.saving h2 + p,
.comparison h2 + p,
.troubleshooting h2 + p {
  margin-top: 12px;
}

.tool-content[hidden] {
  display: none;
}

.tool-content {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
}

.tool-content + .tool-content:not([hidden]) {
  margin-top: 28px;
}

.tool-content[hidden] + .tool-content:not([hidden]) {
  margin-top: 0;
}

.feature-steps {
  margin: 12px 0;
  padding-inline-start: 1.4em;
}

.feature-steps li + li {
  margin-top: 5px;
}

.install-step,
.tutorial-steps li,
.problem-card {
  align-items: start;
}

.install-step {
  padding-block: 17px;
}

.tutorial-grid {
  margin-top: 24px;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  align-items: start;
}

.tutorial-steps {
  margin-top: 0;
}

.tutorial-steps li {
  padding-block: 14px;
}

.tutorial-copy > p,
.formats-wrap > p,
.reading-width > p {
  margin-top: 14px;
}

.reading-width {
  max-width: 850px;
}

.paint-comparison {
  background: #e8f3fe;
}

.paint-comparison .content-table {
  margin-block: 22px;
}

.paint-comparison .content-table thead th:first-child {
  width: 40%;
}

.final-words {
  background: #e9ecff;
}

.problem-card .card-copy {
  padding: 0;
}

.faq-answer p {
  margin: 0;
}

@media (max-width: 800px) {
  .tool-description > p,
  .feature-steps,
  .install-step p,
  .tutorial-steps p,
  .problem-card p {
    font-size: 14px;
  }

  .content-table {
    font-size: 13px;
  }

  .content-table tbody th {
    font-size: inherit;
  }
}

@media (max-width: 600px) {
  .tool-content,
  .tutorial-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .tutorial-copy {
    grid-row: auto;
  }

  .tutorial-icon {
    display: none;
  }

  .install-step .install-icon {
    width: 26px;
  }

  .problem-card {
    grid-template-columns: 58px minmax(0, 1fr);
    align-items: start;
  }

  .paint-comparison .content-table th,
  .paint-comparison .content-table td {
    overflow-wrap: anywhere;
  }
}

.download-copy > .button {
  margin-top: 24px;
}