:root{--ink:#23392f;--muted:#647168;--green:#244e40;--green-dark:#193e32;--sage:#eaf0e8;--cream:#f8f7f2;--line:#dde3da;--gold:#e1b661;--white:#fff;--radius:20px;--shadow:0 12px 36px #203d2e08;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);font-synthesis:none;background:var(--cream)}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid #bc8a2e;outline-offset:4px}p{line-height:1.7}h1,h2,h3,h4,p{margin-top:0}h1,h2,h3,h4{letter-spacing:-.035em}h1{font-size:clamp(2.3rem,4.7vw,4.2rem);font-weight:650;line-height:1.08;margin-bottom:22px}h1 em{font-family:Georgia,serif;font-weight:400;color:var(--green);font-style:italic}h2{font-size:1.85rem;line-height:1.25}h3{font-size:1.05rem}.container{width:min(1140px,calc(100% - 48px));margin-inline:auto}.icon{flex-shrink:0;vertical-align:middle}.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}[hidden]{display:none!important}.skip-link{position:fixed;top:-100px;left:20px;z-index:10;padding:14px;background:white}.skip-link:focus{top:12px}.site-header{background:#fffefb;border-bottom:1px solid var(--line)}.header-inner{max-width:1240px;margin:auto;padding:22px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;gap:10px;font-size:1.15rem;font-weight:750;white-space:nowrap;letter-spacing:-.055em}.brand-light{font-weight:500}.brand-dot{color:#b87f27}.brand-mark{display:grid;place-items:center;width:32px;height:34px;background:var(--green);color:#f2e7c7;border-radius:10px 10px 4px 10px}.brand-mark svg{width:23px}.site-header nav{display:flex;align-items:center;gap:30px;font-size:.85rem;font-weight:550}.site-header nav a{padding:8px 0}.site-header nav .nav-tool{display:inline-flex;gap:12px;align-items:center;color:var(--green)}.site-header nav [aria-current=page]{text-decoration:underline;text-decoration-color:#d1ac65;text-underline-offset:8px}.breadcrumb{padding-top:25px;font-size:.76rem;color:var(--muted)}.breadcrumb ol{display:flex;gap:10px;list-style:none;padding:0;margin:0;flex-wrap:wrap}.breadcrumb li+li:before{content:"/";color:#a6afa5;margin-right:10px}.breadcrumb [aria-current]{color:var(--ink)}.eyebrow{display:block;letter-spacing:.15em;font-size:.67rem;font-weight:750;color:#597160;margin-bottom:16px}.paint-intro{display:flex;align-items:center;justify-content:space-between;padding:34px 0 32px;gap:25px}.paint-intro h1{font-size:clamp(2.2rem,4.1vw,3.4rem);line-height:1.08;margin-bottom:18px}.paint-intro p{max-width:640px;margin:0;font-size:.97rem;color:var(--muted)}.hero-badge{display:flex;gap:8px;align-items:center;font-size:.74rem;background:#eef1e7;padding:12px 15px;border-radius:30px;white-space:nowrap}.hero-badge .icon{width:16px}.calculator-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:26px;align-items:start;scroll-margin-top:25px}.calculator-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--white);box-shadow:var(--shadow);overflow:hidden}.card-topline{display:flex;align-items:center;justify-content:space-between;background:#f2f5ef;border-bottom:1px solid var(--line);padding:17px 28px;font-size:.8rem}.card-topline>span:first-child{display:flex;align-items:center;gap:10px;font-weight:650}.quiet{color:#697967;font-size:.7rem}.form-content{padding:0 28px 22px}.form-step{padding:27px 0;border-bottom:1px solid var(--line)}.step-heading{display:flex;align-items:center;gap:11px;margin-bottom:20px}.step-heading h2{font-size:1.09rem;font-weight:680;margin:0;letter-spacing:-.02em}.step-number{font-size:.67rem;font-weight:750;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;flex-shrink:0;border:1px solid #dce5d8;background:#f4f7f1;border-radius:50%;color:var(--green)}.mode-switch{display:grid;grid-template-columns:1fr 1fr;margin:0 0 24px;border:0;background:#f2f4ef;padding:5px;border-radius:10px;gap:4px}.mode-switch label{position:relative}.mode-switch input{position:absolute;opacity:0;width:100%;height:100%;inset:0;margin:0;cursor:pointer}.mode-switch span{display:flex;align-items:center;justify-content:center;padding:12px 5px;min-height:44px;font-size:.79rem;font-weight:600;color:#687368;border-radius:7px;text-align:center}.mode-switch input:checked+span{background:white;color:var(--green);box-shadow:0 2px 8px #293c2110}.mode-switch input:focus-visible+span{outline:3px solid #bc8a2e;outline-offset:1px}.field{min-width:0}.field label{font-size:.79rem;font-weight:650;display:flex;align-items:center;gap:7px;margin-bottom:9px}.optional{font-size:.64rem;font-weight:400;color:var(--muted)}.input-wrap{position:relative}.field input{border:1px solid #cdd8cc;background:#fff;width:100%;height:50px;border-radius:9px;padding:10px 60px 10px 14px;color:var(--ink);font-size:1.1rem;font-weight:550;transition:border-color .15s,box-shadow .15s;min-width:0}.field input:focus{border-color:#668868;box-shadow:0 0 0 3px #244e400a;outline-offset:2px}.input-unit{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:.8rem;color:#778273;pointer-events:none}.field-help{display:block;color:var(--muted);font-size:.69rem;line-height:1.5;margin-top:8px}.field-error{display:block;color:#aa342a;font-size:.76rem;line-height:1.5;margin-top:6px}.field-error:empty{display:none}.field input[aria-invalid=true]{border-color:#b53e30;background:#fffafa}.fields-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.info-note{display:flex;align-items:flex-start;gap:9px;margin-top:17px;color:#63715c;background:#f4f6ef;padding:12px;border-radius:8px;font-size:.69rem;line-height:1.5}.info-note svg{width:15px;height:15px}.margin-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;margin-top:23px}.margin-note{color:#6a7867;font-size:.71rem;padding-left:4px}.margin-note strong{color:#4a624c;font-size:.73rem}.margin-note p{line-height:1.6;margin:6px 0 0}.purchase-options{padding:0}.purchase-options summary{padding:22px 0;display:flex;align-items:center;gap:11px;cursor:pointer;list-style:none}.purchase-options summary::-webkit-details-marker{display:none}.purchase-options summary strong{font-weight:650;font-size:1rem;letter-spacing:-.02em}.purchase-options summary small{display:block;font-size:.7rem;color:var(--muted);margin-top:5px}.summary-plus{margin-left:auto;font-size:1.3rem;color:var(--muted);font-weight:300}.purchase-options[open] .summary-plus{transform:rotate(45deg)}.options-content{padding:0 0 22px}.form-actions{display:flex;gap:18px;align-items:center;padding-top:24px}.primary-button{border:0;border-radius:9px;background:var(--green);color:white;padding:15px 21px;font-size:.85rem;line-height:1.3;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:17px;min-height:48px;text-decoration:none}.primary-button:hover{background:var(--green-dark);text-decoration:none}.form-actions .primary-button{flex:1}.text-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;background:none;color:var(--green);padding:8px 0;min-height:40px;font-size:.76rem;font-weight:550}.text-button:hover{text-decoration:underline}.reset-button{font-size:.73rem;color:var(--muted)}.outline-button{border:1px solid #becfba;background:white;color:var(--green);border-radius:8px;padding:11px 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:.78rem;font-weight:600;min-height:44px}.outline-button:hover{background:#f1f5ee}.local-note{font-size:.67rem;color:#7a8475;text-align:center;margin:14px 0 0}.result-column{position:sticky;top:24px;min-width:0}.result-card{color:#fff;background:var(--green);border-radius:var(--radius);padding:29px;position:relative;overflow:hidden;box-shadow:0 14px 28px #173c3210;min-height:465px}.result-label{font-size:.63rem;letter-spacing:.17em;font-weight:600;color:#d4dec9}.result-card h2{font-size:1.8rem;font-weight:550;line-height:1.2;margin:20px 0 16px}.result-card>p{color:#d4ded2;font-size:.81rem;line-height:1.7}.empty-checks{display:grid;gap:14px;margin-top:24px;font-size:.73rem;color:#e1e8da}.empty-checks span{display:flex;gap:10px;align-items:center}.empty-checks .icon{width:15px;height:15px;color:#d4bc7f}.result-footnote{font-size:.65rem;margin-top:29px;padding-top:18px;border-top:1px solid #ffffff25;color:#c2cebd}.empty-art{height:110px;position:relative;margin-top:14px;max-width:210px;margin-inline:auto}.art-pot,.art-small-pot{position:absolute;width:77px;height:83px;left:37px;top:20px;border:1px solid #ddcc9b;border-radius:7px 7px 17px 17px;background:#eee3c5;transform:rotate(-7deg);box-shadow:9px 7px 0 #17392e}.art-pot:before,.art-small-pot:before{content:"";position:absolute;top:-6px;left:-3px;right:-3px;height:12px;border:1px solid #bfae80;border-radius:50%;background:#f8f0db}.art-pot span,.art-small-pot span{position:absolute;top:25px;width:100%;height:32px;background:#9cae8d}.art-small-pot{height:57px;width:53px;left:109px;top:49px;transform:rotate(8deg);background:#e7bf76}.art-small-pot span{background:#b7893f;top:18px;height:21px}.art-tick{position:absolute;left:156px;top:15px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#d7e2c2;color:#244e40;font-size:22px;transform:rotate(7deg)}.result-helper{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px;padding:14px 8px;font-size:.7rem;color:var(--muted)}.result-helper .text-button{font-size:.7rem}.estimate-note{max-width:680px;font-size:.72rem;color:#788171;line-height:1.7;margin:22px 0 38px}.result-heading{margin-top:27px;font-size:.89rem;color:#e2e9db}.result-quantity{font-size:clamp(2.7rem,4.5vw,4rem);line-height:1.1;font-weight:550;letter-spacing:-.06em;margin:7px 0 7px}.result-quantity small{font-size:.46em;letter-spacing:0;font-weight:400;color:#d4dfc9}.quantity-sub{font-size:.72rem;color:#c8d7bf;margin-bottom:22px}.shopping-list{background:#fcfcf5;color:var(--ink);border-radius:12px;padding:20px;margin-top:20px}.shopping-title{font-size:1.23rem;font-weight:700;letter-spacing:-.04em;margin:0 0 17px;display:flex;gap:7px;align-items:center}.pot-lines{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:10px}.pot-lines li{display:flex;align-items:center;gap:10px;font-size:.83rem}.pot-lines svg{color:#5c7556;width:17px}.shopping-list dl,.example-receipt dl{margin:0}.shopping-list dl>div,.example-receipt dl>div{display:flex;justify-content:space-between;gap:10px;font-size:.76rem;padding:11px 0;border-top:1px solid #e0e5d8}.shopping-list dt{color:#6a7660}.shopping-list dd,.example-receipt dd{font-weight:650;margin:0;text-align:right}.shopping-list .budget{font-size:.96rem;margin-top:4px;border-top:1px dashed #b8c6b0;padding-top:15px}.budget dd.unknown{font-size:.7rem;font-weight:400;max-width:120px;line-height:1.5}.shopping-notice{font-size:.71rem;color:#6b7564;line-height:1.6;margin-bottom:0}.result-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:21px}.result-metrics span{font-size:.65rem;color:#c7d5bf}.result-metrics strong{display:block;font-size:.88rem;font-weight:550;margin-top:5px;color:white}.result-details{margin-top:24px;padding-top:17px;border-top:1px solid #ffffff26;font-size:.75rem}.result-details summary{cursor:pointer;min-height:35px;font-weight:500}.result-details dl{margin:10px 0}.result-details dl>div{display:flex;justify-content:space-between;gap:14px;margin:11px 0;font-size:.7rem}.result-details dt{color:#d0ddc7}.result-details dd{margin:0;font-weight:550;text-align:right}.result-details p{font-size:.69rem;color:#d0ddc7}.copy-button{display:flex;width:100%;gap:9px;justify-content:center;align-items:center;border:1px solid #ffffff45;border-radius:8px;background:transparent;color:#f7f6eb;font-size:.77rem;padding:12px;margin-top:20px;min-height:44px}.copy-button:hover{background:#ffffff10}.purchase-choice{margin-top:18px;display:flex;gap:5px}.purchase-choice button{background:transparent;color:#deead5;border:1px solid #ffffff40;border-radius:6px;padding:8px;font-size:.68rem;flex:1;min-height:40px}.purchase-choice button[aria-pressed=true]{background:#f0e4c5;color:#244e40;border-color:#f0e4c5}.comparison-note{font-size:.69rem;line-height:1.6;color:#d1ddc7;margin:12px 0 0}.pending-result{padding-top:55px}.pending-result h2{font-size:1.5rem}.result-card[aria-busy=true]{opacity:.83}.row-card{padding:17px;border:1px solid var(--line);border-radius:11px;margin-bottom:15px;background:#fff}.row-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.row-heading h3,.row-heading h4{margin:0;font-size:.87rem;letter-spacing:-.02em}.remove-button{display:grid;place-items:center;color:#778472;border:0;background:none;padding:10px;width:40px;height:40px;margin:-9px -6px -9px 0;border-radius:5px}.remove-button:hover{background:#f5eae5;color:#9a4435}.remove-button svg{width:16px}.opening-card{padding:14px;background:#f7f8f3;border-radius:8px;margin-top:12px}.opening-card .field input{height:43px;font-size:.94rem}.opening-actions{display:flex;gap:20px;flex-wrap:wrap;margin-top:10px}.section-help{font-size:.78rem;color:var(--muted);margin-bottom:17px;line-height:1.6}.fineprint{font-size:.68rem;color:#78816f;line-height:1.6;margin:13px 0 0}.ceiling-option{border-top:1px solid var(--line);padding-top:18px;margin-top:20px}.check-label{display:flex;align-items:center;gap:10px;font-size:.83rem;font-weight:550;min-height:40px}.check-label input{accent-color:var(--green);width:18px;height:18px}.ceiling-option .section-help{margin-top:12px}.package-card{background:#fafbf7}.error-summary,.example-notice{margin-top:20px;padding:14px;border-radius:8px;font-size:.8rem;line-height:1.6}.error-summary{background:#fff2ee;border:1px solid #e9b7a6;color:#923b30}.error-summary a{text-decoration:underline;display:block;padding-top:4px}.example-notice{background:#fbf3df;color:#6e5830}.ad-slot{height:100px;border-top:1px solid #e7e9e0;border-bottom:1px solid #e7e9e0;margin:32px 0 64px;display:flex;justify-content:center;align-items:flex-start;padding-top:13px}.ad-slot span{font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:#8d9386}.editorial{max-width:980px;margin:auto}.editorial-intro{max-width:690px}.editorial h2{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:550;margin-bottom:19px}.editorial p{color:var(--muted);font-size:.89rem}.formula-card{background:#edf1e6;border:1px solid #dce4d2;border-radius:12px;padding:23px 26px;margin-top:27px}.formula-card>span{font-size:.7rem;color:#67775b}.formula-card strong{display:block;font-size:1.07rem;font-weight:600;margin-top:9px;letter-spacing:-.03em}.formula-card p{font-size:.77rem;margin:12px 0 0;max-width:540px}.example-section{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;padding:65px 0;align-items:center;border-bottom:1px solid var(--line)}.example-section .outline-button{margin-top:20px}.example-receipt{background:#fffefa;padding:30px 26px;border:1px solid #e2e5d9;box-shadow:6px 8px 0 #edf0e6;transform:rotate(1deg);border-radius:3px}.example-receipt>span{font-size:.56rem;letter-spacing:.11em;color:#778570}.example-receipt h3{font-size:1.55rem;margin-top:20px}.example-receipt .receipt-total{font-size:1rem;padding-top:20px;margin-top:10px;border-top-style:dashed}.advice-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:55px;padding:60px 0;border-bottom:1px solid var(--line)}.check-list{list-style:none;padding:0;display:grid;gap:19px}.check-list li{display:flex;align-items:flex-start;gap:13px;font-size:.84rem;line-height:1.6;color:var(--muted)}.check-list .icon{color:#6e8658;width:17px;height:20px;margin-top:2px}.mistakes{background:#efefe5;border-radius:12px;padding:25px}.mistakes h2{font-size:1.15rem}.mistakes ul{padding-left:18px;color:var(--muted);font-size:.82rem;line-height:1.7;display:grid;gap:12px;margin-bottom:0}.faq-section{padding:60px 0}.faq-section details{border-bottom:1px solid var(--line);padding:19px 0}.faq-section summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:.91rem;font-weight:550;min-height:26px}.faq-section summary::-webkit-details-marker{display:none}.faq-section summary span{font-size:1.3rem;font-weight:300}.faq-section details[open] summary span{transform:rotate(45deg)}.faq-section details p{margin:16px 30px 2px 0;font-size:.85rem}.sources-section{border-top:1px solid var(--line);padding:40px 0}.sources-section h2{font-size:1.4rem}.sources-section ul{list-style:none;padding:0;display:grid;gap:20px;margin:25px 0}.sources-section a{font-size:.84rem;text-decoration:underline;text-decoration-color:#a1b195;text-underline-offset:4px}.sources-section li p{font-size:.74rem;margin:6px 0}.sources-section>small{color:var(--muted);font-size:.67rem}.related-section{padding:35px 0 75px;border-top:1px solid var(--line)}.related-section h2{font-size:1.4rem}.upcoming-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:22px 0}.upcoming-tools>span{border:1px solid var(--line);border-radius:8px;padding:18px;font-size:.8rem}.upcoming-tools small{display:block;font-size:.66rem;color:#7e886f;margin-top:10px}.text-link{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;color:var(--green)}.site-footer{background:#edf0e7;border-top:1px solid #dde3d4}.footer-inner{max-width:1140px;margin:auto;padding:35px 0;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:16px}.footer-brand{font-size:1.08rem;gap:0}.footer-inner>p{text-align:right;margin:0;font-size:.77rem;color:#6c7b62}.footer-inner>div{display:flex;gap:22px;font-size:.7rem}.footer-inner>small{text-align:right;font-size:.64rem;color:#78866d;line-height:1.6}.home-hero{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:30px;min-height:530px;padding-block:70px}.home-hero .hero-description{font-size:1.05rem;line-height:1.7;color:var(--muted);margin-bottom:30px}.hero-reassurance{font-size:.68rem;color:#71806b;margin-top:17px}.home-art{height:380px;position:relative}.art-orbit{width:310px;height:310px;background:#e7eddf;border-radius:50%;position:absolute;left:8%;top:20px}.home-receipt{position:absolute;width:255px;left:18%;top:35px;padding:25px;background:#fffef8;transform:rotate(-7deg);border:1px solid #dce2d2;box-shadow:10px 15px 0 #cad4bd60}.home-receipt>span{font-size:.52rem;letter-spacing:.1em;color:#718260}.home-receipt strong{display:block;font-size:1.6rem;letter-spacing:-.035em;font-weight:550;margin:12px 0}.receipt-line{height:1px;border-top:1px dashed #cbd4bb;margin:20px 0}.home-receipt i{display:grid;place-items:center;background:var(--green);border-radius:50%;color:#f0e9d0;height:38px;width:38px;margin-left:auto;font-size:24px;font-style:normal}.home-paint-chip{position:absolute;bottom:20px;right:15px;height:135px;width:95px;background:linear-gradient(to bottom,#c8d2ba 0 33%,#96a88b 33% 66%,#60795c 66%);transform:rotate(15deg);border:6px solid #fffef7;border-radius:3px;box-shadow:4px 5px 0 #37432f10}.home-tools{padding-top:20px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.section-heading h2{margin:0;font-weight:550;font-size:1.7rem}.tool-card{background:#fffefb;border:1px solid var(--line);border-radius:16px;padding:32px;display:flex;gap:26px;position:relative;box-shadow:var(--shadow)}.tool-card:hover{text-decoration:none;border-color:#8ba57a;background:#fff}.tool-icon{display:grid;place-items:center;background:#e9efe1;border-radius:12px;min-width:65px;height:65px;color:var(--green)}.tool-icon svg{width:32px;height:32px}.tool-card .eyebrow{font-size:.6rem;margin-bottom:10px}.tool-card h2{font-size:1.5rem;font-weight:550;margin-bottom:10px}.tool-card p{font-size:.85rem;color:var(--muted);margin-bottom:20px}.card-link{display:flex;align-items:center;gap:10px;font-size:.78rem;font-weight:650;color:var(--green)}.card-index{font-size:2.5rem;font-weight:300;color:#d3dbcd;margin-left:auto;align-self:center}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:60px;padding:65px 0 20px}.principles>div>span{font-size:.72rem;color:#9c864e}.principles h2{font-size:1.1rem;margin:14px 0 8px}.principles p{font-size:.8rem;color:var(--muted)}.category-intro{padding:50px 0}.category-intro h1{font-size:clamp(2.5rem,5vw,3.5rem)}.hero-description{font-size:1rem;color:var(--muted)}.available{color:#6c7d60;font-size:.71rem}.category-note{max-width:700px;padding:60px 0 5px}.category-note h2{font-size:1.7rem;font-weight:550}.category-note p{color:var(--muted);font-size:.9rem}.no-script{background:#f6ebd5;border-radius:8px;padding:18px;color:#634c2c}
@media(min-width:1440px){.paint-intro{padding-block:40px}.container{width:min(1160px,calc(100% - 64px))}}
@media(max-width:900px){.container{width:calc(100% - 40px)}.header-inner{padding:18px 20px}.site-header nav{gap:18px}.calculator-layout{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px}.form-content{padding-inline:20px}.card-topline{padding-inline:20px}.result-card{padding:23px}.hero-badge{display:none}.margin-row{gap:15px}.margin-note{font-size:.68rem}.result-helper{justify-content:center;text-align:center}.example-section{gap:35px}.footer-inner{padding-inline:24px}.home-hero h1{font-size:3.5rem}.home-art{transform:scale(.86);transform-origin:center}}
@media(max-width:720px){.container{width:calc(100% - 32px)}.header-inner{padding:17px 16px;gap:15px}.brand{font-size:1rem;gap:7px}.brand-mark{width:28px;height:29px}.site-header nav>a:first-child{font-size:.7rem}.site-header nav .nav-tool{display:none}.breadcrumb{padding-top:20px;font-size:.68rem}.paint-intro{padding:27px 0}.paint-intro h1{font-size:2.3rem}.paint-intro p{font-size:.87rem;line-height:1.7}.eyebrow{font-size:.6rem;letter-spacing:.13em;margin-bottom:13px}.calculator-layout{grid-template-columns:1fr;gap:22px}.calculator-card{border-radius:16px}.card-topline{padding:15px 19px;font-size:.75rem}.form-content{padding-inline:19px}.form-step{padding-block:23px}.purchase-options{padding:0}.mode-switch{margin-bottom:20px}.mode-switch span{font-size:.71rem;min-height:47px;padding-inline:7px}.field label{font-size:.77rem}.fields-two{gap:13px}.field input{font-size:1rem;height:49px;padding-right:50px}.field-help{font-size:.68rem}.margin-row{gap:20px}.margin-note{font-size:.69rem}.form-actions{gap:16px;flex-wrap:wrap}.form-actions .primary-button{min-width:190px}.result-column{position:static}.result-card{padding:26px;min-height:0;border-radius:16px}.result-card h2{font-size:1.7rem}.result-quantity{font-size:3.5rem}.result-helper{justify-content:space-between;padding-inline:5px}.estimate-note{margin:16px 2px 28px}.ad-slot{height:90px;margin:25px 0 45px}.editorial h2{font-size:1.65rem}.formula-card{padding:20px}.formula-card strong{font-size:.97rem;line-height:1.5}.example-section{grid-template-columns:1fr;gap:30px;padding:45px 0}.example-receipt{max-width:390px;width:100%;justify-self:center;transform:rotate(.5deg)}.advice-grid{grid-template-columns:1fr;gap:24px;padding:40px 0}.faq-section{padding:40px 0}.faq-section summary{font-size:.85rem}.sources-section h2,.related-section h2{font-size:1.4rem}.related-section{padding-bottom:45px}.upcoming-tools{grid-template-columns:1fr}.upcoming-tools>span{display:flex;justify-content:space-between;gap:15px;padding:16px}.upcoming-tools small{margin:0}.footer-inner{grid-template-columns:1fr;padding:28px 20px;gap:15px}.footer-inner>p,.footer-inner>small{text-align:left}.home-hero{grid-template-columns:1fr;gap:0;padding:47px 0 30px;min-height:0}.home-hero h1{font-size:3.2rem}.home-hero .hero-description{font-size:.95rem}.home-art{height:310px;max-width:370px;width:100%;justify-self:center;transform:scale(.82);margin-block:-5px}.home-tools{padding-top:0}.section-heading{align-items:flex-start;flex-direction:column;gap:14px}.section-heading h2{font-size:1.55rem}.tool-card{padding:23px 20px;gap:15px}.tool-icon{min-width:43px;height:45px;border-radius:9px}.tool-icon svg{width:24px}.tool-card h2{font-size:1.26rem;line-height:1.3}.tool-card p{font-size:.8rem}.card-index{display:none}.principles{grid-template-columns:1fr;gap:20px;padding:35px 0 10px}.principles>div{padding-bottom:15px;border-bottom:1px solid var(--line)}.principles h2{margin-top:9px}.category-intro{padding:35px 0}.category-intro h1{font-size:2.45rem}.category-note{padding-top:40px}.category-note h2{font-size:1.5rem}.empty-art{margin-top:23px}.opening-card{padding:12px}.row-card{padding:14px}.optional{font-size:.6rem}.purchase-options summary strong{font-size:.94rem}}
@media(max-width:370px){.container{width:calc(100% - 24px)}.header-inner{padding-inline:12px}.brand{font-size:.87rem}.brand-mark{width:24px;height:26px}.site-header nav>a:first-child{font-size:.63rem}.paint-intro h1{font-size:2.05rem}.form-content{padding-inline:15px}.margin-row{grid-template-columns:1fr}.margin-note{display:none}.form-actions{flex-direction:column;gap:7px}.form-actions .primary-button{width:100%}.result-helper{justify-content:center}.field label{font-size:.7rem}.input-unit{right:10px}.field input{padding-left:10px}.fields-two{gap:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{.site-header,.site-footer,form,.ad-slot,.result-helper,.editorial,.copy-button,.purchase-choice{display:none!important}.calculator-layout{display:block}.result-column{position:static}.result-card{color:black;background:white;border:1px solid #ccc}.result-card *{color:black!important}.result-details{display:block}.estimate-note{color:black}}

/* Reserved ad space, separated from controls and results. */
.ad-slot-live{display:block;height:auto;min-height:280px;padding:16px 0;margin:48px 0 64px;overflow:hidden}.ad-slot-live>span{display:block;text-align:center;margin-bottom:16px}.ad-slot-live ins{min-height:250px}.footer-inner>div{flex-wrap:wrap}select:focus-visible{outline:3px solid #bc8a2e;outline-offset:4px}@media(max-width:720px){.ad-slot-live{min-height:150px;margin:40px 0}.ad-slot-live ins{min-height:120px}}

/* Small secondary text retains the palette with readable contrast. */
.fineprint,.local-note,.estimate-note,.input-unit,.footer-inner>small,.available,.hero-reassurance,.ad-slot span,.optional,.quiet,.margin-note,.info-note{color:#596752}

/* ========================================================================== */
/* V2 PREMIUM — Juste la quantité                                             */
/* Passe visuelle globale, sans modification du HTML ni de la logique métier. */
/* ========================================================================== */

:root{
  --ink:#1d3028;
  --ink-strong:#13241d;
  --muted:#63736a;
  --green:#214b3c;
  --green-dark:#15372d;
  --green-deep:#102a22;
  --sage:#e8eee6;
  --sage-2:#f1f4ee;
  --cream:#f7f4ed;
  --paper:#fffdf8;
  --white:#fff;
  --line:#d9e1d8;
  --line-strong:#c8d4c7;
  --gold:#c69a4a;
  --gold-dark:#9f762f;
  --gold-soft:#f1e5c9;
  --danger:#a84034;
  --radius:22px;
  --radius-sm:12px;
  --shadow:0 18px 50px rgba(24,53,42,.08),0 3px 10px rgba(24,53,42,.035);
  --shadow-soft:0 10px 30px rgba(24,53,42,.055);
  --shadow-strong:0 26px 70px rgba(14,39,31,.16);
  color:var(--ink);
  background:var(--cream);
}

html{
  scroll-behavior:smooth;
  background:var(--cream);
}

body{
  min-height:100vh;
  background:
    radial-gradient(circle at 8% -10%,rgba(198,154,74,.07),transparent 28rem),
    radial-gradient(circle at 90% 5%,rgba(33,75,60,.055),transparent 34rem),
    var(--cream);
  color:var(--ink);
  text-rendering:optimizeLegibility;
}

::selection{
  background:var(--gold-soft);
  color:var(--green-dark);
}

p{line-height:1.72}

h1,h2,h3,h4{
  color:var(--ink-strong);
  letter-spacing:-.04em;
}

h1{
  font-size:clamp(2.55rem,5vw,4.75rem);
  font-weight:690;
  line-height:1.01;
  letter-spacing:-.055em;
}

h1 em{
  color:var(--green);
  text-decoration-thickness:.06em;
  text-underline-offset:.08em;
}

h2{
  font-size:clamp(1.75rem,3vw,2.25rem);
  font-weight:620;
  letter-spacing:-.045em;
}

h3{font-weight:650}

.container{
  width:min(1180px,calc(100% - 56px));
}

/* Header */
.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,253,248,.9);
  border-bottom:1px solid rgba(214,224,214,.78);
  backdrop-filter:blur(18px) saturate(1.1);
  -webkit-backdrop-filter:blur(18px) saturate(1.1);
  box-shadow:0 1px 0 rgba(255,255,255,.75);
}

.header-inner{
  max-width:1280px;
  padding:17px 34px;
}

.brand{
  gap:11px;
  font-size:1.18rem;
  font-weight:790;
  letter-spacing:-.058em;
}

.brand-mark{
  width:36px;
  height:38px;
  border-radius:12px 12px 5px 12px;
  background:
    linear-gradient(145deg,#2a5d4a,var(--green-dark));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 7px 18px rgba(21,55,45,.14);
}

.brand-dot{color:var(--gold)}

.site-header nav{
  gap:32px;
  font-size:.82rem;
  font-weight:620;
}

.site-header nav a{
  position:relative;
  padding:10px 0;
}

.site-header nav a:hover{
  text-decoration:none;
  color:var(--green);
}

.site-header nav [aria-current=page]{
  text-decoration:none;
}

.site-header nav [aria-current=page]::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:3px;
  height:2px;
  border-radius:999px;
  background:var(--gold);
}

.breadcrumb{
  padding-top:28px;
  font-size:.72rem;
}

.breadcrumb a:hover{
  color:var(--green);
}

/* Intro / hero */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#557061;
  font-size:.65rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.eyebrow::before{
  content:"";
  width:22px;
  height:1px;
  background:var(--gold);
}

.paint-intro{
  padding:44px 0 38px;
}

.paint-intro h1{
  max-width:880px;
  font-size:clamp(2.5rem,4.5vw,3.75rem);
  line-height:1.02;
  margin-bottom:20px;
}

.paint-intro p{
  max-width:720px;
  font-size:1.01rem;
  color:var(--muted);
}

.hero-badge{
  border:1px solid #dce6d8;
  background:rgba(239,244,234,.88);
  color:#526a5a;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}

/* Calculator shell */
.calculator-layout{
  grid-template-columns:minmax(0,1.55fr) minmax(330px,1fr);
  gap:30px;
}

.calculator-card{
  border:1px solid rgba(205,216,205,.9);
  background:rgba(255,255,255,.95);
  border-radius:24px;
  box-shadow:var(--shadow);
}

.card-topline{
  min-height:58px;
  padding:16px 30px;
  background:
    linear-gradient(180deg,#f7f9f4,#f1f5ef);
  border-bottom:1px solid #dce4da;
}

.card-topline>span:first-child{
  font-weight:720;
  color:#385548;
}

.quiet{
  color:#6a796f;
  font-size:.67rem;
}

.form-content{
  padding:2px 30px 26px;
}

.form-step{
  padding:30px 0;
  border-bottom:1px solid #e4e9e2;
}

.form-step:last-of-type{
  border-bottom-color:#e8ece6;
}

.step-heading{
  margin-bottom:21px;
}

.step-heading h2{
  color:#1b342a;
  font-size:1.11rem;
  font-weight:720;
}

.step-number{
  width:29px;
  height:29px;
  border:1px solid #d3dfd1;
  background:#eef4eb;
  color:var(--green);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

/* Switch / segmented controls */
.mode-switch{
  gap:5px;
  padding:6px;
  border:1px solid #e0e6dc;
  border-radius:13px;
  background:#eef2ec;
}

.mode-switch span{
  min-height:46px;
  border-radius:9px;
  font-size:.8rem;
  font-weight:650;
  transition:
    background-color .18s ease,
    color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.mode-switch input:checked+span{
  color:var(--green-dark);
  background:var(--paper);
  box-shadow:
    0 5px 14px rgba(36,78,64,.08),
    inset 0 0 0 1px rgba(209,220,207,.9);
}

/* Fields */
.field label{
  color:#263c32;
  font-size:.8rem;
  font-weight:700;
  margin-bottom:9px;
}

.optional{
  color:#79857c;
  font-size:.62rem;
}

.field input,
.field select,
select{
  width:100%;
  min-height:52px;
  border:1px solid #cbd7ca;
  border-radius:11px;
  background:#fffefa;
  color:var(--ink-strong);
  box-shadow:
    inset 0 1px 1px rgba(21,55,45,.025),
    0 1px 0 rgba(255,255,255,.8);
  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    background-color .16s ease,
    transform .16s ease;
}

.field input{
  height:52px;
  padding:10px 62px 10px 15px;
  font-size:1.08rem;
  font-weight:600;
}

.field select,
select{
  padding:10px 40px 10px 14px;
}

.field input:hover,
.field select:hover,
select:hover{
  border-color:#b6c7b5;
}

.field input:focus,
.field select:focus,
select:focus{
  outline:none;
  border-color:#6f9479;
  background:#fff;
  box-shadow:
    0 0 0 4px rgba(36,78,64,.09),
    0 6px 18px rgba(36,78,64,.045);
}

.input-unit{
  color:#69796f;
  font-weight:600;
}

.field-help{
  margin-top:8px;
  color:#637169;
  font-size:.69rem;
  line-height:1.55;
}

.field-error{
  color:var(--danger);
  font-weight:560;
}

.field input[aria-invalid=true]{
  border-color:#b94b3d;
  background:#fffaf8;
  box-shadow:0 0 0 4px rgba(185,75,61,.075);
}

.info-note{
  border:1px solid #e2e7db;
  background:#f6f8f2;
  color:#5d6f63;
  border-radius:10px;
  padding:13px 14px;
}

.margin-note{
  color:#68776d;
}

.purchase-options summary{
  padding:24px 0;
}

.purchase-options summary strong{
  color:#243d32;
  font-size:1.02rem;
  font-weight:690;
}

.purchase-options summary small{
  color:#6d7a72;
}

.summary-plus{
  display:grid;
  place-items:center;
  width:31px;
  height:31px;
  border:1px solid #d8e0d6;
  border-radius:50%;
  background:#f6f8f3;
  transition:transform .2s ease,background-color .2s ease;
}

/* Buttons */
.primary-button{
  min-height:52px;
  padding:15px 23px;
  border-radius:11px;
  background:
    linear-gradient(180deg,#285745,var(--green));
  color:#fff;
  font-size:.84rem;
  font-weight:690;
  box-shadow:
    0 10px 22px rgba(25,62,50,.16),
    inset 0 1px 0 rgba(255,255,255,.15);
  transition:
    transform .16s ease,
    box-shadow .16s ease,
    background .16s ease;
}

.primary-button:hover{
  background:
    linear-gradient(180deg,#214b3c,var(--green-dark));
  transform:translateY(-1px);
  box-shadow:
    0 13px 26px rgba(25,62,50,.2),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.primary-button:active{
  transform:translateY(0);
  box-shadow:0 5px 14px rgba(25,62,50,.14);
}

.outline-button{
  border:1px solid #bfd0bd;
  border-radius:10px;
  background:rgba(255,255,255,.82);
  color:var(--green-dark);
  font-weight:650;
  transition:background-color .16s ease,border-color .16s ease,transform .16s ease;
}

.outline-button:hover{
  background:#f2f6ef;
  border-color:#a9c0a7;
  transform:translateY(-1px);
}

.text-button{
  color:var(--green);
  font-weight:620;
}

.reset-button{
  color:#718076;
}

/* Signature result card */
.result-column{
  top:92px;
}

.result-card{
  isolation:isolate;
  min-height:465px;
  padding:31px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:24px;
  background:
    linear-gradient(155deg,#285846 0%,#1d493a 50%,#15382d 100%);
  box-shadow:var(--shadow-strong);
}

.result-card::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:300px;
  height:300px;
  top:-150px;
  right:-100px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(226,182,97,.16),transparent 68%);
}

.result-card::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:240px;
  height:240px;
  left:-140px;
  bottom:-150px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.06),transparent 70%);
}

.result-label{
  color:#e2cf9e;
  font-size:.61rem;
  font-weight:720;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.result-card h2{
  color:#fff;
  font-size:1.92rem;
  font-weight:610;
  letter-spacing:-.045em;
}

.result-card>p{
  color:#d5e1d7;
}

.result-quantity{
  margin:9px 0 6px;
  color:#fff;
  font-size:clamp(3rem,4.7vw,4.45rem);
  font-weight:600;
  letter-spacing:-.065em;
}

.result-quantity small{
  color:#d8e5d6;
}

.quantity-sub{
  color:#cad8ca;
}

.empty-checks{
  color:#e4ece0;
}

.empty-checks .icon{
  color:#e4c67f;
}

.result-footnote{
  color:#c7d4c6;
  border-top-color:rgba(255,255,255,.15);
}

/* Purchase card inside result */
.shopping-list{
  margin-top:22px;
  padding:22px;
  border:1px solid rgba(255,255,255,.7);
  border-radius:15px;
  background:
    linear-gradient(180deg,#fffef8,#f8f5eb);
  color:var(--ink);
  box-shadow:
    0 12px 26px rgba(9,30,23,.16),
    inset 0 1px 0 #fff;
}

.shopping-title{
  color:#1b342a;
  font-size:1.28rem;
}

.pot-lines li{
  font-size:.84rem;
}

.pot-lines svg{
  color:#667f5f;
}

.shopping-list dl>div,
.example-receipt dl>div{
  border-top-color:#e5e5d9;
}

.shopping-list dt{
  color:#68756b;
}

.shopping-list .budget{
  border-top-color:#b6c2ae;
}

.shopping-notice{
  color:#647066;
}

/* Metrics / details */
.result-metrics{
  gap:11px;
}

.result-metrics>div,
.result-metrics>span{
  border-radius:10px;
}

.result-metrics span{
  color:#c7d7c7;
}

.result-metrics strong{
  color:#fff;
}

.result-details{
  border-top-color:rgba(255,255,255,.16);
}

.result-details summary{
  color:#f0f5ec;
}

.result-details dt,
.result-details p{
  color:#cfdbcd;
}

.copy-button{
  border-color:rgba(255,255,255,.26);
  border-radius:10px;
  background:rgba(255,255,255,.025);
  transition:background-color .16s ease,border-color .16s ease,transform .16s ease;
}

.copy-button:hover{
  border-color:rgba(255,255,255,.4);
  background:rgba(255,255,255,.08);
  transform:translateY(-1px);
}

.purchase-choice{
  gap:7px;
}

.purchase-choice button{
  border-radius:8px;
}

.purchase-choice button[aria-pressed=true]{
  background:var(--gold-soft);
  color:var(--green-dark);
  border-color:var(--gold-soft);
}

/* Repeater / cards */
.row-card{
  padding:18px;
  border-color:#dbe3d9;
  border-radius:13px;
  background:#fffefb;
  box-shadow:0 5px 18px rgba(24,53,42,.03);
}

.row-heading h3,
.row-heading h4{
  color:#243d32;
  font-weight:690;
}

.remove-button{
  border-radius:8px;
}

.opening-card{
  border:1px solid #e3e8df;
  background:#f7f9f5;
  border-radius:10px;
}

.package-card{
  background:#fbfcf8;
}

.error-summary{
  border-color:#e4b1a4;
  background:#fff2ed;
}

.example-notice{
  border:1px solid #ead9ad;
  background:#fff7e7;
  color:#70572b;
}

/* Ads: quiet, clearly separated */
.ad-slot{
  margin:38px 0 70px;
  border-top-color:#e1e5dc;
  border-bottom-color:#e1e5dc;
}

.ad-slot-live{
  margin:52px 0 70px;
}

/* Editorial */
.editorial{
  max-width:1020px;
}

.editorial-intro{
  max-width:720px;
}

.editorial h2{
  color:#183027;
  font-weight:610;
  letter-spacing:-.045em;
}

.editorial p{
  color:#66756c;
  font-size:.91rem;
}

.formula-card{
  position:relative;
  overflow:hidden;
  margin-top:30px;
  padding:26px 29px 26px 31px;
  border:1px solid #d9e2d3;
  border-radius:15px;
  background:
    linear-gradient(135deg,#edf2e8,#f5f6ef);
  box-shadow:0 10px 28px rgba(36,78,64,.045);
}

.formula-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--gold);
}

.formula-card>span{
  color:#627358;
  font-weight:620;
}

.formula-card strong{
  color:#233c30;
  font-size:1.12rem;
}

.example-section{
  gap:70px;
  padding:76px 0;
}

.example-receipt{
  position:relative;
  border:1px solid #dddccb;
  border-radius:5px;
  background:#fffef9;
  box-shadow:
    12px 14px 0 #e9ede3,
    0 24px 50px rgba(28,53,40,.08);
  transform:rotate(.7deg);
}

.example-receipt::before{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:-1px;
  height:3px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  opacity:.75;
}

.example-receipt h3{
  color:#1f382d;
}

.advice-grid{
  gap:62px;
  padding:70px 0;
}

.check-list li{
  color:#65736a;
}

.check-list .icon{
  color:#71875f;
}

.mistakes{
  border:1px solid #e0e2d6;
  border-radius:15px;
  background:#efefe6;
  box-shadow:0 9px 24px rgba(45,59,38,.035);
}

.mistakes h2{
  color:#293a2c;
}

.faq-section{
  padding:70px 0;
}

.faq-section details{
  margin-bottom:9px;
  padding:0;
  border:1px solid #dfe5dc;
  border-radius:12px;
  background:rgba(255,255,255,.54);
  overflow:hidden;
}

.faq-section summary{
  min-height:62px;
  padding:17px 20px;
  color:#263d33;
  font-size:.9rem;
  font-weight:640;
}

.faq-section details[open]{
  background:#fffefa;
  box-shadow:0 8px 22px rgba(36,78,64,.035);
}

.faq-section details p{
  margin:0;
  padding:0 20px 20px;
  color:#69766f;
}

.sources-section{
  padding:48px 0;
}

.sources-section a{
  color:#395f4d;
  text-decoration-color:#a7b89c;
}

.related-section{
  padding:45px 0 82px;
}

.upcoming-tools{
  gap:14px;
}

.upcoming-tools>span{
  border-color:#dbe3d8;
  border-radius:12px;
  background:rgba(255,255,255,.6);
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}

.upcoming-tools>span:hover{
  transform:translateY(-2px);
  border-color:#b9cbb6;
  box-shadow:0 10px 22px rgba(36,78,64,.045);
}

/* Home */
.home-hero{
  min-height:560px;
  gap:46px;
  padding-block:82px;
}

.home-hero .hero-description{
  max-width:680px;
  color:#65756b;
  font-size:1.07rem;
}

.hero-reassurance{
  color:#65776a;
  font-weight:540;
}

.home-art{
  filter:drop-shadow(0 20px 35px rgba(27,55,43,.06));
}

.art-orbit{
  background:
    radial-gradient(circle at 35% 30%,#f2f4ed,#dde7d8 75%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}

.home-receipt{
  border-color:#d7dece;
  background:#fffef9;
  box-shadow:
    14px 18px 0 rgba(197,208,185,.45),
    0 26px 55px rgba(24,53,42,.08);
}

.home-receipt i{
  box-shadow:0 7px 16px rgba(33,75,60,.15);
}

.home-tools{
  padding-top:30px;
}

.section-heading h2{
  color:#183027;
  font-size:1.85rem;
  font-weight:630;
}

.tool-card{
  padding:34px;
  border-color:#d8e0d6;
  border-radius:18px;
  background:#fffefa;
  box-shadow:var(--shadow-soft);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background-color .18s ease;
}

.tool-card:hover{
  transform:translateY(-3px);
  border-color:#a8bda5;
  background:#fff;
  box-shadow:0 20px 44px rgba(26,59,46,.085);
}

.tool-icon{
  min-width:68px;
  height:68px;
  border:1px solid #dce6d7;
  border-radius:14px;
  background:
    linear-gradient(145deg,#edf3e8,#e3ebdd);
  color:var(--green);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}

.tool-card h2{
  color:#1f382d;
  font-size:1.55rem;
  font-weight:620;
}

.tool-card p{
  color:#68766d;
}

.card-link{
  color:var(--green);
  font-weight:690;
}

.card-index{
  color:#d7ddd1;
  font-size:2.7rem;
}

.principles{
  gap:70px;
  padding:78px 0 30px;
}

.principles>div{
  position:relative;
}

.principles>div>span{
  color:var(--gold-dark);
  font-weight:700;
}

.principles h2{
  color:#223a2f;
  font-weight:670;
}

.principles p{
  color:#68766d;
}

/* Category pages */
.category-intro{
  padding:66px 0 54px;
}

.category-intro h1{
  max-width:850px;
  font-size:clamp(2.75rem,5.2vw,4.15rem);
}

.hero-description{
  max-width:760px;
  color:#65756b;
}

.available{
  color:#63755f;
  font-weight:620;
}

.category-note{
  max-width:760px;
  padding:72px 0 12px;
}

/* Footer */
.site-footer{
  margin-top:10px;
  border-top:0;
  background:
    linear-gradient(145deg,#18382d,#102a22);
  color:#eef4ec;
}

.footer-inner{
  max-width:1180px;
  padding:42px 0;
}

.footer-brand{
  color:#fff;
}

.footer-inner>p{
  color:#c5d2c6;
}

.footer-inner>div{
  color:#d5dfd4;
}

.footer-inner>div a:hover{
  color:#fff;
}

.footer-inner>small{
  color:#aebdaf;
}

/* Focus treatment */
button:focus-visible,
a:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid rgba(198,154,74,.92);
  outline-offset:4px;
}

/* Desktop wide */
@media(min-width:1440px){
  .container{width:min(1200px,calc(100% - 72px))}
  .paint-intro{padding-block:48px 42px}
  .calculator-layout{gap:34px}
}

/* Tablet */
@media(max-width:900px){
  .container{width:calc(100% - 40px)}
  .header-inner{padding:16px 20px}
  .site-header nav{gap:20px}
  .calculator-layout{
    grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);
    gap:20px;
  }
  .form-content{padding-inline:22px}
  .card-topline{padding-inline:22px}
  .result-card{padding:25px}
  .example-section{gap:38px}
  .home-hero{gap:24px}
}

/* Mobile */
@media(max-width:720px){
  body{
    background:
      radial-gradient(circle at 0 -8%,rgba(198,154,74,.07),transparent 20rem),
      var(--cream);
  }

  .container{width:calc(100% - 30px)}

  .site-header{
    position:sticky;
  }

  .header-inner{
    padding:14px 15px;
  }

  .brand{
    font-size:1rem;
  }

  .brand-mark{
    width:30px;
    height:32px;
  }

  .breadcrumb{
    padding-top:18px;
  }

  .paint-intro{
    padding:31px 0 28px;
  }

  .paint-intro h1{
    font-size:clamp(2.3rem,11vw,3rem);
    line-height:1.03;
  }

  .paint-intro p{
    font-size:.9rem;
  }

  .calculator-layout{
    grid-template-columns:1fr;
    gap:24px;
  }

  .calculator-card{
    border-radius:18px;
  }

  .card-topline{
    min-height:54px;
    padding:14px 18px;
  }

  .form-content{
    padding-inline:18px;
  }

  .form-step{
    padding-block:25px;
  }

  .mode-switch{
    padding:5px;
  }

  .mode-switch span{
    min-height:46px;
  }

  .field input{
    height:51px;
  }

  .form-actions{
    gap:12px;
  }

  .form-actions .primary-button{
    min-width:180px;
  }

  .result-column{
    position:static;
  }

  .result-card{
    padding:27px 23px;
    border-radius:18px;
  }

  .result-card h2{
    font-size:1.72rem;
  }

  .result-quantity{
    font-size:clamp(3rem,14vw,4rem);
  }

  .shopping-list{
    padding:19px;
    border-radius:13px;
  }

  .example-section{
    gap:34px;
    padding:52px 0;
  }

  .advice-grid{
    gap:28px;
    padding:48px 0;
  }

  .faq-section{
    padding:48px 0;
  }

  .faq-section summary{
    min-height:58px;
    padding:16px 17px;
  }

  .faq-section details p{
    padding:0 17px 18px;
  }

  .home-hero{
    padding:55px 0 34px;
  }

  .home-hero h1{
    font-size:clamp(3rem,14vw,3.65rem);
  }

  .home-art{
    height:300px;
  }

  .tool-card{
    padding:22px 19px;
    border-radius:15px;
  }

  .tool-icon{
    min-width:46px;
    height:48px;
    border-radius:10px;
  }

  .tool-card h2{
    font-size:1.28rem;
  }

  .principles{
    padding:42px 0 14px;
  }

  .principles>div{
    padding:2px 0 20px;
  }

  .category-intro{
    padding:42px 0;
  }

  .category-intro h1{
    font-size:clamp(2.45rem,12vw,3.15rem);
  }

  .site-footer{
    margin-top:0;
  }

  .footer-inner{
    padding:34px 20px;
  }
}

@media(max-width:370px){
  .container{width:calc(100% - 22px)}
  .header-inner{padding-inline:11px}
  .brand{font-size:.88rem}
  .paint-intro h1{font-size:2.15rem}
  .form-content{padding-inline:14px}
  .result-card{padding-inline:19px}
  .shopping-list{padding:16px}
}

/* Motion, only where useful */
@media(prefers-reduced-motion:no-preference){
  .tool-card,
  .primary-button,
  .outline-button,
  .copy-button,
  .upcoming-tools>span{
    will-change:transform;
  }
}

/* Print remains intentionally simple */
@media print{
  body{background:white!important}
  .result-card{box-shadow:none!important}
}


/* V2 ADSENSE VALUE PASS */
.value-guide,.hub-value,.home-value,.home-method,.about-expanded{margin-top:clamp(2.5rem,5vw,5rem);margin-bottom:clamp(2.5rem,5vw,5rem);}
.value-guide>p,.hub-value>p,.home-value>p,.home-method>p,.about-expanded>p{max-width:78ch;line-height:1.72;}
.value-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:1.5rem 0;}
.value-grid>div{border:1px solid rgba(36,78,64,.16);border-radius:18px;padding:1.15rem;background:rgba(255,255,255,.6);}
.value-grid h3{margin:.1rem 0 .55rem;font-size:1.05rem;}
.value-grid p{margin:0;line-height:1.62;}
.value-closing{padding:1rem 1.15rem;border-left:3px solid #244e40;background:rgba(36,78,64,.055);border-radius:0 12px 12px 0;}
.about-expanded h2,.home-value h2,.home-method h2,.hub-value h2,.value-guide h2{max-width:28ch;}
@media(max-width:760px){.value-grid{grid-template-columns:1fr}.value-guide,.hub-value,.home-value,.home-method,.about-expanded{margin-top:2.25rem;margin-bottom:2.25rem}}