/* HOMEFRONT Compass: The Secret Life of Your Backyard.
 * Four original symbolic connection plates, NOT botanical or zoological specimens.
 * Type floor: 12px for labels, 14px for safety and fine print, 15px for reading text.
 */
.hf-backyard-world{--bw-night:#13232e;--bw-navy:#1e3341;--bw-ink:#2b3d48;--bw-muted:#4f5d66;--bw-bronze:#6f4f28;--bw-cream:#f4f0e8;--bw-gold:#eaca92;--bw-gold-light:#ffe1ae;color:var(--bw-navy);background:var(--bw-cream)}
.hf-backyard-world *,.hf-backyard-world *:before,.hf-backyard-world *:after{box-sizing:border-box}
.hf-backyard-world button{font:inherit;cursor:pointer}
.hf-backyard-world [hidden]{display:none!important}
.hf-backyard-world .eyebrow{font:700 12px/1.6 Manrope,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.hf-site .hf-backyard-world :is(a,button):focus-visible{outline:3px solid var(--bw-navy);outline-offset:3px}
.hf-site .hf-backyard-world :is(.bw-hero,.bw-sources) :is(a,button):focus-visible{outline-color:var(--bw-gold-light)}
.bw-hero{background:linear-gradient(132deg,#102b35,#1e3341 64%,#2d4b4e);color:#f4f0e8;overflow:hidden}
.bw-hero-layout{display:grid;grid-template-columns:1.03fr .97fr;gap:6%;align-items:center;padding-block:117px 91px}
.bw-hero .hf-crumb{font-size:12px}
.bw-hero .hf-crumb,.bw-hero .hf-crumb a{color:#e2e8e3}
.bw-hero .hf-crumb a{display:inline-block;padding-block:4px}
.bw-hero .eyebrow{color:var(--bw-gold);margin-top:42px}
.bw-hero h1{font:500 clamp(50px,6vw,92px)/1.02 Editorial,Georgia,serif;letter-spacing:-.034em;margin:18px 0 24px}
.bw-hero h1 em{color:var(--bw-gold);font-style:normal}
.bw-hero p:not(.eyebrow){max-width:570px;color:#e0e7e5;font:400 17px/1.8 Manrope,Arial,sans-serif}
.bw-enter{display:inline-flex;align-items:center;gap:28px;background:var(--bw-gold);color:#182f3c;text-decoration:none;border-radius:24px;padding:14px 22px;margin-top:26px;min-height:46px;font:700 14px Manrope,Arial,sans-serif}
.bw-hero-plate{margin:0;height:392px;background:linear-gradient(#ffffff0c 1px,transparent 1px),linear-gradient(90deg,#ffffff0c 1px,transparent 1px),#233c46;background-size:27px 27px;border:1px solid #bba4769a;position:relative;overflow:hidden;box-shadow:17px 20px 0 #0615228a}
.bw-hero-canopy{position:absolute;inset:0 0 38%;display:flex;align-items:end;justify-content:space-evenly}
.bw-hero-canopy i{display:block;height:65%;width:16%;background:#577d66;border-radius:60% 60% 12% 12%;opacity:.8}
.bw-hero-canopy i:nth-child(2){height:87%;background:#708b70}
.bw-hero-canopy i:nth-child(3){height:70%;background:#587d69}
.bw-hero-canopy i:nth-child(4){height:76%;background:#486a5c}
.bw-hero-flowers{position:absolute;bottom:25%;left:7%;right:7%;display:flex;justify-content:space-evenly;align-items:end;height:100px}
.bw-hero-flowers i{display:block;width:18px;height:18px;border-radius:50%;background:var(--bw-gold);box-shadow:0 0 0 7px #c59c76,0 0 0 15px #c59c7655;position:relative}
.bw-hero-flowers i:after{content:"";position:absolute;left:8px;top:26px;width:2px;height:58px;background:#9cbb9d}
.bw-hero-path{position:absolute;bottom:0;height:26%;left:0;right:0;background:linear-gradient(#213f3f,#122a30);border-top:2px solid #7b9180}
.bw-hero-plate figcaption{position:absolute;bottom:14px;left:19px;color:#f3e4c4;font:700 12px Manrope,Arial,sans-serif;letter-spacing:.11em}
.bw-answer{display:grid;grid-template-columns:.42fr .58fr;gap:20px 56px;padding-block:78px 86px;align-items:start}
.bw-answer .eyebrow{color:#7a5a30;grid-column:1/-1;margin:0}
.bw-answer h2,.bw-explorer-head h2,.bw-reading-head h2,.bw-sources h2{font:500 clamp(34px,3.9vw,56px)/1.1 Editorial,Georgia,serif;letter-spacing:-.027em;margin:0;text-wrap:balance}
.bw-answer-text p{font:400 15px/1.8 Manrope,Arial,sans-serif;color:var(--bw-muted);margin:0 0 16px;text-wrap:pretty}
.bw-answer-text .bw-lede{font-size:18px;line-height:1.75;color:var(--bw-navy)}
.bw-explorer{background:#e9e2d6;padding-block:82px 102px}
.bw-explorer-head{max-width:820px}.bw-explorer-head .eyebrow{color:#73552e}
.bw-explorer-head h2{margin:15px 0}
.bw-explorer-head>p:not(.eyebrow){font:400 16px/1.75 Manrope,Arial,sans-serif;color:#4a5861}
.bw-chapters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:36px 0 17px}
.bw-chapters button{background:#faf7ef;border:1px solid #9c8b72;text-align:left;min-width:0;min-height:115px;padding:19px;color:var(--bw-navy);display:flex;flex-direction:column;gap:11px}
.bw-chapters button small{font:700 12px/1.5 Manrope,Arial,sans-serif;color:var(--bw-bronze);letter-spacing:.1em}
.bw-chapters button strong{font:500 23px/1.15 Editorial,Georgia,serif}
.bw-chapters button:hover{border-color:#7d5a2e}
.bw-chapters button[aria-pressed=true]{background:#e3d2b4;border-color:#7d5a2e;box-shadow:inset 0 0 0 2px #9a7340}
.bw-exhibit{display:grid;grid-template-columns:1.05fr .95fr;min-height:560px;border:1px solid #a99575}
.bw-stage{margin:0;background:linear-gradient(130deg,#17333f,#142938);color:#f4f0e8;min-width:0;padding:27px;display:flex;flex-direction:column;justify-content:space-between;gap:18px}
.bw-stage-folio{display:flex;justify-content:space-between;gap:12px;color:var(--bw-gold-light);font:700 12px/1.5 Manrope,Arial,sans-serif;letter-spacing:.12em;margin:0}
.bw-landscape{height:380px;width:100%;margin:auto;position:relative;border:1px solid #728e81;background:linear-gradient(#334d55,#405c5d 54%,#19392f 55%,#1e4437);isolation:isolate;overflow:hidden}
.bw-ground{position:absolute;bottom:0;left:0;right:0;height:32%;background:linear-gradient(#436348,#244339);border-top:2px solid #9db18a}
.bw-fence{position:absolute;right:1%;top:6%;bottom:4%;width:21%;border-left:3px dashed #d1bea494;background:repeating-linear-gradient(90deg,#415263 0,#415263 15px,#314b4b 16px,#314b4b 19px);z-index:2}
.bw-fence span{position:absolute;right:6px;top:13px;writing-mode:vertical-rl;font:700 12px Manrope,Arial,sans-serif;letter-spacing:.08em;color:#f3e4b8;background:#22333d;padding:4px 2px}
.bw-plant{position:absolute;left:19%;bottom:28%;width:21%;height:46%;z-index:2;opacity:.35;transition:opacity .25s}
.bw-stem{height:78%;width:7px;background:#98ae77;margin:18% auto 0;position:relative}
.bw-stem:before,.bw-stem:after{content:"";position:absolute;top:32%;left:-27px;width:35px;height:19px;border-radius:0 50% 50% 50%;transform:rotate(-23deg);background:#6c9874}
.bw-stem:after{top:48%;left:3px;transform:rotate(29deg)}
.bw-flower{height:49px;width:49px;position:absolute;left:calc(50% - 25px);top:0}
.bw-flower i{position:absolute;background:#d6ae88;width:25px;height:25px;border-radius:50%}
.bw-flower i:nth-child(1){top:0;left:12px}.bw-flower i:nth-child(2){top:12px;left:0}.bw-flower i:nth-child(3){top:12px;left:24px}.bw-flower i:nth-child(4){top:24px;left:12px}
.bw-flower b{position:absolute;left:17px;top:17px;width:15px;height:15px;border-radius:50%;background:var(--bw-gold);z-index:2}
.bw-leaf{position:absolute;left:44%;bottom:29%;width:24%;height:19%;opacity:.35;transition:opacity .25s}
.bw-leaf i{position:absolute;width:53px;height:23px;border-radius:50% 5% 50% 5%;background:#8baa78;transform:rotate(30deg)}
.bw-leaf i:nth-child(2){left:39px;top:9px;transform:rotate(-27deg)}
.bw-visitor{opacity:.35;transition:opacity .25s}
.bw-bee{position:absolute;top:19%;left:48%;z-index:3;width:35px;height:21px;background:#ddbd70;border:2px solid #4f3e28;border-radius:50%;transform:rotate(15deg)}
.bw-bee:before,.bw-bee:after{content:"";position:absolute;top:-11px;width:19px;height:15px;border:1px solid #d6e6e4;background:#9fc9c988;border-radius:50%}
.bw-bee:before{left:2px}.bw-bee:after{left:15px;transform:rotate(25deg)}
.bw-bee i{position:absolute;top:1px;left:13px;height:15px;border-left:4px solid #3f4d45}
.bw-beetle{position:absolute;left:54%;top:42%;width:29px;height:27px;border-radius:50%;background:#b77653;border:3px solid #4c473b;z-index:3}
.bw-beetle:before{content:"";position:absolute;left:11px;top:0;bottom:0;border-left:2px solid #513e32}
.bw-cover{position:absolute;left:3%;bottom:9%;width:51%;height:17%;display:flex;justify-content:space-around;align-items:end;opacity:.35;z-index:2}
.bw-cover i{width:27%;height:57%;border-radius:70% 70% 0 0;background:#62896b}
.bw-cover i:nth-child(2){height:90%;background:#729975}.bw-cover i:nth-child(3){height:70%}
.bw-boundary{position:absolute;right:6%;bottom:19%;height:38%;width:11%;z-index:3;opacity:.3}
.bw-boundary i{display:block;height:60%;border-left:2px dashed var(--bw-gold);transform:skewX(-14deg)}
.bw-connection-line{position:absolute;left:33%;top:32%;width:27%;height:12%;border-top:4px dashed var(--bw-gold);transform:rotate(-26deg);z-index:6;opacity:0;transition:opacity .2s}
.bw-landscape[data-layer="pollinator"] :is(.bw-plant,.bw-bee),.bw-landscape[data-layer="predator"] :is(.bw-leaf,.bw-beetle),.bw-landscape[data-layer="habitat"] :is(.bw-cover,.bw-plant),.bw-landscape[data-layer="neighbor"] :is(.bw-fence,.bw-boundary){opacity:1}
.bw-landscape[data-layer="predator"] .bw-connection-line{left:46%;top:44%;width:13%;transform:rotate(0deg)}
.bw-landscape[data-layer="habitat"] .bw-connection-line{left:22%;top:58%;width:30%;transform:rotate(34deg)}
.bw-landscape[data-layer="neighbor"] .bw-connection-line{left:55%;top:38%;width:30%;transform:rotate(68deg)}
.bw-landscape[data-revealed=true] .bw-connection-line{opacity:1}
.bw-stage figcaption{color:var(--bw-gold-light);font:700 12px/1.6 Manrope,Arial,sans-serif;letter-spacing:.08em}
.bw-observation{background:#f9f5ed;padding:clamp(28px,3.5vw,48px);min-width:0}
.bw-now .eyebrow{color:#7a5a30;margin:0}
.bw-observation h3{font:500 clamp(32px,3.5vw,48px)/1.1 Editorial,Georgia,serif;margin:16px 0 8px;text-wrap:balance}
.bw-focus-line,.bw-card-focus{font:700 14px/1.6 Manrope,Arial,sans-serif;color:var(--bw-muted);margin:0 0 16px}
.bw-scene-intro{font:400 15px/1.75 Manrope,Arial,sans-serif;color:var(--bw-ink);text-wrap:pretty}
.bw-reveal[hidden]{display:none!important}
.bw-reveal{min-height:47px;border-radius:25px;border:1px solid var(--bw-navy);background:var(--bw-navy);color:#fff;padding:13px 20px;margin:20px 0;font:700 14px Manrope,Arial,sans-serif!important}
.bw-from{border-left:3px solid #9a7340;background:#ece2d1;padding:16px 19px;margin:0 0 18px}
.bw-from p{font:400 15px/1.75 Manrope,Arial,sans-serif;color:var(--bw-ink);margin:0 0 8px}
.hf-backyard-world .bw-from .bw-from-label{font:700 12px/1.5 Manrope,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--bw-bronze);margin:0 0 6px}
.bw-from a{display:block;width:fit-content;padding-block:4px;color:var(--bw-bronze);font:700 14px/1.4 Manrope,Arial,sans-serif}
.bw-try{font:400 15px/1.75 Manrope,Arial,sans-serif;color:var(--bw-ink);margin:0}
.bw-try strong{color:var(--bw-navy)}
.bw-privacy{font:400 14px/1.7 Manrope,Arial,sans-serif;color:#4a5861;margin-top:20px}
.bw-noscript{background:#fff7e5;color:var(--bw-navy);padding:20px;font:400 15px/1.7 Manrope,Arial,sans-serif}
.bw-reading{padding-block:95px 104px}
.bw-reading-head{max-width:840px}.bw-reading-head .eyebrow{color:#7a5a30}.bw-reading-head h2{margin:16px 0}
.bw-reading-head>p:not(.eyebrow){font:400 16px/1.75 Manrope,Arial,sans-serif;color:var(--bw-muted)}
.bw-reading-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:38px}
.bw-reading-card{background:#faf7f1;border:1px solid #d7cdbd;padding:29px}
.bw-card-code{font:700 12px Manrope,Arial,sans-serif;letter-spacing:.1em;color:#7a5a30;margin:0}
.bw-reading-card h3{font:500 31px/1.14 Editorial,Georgia,serif;margin:14px 0 6px;text-wrap:balance}
.bw-reading-card>p:not(.bw-card-code):not(.bw-card-focus):not(.bw-try){font:400 15px/1.75 Manrope,Arial,sans-serif;color:var(--bw-ink);text-wrap:pretty}
.bw-sources{background:#142e3a;color:#f4f0e8;padding-block:84px 76px}
.bw-sources .eyebrow{color:var(--bw-gold)}.bw-sources h2{margin:17px 0 39px}
.bw-sources-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.bw-sources-grid a{min-width:0;padding:23px;background:#264754;color:#f4f0e8;text-decoration:none;border:1px solid #c2a16f80;display:flex;flex-direction:column;gap:10px}
.bw-sources-grid strong{font:700 15px/1.5 Manrope,Arial,sans-serif}
.bw-sources-grid span{font:400 14px/1.7 Manrope,Arial,sans-serif;color:#dde4e4}
.bw-sources-grid a>span:last-child{color:var(--bw-gold)}
.bw-disclaimer{font:400 15px/1.8 Manrope,Arial,sans-serif;color:#dde4e4;margin-top:30px;padding-top:21px;border-top:1px solid #eaca9257;max-width:950px}
.bw-sources nav{display:flex;flex-wrap:wrap;gap:8px 24px;margin:22px 0}.bw-sources nav a{display:inline-flex;align-items:center;min-height:32px;color:var(--bw-gold);font:700 14px Manrope,Arial,sans-serif;text-decoration:none}
.bw-sources small{font:400 13px/1.6 Manrope,Arial,sans-serif;color:#cfd9db}
@media(max-width:1050px){.bw-hero-layout,.bw-exhibit,.bw-answer{grid-template-columns:1fr}.bw-hero-layout{padding-block:95px 72px}.bw-hero-plate{max-width:670px;height:310px;margin-top:52px}.bw-chapters{grid-template-columns:repeat(2,minmax(0,1fr))}.bw-exhibit{min-height:0}.bw-sources-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.bw-hero-layout{padding-block:85px 60px}.bw-hero h1{font-size:clamp(43px,10.7vw,65px)}.bw-hero-plate{height:227px;padding:14px}.bw-answer{padding-block:56px 60px}.bw-answer-text .bw-lede{font-size:17px}.bw-explorer{padding-block:61px 72px}.bw-chapters{gap:8px}.bw-chapters button{min-height:91px;padding:13px;gap:7px}.bw-chapters strong{font-size:19px}.bw-stage{padding:16px}.bw-landscape{height:282px}.bw-observation{padding:24px}.bw-reading{padding-block:63px}.bw-reading-grid,.bw-sources-grid{grid-template-columns:1fr}.bw-reading-card{padding:23px}.bw-sources{padding-block:64px}}
@media(max-width:360px){.bw-chapters strong{font-size:17px}.bw-landscape{height:250px}.bw-visitor{transform:scale(.8)}.bw-stage-folio{flex-direction:column;gap:2px}}
@media(prefers-reduced-motion:reduce){.hf-backyard-world *,.hf-backyard-world *:before,.hf-backyard-world *:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media print{.bw-hero,.bw-explorer{display:none!important}.bw-reading-grid{display:block}.bw-reading-card{break-inside:avoid;margin-bottom:14px}.bw-sources{background:white;color:#111}.bw-sources-grid a{background:white;color:#111}}
