/*
Theme Name: Cocoon Child
Template: cocoon-master
Version: 1.1.3
*/
:root{--hh-ink:#183734;--hh-teal:#17685e;--hh-paper:#f5f7f3;--hh-line:#d9e3de;--hh-muted:#53685f;--hh-gold:#eadbaf}body{background:var(--hh-paper)}a{color:var(--hh-teal)}.hh{line-height:1.85;overflow-wrap:anywhere}.hh *{box-sizing:border-box}.hh-kicker{font-size:.8rem;letter-spacing:.15em;font-weight:bold;color:var(--hh-teal)}.hh-note{font-size:.86rem;color:var(--hh-muted)}.hh-panel{margin:1.25rem 0}.hh-fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.hh label{font-weight:bold;display:block}.hh select,.hh textarea{max-width:100%;color:inherit}.hh button,.hh-button{font:inherit;min-height:44px}.hh button[aria-pressed=true]{outline:2px solid currentColor;outline-offset:2px;background:var(--cocoon-xx-thin-color);color:inherit}.hh button:disabled{opacity:.55;cursor:default}.hh button:focus-visible,.hh a:focus-visible,.hh select:focus-visible,.hh textarea:focus-visible{outline:3px solid #b17919;outline-offset:3px}.hh-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.hh-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.hh-card{min-width:0}.hh-card h3{margin:0 0 .7rem}.hh-card p{margin:.4rem 0}.hh-num{font-variant-numeric:tabular-nums;font-size:1.35rem;font-weight:bold}.hh-table-wrap{max-width:100%;overflow:auto}.hh table{width:100%}.hh td,.hh th{vertical-align:top}.hh caption{text-align:left;font-weight:bold;padding:.5rem 0}.hh details{margin:1rem 0}.hh summary{cursor:pointer;min-height:44px;padding:.6rem}.hh-status{padding:.7rem}.hh-bad{color:#8b4933}.hh-good{color:#17685e}.hh-nav{display:flex;gap:1rem;flex-wrap:wrap}.hh-foot{border-top:1px solid var(--hh-line);margin-top:3rem;padding:1.5rem 0}.hh [hidden]{display:none!important}.hh-preview{max-width:1060px;margin:0 auto;padding:24px}.hh-preview-header{display:flex;justify-content:space-between;gap:1rem;align-items:center;margin-bottom:24px}.hh-preview-header a{text-decoration:none}.hh-brand{font-size:1.3rem;font-weight:bold}.hh-mobile-switch{display:none}@media(max-width:600px){.hh-fields,.hh-grid{grid-template-columns:1fr}.hh-mobile-switch{display:block}.hh-compare [data-secondary]{display:none}.hh-preview{padding:12px}.hh-preview-header{align-items:flex-start;flex-direction:column}}

.sidebar{display:none}.main{width:100%;max-width:100%}.hh-foot{justify-content:center;padding:1.5rem}.hh form label{margin:1rem 0}

.hh table:not(.hh-compare){min-width:540px}.hh [data-fallback] table{min-width:900px}.hh-table-wrap:focus-visible{outline:3px solid #b17919}



/* Native Cocoon navigation is configured through WordPress menus. */
.sidebar-menu-button{display:none!important}.header-site-logo-image{max-height:54px;width:auto;object-fit:contain}.footer-site-logo-image{max-height:38px;width:auto;object-fit:contain}#navi .navi-in>ul>li>a{color:var(--hh-ink)}.logo-image{padding:8px 12px}@media(max-width:600px){.header-site-logo-image{max-height:40px}}



/* Header: equal-width, centered navigation without button frames. */
#header-container{background:#fff;border-bottom:1px solid var(--hh-line);box-shadow:0 2px 12px rgba(24,55,52,.035)}
#header-container #header-container-in{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:18px 30px;max-width:1256px}
#header-container #header{flex:0 0 auto;width:auto;margin:0}
#header-container #header-in{display:flex;align-items:center;width:auto;padding:0}
#header-container .logo-header{margin:0;padding:0;line-height:1}
#header-container .header-site-logo-image{height:auto;max-height:30px;max-width:240px;width:auto}
#header-container .tagline{display:none}
#header-container #navi{flex:0 1 624px;width:624px;max-width:100%;background:transparent;margin:0}
#header-container #navi-in{width:100%;padding:0}
#header-container #navi .navi-in>ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;width:100%}
#header-container #navi .navi-in>ul.menu-mobile{display:none}
#header-container #navi .navi-in>ul>li{width:100%;min-width:0;height:auto;line-height:1.5;border:0;padding:0}
#header-container #navi .navi-in>ul>li>a{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:46px;padding:11px 14px;border:0;border-radius:0;background:transparent;font-size:13px;font-weight:700;line-height:1.5;color:var(--hh-ink);opacity:1;transition:color .16s}
#header-container #navi .caption-wrap{display:block;width:auto;min-width:0;height:auto;line-height:1.5;text-align:center}
#header-container #navi .item-label{width:auto;font-size:inherit;line-height:1.5;white-space:normal;overflow:visible;text-overflow:clip;text-align:center}
#header-container #navi .navi-in>ul>li>a:hover{background:transparent;color:var(--hh-teal)}
#header-container #navi .navi-in>ul>li>a:hover .item-label{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
#header-container #navi .navi-in>ul>li>a::before{content:"";display:block;flex:0 0 18px;width:18px;height:18px;background:currentColor;mask:var(--hh-nav-icon) center/contain no-repeat;-webkit-mask:var(--hh-nav-icon) center/contain no-repeat}
#navi li:nth-child(1){--hh-nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='7' height='16' rx='1.5'/%3E%3Crect x='14' y='4' width='7' height='16' rx='1.5'/%3E%3Cpath d='M6 9h1m-1 4h1m10-4h1m-1 4h1'/%3E%3C/svg%3E")}
#navi li:nth-child(2){--hh-nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1'/%3E%3C/svg%3E")}
#navi li:nth-child(3){--hh-nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V4m0 16h16M9 16v-5m5 5V7m5 9v-8'/%3E%3C/svg%3E")}
#navi li:nth-child(4){--hh-nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='17' rx='2'/%3E%3Cpath d='M9 4V2h6v2M9 10l2 2 4-4m-6 9h6'/%3E%3C/svg%3E")}
#header-container #navi .navi-in>ul>li.current-menu-item:not(.menu-item-home)>a{background:transparent;color:var(--hh-teal)}
#header-container #navi .navi-in>ul>li.current-menu-item:not(.menu-item-home) .item-label{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
#header-container a:focus-visible{outline:3px solid #b17919;outline-offset:3px}
@media(max-width:1000px){
 #header-container #header-container-in{gap:18px;padding:16px 24px}
 #header-container .header-site-logo-image{max-height:26px;max-width:208px}
 #header-container #navi .navi-in>ul>li>a{padding:10px 12px;font-size:12px;gap:8px}
}
@media(max-width:820px){
 #header-container #header-container-in{flex-direction:column;align-items:stretch;gap:15px;padding:18px 20px 16px}
 #header-container #header-in{justify-content:center}
 #header-container .header-site-logo-image{max-height:27px;max-width:216px}
 #header-container #navi{display:block;flex:auto;width:100%}
 #header-container #navi .navi-in>ul.menu-pc{display:none}
 #header-container #navi .navi-in>ul.menu-mobile{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 #header-container #navi .navi-in>ul>li>a{min-height:44px;padding:10px 10px}
}
@media(prefers-reduced-motion:reduce){#header-container #navi .navi-in>ul>li>a{transition:none}}

/* Hero: a concise introduction to the comparison tool. */
.hh-hero{padding:48px 20px 40px;background:transparent;border:0;border-radius:0;text-align:center}
.hh-hero .hh-kicker{margin:0 0 18px;font-size:14px;letter-spacing:.04em;font-weight:700;color:var(--hh-muted)}
.hh-hero h1{margin:0;color:var(--hh-ink);font-size:clamp(28px,3.5vw,46px);font-weight:700;line-height:1.55;letter-spacing:.02em}
.hh-hero h1 span{display:block}
.hh-hero .hh-hero-description{margin:20px 0 28px;font-size:16px;line-height:1.8;color:var(--hh-muted)}
.hh-hero .hh-button{display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:52px;padding:12px 28px;font-size:16px;font-weight:700}

#comparison{scroll-margin-top:24px}
@media(max-width:600px){.hh-hero{padding:28px 0 24px}.hh-hero .hh-kicker{font-size:12px;margin-bottom:14px}.hh-hero h1{font-size:clamp(23px,6.7vw,32px);letter-spacing:0}.hh-hero .hh-hero-description{font-size:14px;max-width:19em;margin:16px auto 24px}.hh-hero .hh-button{min-height:48px;font-size:14px;padding:11px 24px}}

/* Compact header uses Cocoon's existing drawer; no-JS keeps visible links. */
#header-container .hh-header-menu{display:none}
@media(max-width:1000px){
 #header-container #header-container-in.hh-collapsible-nav{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px}
 #header-container .hh-collapsible-nav #header{flex:1;min-width:0}
 #header-container .hh-collapsible-nav #header-in{justify-content:flex-start}
 #header-container .hh-collapsible-nav .logo-header{text-align:left}
 #header-container .hh-collapsible-nav .header-site-logo-image{max-width:min(216px,100%);max-height:27px}
 #header-container .hh-collapsible-nav #navi{display:none}
 #header-container .hh-header-menu{display:block;flex:0 0 48px;width:48px}
 #header-container .hh-header-menu #navi-menu-open{display:flex;flex-direction:column;align-items:center;justify-content:center;width:48px;min-height:48px;padding:4px;border:0;background:transparent;color:var(--hh-ink);cursor:pointer;line-height:1.3}
 #header-container .hh-header-menu .menu-icon{font-size:22px}
 #header-container .hh-header-menu .menu-caption{font-size:10px}
 #header-container .hh-header-menu button:focus-visible{outline:3px solid #b17919;outline-offset:2px}
 #header-container .hh-header-menu #navi-menu-content{left:auto;right:0;transform:translateX(105%);visibility:hidden;transition:transform .3s ease,visibility .3s}
 #header-container .hh-header-menu #navi-menu-input:checked ~ #navi-menu-content{transform:translateX(0);visibility:visible}
 #header-container .hh-header-menu .menu-close-button{width:48px;min-height:48px;margin:12px 20px 0 auto;padding:8px;border:0;background:transparent;cursor:pointer}
 #header-container .hh-header-menu .menu-drawer a{min-height:48px;display:flex;align-items:center}
}
@media(prefers-reduced-motion:reduce){#header-container .hh-header-menu #navi-menu-content{transition:none}}

/* Full-window photographic hero; the central tint keeps the copy legible. */
.home #content{container-type:inline-size;margin-top:0}
.home #main{padding-top:0}
.home #comparison{padding-top:28px}
.hh-hero{position:relative;isolation:isolate;width:100cqw;margin-left:calc(50% - 50cqw);min-height:460px;padding:58px 24px 52px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#183734;color:#fff}
.hh-hero-media{position:absolute;inset:0;z-index:-1;overflow:hidden;background:url("images/hero-workers.webp") center/cover no-repeat}
.hh-hero-media::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 42% 110% at 50% 50%,rgba(8,32,29,.68) 0%,rgba(8,32,29,.60) 38%,rgba(8,32,29,.28) 68%,rgba(8,32,29,.04) 100%)}
.hh-hero-media>span{display:none}
.hh-hero .hh-kicker,.hh-hero h1,.hh-hero .hh-hero-description{color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.hh-hero h1{font-size:clamp(30px,3.5vw,48px)}
.hh-hero .hh-button{margin:0}
@media(max-width:600px){
 .hh-hero{min-height:390px;padding:40px 16px 36px}
 .hh-hero h1{font-size:clamp(23px,6.7vw,32px)}
 .hh-hero-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:2px;background:#fff}
 .hh-hero-media>span{display:block;background-image:url("images/hero-workers.webp");background-size:auto 200%;background-repeat:no-repeat}
 .hh-hero-media>span:nth-child(1){background-position:12% top}
 .hh-hero-media>span:nth-child(2){background-position:88% top}
 .hh-hero-media>span:nth-child(3){background-position:42% bottom}
 .hh-hero-media>span:nth-child(4){background-position:72% bottom}
 .hh-hero-media::after{background:radial-gradient(ellipse 90% 100% at 50% 50%,rgba(8,32,29,.68) 0%,rgba(8,32,29,.54) 48%,rgba(8,32,29,.10) 100%)}
}

/* Three metric sections use Cocoon headings and tables. */
.hh-metric-section{margin-bottom:56px;scroll-margin-top:24px}
.hh-metric-section .hh-table-wrap table{min-width:0;table-layout:fixed}
.hh-metric-section th:first-child{width:46%}
.hh-metric-section td{white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.hh-metric-section .hh-section-links{margin:24px 0 0}
.hh .hh-section-links>p{margin:0;font-size:inherit;line-height:inherit}
.hh .hh-section-links a{text-underline-offset:3px}
#industries{scroll-margin-top:24px}
@media(max-width:600px){.hh-metric-section{margin-bottom:40px}.hh-metric-section td,.hh-metric-section th{padding:8px 5px;font-size:12px}.hh-metric-section th:first-child{width:44%}.hh-metric-section caption{font-size:14px}}

/* Local role switches sit at the upper right of each applicable table. */
.hh-table-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:24px 0 8px}
.hh-table-title{font-weight:700;font-size:16px;margin:0!important;min-width:0}
.hh-role-switch{display:flex;gap:4px;flex-shrink:0}
.hh .hh-role-switch .btn{margin:0;min-width:60px;min-height:44px;padding:8px 6px;position:relative;font-size:13px;font-weight:400;color:var(--hh-muted);background:transparent;border:0;border-radius:0;box-shadow:none;opacity:1}
.hh .hh-role-switch .btn[aria-pressed=true]{color:var(--hh-ink);background:transparent;outline:none;text-decoration:underline;text-decoration-color:var(--hh-teal);text-decoration-thickness:2px;text-underline-offset:4px}
.hh .hh-role-switch .btn::after{content:none;display:none}
.hh .hh-role-switch .btn:hover{color:var(--hh-teal);background:transparent;box-shadow:none}
.hh .hh-role-switch .btn:focus-visible{outline:2px solid var(--hh-teal);outline-offset:2px}
.hh-metric-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:600px){.hh-table-title{font-size:14px}.hh-table-toolbar{gap:8px}.hh .hh-role-switch .btn{min-width:56px;padding:8px 4px;font-size:12px}}

/* Keep industry labels and values within a comfortable reading width. */
.hh-metric-section .hh-table-wrap,.hh-metric-section .hh-table-toolbar{max-width:600px;margin-left:auto;margin-right:auto}

.hh-metric-section .hh-metric-table:has(thead [hidden]) th:first-child{width:64%}

.hh-metric-section .hh-table-note{max-width:600px;margin:8px auto 0;font-size:12px;line-height:1.6}
.hh-metric-section .hh-table-wrap table{margin-bottom:0}

/* Native Cocoon tab-caption boxes separate the source heading from the text. */
.hh-source-info{margin:24px 0 0;font-size:14px}
.hh .hh-source-info .tab-caption-box-content>p{margin:8px 0;line-height:1.8}
@media(max-width:600px){.hh-source-info{font-size:12px}}

/* Source tabs share the site key color while retaining Cocoon styling. */
.hh-source-info.tcb-teal .tab-caption-box-label{background-color:var(--cocoon-key-color,var(--hh-teal))}
.hh-source-info.tcb-teal .tab-caption-box-content{border-color:var(--cocoon-key-color,var(--hh-teal))}

/* A full-width interlude, with the question kept at a readable width. */
.hh-quiz{width:100cqw;max-width:none;margin:0 0 0 calc(50% - 50cqw);padding:32px 24px;background-color:#faf5e8;background-image:radial-gradient(rgba(122,105,66,.055) .7px,transparent .7px);background-size:7px 7px}
.hh-quiz-inner{position:relative;max-width:600px;margin:0 auto}
.hh .hh-quiz-question{margin:0 0 12px;font-size:16px;font-weight:700;line-height:1.6;text-align:center}
.hh-quiz-choices{display:grid;grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr);gap:8px;align-items:stretch}
.hh-quiz-vs{align-self:center;text-align:center;font-size:12px;font-weight:800;color:#a87724;font-style:italic}
.hh-quiz-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:64px;padding:10px 42px;border:1px solid #bdcfe7;border-radius:8px;background:#edf3fc;color:var(--hh-ink);box-shadow:0 2px 0 #bdcfe7}
.hh-quiz-card::before{content:attr(data-choice);position:absolute;left:10px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#416ba8;color:#fff;font-size:13px;font-weight:800}
.hh-quiz-card:nth-of-type(2){background:#fff0db;border-color:#e3c695;box-shadow:0 2px 0 #e3c695}
.hh-quiz-card:nth-of-type(2)::before{background:#b36b20}
.hh .hh-quiz-card button{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:10px 42px;min-height:44px;border:0;border-radius:8px;background:transparent;color:inherit;font-size:14px;font-weight:700;line-height:1.5;cursor:pointer;box-shadow:none}
.hh .hh-quiz-card:has(button:hover){transform:translateY(-2px)}
.hh-quiz-card[data-revealed]{padding-top:22px;padding-bottom:14px}
.hh-quiz-picked{position:absolute;right:-1px;top:-1px;padding:2px 8px;border-radius:0 8px 0 7px;background:var(--hh-ink);color:#fff;font-size:10px;font-weight:700;line-height:1.5}
.hh-quiz-name{display:block;width:100%;text-align:center;font-size:14px;font-weight:700;line-height:1.5}
.hh-quiz-card a.hh-quiz-name{color:var(--hh-teal);text-decoration:underline;text-underline-offset:3px}
.hh-quiz-value{display:block;width:100%;text-align:center;font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;animation:hh-reveal .3s ease-out}
.hh-quiz-card[data-revealed]::after{content:'';position:absolute;left:50%;top:50%;width:112px;height:112px;transform:translate(-50%,-50%);background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Cpath%20d%3D%22M25%2025L95%2095M95%2025L25%2095%22%20fill%3D%22none%22%20stroke%3D%22%23b34b38%22%20stroke-width%3D%2210%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;opacity:.36;pointer-events:none;z-index:3}
.hh-quiz-card[data-correct]::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%2260%22%20r%3D%2250%22%20fill%3D%22none%22%20stroke%3D%22%2317685e%22%20stroke-width%3D%228%22%2F%3E%3C%2Fsvg%3E")}
.hh-quiz-card[data-revealed] .hh-quiz-name,.hh-quiz-card[data-revealed] .hh-quiz-value{position:relative;z-index:1}
.hh-quiz-picked{z-index:4}
.hh .hh-quiz-next{display:block;min-height:32px;margin:10px auto 0;padding:4px 18px;border:1px solid #c4d9cd;border-radius:18px;background:#e2eee7;color:var(--hh-teal);font-size:12px;line-height:1.5;font-weight:500;cursor:pointer;box-shadow:none}
.hh .hh-quiz-next:hover{background:#d4e5db;color:var(--hh-teal)}
/* Announce the verdict to assistive technology without adding a visual result row. */
.hh-quiz-result{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes hh-reveal{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes hh-celebrate{from{transform:scale(.3) rotate(-40deg)}to{transform:scale(1) rotate(0)}}
@media(max-width:480px){
 .hh-quiz{padding:24px 16px}
 .hh .hh-quiz-question{font-size:14px;text-align:left}
 .hh-quiz-choices{grid-template-columns:minmax(0,1fr);gap:10px}
 .hh-quiz-vs{display:none}
 .hh-quiz-card{min-height:64px}
 .hh .hh-quiz-card button,.hh-quiz-name{font-size:13px}
 .hh-quiz-value{font-size:18px}
}
@media(prefers-reduced-motion:reduce){.hh .hh-quiz-card:has(button:hover){transform:none}.hh-quiz-value,.hh-quiz-result{animation:none}}