/* FixCode Guide – WWII home-front poster theme */
@media screen{
:root{--b:#1d2b53;--bg:#f4ead5;--t:#1a1a1a;--m:#4a4238;--red:#c8102e;--navy:#1d2b53;--mus:#f2b705;--cream:#f4ead5;--paper:#fffaf0;--ok:#e3f1e3;--warn:#fff0c2}
body{font:18px/1.65 "Source Sans 3","Source Sans Pro",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--t);background:var(--cream);
 background-image:radial-gradient(#1d2b5312 1px,transparent 1.2px);background-size:6px 6px}
h1,h2,h3,nav.top .brand{font-family:"Oswald","Bebas Neue",Impact,"Arial Narrow",sans-serif;text-transform:uppercase;letter-spacing:.02em;font-weight:700;color:var(--navy)}
h1{font-size:clamp(2rem,6vw,2.8rem);line-height:1.1}
h2{font-size:1.6rem;line-height:1.2;border-bottom:4px solid var(--red);padding-bottom:4px;display:inline-block}
main{max-width:900px}
a{color:#a50d26}a:hover{color:var(--navy)}
small,.m,.ph{color:var(--m)}.ph{font-size:.8rem}
/* nav: navy band with red/white stripe */
nav.top{background:var(--navy);padding:12px 20px;border-bottom:6px solid var(--red);box-shadow:0 4px 0 var(--mus);font-size:1.05rem;font-weight:600}
nav.top .brand{font-size:1.6rem;color:var(--mus)!important;display:inline-flex;align-items:center;gap:8px}
nav.top .brand:before{content:"";width:36px;height:36px;background:url(../img/badge-96.png) center/contain no-repeat;display:inline-block}
nav.top a{color:#fff;padding:4px 2px}nav.top a:hover{color:var(--mus);text-decoration:underline}
/* boxes */
.answer{background:var(--paper);border:3px solid var(--navy);border-left:10px solid var(--red);border-radius:4px;box-shadow:6px 6px 0 var(--navy);font-size:1.1rem}
.box{border:3px solid var(--navy);border-radius:4px;box-shadow:5px 5px 0 #1d2b5333}
.tip{background:var(--ok)}.safety{background:var(--warn);border-color:var(--red)}
.tags span{background:var(--navy);color:#fff;border-radius:3px;font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.05em;font-size:.9rem;padding:3px 10px}
.tags span:first-child{background:var(--red)}
ol.steps>li{background:var(--paper);border:2px solid var(--navy);border-radius:4px;box-shadow:4px 4px 0 #1d2b5333;padding-left:66px}
ol.steps>li:before{background:var(--red);color:#fff;width:38px;height:38px;line-height:38px;font-family:"Oswald",sans-serif;font-size:1.2rem;border:3px solid var(--mus);box-sizing:content-box;left:10px;top:10px}
.badge{font-size:.8rem;border-radius:3px}.free{background:#1e6b34;color:#fff}.cost{background:var(--red);color:#fff}.shop{background:#f2b705;color:#1d2b53}
table{background:var(--paper);border:3px solid var(--navy);font-size:1rem}th{background:var(--navy);color:#fff;font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.04em}td,th{border-bottom:1px solid #d9cba8}
.btn,.chunky{display:inline-block;background:var(--mus);color:#111!important;font-weight:800;padding:10px 18px;border:3px solid var(--navy);border-radius:4px;box-shadow:4px 4px 0 var(--navy);text-decoration:none;text-transform:uppercase;letter-spacing:.03em;transition:transform .08s,box-shadow .08s}
.btn:hover,.chunky:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--navy)}
.chunky.red{background:var(--red);color:#fff!important}
.card{background:var(--paper);border:3px solid var(--navy);border-left:12px solid var(--navy);border-radius:4px;box-shadow:5px 5px 0 #1d2b5340;transition:transform .08s,box-shadow .08s}
.card:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #1d2b5366}
.card strong{color:var(--navy);font-size:1.08rem}
.cat-app .card{border-color:var(--navy)}
.cat-plumb .card{border-color:var(--red)}.cat-plumb .card strong{color:#9e0c24}
.cat-elec .card{border-color:#b98a00;border-left-color:var(--mus)}
.grp>h2{display:block;color:#fff;background:var(--navy);border:0;padding:6px 14px;border-radius:3px;font-size:1.35rem}
.cat-plumb>h2{background:var(--red)}.cat-elec>h2{background:var(--mus);color:#111}
/* footer band */
footer{background:var(--navy);color:#e9e2cf;font-size:.95rem;border-top:6px solid var(--red);box-shadow:0 -4px 0 var(--mus) inset;margin-top:30px}
footer a{color:var(--mus)}footer strong{color:#fff}
/* home hero */
.hero{position:relative;background:var(--navy);color:#fff;border:4px solid var(--navy);border-radius:6px;overflow:hidden;margin:8px 0 22px;box-shadow:8px 8px 0 var(--red);display:grid;grid-template-columns:1fr}
.hero-img{display:block;width:100%;height:auto;background:var(--cream)}
.hero-text{padding:22px 22px 26px;text-align:center;background:var(--navy);border-top:6px solid var(--mus)}
.hero-text .lead{font-family:"Oswald",sans-serif;text-transform:uppercase;font-size:clamp(1.3rem,4vw,1.9rem);line-height:1.25;margin:0 0 6px;font-weight:600}
.hero-text .lead a{color:var(--mus)}
.hero-text h1{color:#fff;font-size:clamp(2.6rem,10vw,4.4rem);margin:2px 0 10px;text-shadow:3px 3px 0 var(--red)}
.hero-text .sub{margin:0 auto 18px;max-width:560px;font-size:1.12rem;color:#f4ead5}
.hero-text .alt{color:#fff;font-weight:700;padding:12px 14px;text-decoration:underline}
.starburst{position:absolute;top:14px;left:14px;width:112px;height:112px;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--red);color:#fff;font-family:"Oswald",sans-serif;font-weight:700;text-transform:uppercase;line-height:1.05;font-size:1rem;
 clip-path:polygon(50% 0,61% 13%,77% 6%,79% 22%,95% 24%,88% 39%,100% 50%,88% 61%,95% 76%,79% 78%,77% 94%,61% 87%,50% 100%,39% 87%,23% 94%,21% 78%,5% 76%,12% 61%,0 50%,12% 39%,5% 24%,21% 22%,23% 6%,39% 13%);transform:rotate(-10deg)}
#search{background:var(--paper);border:3px solid var(--navy);border-radius:6px;padding:16px;box-shadow:6px 6px 0 var(--mus)}
#search>label{font-family:"Oswald",sans-serif;text-transform:uppercase;color:var(--navy);font-size:1.4rem!important}
#q{border:3px solid var(--navy)!important;border-radius:4px!important;font-size:1.2rem!important;background:#fff}
#q:focus{outline:4px solid var(--mus);outline-offset:2px}
#fixform{border:3px solid var(--navy)!important;border-left:10px solid var(--red)!important;border-radius:4px!important;background:#fff!important}
#fixform button{background:var(--mus)!important;border:3px solid var(--navy)!important;border-radius:4px!important;box-shadow:4px 4px 0 var(--navy);text-transform:uppercase;font-weight:800!important}
#qz button{border:2px solid var(--navy)!important;border-radius:4px!important;background:#fff!important;font-size:1.05rem}
#qz button:hover{background:#fff4cc!important}#qz .back{border:0!important;background:none!important;color:#a50d26!important}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
:focus-visible{outline:4px solid var(--mus);outline-offset:2px}
iframe{border:4px solid var(--navy);border-radius:4px;max-width:100%}
.sheet{background:var(--paper)}
@media(min-width:860px){.hero{grid-template-columns:1fr}.hero-text{padding:26px 40px 30px}}
@media(max-width:520px){body{font-size:17px}h1{font-size:1.9rem}.starburst{width:78px;height:78px;font-size:.72rem;top:8px;left:8px}nav.top .brand{font-size:1.35rem}ol.steps>li{padding-left:60px}}
}

@media screen{.ask-rosie{display:flex!important;align-items:center;gap:12px;margin-bottom:10px;font-family:"Oswald",sans-serif;text-transform:uppercase;color:var(--navy);font-size:1.6rem;font-weight:700;line-height:1}.ask-rosie img{display:block;width:52px;height:52px;border-radius:50%;border:3px solid var(--navy);box-shadow:3px 3px 0 var(--red);background:var(--mus)}@media(max-width:520px){.ask-rosie{font-size:1.4rem}.ask-rosie img{width:46px;height:46px}}}
@media screen{.cat-storage>h2{background:#0b6466}.cat-storage .card{border-color:#0b6466}.cat-storage .card strong{color:#0b5456}}