@font-face{font-family:'Open Sans';font-style:normal;font-weight:300 800;font-display:swap;src:url('../fonts/open-sans-latin-ext-wght-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;} @font-face{font-family:'Open Sans';font-style:normal;font-weight:300 800;font-display:swap;src:url('../fonts/open-sans-latin-wght-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'Open Sans';font-style:italic;font-weight:300 800;font-display:swap;src:url('../fonts/open-sans-latin-ext-wght-italic.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;} @font-face{font-family:'Open Sans';font-style:italic;font-weight:300 800;font-display:swap;src:url('../fonts/open-sans-latin-wght-italic.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'Space Grotesk';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/space-grotesk-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/space-grotesk-latin-500-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'Space Grotesk';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/space-grotesk-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/jetbrains-mono-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/jetbrains-mono-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;src:url('../fonts/jetbrains-mono-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}:root{--red:#d6111e;--red-dark:#a90d17;--red-tint:#fbe4e2;--gold:#ddc76d;--gold-dark:#7a6a2c;--gold-tint:#f8f2df;--ink:#17110f;--ink-soft:#4a413c;--muted:#7b716a;--line:#e7ded3;--line-strong:#d3c7b6;--bg:#fffdfa;--surface:#ffffff;--surface-alt:#f7f1e6;--shadow:0 1px 2px rgba(23,17,15,.05),0 10px 28px -16px rgba(23,17,15,.18);--radius:12px;--maxw:1180px;--nav-w:250px;} *{box-sizing:border-box;} html{scroll-behavior:smooth;} body{margin:0;background:var(--bg);color:var(--ink);font-family:'Open Sans',system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.65;font-size:16px;} img{max-width:100%;display:block;} a{color:var(--red-dark);text-decoration:none;} a:hover{text-decoration:underline;} h1,h2,h3,h4{font-family:'Open Sans',sans-serif;font-weight:800;line-height:1.2;margin:0 0 .4em;text-wrap:balance;color:var(--ink);} p{margin:0 0 1em;}:focus-visible{outline:3px solid var(--red);outline-offset:2px;} .skip-link{position:absolute;left:-999px;top:0;background:var(--red);color:#fff;padding:10px 16px;border-radius:0 0 8px 0;z-index:200;} .skip-link:focus{left:0;} .hb-season-banner{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding:9px 40px;font-size:13.5px;font-weight:700;text-align:center;color:#fff;position:relative;background:linear-gradient(90deg,var(--red-dark),var(--red));} .hb-season-banner .hb-season-icon{font-size:16px;} .hb-season-banner .hb-season-close{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.2);border:none;color:inherit;width:22px;height:22px;border-radius:50%;cursor:pointer;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;} .hb-season-banner .hb-season-close:hover{background:rgba(255,255,255,.36);} body.hb-season-joulu .hb-season-banner,body.hb-season-joulukausi .hb-season-banner{background:linear-gradient(90deg,#7a1420,#1f5c33);} body.hb-season-itsenaisyyspaiva .hb-season-banner{background:linear-gradient(90deg,#00205b,#00368a);} body.hb-season-uusivuosi .hb-season-banner{background:linear-gradient(90deg,#332257,#7a1f5c);} body.hb-season-vappu .hb-season-banner{background:linear-gradient(90deg,var(--gold-dark),var(--red));} body.hb-season-juhannus .hb-season-banner{background:linear-gradient(90deg,var(--gold),#e7c766);color:#3a2c10;} body.hb-season-juhannus .hb-season-banner .hb-season-close{background:rgba(0,0,0,.1);} .hb-snow{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:5;} .hb-snow span{position:absolute;top:-24px;color:#fff;user-select:none;will-change:transform;animation-name:hb-snow-fall;animation-timing-function:linear;animation-iteration-count:infinite;text-shadow:0 0 4px rgba(23,17,15,.25);} @keyframes hb-snow-fall{0%{transform:translateY(-24px) translateX(0);} 50%{transform:translateY(50vh) translateX(14px);} 100%{transform:translateY(110vh) translateX(-10px);}} @media (prefers-reduced-motion:reduce){.hb-snow{display:none;}} .container{max-width:var(--maxw);margin:0 auto;padding:0 24px;} @media (max-width:640px){.container{padding:0 18px;}} .site-topbar{background:var(--ink);color:#fff;font-size:13px;} .site-topbar .container{display:flex;justify-content:space-between;align-items:center;padding-top:6px;padding-bottom:6px;color:#cfc6bf;} .site-topbar a{color:#fff;} .site-header{background:var(--surface);position:sticky;top:0;z-index:100;} .site-header .container{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:14px;padding-bottom:14px;} .brand{display:flex;align-items:center;gap:10px;flex:none;} .brand img{width:40px;height:40px;border-radius:8px;object-fit:contain;} .brand .word{font-weight:800;font-size:19px;letter-spacing:-.01em;} .brand .word span{color:var(--red);} .brand--custom-logo img{width:auto;height:44px;max-width:240px;max-height:44px;border-radius:0;object-fit:contain;} .brand--custom-logo .custom-logo-link{display:flex;align-items:center;line-height:0;} .primary-nav-bar{width:100%;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);} .primary-nav-bar .container{padding-top:0;padding-bottom:0;} .primary-nav{flex:1;} .primary-nav >ul{list-style:none;display:flex;gap:6px;margin:0;padding:0;flex-wrap:wrap;justify-content:space-between;} .primary-nav >ul >li{position:relative;} .primary-nav a{display:block;padding:12px;border-radius:8px;color:var(--ink-soft);font-weight:600;font-size:14.5px;} .primary-nav >ul >li >a:hover,.primary-nav >ul >li.is-active >a{background:var(--red-tint);color:var(--red-dark);text-decoration:none;} .primary-nav .has-sub >a::after{content:"\25BE";font-size:10px;margin-left:5px;color:var(--muted);} .primary-nav .sub-menu{list-style:none;display:block;margin:0;padding:8px;position:absolute;top:100%;left:0;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);min-width:210px;z-index:200;opacity:0;visibility:hidden;transform:translateY(4px);transition:.15s ease;} .primary-nav .sub-menu.sub-menu--oikealle{left:auto;right:0;} .primary-nav .sub-menu li{display:block;width:100%;} .primary-nav .has-sub:hover .sub-menu,.primary-nav .has-sub:focus-within .sub-menu{opacity:1;visibility:visible;transform:translateY(0);} .primary-nav .sub-menu a{display:block;padding:8px 10px;font-weight:500;font-size:14px;border-radius:7px;white-space:nowrap;} .primary-nav .sub-menu a:hover{background:var(--surface-alt);text-decoration:none;} .header-cta{flex:none;background:var(--red);color:#fff;padding:9px 16px;border-radius:8px;font-weight:700;font-size:13.5px;} .header-cta:hover{background:var(--red-dark);color:#fff;text-decoration:none;} .nav-toggle{display:none;flex:none;background:none;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:18px;color:var(--ink);} .primary-nav-overlay{display:none;} .primary-nav-close{display:none;} @media (max-width:900px){.site-header{border-bottom:1px solid var(--line);} .primary-nav-bar{border:none;} .primary-nav{position:fixed;inset:0 0 0 auto;width:min(320px,88vw);background:var(--surface);transform:translateX(100%);transition:.25s ease;box-shadow:-16px 0 32px rgba(0,0,0,.15);padding:70px 22px 22px;overflow-y:auto;z-index:150;} .primary-nav.is-open{transform:translateX(0);} .primary-nav >ul{flex-direction:column;} .primary-nav .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding-left:14px;display:none;} .primary-nav .has-sub.is-open .sub-menu{display:block;} .nav-toggle{display:block;} .header-cta{display:none;}} .hero{background:var(--surface);color:var(--ink);padding:64px 0 56px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);} .hero::before{content:"";position:absolute;top:-140px;right:-160px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle at 30% 30%,var(--red) 0%,rgba(214,17,30,0) 70%);opacity:.14;pointer-events:none;} .hero .container{display:flex;align-items:center;gap:44px;flex-wrap:wrap;position:relative;} .hero .htext{flex:1;min-width:280px;} .hero .kicker{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--red-dark);font-weight:800;background:var(--red-tint);padding:5px 12px;border-radius:999px;} .hero .kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red);} .hero h1{color:var(--ink);font-size:clamp(32px,5vw,50px);margin-top:16px;max-width:15ch;line-height:1.08;} .hero h1 mark{background:none;color:var(--red);} .hero p{color:var(--ink-soft);font-size:17px;max-width:50ch;margin-top:16px;} .hero .actions{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap;} .btn{display:inline-flex;align-items:center;gap:8px;padding:13px 22px;border-radius:9px;font-weight:800;font-size:14.5px;border:2px solid transparent;} .btn-primary{background:var(--red);color:#fff;box-shadow:0 8px 20px -6px rgba(214,17,30,.55);} .btn-primary:hover{background:var(--red-dark);color:#fff;text-decoration:none;} .btn-ghost{border-color:var(--ink);color:var(--ink);background:transparent;} .btn-ghost:hover{border-color:var(--red);color:var(--red);text-decoration:none;} .hero .stat-strip{display:flex;gap:26px;margin-top:34px;flex-wrap:wrap;} .hero .stat-strip .s{border-left:2px solid var(--red);padding-left:12px;} .hero .stat-strip .s b{display:block;font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;} .hero .stat-strip .s span{font-size:12px;color:var(--muted);} .hero .art{flex:none;width:min(300px,82vw);aspect-ratio:1/1;border-radius:22px;position:relative;background:var(--surface);border:3px solid var(--red);display:flex;align-items:center;justify-content:center;padding:30px;box-shadow:0 24px 48px -20px rgba(214,17,30,.4),0 0 0 8px var(--red-tint);} .hero .art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(0,0,0,.12));} .hero .art .ribbon{position:absolute;top:-12px;right:-14px;background:#fff;color:var(--red);border:2px solid var(--red);font-size:11.5px;font-weight:800;padding:6px 12px;border-radius:999px;box-shadow:0 6px 14px rgba(0,0,0,.15);transform:rotate(6deg);} .section{padding:48px 0;} .section-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:22px;flex-wrap:wrap;} .section-head h2{font-size:23px;} .section-head .see-all{font-size:13.5px;font-weight:700;color:var(--red-dark);} .card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;} @media (max-width:880px){.card-grid{grid-template-columns:repeat(2,1fr);}} @media (max-width:560px){.card-grid{grid-template-columns:1fr;}} .card-grid--4{grid-template-columns:repeat(4,1fr);} @media (max-width:880px){.card-grid--4{grid-template-columns:repeat(2,1fr);}} @media (max-width:560px){.card-grid--4{grid-template-columns:1fr;}} .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;} .card .thumb{aspect-ratio:16/10;background:#000;position:relative;overflow:hidden;} .card .thumb img{width:100%;height:100%;object-fit:cover;} .card .body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1;} .pill{display:inline-flex;align-items:center;font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:3px 9px;border-radius:999px;width:fit-content;} .pill-gold{background:var(--gold-tint);color:var(--gold-dark);} .pill-red{background:var(--red-tint);color:var(--red-dark);} .dir-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;font-size:28px;line-height:1;background:linear-gradient(135deg,var(--red-tint),var(--gold-tint));box-shadow:inset 0 0 0 1px var(--line);} .card h3{font-size:16.5px;} .card p{color:var(--muted);font-size:13.8px;margin:0;} .card .meta{font-size:12px;color:var(--muted);margin-top:auto;padding-top:8px;display:flex;gap:10px;} .hb-tool-card .thumb{display:flex;align-items:center;justify-content:center;background:#000;} .hb-tool-icon span{font-size:54px;line-height:1;} .hb-tool-card .body{gap:10px;} .hb-tool-card p{flex:1;} .hb-tool-btn{margin-top:4px;align-self:flex-start;} .hb-dirs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:22px;margin-top:8px;} .hb-dirs-card{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;} .hb-dirs-card::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--hb-dirs-accent,var(--red)),transparent 130%);} .hb-dirs-card:hover{transform:translateY(-5px);border-color:var(--hb-dirs-accent,var(--gold-dark));box-shadow:0 26px 48px -22px color-mix(in srgb,var(--hb-dirs-accent,var(--red)) 45%,transparent),var(--shadow);} .hb-dirs-card-link{display:flex;flex-direction:column;gap:14px;padding:26px 22px 6px;text-decoration:none;color:inherit;} .hb-dirs-card-link:hover{text-decoration:none;} .hb-dirs-icon{display:inline-flex;align-items:center;justify-content:center;width:60px;height:60px;border-radius:16px;font-size:30px;line-height:1;background:linear-gradient(135deg,color-mix(in srgb,var(--hb-dirs-accent,var(--red)) 22%,var(--surface)),var(--surface-alt));box-shadow:inset 0 0 0 1px var(--line);} .hb-dirs-body{display:flex;flex-direction:column;gap:6px;} .hb-dirs-title{font-size:18px;margin:0;color:var(--ink);} .hb-dirs-desc{color:var(--muted);font-size:13.8px;margin:0;} .hb-dirs-count{font-size:12px;color:var(--muted);font-weight:700;} .hb-dirs-preview{list-style:none;margin:14px 22px 0;padding:12px 0 0;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:6px;} .hb-dirs-preview-item a{display:flex;align-items:baseline;gap:6px;font-size:12.8px;color:var(--ink-soft);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .hb-dirs-preview-item a:hover{color:var(--hb-dirs-accent,var(--red-dark));text-decoration:underline;} .hb-dirs-preview-flag{flex:none;font-size:1.05em;} .hb-dirs-btn{margin:16px 22px 22px;align-self:flex-start;display:inline-flex;align-items:center;gap:6px;background:var(--hb-dirs-accent,var(--red));color:#fff;font-weight:700;font-size:13.5px;padding:10px 18px;border-radius:999px;text-decoration:none;transition:filter .15s ease,transform .15s ease;} .hb-dirs-btn:hover{filter:brightness(1.1);transform:translateX(2px);text-decoration:none;} @media (max-width:420px){.hb-dirs-card-link{padding:20px 18px 4px;} .hb-dirs-icon{width:50px;height:50px;font-size:24px;border-radius:12px;} .hb-dirs-title{font-size:16px;} .hb-dirs-preview,.hb-dirs-btn{margin-left:18px;margin-right:18px;}} .article-wrap:has(.hb-section-layout){max-width:1200px;} .hb-archive-section-wrap{max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box;} .hb-section-layout{display:grid;grid-template-columns:30% 70%;gap:28px;align-items:start;margin-top:8px;} @media (max-width:860px){.hb-section-layout{grid-template-columns:1fr;}} .hb-section-nav{position:sticky;top:74px;align-self:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px 20px 22px;} @media (max-width:860px){.hb-section-nav{position:static;}} .hb-section-nav-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:10px;} .hb-section-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;} .hb-section-nav li a{display:block;padding:8px 10px;border-radius:8px;color:var(--ink-soft);font-weight:600;font-size:14px;text-decoration:none;transition:background .15s ease,color .15s ease;} .hb-section-nav li a:hover{background:var(--surface-alt);color:var(--ink);text-decoration:none;} .hb-section-nav li.is-active a{background:var(--red-tint);color:var(--red-dark);} .hb-section-nav--red{background:var(--ink);border:1px solid #2a221c;color:#f3ece5;border-top:3px solid transparent;background-image:linear-gradient(var(--ink),var(--ink)),linear-gradient(90deg,var(--red),var(--gold));background-origin:border-box;background-clip:padding-box,border-box;} .hb-section-nav--red .hb-section-nav-title{color:#a89d96;} .hb-section-nav--red li a{color:#e6ddd5;} .hb-section-nav--red li a:hover{background:rgba(255,255,255,.08);color:#fff;} .hb-section-nav--red li.is-active a{background:var(--red);color:#fff;} .hb-section-content{min-width:0;} .hb-section-content .card-grid{grid-template-columns:repeat(auto-fit,minmax(215px,1fr));} .hb-dirnav-card{display:flex;align-items:center;gap:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;} .hb-dirnav-card:hover{transform:translateY(-3px);border-color:var(--gold-dark);box-shadow:0 16px 36px -16px rgba(214,17,30,.32);text-decoration:none;} .hb-dirnav-icon{flex:none;display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;font-size:28px;line-height:1;background:linear-gradient(135deg,var(--red-tint),var(--gold-tint));box-shadow:inset 0 0 0 1px var(--line);} .hb-dirnav-text{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1;} .hb-dirnav-title{font-family:'Open Sans',sans-serif;font-weight:800;font-size:16px;color:var(--ink);} .hb-dirnav-count{font-size:12.5px;color:var(--muted);} .hb-dirnav-arrow{flex:none;color:var(--gold-dark);font-size:19px;font-weight:700;transition:transform .18s ease,color .18s ease;} .hb-dirnav-card:hover .hb-dirnav-arrow{transform:translateX(4px);color:var(--red-dark);} @media (max-width:420px){.hb-dirnav-card{padding:14px 16px;gap:12px;} .hb-dirnav-icon{width:46px;height:46px;font-size:22px;border-radius:12px;} .hb-dirnav-title{font-size:14.5px;}} .hb-front-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;text-align:left;} @media (max-width:760px){.hb-front-contact-grid{grid-template-columns:1fr;gap:28px;}} .hb-front-contact-col h2{font-size:21px;margin-bottom:6px;} .hb-front-contact-col >p{color:var(--muted);font-size:14px;margin:0 0 16px;} .hb-front-contact-col{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px 26px;box-shadow:var(--shadow);} .hb-pagination-wrap{margin-top:28px;} .hb-pagination{margin:0;} .hb-pagination .nav-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;} .hb-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 14px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);font-weight:700;font-size:14px;text-decoration:none;transition:border-color .15s ease,color .15s ease,background .15s ease,box-shadow .15s ease;} .hb-pagination a.page-numbers:hover{border-color:var(--red);color:var(--red-dark);box-shadow:var(--shadow);text-decoration:none;} .hb-pagination .page-numbers.current{background:linear-gradient(135deg,var(--red),var(--red-dark));border-color:transparent;color:#fff;box-shadow:var(--shadow);} .hb-pagination .page-numbers.dots{border-color:transparent;background:transparent;color:var(--muted);min-width:auto;padding:0 4px;} .hb-pagination .page-numbers.prev,.hb-pagination .page-numbers.next{padding:0 18px;font-weight:700;color:var(--ink);} .hb-pagination .page-numbers.prev:hover,.hb-pagination .page-numbers.next:hover{background:var(--gold-tint);border-color:var(--gold);color:var(--gold-dark);} @media (max-width:480px){.hb-pagination .page-numbers{min-width:36px;height:36px;padding:0 10px;font-size:13px;} .hb-pagination .page-numbers.prev,.hb-pagination .page-numbers.next{padding:0 12px;}} .article-wrap{max-width:760px;margin:0 auto;padding:44px 24px 0;} .hb-tool-page .article-wrap{max-width:1200px;} body.single .article-wrap{max-width:1200px;} body.single .article-wrap.article-with-sidebar{max-width:1200px;} .article-head .kicker{color:var(--red-dark);font-weight:700;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;} .article-head h1{position:relative;font-size:clamp(30px,5vw,44px);font-weight:900;margin-top:10px;padding-bottom:20px;letter-spacing:-.02em;line-height:1.15;} .article-head h1::after{content:"";position:absolute;left:0;bottom:0;width:96px;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--red) 0%,var(--red) 50%,var(--gold) 50%,var(--gold) 100%);} .article-head .byline{color:var(--muted);font-size:13.5px;margin-top:14px;display:flex;gap:14px;flex-wrap:wrap;align-items:center;} .article-cover{margin:26px 0;border-radius:14px;overflow:hidden;aspect-ratio:1080/400;background:var(--surface-alt);} .article-cover img{width:100%;height:100%;object-fit:cover;} .article-thumb-inline{width:220px;max-width:45%;height:auto;border-radius:12px;box-shadow:var(--shadow);} .article-summary-card{background:var(--surface-alt);border:1px solid var(--line);border-left:4px solid var(--red);border-radius:12px;padding:18px 22px 20px;margin:0 0 28px;} .article-summary-label{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--red-dark);margin-bottom:8px;} .article-summary-text{font-size:15.5px;line-height:1.6;color:var(--ink-soft);margin:0;} .article-summary-share{display:flex;gap:8px;margin-top:14px;} .article-summary-share a{width:30px;height:30px;border-radius:8px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--ink-soft);} .article-summary-share a:hover{background:var(--red);border-color:var(--red);color:#fff;} .prose img.alignleft,.prose .wp-caption.alignleft{float:left;margin:6px 22px 16px 0;} .prose img.alignright,.prose .wp-caption.alignright{float:right;margin:6px 0 16px 22px;} .prose img.aligncenter,.prose .wp-caption.aligncenter{display:block;margin-left:auto;margin-right:auto;float:none;} .prose .wp-caption{max-width:100%;} .prose .wp-caption img{display:block;margin:0;} .prose .wp-caption-text{font-size:13px;color:var(--muted);text-align:center;margin-top:6px;} .prose::after{content:"";display:table;clear:both;} @media (max-width:560px){.prose img.alignleft,.prose img.alignright,.prose .wp-caption.alignleft,.prose .wp-caption.alignright{float:none;display:block;margin:0 auto 16px;max-width:100%;width:auto;}} .prose{font-size:17px;line-height:1.75;color:var(--ink-soft);} .prose >*:first-child{margin-top:0;} .prose >h2:not(.card-grid):not(.hb-rss-list){position:relative;font-size:clamp(22px,2.8vw,27px);font-weight:800;color:var(--ink);margin:2.1em 0 .9em;padding-bottom:.5em;letter-spacing:-.01em;border-bottom:2px solid var(--line);clear:both;} .prose >h2:not(.card-grid):not(.hb-rss-list)::before{content:"";position:absolute;left:0;bottom:-3px;width:64px;height:4px;border-radius:999px;background:linear-gradient(90deg,var(--red),var(--gold));} .prose >h3:not(.card-grid):not(.hb-rss-list){position:relative;font-size:clamp(17.5px,2vw,19.5px);font-weight:700;color:var(--ink);margin:1.8em 0 .7em;padding-left:16px;letter-spacing:-.005em;clear:both;} .prose >h3:not(.card-grid):not(.hb-rss-list)::before{content:"";position:absolute;left:0;top:.22em;width:7px;height:7px;border-radius:2px;background:var(--gold);transform:rotate(45deg);} .prose >h4:not(.card-grid):not(.hb-rss-list){position:relative;font-size:16px;font-weight:700;color:var(--ink);margin:1.6em 0 .6em;padding-left:14px;clear:both;} .prose >h4:not(.card-grid):not(.hb-rss-list)::before{content:"";position:absolute;left:0;top:.3em;width:6px;height:6px;border-radius:1px;background:var(--red-dark);} .prose p{margin-bottom:1.1em;} .prose >p:first-of-type{font-size:1.18em;line-height:1.65;color:var(--ink);} .prose a{color:var(--red-dark);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold-dark);text-decoration-thickness:1.5px;transition:color .15s,text-decoration-color .15s;} .prose a:hover{color:var(--red);text-decoration-color:var(--red);} .prose strong,.prose b{color:var(--ink);font-weight:700;} .prose em{color:var(--ink-soft);} .prose >ul:not(.card-grid):not(.hb-rss-list),.prose >ol:not(.card-grid):not(.hb-rss-list){margin:0 0 1.3em;padding-left:6px;list-style:none;} .prose >ul:not(.card-grid):not(.hb-rss-list) >li,.prose >ol:not(.card-grid):not(.hb-rss-list) >li{margin-bottom:.5em;padding-left:26px;position:relative;} .prose >ul:not(.card-grid):not(.hb-rss-list) >li >ul,.prose >ul:not(.card-grid):not(.hb-rss-list) >li >ol,.prose >ol:not(.card-grid):not(.hb-rss-list) >li >ul,.prose >ol:not(.card-grid):not(.hb-rss-list) >li >ol{margin:.5em 0 0;padding-left:20px;list-style:none;} .prose >ul:not(.card-grid):not(.hb-rss-list) >li::before{content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px var(--gold-tint);} .prose >ol:not(.card-grid):not(.hb-rss-list){counter-reset:hb-ol;} .prose >ol:not(.card-grid):not(.hb-rss-list) >li{counter-increment:hb-ol;} .prose >ol:not(.card-grid):not(.hb-rss-list) >li::before{content:counter(hb-ol);position:absolute;left:0;top:0;min-width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:var(--red);color:#fff;font-size:11.5px;font-weight:800;line-height:1;} .prose >ul:not(.card-grid):not(.hb-rss-list) li ul >li,.prose >ul:not(.card-grid):not(.hb-rss-list) li ol >li,.prose >ol:not(.card-grid):not(.hb-rss-list) li ul >li,.prose >ol:not(.card-grid):not(.hb-rss-list) li ol >li{position:relative;margin-bottom:.4em;padding-left:18px;} .prose >ul:not(.card-grid):not(.hb-rss-list) li ul >li::before,.prose >ol:not(.card-grid):not(.hb-rss-list) li ul >li::before{content:"";position:absolute;left:0;top:.68em;width:5px;height:5px;border-radius:50%;background:var(--red-dark);} .prose >ul:not(.card-grid):not(.hb-rss-list) li ol,.prose >ol:not(.card-grid):not(.hb-rss-list) li ol{counter-reset:hb-ol-nested;} .prose >ul:not(.card-grid):not(.hb-rss-list) li ol >li,.prose >ol:not(.card-grid):not(.hb-rss-list) li ol >li{counter-increment:hb-ol-nested;} .prose >ul:not(.card-grid):not(.hb-rss-list) li ol >li::before,.prose >ol:not(.card-grid):not(.hb-rss-list) li ol >li::before{content:counter(hb-ol-nested,lower-alpha) ".";position:absolute;left:0;top:0;color:var(--gold-dark);font-weight:800;font-size:12.5px;} .prose >blockquote:not(.card-grid):not(.hb-rss-list){position:relative;margin:1.8em 0;padding:1em 1.4em 1em 2.6em;border-left:3px solid var(--red);background:var(--red-tint);border-radius:0 10px 10px 0;color:var(--ink);font-size:16.5px;font-style:italic;} .prose >blockquote:not(.card-grid):not(.hb-rss-list)::before{content:"\201C";position:absolute;left:.5em;top:-.1em;font-family:Georgia,serif;font-style:normal;font-size:2.6em;line-height:1;color:var(--gold-dark);opacity:.55;} .prose >blockquote:not(.card-grid):not(.hb-rss-list) p:last-child{margin-bottom:0;} .prose hr{position:relative;border:none;border-top:1px dashed var(--line);margin:2.4em 0;} .prose hr::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;transform:translate(-50%,-50%) rotate(45deg);background:var(--gold);border:2px solid var(--bg);} .prose >img,.prose p >img{border-radius:12px;max-width:100%;height:auto;box-shadow:var(--shadow);} .prose figure{margin:1.6em 0;} .prose figcaption{font-size:13px;color:var(--muted);text-align:center;margin-top:8px;} .prose >.alignwide{width:100vw;max-width:1400px;margin-left:50%;transform:translateX(-50%);} .prose >.alignfull{width:100vw;max-width:100vw;margin-left:50%;transform:translateX(-50%);} .prose >.alignwide img,.prose >.alignfull img{width:100%;height:auto;display:block;} .prose >.alignfull img{border-radius:0;} .prose >table:not(.card-grid):not(.hb-rss-list),.prose >figure.wp-block-table >table{width:100%;border-collapse:separate;border-spacing:0;margin:1.8em 0;font-size:15px;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:var(--shadow);} .prose >table:not(.card-grid):not(.hb-rss-list) th,.prose >table:not(.card-grid):not(.hb-rss-list) td,.prose >figure.wp-block-table >table th,.prose >figure.wp-block-table >table td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left;} .prose >table:not(.card-grid):not(.hb-rss-list) th,.prose >figure.wp-block-table >table th{color:#fff;font-weight:700;background:linear-gradient(135deg,var(--red-dark),var(--red));border-bottom:none;} .prose >table:not(.card-grid):not(.hb-rss-list) tr:last-child td,.prose >figure.wp-block-table >table tr:last-child td{border-bottom:none;} .prose >table:not(.card-grid):not(.hb-rss-list) tr:nth-child(even) td,.prose >figure.wp-block-table >table tr:nth-child(even) td{background:var(--surface-alt);} .prose >table:not(.card-grid):not(.hb-rss-list) tr:hover td,.prose >figure.wp-block-table >table tr:hover td{background:var(--gold-tint);} .prose >figure.wp-block-table{margin:1.8em 0;} .ai-notice{display:inline-flex;align-items:center;gap:6px;background:var(--surface-alt);border:1px solid var(--line);color:var(--muted);font-size:12px;padding:5px 11px;border-radius:999px;margin-top:28px;} .ai-notice b{color:var(--ink);} .code-block{position:relative;background:#1c1512;color:#f1e9e0;border-radius:10px;padding:16px 44px 16px 16px;margin:1.4em 0;overflow-x:auto;border-left:3px solid var(--gold);line-height:1.55;} .code-block code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13.5px;} .code-copy{position:absolute;top:10px;right:10px;background:#332a24;color:#e6dcd2;border:none;border-radius:6px;padding:5px 9px;font-size:11px;cursor:pointer;} .code-copy:hover{background:var(--red);color:#fff;} .prose code{background:var(--surface-alt);border:1px solid var(--line);border-radius:5px;padding:.15em .45em;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.9em;color:var(--red-dark);} .prose pre code{background:none;border:none;padding:0;color:inherit;} .tag-cloud{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:36px;} .tag-cloud-label{flex:none;font-weight:700;font-size:13px;color:var(--ink-soft);} .tag-cloud-tags{display:flex;flex-wrap:wrap;gap:8px;flex:1;} .tag-cloud a{background:var(--surface-alt);border:1px solid var(--line);padding:5px 12px;border-radius:999px;font-size:12.5px;color:var(--ink-soft);font-weight:600;} .tag-cloud a:hover{background:var(--gold-tint);border-color:var(--gold);color:var(--gold-dark);text-decoration:none;} .share-row{display:flex;gap:8px;margin-top:20px;} .share-row a{width:34px;height:34px;border-radius:8px;background:var(--surface-alt);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--ink-soft);} .share-row a:hover{background:var(--red);border-color:var(--red);color:#fff;} .related{background:var(--surface-alt);margin-top:56px;padding:44px 0;} .related .container{max-width:var(--maxw);} .directory{display:grid;grid-template-columns:var(--nav-w) 1fr;gap:0;align-items:start;} @media (max-width:860px){.directory{grid-template-columns:1fr;}} .directory:not(:has(.side-nav)){grid-template-columns:1fr;} .side-nav{position:sticky;top:74px;align-self:start;background:var(--ink);color:#fff;padding:26px 22px;border-radius:0 14px 14px 0;} @media (max-width:860px){.side-nav{position:static;border-radius:14px;margin:20px 24px 0;}} .side-nav .grp{font-family:'Open Sans';font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#a89d96;margin:20px 0 8px;} .side-nav .grp:first-child{margin-top:0;} .side-nav ul{list-style:none;margin:0;padding:0;} .side-nav li a{display:flex;align-items:center;gap:6px;padding:7px 0;color:#e6ddd5;font-size:14px;font-weight:600;} .side-nav li a:hover,.side-nav li.is-active >a{color:var(--gold);text-decoration:none;} .side-nav li.sub a{padding-left:14px;font-weight:400;font-size:13px;color:#c2b8b0;} .side-nav .count{margin-left:auto;font-size:11px;color:#8a7f77;font-weight:400;} .side-nav .cat-toggle-all{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin-top:14px;padding:9px 12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:9px;color:#e6ddd5;font-family:'Open Sans';font-size:12.5px;font-weight:700;letter-spacing:.02em;cursor:pointer;transition:background .15s,border-color .15s;} .side-nav .cat-toggle-all:hover{background:rgba(255,255,255,.1);border-color:rgba(221,199,109,.4);} .side-nav .cat-toggle-all .cat-toggle-arrow{transition:transform .2s ease;color:var(--gold);} .side-nav .cat-toggle-all.is-open .cat-toggle-arrow{transform:rotate(180deg);} .side-nav .cat-all-panel{margin-top:12px;padding-top:14px;border-top:1px dashed rgba(255,255,255,.14);} .side-nav .cat-search-row{margin-bottom:10px;} .side-nav .cat-search-input{width:100%;box-sizing:border-box;padding:9px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.35);color:#fff;font-size:13px;font-family:'Open Sans';outline:none;transition:border-color .15s;} .side-nav .cat-search-input::placeholder{color:#8a7f77;} .side-nav .cat-search-input:focus{border-color:var(--gold);} .side-nav .cat-all-list{max-height:360px;overflow-y:auto;padding-right:4px;scrollbar-width:thin;scrollbar-color:rgba(221,199,109,.4) transparent;} .side-nav .cat-all-list::-webkit-scrollbar{width:6px;} .side-nav .cat-all-list::-webkit-scrollbar-thumb{background:rgba(221,199,109,.35);border-radius:6px;} .side-nav .cat-group{margin-bottom:2px;} .side-nav .cat-group >a{font-size:13.5px;padding:6px 0;} .side-nav .cat-sub{list-style:none;margin:0 0 4px;padding:0;} .side-nav .cat-sub li a{padding:5px 0 5px 14px;font-weight:400;font-size:12.5px;color:#c2b8b0;} .side-nav .cat-search-empty{font-size:12.5px;color:#a89d96;text-align:center;padding:14px 0 4px;margin:0;} .dir-content{padding:36px 24px 60px;min-width:0;} .crumbs{font-size:12.5px;color:var(--muted);margin-bottom:14px;} .crumbs a{color:var(--muted);} .dir-content h1{font-size:26px;} .dir-content .lede{color:var(--muted);max-width:60ch;margin-top:6px;} .dir-toolbar{display:flex;gap:10px;margin:20px 0;flex-wrap:wrap;} .dir-toolbar input,.dir-toolbar select{border:1px solid var(--line-strong);border-radius:8px;padding:9px 12px;font-family:inherit;font-size:13.5px;background:var(--surface);} .dir-toolbar input{flex:1;min-width:180px;} .dir-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:6px;} @media (max-width:1080px){.dir-grid{grid-template-columns:repeat(2,1fr);}} @media (max-width:560px){.dir-grid{grid-template-columns:1fr;}} .dir-card{background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:16px 18px;box-shadow:var(--shadow);} .dir-card .top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;} .dir-card h3{font-size:15px;} .dir-card p{font-size:13px;color:var(--muted);margin:6px 0 0;} .dir-card .badge-mini{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--gold-tint);color:var(--gold-dark);white-space:nowrap;} .dir-toolbar-dark{display:flex;gap:10px;flex-wrap:wrap;align-items:center;background:#17110f;border-radius:12px;padding:14px 16px;margin:20px 0 14px;} .dir-toolbar-dark input[type="search"]{flex:1;min-width:180px;border:1px solid #4a3d34;border-radius:8px;padding:10px 14px;background:#241a15;color:#fff;font-family:inherit;font-size:14px;} .dir-toolbar-dark input[type="search"]::placeholder{color:#a89d90;} .dir-toolbar-dark .btn-hae{background:var(--red);color:#fff;border:none;border-radius:999px;padding:10px 20px;font-weight:700;font-size:13.5px;cursor:pointer;} .dir-toolbar-dark .btn-hae:hover{background:var(--red-dark);} .dir-toolbar-dark .btn-suosikit{background:transparent;color:#fff;border:1px solid #4a3d34;border-radius:999px;padding:10px 18px;font-weight:700;font-size:13.5px;cursor:pointer;white-space:nowrap;} .dir-toolbar-dark .btn-suosikit:hover{border-color:var(--gold);} .dir-toolbar-dark .btn-suosikit.is-active{background:var(--gold);color:#000;border-color:var(--gold);} .dir-count{color:var(--muted);font-size:13.5px;margin:4px 0 16px;} .dir-grid-dark{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:6px;} @media (max-width:1080px){.dir-grid-dark{grid-template-columns:repeat(2,1fr);}} @media (max-width:560px){.dir-grid-dark{grid-template-columns:1fr;}} .dir-card-dark{position:relative;background:#0d0a08;border:1px solid #2a221c;border-radius:12px;padding:16px 18px 18px;color:#f3ece5;} .dir-card-dark h3{font-size:15.5px;margin:0;} .dir-card-dark h3 a{color:#fff;} .dir-card-dark p{font-size:13px;color:#a89d90;margin:8px 0 14px;line-height:1.5;} .dir-card-dark .fav-btn{position:absolute;top:12px;right:12px;background:none;border:none;font-size:19px;line-height:1;color:#a89d90;cursor:pointer;padding:2px;} .dir-card-dark .fav-btn.is-fav{color:var(--red);} .dir-card-dark .btn-lue{display:inline-block;background:var(--red);color:#fff;border-radius:999px;padding:8px 18px;font-weight:700;font-size:13px;text-decoration:none;} .dir-card-dark .btn-lue:hover{background:var(--red-dark);color:#fff;} .dir-card-dark .share-mini{display:flex;gap:6px;margin-top:12px;} .dir-card-dark .share-mini a{width:26px;height:26px;border-radius:50%;border:1px solid #3a2b22;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#a89d90;} .dir-card-dark .share-mini a:hover{background:var(--red);border-color:var(--red);color:#fff;} .dir-card-dark[hidden]{display:none;} .hb-cctld-flag{font-size:1.15em;margin-right:2px;vertical-align:-1px;} .hb-cctld-flag-lead{font-size:3rem;line-height:1;margin:0 0 6px;} .hb-dir-more-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;margin:26px 0 12px;} .hb-dir-more-wrap[hidden]{display:none;} .hb-dir-more-info{margin:0;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;text-align:center;} .hb-dir-more-wrap.is-error .hb-dir-more-info{color:var(--red-dark);font-weight:600;} .hb-dir-more-bar{width:min(240px,70%);height:4px;border-radius:999px;background:var(--line);overflow:hidden;} .hb-dir-more-bar span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--red),#ff5a3c);transition:width .35s ease;} .hb-dir-more-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:200px;padding:14px 28px;border:1px solid #4a3d34;border-radius:999px;background:linear-gradient(180deg,#261b16,#17110f);color:#fff;font-family:inherit;font-size:14px;font-weight:700;line-height:1;letter-spacing:.01em;cursor:pointer;box-shadow:0 10px 24px -14px rgba(23,17,15,.75),inset 0 1px 0 rgba(255,255,255,.06);transition:transform .15s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;-webkit-tap-highlight-color:transparent;} .hb-dir-more-btn:hover{background:linear-gradient(180deg,#e0212e,var(--red));border-color:var(--red);transform:translateY(-1px);box-shadow:0 14px 26px -14px rgba(214,17,30,.7);} .hb-dir-more-btn:active{transform:translateY(0);box-shadow:0 6px 14px -10px rgba(214,17,30,.7);} .hb-dir-more-btn:focus-visible{outline:3px solid var(--gold);outline-offset:3px;} .hb-dir-more-ico{flex:none;transition:transform .2s ease;} .hb-dir-more-btn:hover .hb-dir-more-ico{transform:translateY(2px);} .hb-dir-more-spin{display:none;flex:none;width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:hb-dir-spin .7s linear infinite;} .hb-dir-more-btn.is-loading{cursor:progress;pointer-events:none;background:linear-gradient(180deg,#261b16,#17110f);border-color:#4a3d34;transform:none;box-shadow:0 10px 24px -14px rgba(23,17,15,.75);} .hb-dir-more-btn.is-loading .hb-dir-more-ico{display:none;} .hb-dir-more-btn.is-loading .hb-dir-more-spin{display:inline-block;} .hb-dir-more-wrap.is-error .hb-dir-more-btn{border-color:var(--red);} @keyframes hb-dir-spin{to{transform:rotate(360deg);}} @media (max-width:560px){.hb-dir-more-btn{width:100%;max-width:360px;}} @media (prefers-reduced-motion:reduce){.hb-dir-more-btn,.hb-dir-more-ico,.hb-dir-more-bar span{transition:none;} .hb-dir-more-btn:hover{transform:none;} .hb-dir-more-spin{animation-duration:2s;}} .site-footer{background:var(--ink);color:#cfc6bf;margin-top:60px;padding:44px 0 24px;font-size:13.5px;} .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;} @media (max-width:760px){.footer-grid{grid-template-columns:1fr 1fr;}} @media (max-width:480px){.footer-grid{grid-template-columns:1fr;}} .site-footer h3{color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;} .site-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;} .site-footer li{margin:6px 0;display:block;} .site-footer a{color:#cfc6bf;display:inline-block;} .site-footer a:hover{color:var(--gold);} .footer-brand{display:flex;align-items:center;gap:10px;margin-bottom:10px;} .footer-brand img{width:32px;height:32px;border-radius:7px;} .footer-bottom{border-top:1px solid #332a24;margin-top:32px;padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:#8a7f77;font-size:12.5px;} .badge-strip{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0;} .badge-strip .b{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);} .weather-block{max-width:1080px;margin:0 auto;} .weather-search{display:flex;gap:8px;margin-bottom:14px;} .weather-search-input{flex:1;padding:11px 14px;border-radius:10px;border:1px solid #e7ded3;background:#fff;font-size:14px;outline:none;} .weather-search-input:focus{border-color:var(--red);} .weather-search-btn{flex:none;background:var(--red);color:#fff;border:none;padding:11px 20px;border-radius:10px;font-weight:700;font-size:13.5px;cursor:pointer;} .weather-search-btn:hover{background:var(--red-dark);} .weather-result.is-loading{opacity:.55;} .weather-error{color:#7b716a;font-size:13.5px;padding:16px 4px;} .weather-widget{max-width:1080px;width:100%;box-sizing:border-box;background:linear-gradient(160deg,var(--ink) 0%,#2a1f18 100%);color:#fff;border-radius:16px;padding:24px 28px 26px;box-shadow:var(--shadow);} .weather-widget .weather-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;} .weather-widget .weather-main{display:flex;align-items:center;gap:6px;} .weather-widget .weather-icon{width:72px;height:72px;flex:none;margin:-8px 0;filter:drop-shadow(0 4px 10px rgba(0,0,0,.35));} .weather-widget .weather-temp-block{flex:1;} .weather-widget .temp{font-size:42px;font-weight:800;line-height:1;letter-spacing:-.02em;} .weather-widget .temp .unit{font-size:20px;font-weight:600;opacity:.75;margin-left:1px;} .weather-widget .place{font-size:14px;color:var(--gold);font-weight:700;margin-top:4px;} .weather-widget .weather-minmax{font-size:16px;font-weight:700;color:rgba(255,255,255,.85);} .weather-widget .weather-minmax .wmax{color:#fff;} .weather-widget .weather-minmax .wmin{color:rgba(255,255,255,.6);} .weather-widget .weather-desc{font-size:14.5px;color:rgba(255,255,255,.85);margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.12);} .weather-widget .weather-meta{display:flex;flex-wrap:wrap;gap:14px 22px;margin-top:10px;font-size:13px;color:rgba(255,255,255,.8);} .weather-widget .wm-label{color:rgba(255,255,255,.5);margin-right:3px;} .weather-widget .weather-forecast{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);} .weather-widget .weather-day{display:flex;flex-direction:column;align-items:center;gap:2px;background:rgba(255,255,255,.06);border-radius:10px;padding:10px 4px;text-align:center;} .weather-widget .wd-label{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:rgba(255,255,255,.65);} .weather-widget .wd-temps{font-size:12.5px;} .weather-widget .wd-temps .wmax{font-weight:700;color:#fff;} .weather-widget .wd-temps .wmin{color:rgba(255,255,255,.55);} @media (max-width:640px){.weather-widget .weather-forecast{grid-template-columns:repeat(3,1fr);} .weather-widget{padding:20px 18px 22px;}} .hb-news{background:#100c0a;border-radius:16px;padding:20px 20px 24px;color:#f3ece5;margin:20px 0;} .hb-news-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px;} .hb-news-live{display:flex;align-items:center;gap:6px;font-weight:800;font-size:12.5px;letter-spacing:.06em;color:#ff5b5b;} .hb-live-dot{width:8px;height:8px;border-radius:50%;background:#ff2d2d;box-shadow:0 0 0 0 rgba(255,45,45,.6);animation:hb-live-pulse 1.6s infinite;} @keyframes hb-live-pulse{0%{box-shadow:0 0 0 0 rgba(255,45,45,.55);}70%{box-shadow:0 0 0 8px rgba(255,45,45,0);}100%{box-shadow:0 0 0 0 rgba(255,45,45,0);}} .hb-news-updated{font-size:12.5px;color:#a89d90;} .hb-news-refresh{margin-left:auto;background:transparent;border:1px solid #4a3d34;color:#fff;border-radius:999px;padding:8px 16px;font-size:12.5px;font-weight:700;text-decoration:none;transition:border-color .15s ease,color .15s ease;} .hb-news-refresh:hover{border-color:var(--gold);color:var(--gold);} .hb-news-toolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px;} .hb-news-search{flex:1;min-width:180px;border:1px solid #4a3d34;border-radius:8px;padding:10px 14px;background:#1c1512;color:#fff;font-family:inherit;font-size:14px;} .hb-news-search::placeholder{color:#a89d90;} .hb-news-view{display:flex;gap:6px;} .hb-view-btn{background:#1c1512;border:1px solid #4a3d34;color:#a89d90;border-radius:8px;width:38px;height:38px;font-size:16px;cursor:pointer;transition:border-color .15s ease,color .15s ease,background .15s ease;} .hb-view-btn.is-active{background:var(--red);color:#fff;border-color:var(--red);} .hb-news-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;} .hb-news-tab{background:#1c1512;border:1px solid #3a2b22;color:#cfc6bf;border-radius:999px;padding:8px 14px;font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;cursor:pointer;display:flex;align-items:center;gap:6px;transition:border-color .15s ease,background .15s ease,color .15s ease;} .hb-news-tab span{background:rgba(255,255,255,.12);border-radius:999px;padding:1px 7px;font-size:11px;} .hb-news-tab.is-active{background:var(--red);color:#fff;border-color:var(--red);} .hb-news-tab.is-active span{background:rgba(255,255,255,.25);} .hb-news-grid{display:grid;grid-template-columns:1fr;gap:14px;} .hb-news-grid.hb-news-grid-view{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;} .hb-news-empty{color:#a89d90;font-size:13.5px;} .hb-news-card{position:relative;display:flex;gap:14px;align-items:stretch;background:#17110f;border:1px solid #2a221c;border-radius:14px;padding:14px 46px 14px 14px;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;} .hb-news-card:hover{transform:translateY(-4px);border-color:var(--hb-news-accent,#4a3d34);box-shadow:0 20px 40px -20px rgba(0,0,0,.6),0 0 0 1px var(--hb-news-accent,#3a2b22) inset;} .hb-news-card[hidden]{display:none;} .hb-news-thumb{flex:none;width:112px;border-radius:10px;overflow:hidden;position:relative;background:#1c1512;} .hb-news-thumb img{width:100%;height:100%;object-fit:cover;display:block;} .hb-news-thumb-ic{display:none;} .hb-news-thumb--empty{background:linear-gradient(135deg,var(--hb-news-accent,#3a2b22),#100c0a);} .hb-news-thumb--empty .hb-news-thumb-ic{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:30px;line-height:1;} .hb-news-content{flex:1;min-width:0;display:flex;flex-direction:column;} .hb-news-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11px;color:#a89d90;margin-bottom:6px;} .hb-news-source{font-weight:800;letter-spacing:.03em;color:#cfc6bf;} .hb-news-new{background:var(--red);color:#fff;border-radius:4px;padding:1px 6px;font-weight:800;font-size:10.5px;letter-spacing:.04em;} .hb-news-title{font-size:15px;margin:0 0 6px;color:#fff;line-height:1.4;} .hb-news-excerpt{font-size:13px;color:#a89d90;margin:0;line-height:1.5;} .hb-news-actions{position:absolute;top:12px;right:12px;display:flex;flex-direction:column;gap:6px;} .hb-news-fav,.hb-news-open{width:26px;height:26px;border-radius:50%;border:1px solid #3a2b22;background:transparent;color:#a89d90;font-size:13px;display:flex;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;transition:border-color .15s ease,color .15s ease;} .hb-news-fav.is-fav{color:var(--red);border-color:var(--red);} .hb-news-open:hover,.hb-news-fav:hover{border-color:var(--gold);color:var(--gold);} .hb-news-grid-view .hb-news-card{flex-direction:column;padding:0 0 16px;} .hb-news-grid-view .hb-news-thumb{width:100%;aspect-ratio:16/10;border-radius:14px 14px 0 0;} .hb-news-grid-view .hb-news-thumb-ic{font-size:44px;} .hb-news-grid-view .hb-news-content{padding:14px 16px 0;} .hb-news-grid-view .hb-news-actions{top:10px;right:10px;flex-direction:row;background:rgba(16,12,10,.55);backdrop-filter:blur(3px);border-radius:999px;padding:4px;gap:4px;} @media (max-width:600px){.hb-news-head{gap:10px;} .hb-news-refresh{margin-left:0;} .hb-news-thumb{width:80px;}} .hb-modal-overlay{position:fixed;inset:0;background:rgba(8,6,5,.72);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:24px;z-index:100000;} .hb-modal-overlay[hidden]{display:none;} body.hb-modal-open{overflow:hidden;} .hb-modal{position:relative;width:100%;max-width:920px;max-height:88vh;overflow-y:auto;background:#0d0a08;color:#f3ece5;border-radius:16px;border:1px solid #2a221c;border-top:3px solid transparent;background-image:linear-gradient(#0d0a08,#0d0a08),linear-gradient(90deg,var(--red),var(--gold));background-origin:border-box;background-clip:padding-box,border-box;box-shadow:0 30px 80px -20px rgba(0,0,0,.6);padding:36px;} .hb-modal-close{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;background:#1c1512;border:1px solid #3a2b22;color:#f3ece5;font-size:20px;line-height:1;cursor:pointer;transition:transform .2s,border-color .2s,color .2s;} .hb-modal-close:hover{border-color:var(--gold);color:var(--gold);transform:rotate(90deg);} .hb-modal-body{display:grid;grid-template-columns:2fr 1fr;gap:32px;} .hb-modal.hb-modal-no-sidebar .hb-modal-body{grid-template-columns:1fr;} .hb-modal-loading{color:#a89d90;font-size:13.5px;} .hb-modal-title{color:#fff;font-size:30px;margin:6px 0 16px;padding-right:30px;line-height:1.3;} .hb-modal-generic-info{margin-top:22px;padding-top:18px;border-top:1px solid #2a221c;} .hb-modal-generic-info h4{margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);} .hb-modal-content{color:#fff !important;font-size:15px;line-height:1.7;} .hb-modal-content p{margin:0 0 14px;} .hb-modal-content a{color:var(--gold) !important;text-decoration-color:rgba(221,199,109,.4);text-underline-offset:2px;} .hb-modal-content a:hover{color:#fff !important;} .hb-modal-content img{max-width:100%;height:auto;border-radius:10px;margin:14px 0;} .hb-modal-content h1,.hb-modal-content h2,.hb-modal-content h3,.hb-modal-content h4,.hb-modal-content h5,.hb-modal-content h6{color:var(--red) !important;font-weight:800;line-height:1.3;margin:1.3em 0 .55em;} .hb-modal-content h1:first-child,.hb-modal-content h2:first-child,.hb-modal-content h3:first-child,.hb-modal-content h4:first-child{margin-top:0;} .hb-modal-content h2{font-size:20px;padding-bottom:.4em;border-bottom:2px solid rgba(221,199,109,.25);} .hb-modal-content h3{font-size:17.5px;} .hb-modal-content h4{font-size:15px;} .hb-modal-content ul,.hb-modal-content ol{padding-left:1.3em;margin:0 0 14px;} .hb-modal-content li+li{margin-top:.35em;} .hb-modal-content blockquote{margin:0 0 14px;padding:12px 18px;border-left:3px solid var(--gold);background:rgba(221,199,109,.06);border-radius:0 10px 10px 0;font-style:italic;color:#cfc6bf;} .hb-modal-sidebar{display:flex;flex-direction:column;gap:14px;} .hb-modal-side-box{background:#17110f;border:1px solid #2a221c;border-radius:12px;padding:16px 18px;} .hb-modal-side-box h4{margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);} .hb-modal-side-box p{margin:0 0 10px;font-size:13.5px;color:#cfc6bf;line-height:1.6;} .hb-modal-side-box p:last-child{margin-bottom:0;} .hb-modal-side-btn{display:block;text-align:center;background:var(--red);color:#fff;border-radius:999px;padding:10px 20px;font-weight:700;font-size:13.5px;text-decoration:none;} .hb-modal-side-btn:hover{background:var(--red-dark);color:#fff;} .hb-modal-side-box .freq-pill{position:relative;background:rgba(255,255,255,.05);border-left:3px solid var(--red);border-radius:8px;padding:9px 12px 9px 34px;font-weight:600;font-size:13px;color:#e3dbd3;margin-bottom:8px;} .hb-modal-side-box .tag-pill-list{display:flex;flex-wrap:wrap;gap:6px;} .hb-modal-side-box .tag-pill{display:inline-block;background:#1c1512;border:1px solid #2a221c;border-radius:999px;padding:6px 12px;font-size:12px;color:#cfc6bf;} @media (max-width:760px){.hb-modal{padding:24px;max-height:92vh;} .hb-modal-body{grid-template-columns:1fr;} .hb-modal-title{font-size:21px;}} .article-wrap.article-with-sidebar{max-width:1040px;display:grid;grid-template-columns:2fr 1fr;gap:36px;align-items:start;} .article-with-sidebar .article-main{min-width:0;} .article-with-sidebar .article-sidebar{display:flex;flex-direction:column;gap:14px;} .article-sidebar .side-box{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px;box-shadow:var(--shadow);} .article-sidebar .side-box h4{margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--red-dark);} .article-sidebar .side-box p{margin:0 0 10px;font-size:13.5px;color:var(--ink-soft);line-height:1.6;} .article-sidebar .side-box p:last-child{margin-bottom:0;} .article-sidebar .side-btn{display:block;text-align:center;background:var(--red);color:#fff;border-radius:999px;padding:10px 20px;font-weight:700;font-size:13.5px;text-decoration:none;} .article-sidebar .side-btn:hover{background:var(--red-dark);color:#fff;} .article-sidebar .freq-pill{background:var(--surface-alt);border-left:3px solid var(--red);border-radius:8px;padding:9px 12px;font-weight:600;font-size:13px;color:var(--ink-soft);margin-bottom:8px;} .article-sidebar .tag-pill-list{display:flex;flex-wrap:wrap;gap:6px;} .article-sidebar .tag-pill{display:inline-block;background:var(--surface-alt);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:12px;color:var(--ink-soft);} @media (max-width:900px){.article-wrap.article-with-sidebar{grid-template-columns:1fr;max-width:760px;}} .article-head--municipality{position:relative;overflow:hidden;isolation:isolate;margin-bottom:30px;padding:34px clamp(24px,5vw,52px) 30px;background:linear-gradient(135deg,rgba(255,255,255,.98) 0 68%,rgba(221,199,109,.34) 68% 100%);border:2px solid var(--ink);border-top:8px solid var(--red);border-radius:4px 28px 4px 28px;box-shadow:10px 10px 0 rgba(221,199,109,.72);} .article-head--municipality::before{content:"";position:absolute;z-index:-1;right:-58px;top:-80px;width:220px;height:220px;border:34px solid rgba(214,17,30,.08);border-radius:50%;} .article-head--municipality .crumbs{margin-bottom:24px;color:var(--ink-soft);} .municipality-kicker{display:inline-flex;align-items:center;gap:9px;margin-bottom:12px;font-size:12px;font-weight:800;letter-spacing:.14em;line-height:1;text-transform:uppercase;color:var(--red);} .municipality-kicker-icon{display:inline-grid;place-items:center;width:22px;height:22px;background:var(--red);border:5px solid var(--red-tint);border-radius:50%;box-shadow:0 0 0 1px var(--red);color:transparent;} .article-head--municipality h1{max-width:12ch;margin:0;color:var(--ink);font-size:clamp(42px,7vw,78px);line-height:.98;letter-spacing:-.055em;text-wrap:balance;} .article-head--municipality h1::after{display:none;} .municipality-intro{max-width:62ch;margin:20px 0 0;padding-left:16px;border-left:4px solid var(--gold);color:var(--ink-soft);font-size:clamp(16px,2vw,19px);font-weight:600;line-height:1.55;} .municipality-title-mark{display:flex;gap:6px;margin-top:22px;} .municipality-title-mark span{display:block;width:34px;height:5px;background:var(--red);transform:skewX(-24deg);} .municipality-title-mark span:nth-child(2){width:18px;background:var(--gold);} .municipality-title-mark span:nth-child(3){width:9px;background:var(--ink);} .article-head--municipality .byline{display:inline-flex;margin-top:22px;padding:7px 12px;background:var(--ink);border-radius:999px;color:#fff;font-size:12px;} @media (max-width:640px){.article-head--municipality{padding:26px 20px 24px;border-radius:3px 20px 3px 20px;box-shadow:6px 6px 0 rgba(221,199,109,.72);} .article-head--municipality h1{font-size:clamp(38px,13vw,58px);} .municipality-intro{font-size:15.5px;}} .article-head--domain{position:relative;overflow:hidden;isolation:isolate;margin-bottom:34px;padding:34px clamp(24px,5vw,52px) 32px;color:#fff;background:#000;border:2px solid #000;border-bottom:8px solid var(--gold);border-radius:26px 4px 26px 4px;box-shadow:10px 10px 0 var(--red);} .article-head--domain::before{content:".";position:absolute;z-index:-1;right:20px;top:-74px;font-size:260px;font-weight:900;line-height:1;color:rgba(221,199,109,.16);} .article-head--domain::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(120deg,transparent 0 66%,rgba(214,17,30,.24) 66% 100%);} .article-head--domain .crumbs,.article-head--domain .crumbs a{color:rgba(255,255,255,.72);} .domain-kicker{display:flex;align-items:center;gap:10px;margin:24px 0 14px;color:var(--gold);font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;} .domain-kicker span{display:inline-flex;align-items:center;justify-content:center;height:25px;padding:0 8px;background:var(--red);border-radius:4px;color:#fff;font:800 10px/1 ui-monospace,SFMono-Regular,monospace;letter-spacing:0;} .article-head--domain h1{max-width:15ch;margin:0;color:#fff;font-size:clamp(38px,6.5vw,72px);line-height:1;letter-spacing:-.055em;overflow-wrap:anywhere;} .article-head--domain h1::after{display:none;} .domain-intro{max-width:64ch;margin:20px 0 0;color:rgba(255,255,255,.84);font-size:clamp(16px,2vw,19px);font-weight:600;line-height:1.55;} .domain-title-mark{display:flex;align-items:center;gap:8px;margin-top:23px;} .domain-title-mark span:first-child{width:74px;height:5px;background:var(--red);} .domain-title-mark span:last-child{width:16px;height:16px;background:var(--gold);border-radius:50%;} .article-head--domain .byline{display:inline-flex;margin-top:22px;padding:7px 12px;border:1px solid rgba(255,255,255,.3);border-radius:999px;color:#fff;font-size:12px;} .single-domain .prose{counter-reset:domain-section;} .single-domain .prose h2{position:relative;margin-top:2em;padding:14px 18px 14px 58px;background:#fff;border:2px solid #000;border-left:8px solid var(--red);border-radius:3px 14px 3px 14px;box-shadow:5px 5px 0 rgba(221,199,109,.72);font-size:clamp(21px,3vw,28px);counter-increment:domain-section;} .single-domain .prose h2::before{content:counter(domain-section,decimal-leading-zero);position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--red);font:900 15px/1 ui-monospace,SFMono-Regular,monospace;} .single-domain .prose h2::after{content:"";position:absolute;left:45px;top:14px;bottom:14px;width:1px;background:rgba(0,0,0,.2);} @media (max-width:640px){.article-head--domain{padding:26px 20px 25px;border-radius:18px 3px 18px 3px;box-shadow:6px 6px 0 var(--red);} .article-head--domain h1{font-size:clamp(34px,11vw,52px);} .domain-intro{font-size:15.5px;} .single-domain .prose h2{padding:13px 14px 13px 50px;font-size:21px;} .single-domain .prose h2::before{left:11px;} .single-domain .prose h2::after{left:39px;}} .hb-404{background:var(--surface);padding:76px 0 64px;text-align:center;border-bottom:1px solid var(--line);} .hb-404-inner{max-width:640px;margin:0 auto;} .hb-404-badge{display:inline-block;font-size:clamp(64px,12vw,120px);font-weight:900;line-height:1;letter-spacing:-.03em;background:linear-gradient(135deg,var(--red) 40%,var(--gold-dark));-webkit-background-clip:text;background-clip:text;color:transparent;} .hb-404 h1{font-size:clamp(24px,3.4vw,32px);color:var(--ink);margin:6px 0 10px;} .hb-404-lede{color:var(--muted);font-size:16px;max-width:44ch;margin:0 auto 28px;} .hb-404-search{max-width:420px;margin:0 auto 28px;} .hb-404-links{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0;padding:0;} .hb-404-links a{display:inline-block;padding:10px 18px;border-radius:999px;border:1.5px solid var(--line);color:var(--ink-soft);font-weight:700;font-size:14px;} .hb-404-links a:hover{border-color:var(--red);color:var(--red-dark);background:var(--red-tint);text-decoration:none;} .hb-socials{display:flex;align-items:center;gap:8px;flex-wrap:wrap;list-style:none;margin:0;padding:0;} .hb-socials li{margin:0!important;padding:0!important;list-style:none!important;} .hb-socials a{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 9px;border:1.5px solid rgba(255,255,255,.28);border-radius:999px;color:#fff;text-decoration:none;line-height:1;font-weight:700;font-size:14px;box-sizing:border-box;transition:.15s;} .hb-socials a:hover{border-color:var(--gold);color:var(--gold);background:rgba(255,255,255,.06);text-decoration:none;} .hb-socials--square a{border-radius:6px;} .hb-socials--text a{border:0;min-width:auto;height:auto;padding:0;font-size:13px;color:#c2b8b0;} .hb-socials--text a:hover{color:var(--gold);background:none;} .hb-socials--footer{display:grid;grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:10px;width:100%;} .hb-socials--footer li{width:100%;} .hb-socials--footer a{width:100%;min-width:0;height:46px;padding:0;font-size:19px;border-radius:12px;border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.04);} .hb-socials--footer a:hover{background:rgba(221,199,109,.12);} .hb-socials--footer.hb-socials--square a{border-radius:10px;} .hb-socials--footer.hb-socials--text{display:flex;} .hb-socials--footer.hb-socials--text a{width:auto;height:auto;font-size:13px;}:root{--bg:#ffffff;--surface:#ffffff;--surface-alt:#ffffff;--ink:#000000;--ink-soft:#000000;--muted:#000000;--line:rgba(0,0,0,.16);--line-strong:#000000;--red:#d6111e;--red-dark:#d6111e;--red-tint:rgba(214,17,30,.09);--gold:#ddc76d;--gold-dark:#ddc76d;--gold-tint:rgba(221,199,109,.18);--shadow:0 2px 0 rgba(0,0,0,.08),0 22px 50px -34px rgba(0,0,0,.55);--radius:18px;} body{background-color:#ffffff;background-image:radial-gradient(rgba(0,0,0,.045) .7px,transparent .7px);background-size:8px 8px;} h1,h2,h3,h4,.brand .word{font-family:'Open Sans',system-ui,-apple-system,'Segoe UI',sans-serif;letter-spacing:-.025em;} .site-header{border-top:4px solid var(--red);box-shadow:0 8px 30px rgba(24,19,17,.06);} .primary-nav-bar{background:rgba(255,255,255,.94);backdrop-filter:blur(12px);} .hero{padding:86px 0 74px;background:linear-gradient(118deg,#ffffff 0 66%,#ddc76d 66%)!important;} .hero::after{content:"";position:absolute;inset:22px 28px;border:1px solid rgba(24,19,17,.12);pointer-events:none;} .hero h1{font-size:clamp(42px,6.3vw,76px);max-width:12ch;line-height:.98;} .hero .art{transform:rotate(2.5deg);filter:drop-shadow(18px 24px 24px rgba(24,19,17,.18));} .hero .art img{border-radius:26% 8% 24% 8%;} .hero .ribbon{transform:rotate(-7deg);box-shadow:4px 5px 0 var(--ink);} .section-head{border-bottom:2px solid var(--ink);padding-bottom:12px;} .section-head h2::before{content:"//";color:var(--red);margin-right:.35em;font-family:ui-monospace,monospace;} .card,.hb-dirnav-card{border:1px solid rgba(24,19,17,.14);box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease;} .card:hover,.hb-dirnav-card:hover{transform:translateY(-5px) rotate(-.25deg);box-shadow:0 3px 0 rgba(24,19,17,.1),0 28px 55px -30px rgba(24,19,17,.5);} .card-grid>.card:nth-child(even){transform:translateY(14px);} .card-grid>.card:nth-child(even):hover{transform:translateY(9px) rotate(.25deg);} .btn,.header-cta{border-radius:999px;} @media (max-width:760px){.hero{padding:58px 0;background:linear-gradient(155deg,#ffffff 0 72%,#ddc76d 72%)!important;}.hero::after{inset:12px;}.hero h1{font-size:clamp(38px,12vw,58px);}.card-grid>.card:nth-child(even){transform:none;}} @media (prefers-reduced-motion:reduce){.card,.hb-dirnav-card{transition:none;}.hero .art{transform:none;}} .site-header{z-index:10000;} .primary-nav-bar{position:relative;z-index:9999;background:#ffffff;overflow:visible;isolation:isolate;} .primary-nav-bar .container,.primary-nav,.primary-nav>ul,.primary-nav>ul>li{overflow:visible;} .primary-nav .sub-menu{z-index:10001;background:#ffffff;opacity:0;visibility:hidden;pointer-events:none;border:2px solid #000000;box-shadow:8px 8px 0 rgba(221,199,109,.95);} .primary-nav .has-sub:hover>.sub-menu,.primary-nav .has-sub:focus-within>.sub-menu,.primary-nav .has-sub.is-open>.sub-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);} .primary-nav .sub-menu a{background:#ffffff;color:#000000;} .primary-nav .sub-menu a:hover,.primary-nav .sub-menu a:focus-visible{background:#d6111e;color:#ffffff;} @media (max-width:900px){.primary-nav-bar{z-index:10001;}.primary-nav{z-index:10002;background:#ffffff;}.primary-nav .sub-menu{background:#ffffff;border-left:3px solid #ddc76d;box-shadow:none;pointer-events:auto;}} @media (max-width:900px){.site-header{z-index:10003;} .primary-nav-bar{-webkit-backdrop-filter:none;backdrop-filter:none;background:transparent;border:0;z-index:100020;} .primary-nav-overlay{display:block;position:fixed;inset:0;z-index:100010;background:rgba(6,4,3,.75);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s ease,visibility 0s linear .3s;} body:has(#hb-primary-nav.is-open) .primary-nav-overlay{opacity:1;visibility:visible;transition:opacity .3s ease,visibility 0s;} .primary-nav{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;display:flex;flex-direction:column;justify-content:center;background:#0d0a08;background-image:radial-gradient(circle at 85% -10%,rgba(214,17,30,.35) 0%,rgba(214,17,30,0) 55%),radial-gradient(circle at -10% 110%,rgba(221,199,109,.22) 0%,rgba(221,199,109,0) 55%);padding:84px 30px 48px;overflow-y:auto;overscroll-behavior:contain;z-index:100020;box-shadow:none;border-top:3px solid transparent;background-origin:border-box;} .primary-nav:not(.is-open){opacity:0;visibility:hidden;transform:scale(.96);transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s;} .primary-nav.is-open{opacity:1;visibility:visible;transform:scale(1);transition:opacity .3s ease,transform .3s ease,visibility 0s;} @media (prefers-reduced-motion:reduce){.primary-nav,.primary-nav:not(.is-open),.primary-nav.is-open{transition:opacity .15s linear;transform:none;}} .primary-nav-close{display:flex;position:absolute;top:22px;right:22px;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.18);border-radius:50%;cursor:pointer;background:rgba(255,255,255,.06);color:#f3ece5;font-size:22px;line-height:1;transition:background .2s ease,border-color .2s ease,transform .2s ease;} .primary-nav-close:hover,.primary-nav-close:focus-visible{background:var(--red);border-color:var(--red);color:#fff;transform:rotate(90deg);} .primary-nav >ul{background:transparent;gap:4px;} .primary-nav >ul >li{background:transparent;} .primary-nav a{background:transparent;color:#f3ece5;font-size:19px;font-weight:700;padding:13px 14px;border-radius:10px;} .primary-nav >ul >li.is-active >a,.primary-nav >ul >li >a:hover{background:rgba(214,17,30,.22);color:#ff6b74;} .primary-nav .sub-menu{background:rgba(255,255,255,.04);margin:4px 0 10px;padding:6px;border:1px solid rgba(255,255,255,.12);border-left:3px solid var(--gold);border-radius:0 12px 12px 0;box-shadow:none;} .primary-nav .sub-menu li{background:transparent;} .primary-nav .sub-menu a{background:transparent;color:#e6ddd5;font-size:16px;font-weight:600;padding:10px 12px;} .primary-nav .sub-menu a:hover,.primary-nav .sub-menu a:focus-visible{background:var(--red);color:#ffffff;}} [data-theme="dark"]{--bg:#151009;--surface:#1e1712;--surface-alt:#251d17;--ink-soft:#cfc6bf;--muted:#a89d96;--line:rgba(255,255,255,.12);--line-strong:rgba(255,255,255,.24);--red:#f23c4a;--red-dark:#ff727d;--red-tint:rgba(242,60,74,.16);--gold:#e9d68c;--gold-dark:#f3e3ab;--gold-tint:rgba(233,214,140,.14);--shadow:0 2px 0 rgba(0,0,0,.4),0 22px 50px -30px rgba(0,0,0,.9);color-scheme:dark;} [data-theme="dark"] body{background-color:var(--bg);background-image:radial-gradient(rgba(255,255,255,.045) .7px,transparent .7px);background-size:8px 8px;color:var(--ink-soft);} [data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,[data-theme="dark"] h4,[data-theme="dark"] .nav-toggle,[data-theme="dark"] .hero h1,[data-theme="dark"] .hb-dirs-title,[data-theme="dark"] .hb-dirnav-title,[data-theme="dark"] .hb-pagination .page-numbers.next,[data-theme="dark"] .prose>p:first-of-type,[data-theme="dark"] .prose strong,[data-theme="dark"] .prose b,[data-theme="dark"] .ai-notice b,[data-theme="dark"] .hb-404 h1{color:#f3ece5;} [data-theme="dark"] .btn-ghost{color:#f3ece5;border-color:#f3ece5;} [data-theme="dark"] .section-head{border-bottom-color:rgba(255,255,255,.2);} [data-theme="dark"] .article-head--municipality h1,[data-theme="dark"] .article-head--municipality .crumbs,[data-theme="dark"] .municipality-intro{color:#17110f;} [data-theme="dark"] .primary-nav-bar{background:rgba(30,23,18,.94);} [data-theme="dark"] .primary-nav .sub-menu{background:var(--surface);border-color:rgba(255,255,255,.16);} [data-theme="dark"] .primary-nav .sub-menu a{background:var(--surface);color:var(--ink-soft);} [data-theme="dark"] .primary-nav .sub-menu a:hover,[data-theme="dark"] .primary-nav .sub-menu a:focus-visible{background:var(--red);color:#fff;} [data-theme="dark"] .hero{background:linear-gradient(118deg,#1e1712 0 66%,#5c4f22 66%)!important;} @media (max-width:760px){[data-theme="dark"] .hero{background:linear-gradient(155deg,#1e1712 0 72%,#5c4f22 72%)!important;}} [data-theme="dark"] .hero::after{border-color:rgba(255,255,255,.14);} [data-theme="dark"] .hero .art .ribbon{background:var(--surface);color:var(--gold);border-color:var(--gold);} [data-theme="dark"] input,[data-theme="dark"] textarea,[data-theme="dark"] select{background:var(--surface);color:var(--ink-soft);border-color:var(--line-strong);} [data-theme="dark"] .weather-search-input{background:var(--surface);border-color:var(--line-strong);color:var(--ink-soft);} [data-theme="dark"] .article-summary-share a{background:var(--surface);} [data-theme="dark"] .hbs-empty,[data-theme="dark"] .hbs-empty p,[data-theme="dark"] .hbs-empty .hbs-muted{color:#b9aea6;} [data-theme="dark"] .hbs-empty::selection{background:rgba(233,214,140,.28);color:#f3ece5;} .hb-map-chip{display:inline-flex;align-items:center;min-height:32px;padding:6px 12px;border-radius:999px;background:var(--surface-alt);border:1px solid var(--line);color:var(--ink-soft);font-weight:700;font-size:12.5px;text-decoration:none;} .hb-map-chip:hover,.hb-map-chip:focus-visible{background:var(--red);border-color:var(--red);color:#fff;text-decoration:none;} .hb-map-group{margin:26px 0 0;padding:18px 20px;border:1px solid var(--line);border-top:3px solid var(--red);border-radius:16px;background:linear-gradient(135deg,var(--surface),var(--surface-alt));box-shadow:var(--shadow);} .hb-map-group:nth-of-type(3n){border-top-color:var(--gold);} .hb-map-group h2{margin:0 0 12px;font-size:19px;color:var(--ink);} .hb-map-group ul{columns:2;column-gap:32px;list-style:none;padding:0;margin:0;} .hb-map-group li{margin:5px 0;break-inside:avoid;} .hb-map-group li a{color:var(--red);text-decoration:none;font-weight:600;} .hb-map-group li a:hover,.hb-map-group li a:focus-visible{color:var(--red-dark);text-decoration:underline;} [data-theme="dark"] .hb-map-group li a{color:#ff727d;} [data-theme="dark"] .hb-map-group h2{color:#fff;} [data-theme="dark"] .hb-map-group li a:hover,[data-theme="dark"] .hb-map-group li a:focus-visible{color:#f3e3ab;} @media (max-width:650px){.hb-map-group ul{columns:1;}.hb-map-group{padding:15px;}} [data-theme="dark"] .kat-card-cta{color:var(--gold);} [data-theme="dark"] .kat-card-cta:hover{color:var(--red-dark);} [data-theme="dark"] .hb-catban-title{color:var(--ink-soft);} [data-theme="dark"] .hb-catban-arrow{color:var(--ink-soft);} [data-theme="dark"] img{filter:brightness(.9) contrast(1.02);} [data-theme="dark"] .brand img{filter:brightness(.96);} @media (prefers-reduced-motion:reduce){.theme-toggle{transition:none;}} .site-header .theme-toggle{margin-left:auto;} .theme-toggle{appearance:none;-webkit-appearance:none;position:relative;flex:none;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;margin:0 10px 0 auto;padding:0;border-radius:50%;cursor:pointer;color:var(--ink);background:var(--surface);border:1.5px solid var(--line-strong);transition:transform .2s cubic-bezier(.22,1,.36,1),border-color .2s,box-shadow .2s,color .2s,background .2s;-webkit-tap-highlight-color:transparent;} .theme-toggle:hover{transform:translateY(-2px);border-color:var(--gold);color:var(--gold-dark);box-shadow:0 10px 22px -12px rgba(221,199,109,.55);} .theme-toggle:focus-visible{outline:3px solid var(--gold);outline-offset:2px;} .theme-toggle-icon{display:block;} .theme-toggle-icon--sun{display:none;} [data-theme="dark"] .theme-toggle-icon--moon{display:none;} [data-theme="dark"] .theme-toggle-icon--sun{display:block;} @media (max-width:900px){.theme-toggle{margin-right:8px;}} body.hb-kategoriaindeksi-page #sisalto .container{max-width:1200px;} .catidx-search-row{margin:4px 0 20px;max-width:420px;} .catidx-search-input{width:100%;box-sizing:border-box;padding:12px 16px;border-radius:999px;border:1.5px solid var(--line-strong);background:var(--surface);color:var(--ink);font-family:inherit;font-size:14.5px;outline:none;transition:border-color .15s;} .catidx-search-input:focus{border-color:var(--red);} .catidx-empty{color:var(--muted);margin:0 0 20px;} .catidx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px;} .catidx-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease;} .catidx-card:hover,.catidx-card:focus-visible{transform:translateY(-4px);box-shadow:0 3px 0 rgba(24,19,17,.1),0 24px 46px -26px rgba(24,19,17,.5);outline:none;} .catidx-card:focus-visible{outline:3px solid var(--gold);outline-offset:2px;} .catidx-card[hidden]{display:none;} .catidx-art{display:block;line-height:0;} .catidx-art svg{display:block;width:100%;height:auto;} .catidx-body{padding:14px 16px 16px;} .catidx-title{font-size:15.5px;letter-spacing:-.01em;margin:0 0 3px;} .catidx-count{display:block;font-size:12.5px;color:var(--muted);} @media (prefers-reduced-motion:reduce){.catidx-card{transition:none;}}:root[data-theme="light"]{color-scheme:light;} [data-theme="dark"] .theme-toggle,[data-theme="dark"] .hbs-launcher{color:#f3ece5;border-color:#8c8178;} [data-theme="dark"] .theme-toggle:hover,[data-theme="dark"] .hbs-launcher:hover{color:#e9d68c;border-color:#e9d68c;} [data-theme="dark"] .hbs-actions .hbs-btn:not(.is-on){color:#f3ece5;} [data-theme="dark"] .hbs-actions--icon .hbs-btn,[data-theme="dark"] .hbs-actions--pill .hbs-btn{background:#251d17;border-color:#8c8178;} [data-theme="dark"] .hbs-actions .hbs-btn--fav.is-on{color:#ff727d;background:#251d17;} [data-theme="dark"] .hbs-actions .hbs-btn--later.is-on{color:#e9d68c;background:#251d17;} [data-theme="dark"] .hbs-actions .hbs-btn--later.is-on .hbs-shape{fill:#e9d68c;stroke:#e9d68c;} [data-theme="dark"] .dir-icon,[data-theme="dark"] .hb-dirs-icon,[data-theme="dark"] .hb-dirnav-icon{color:#f3ece5;border:1px solid #8c8178;} [data-theme="dark"] .brand img,[data-theme="dark"] .ai-vertailu-logo img,[data-theme="dark"] .ai-vertailu-compare-logo img{filter:none;} [data-theme="dark"] .brand img{background:#fff;border-radius:8px;} .screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;} .screen-reader-text:focus{background:#fff;clip:auto!important;clip-path:none;color:#17110f;display:block;height:auto;left:8px;padding:12px 16px;top:8px;width:auto;z-index:100000;} .hb-index-title{margin:0 0 20px;} .hb-index-title .hb-index-page{font-weight:400;font-size:.7em;color:var(--muted,#7b716a);} .hb-front-hero h1{font-size:20px;line-height:1.3;max-width:none;} .hb-front-editorial{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:start;} .hb-front-intro,.hb-front-latest{min-width:0;} .hb-front-intro{line-height:1.75;overflow-wrap:anywhere;} .hb-front-intro h2{font-size:22px;line-height:1.35;margin:1.5em 0 .65em;} .hb-front-intro h2:first-child{margin-top:0;} .hb-front-intro p{margin:0 0 1.15em;} .hb-front-intro a{text-decoration:underline;text-underline-offset:3px;} .hb-front-latest .section-head{flex-wrap:wrap;gap:12px;} .hb-front-latest .card-grid{grid-template-columns:repeat(2,minmax(0,1fr));} .hb-front-latest .card-grid>.card:nth-child(even){transform:none;} @media(max-width:880px){.hb-front-editorial{grid-template-columns:minmax(0,1fr);gap:32px;}} @media(max-width:560px){.hb-front-latest .card-grid{grid-template-columns:minmax(0,1fr);}} .hbs-empty a.hbs-cta,.hbs-empty a.hbs-cta:visited,.hbs-empty a.hbs-cta:hover,.hbs-empty a.hbs-cta:focus-visible,.hbs-empty a.hbs-cta:active{color:#fff;text-decoration:none;} [data-theme="dark"] .home .section{background:var(--bg)!important;color:var(--ink-soft);} [data-theme="dark"] .home .section:nth-of-type(even){background:var(--surface)!important;} [data-theme="dark"] .hb-front-hero h1,[data-theme="dark"] .home .section-head h2,[data-theme="dark"] .home .hb-front-contact-col>h2{color:#f3ece5!important;} [data-theme="dark"] .hb-front-hero h1 mark{color:#ff727d!important;} [data-theme="dark"] .hb-front-hero .htext>p,[data-theme="dark"] .hb-front-intro{color:#cfc6bf;} [data-theme="dark"] .hb-front-intro h2{color:#f3ece5;} [data-theme="dark"] .hb-front-intro a{color:#ff727d;} [data-theme="dark"] .hb-front-intro a:hover,[data-theme="dark"] .hb-front-intro a:focus-visible{color:#f3e3ab;} [data-theme="dark"] .prose>h2:not(.card-grid):not(.hb-rss-list),[data-theme="dark"] .prose>h3:not(.card-grid):not(.hb-rss-list),[data-theme="dark"] .prose>h4:not(.card-grid):not(.hb-rss-list){color:#f3ece5;} .hbjn-newsletter .hb-newsletter-notice,[data-theme="dark"] .hb-newsletter-notice{color:#f3ece5!important;background:#30291b!important;border-color:#ddc76d!important;} .hb-newsletter-notice::selection,.hb-newsletter-notice::selection{background:#ddc76d;color:#17110f;} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;} .hbjn-badge{animation:none;} .hbjn-card,.hbjn-newsletter{transition:none;}} .hb-affiliate-banner{display:flex;justify-content:center;align-items:center;width:100%;text-align:center;margin:25px auto} .hb-affiliate-banner a{display:block;line-height:0;max-width:100%} .hb-affiliate-banner[hidden]{display:none!important} .hb-affiliate-banner img{display:block;margin:0 auto;max-width:100%;height:auto} .site-footer{margin-top:0!important;position:relative;background:#080808;color:#d8d2cc;border-top:3px solid #d6111e;padding-top:48px;} .site-footer:before{content:"";position:absolute;top:-3px;left:0;right:0;height:3px;background:linear-gradient(90deg,#d6111e 0%,#d6111e 58%,#ddc76d 100%);} .home .hb-front-contact{margin-bottom:0!important;} .home #sisalto{padding-bottom:0!important;margin-bottom:0!important;} .footer-help{display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:36px;padding:26px 30px;border:1px solid rgba(221,199,109,.42);border-radius:18px;background:radial-gradient(circle at 100% 0%,rgba(214,17,30,.16),transparent 42%),linear-gradient(120deg,#171717,#101010);box-shadow:0 12px 32px rgba(0,0,0,.22);} .footer-help__copy{max-width:650px;} .footer-help__eyebrow{display:block;color:#ddc76d;font-size:10.5px;font-weight:850;letter-spacing:.14em;margin-bottom:9px;} .site-footer .footer-help h2{color:#fff;font-size:clamp(18px,2.1vw,24px);line-height:1.2;letter-spacing:-.02em;margin:0 0 9px;} .site-footer .footer-help p{color:#bcb4ad;line-height:1.7;font-size:13px;margin:0;max-width:620px;} .footer-help__actions{display:flex;flex-direction:column;align-items:flex-start;gap:9px;min-width:220px;} .site-footer .footer-help__button{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 15px;border-radius:10px;background:linear-gradient(100deg,#d6111e,#ff5a19);color:#fff;font-weight:800;text-decoration:none;width:100%;box-sizing:border-box;transition:transform .18s,box-shadow .18s;} .site-footer .footer-help__button:hover{color:#fff;transform:translateY(-2px);box-shadow:0 7px 18px rgba(214,17,30,.22);} .site-footer .footer-help__link{font-size:12.5px;text-decoration:none;border-bottom:1px solid rgba(221,199,109,.35);padding-bottom:2px;} .site-footer .footer-help__link:hover{color:#ddc76d;} .footer-bottom{margin-top:28px;} @media(max-width:760px){.footer-help{align-items:stretch;flex-direction:column;padding:22px 20px;gap:20px;margin-top:28px}.footer-help__actions{min-width:0;width:100%}.site-footer{padding-top:34px}} .hb-ai-guide{margin:42px 0 28px;padding:clamp(24px,4vw,38px);border:1px solid rgba(221,199,109,.48);border-radius:20px;background:linear-gradient(135deg,#111 0%,#1b1b1b 72%,#2b1012 100%);color:#f8f6f0;box-shadow:0 14px 35px rgba(0,0,0,.12)} .hb-ai-guide__eyebrow{display:block;margin-bottom:10px;color:#ddc76d;font-size:.75rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase} .hb-ai-guide h2{margin:0 0 14px;color:#fff;font-size:clamp(1.5rem,3vw,2.2rem);line-height:1.2} .hb-ai-guide>p{max-width:1000px;color:rgba(255,255,255,.84);line-height:1.8} .hb-ai-guide__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:24px 0} .hb-ai-guide__grid>div{padding:19px;border:1px solid rgba(221,199,109,.22);border-radius:13px;background:rgba(255,255,255,.045)} .hb-ai-guide__grid h3{margin:0 0 8px;color:#ddc76d;font-size:1.03rem} .hb-ai-guide__grid p{margin:0;color:rgba(255,255,255,.82);font-size:.93rem;line-height:1.7} .hb-ai-guide .hb-ai-guide__note{margin:22px 0 0;padding:16px 18px;border-radius:10px;background:rgba(214,17,30,.13);border-left:3px solid #d6111e;color:#f5f0e8} @media(max-width:680px){.hb-ai-guide{margin:30px 0 20px;padding:22px 18px}.hb-ai-guide__grid{grid-template-columns:1fr}} .hero .hb-hero-video-art{flex:0 1 560px;width:min(560px,100%);aspect-ratio:16/9;padding:0;overflow:hidden;border:2px solid var(--red);border-radius:20px;background:#080707;box-shadow:0 24px 48px -20px rgba(214,17,30,.38),0 0 0 7px var(--red-tint);} .hero .hb-hero-video-art .hb-hero-intro-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:17px;background:#080707;opacity:0;transition:opacity .25s ease;} .hero .hb-hero-video-art .hb-hero-intro-video.is-playing{opacity:1;} .hero .hb-hero-video-art .hb-hero-poster{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover;filter:none;} .hero .hb-hero-video-art .ribbon{z-index:2;top:15px;left:15px;right:auto;transform:rotate(-4deg);max-width:calc(100% - 30px);padding:7px 13px;border-radius:999px;background:var(--red);color:#fff;font-size:11px;font-weight:850;letter-spacing:.02em;box-shadow:3px 4px 0 rgba(0,0,0,.42);} .hb-video-sound-note{position:absolute;left:15px;bottom:13px;z-index:2;color:#fff;font-size:9px;font-weight:800;letter-spacing:.1em;padding:7px 10px;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(0,0,0,.65);backdrop-filter:blur(8px);} .hb-video-sound-note span{color:var(--gold);padding:0 4px} .hb-info-video-section{width:100%;padding:52px 24px 68px;background:linear-gradient(180deg,#f7f1e6 0%,#fffdfa 100%);border-top:1px solid var(--line);} .hb-info-video-inner{max-width:1200px;margin:0 auto} .hb-info-video-copy{max-width:850px;margin:0 0 24px} .hb-info-video-kicker{display:inline-block;margin-bottom:10px;color:var(--red-dark);font-size:11px;font-weight:900;letter-spacing:.15em} .hb-info-video-copy h2{font-size:clamp(27px,3.5vw,40px);letter-spacing:-.035em;line-height:1.13;margin:0 0 12px} .hb-info-video-copy p{max-width:760px;color:var(--ink-soft);font-size:15px;line-height:1.8;margin:0} .hb-info-video-frame{overflow:hidden;width:100%;aspect-ratio:16/9;border:2px solid var(--red);border-radius:20px;background:#080707;box-shadow:0 22px 50px -30px rgba(23,17,15,.45),0 0 0 6px var(--red-tint);} .hb-info-video-frame video{display:block;width:100%;height:100%;object-fit:contain;background:#080707} @media(max-width:760px){.hero .hb-hero-video-art{flex:1 1 100%;width:100%;max-width:560px;margin:14px auto 0} .hero .hb-hero-video-art .ribbon{top:10px;left:10px;font-size:10px} .hb-video-sound-note{left:10px;bottom:9px;font-size:8px} .hb-info-video-section{padding:36px 16px 46px} .hb-info-video-frame{border-radius:13px;box-shadow:0 12px 30px -20px rgba(23,17,15,.45),0 0 0 4px var(--red-tint)}} @media(prefers-reduced-motion:reduce){.hero .hb-hero-video-art video{animation:none}} .hb-front-hero .hb-hero-tagline{display:flex;align-items:center;gap:10px;margin:14px 0 12px;color:#d6111e;font-size:clamp(12px,1.15vw,14px);font-weight:850;letter-spacing:.13em;line-height:1.4;} .hb-front-hero .hb-hero-tagline i{color:#d9bd61;font-style:normal;font-size:1.25em;} @media (max-width:640px){.hb-front-hero .hb-hero-tagline{margin:10px 0;gap:8px;}}

.hero .hb-hero-video-art .hb-hero-intro-video[hidden],.hero .hb-hero-video-art .hb-hero-video-play[hidden]{display:none!important}.hb-hero-video-play{position:absolute;z-index:3;top:50%;left:50%;display:flex;align-items:center;gap:10px;transform:translate(-50%,-50%);padding:12px 17px;border:1px solid rgba(255,255,255,.65);border-radius:999px;background:#d6111e;color:#fff;font:700 14px/1.2 'Open Sans',sans-serif;box-shadow:0 8px 24px rgba(0,0,0,.38);cursor:pointer}.hb-hero-video-play>span:first-child{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;color:#d6111e;font-size:12px}.hb-hero-video-play:hover{transform:translate(-50%,-50%) scale(1.04)}.hb-hero-video-play:focus-visible{outline:3px solid #ddc76d;outline-offset:3px}
.hero .hb-hero-video-art .hb-hero-intro-video{opacity:1!important;transition:none!important;z-index:1}.hero .hb-hero-video-art .hb-video-sound-note{bottom:46px}#hb-a11y-toggle,#hb-a11y-panel{z-index:2147483647!important}html.hb-large-text body{zoom:1.18}
.hb-hero-video-details{position:absolute;inset:0;z-index:1}.hb-hero-video-details>summary{position:absolute;z-index:3;top:50%;left:50%;display:flex;align-items:center;gap:10px;transform:translate(-50%,-50%);padding:12px 17px;border:1px solid rgba(255,255,255,.65);border-radius:999px;background:#d6111e;color:#fff;font:700 14px/1.2 'Open Sans',sans-serif;box-shadow:0 8px 24px rgba(0,0,0,.38);cursor:pointer;list-style:none;white-space:nowrap}.hb-hero-video-details>summary::-webkit-details-marker{display:none}.hb-hero-video-details>summary>span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;color:#d6111e;font-size:12px}.hb-hero-video-details>summary:focus-visible{outline:3px solid #ddc76d;outline-offset:3px}.hb-hero-video-details[open]>summary{display:none}.hb-hero-video-details:not([open])>.hb-hero-intro-video{display:none}.hb-hero-video-details[open]>.hb-hero-intro-video{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;object-fit:cover;border-radius:17px;background:#080707}
/* Accessibility contrast corrections 1.63.16 */.pill-gold{color:#574400}[data-theme=dark] .pill-gold{color:#f3e3ab}.hb-front-latest .card .body{color:#17110f;background:#fff}.hb-front-latest .card .body a{color:#8f0b14}[data-theme=dark] .hb-front-latest .card .body{color:#f3ece5;background:#1e1712}[data-theme=dark] .hb-front-latest .card .body a{color:#ff9ca4}
/* Video playback control and close button */.hb-hero-video-details[open]>summary{display:flex;top:12px;right:12px;left:auto;transform:none;padding:8px 12px;font-size:12px}
.primary-nav>ul>li>a[href*="yhteisochat.harrasteblogi.com"],.primary-nav>ul>li>a[href$="/chat"],.primary-nav>ul>li>a[href$="/chat/"]{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 17px;border:1px solid var(--red);border-radius:999px;background:linear-gradient(135deg,var(--red),var(--red-dark));color:#fff;font-weight:800;text-decoration:none;box-shadow:0 6px 16px rgba(214,17,30,.18);transition:transform .18s ease,box-shadow .18s ease}.primary-nav>ul>li>a[href*="yhteisochat.harrasteblogi.com"]:hover,.primary-nav>ul>li>a[href$="/chat"]:hover,.primary-nav>ul>li>a[href$="/chat/"]:hover{transform:translateY(-1px);color:#fff;box-shadow:0 9px 20px rgba(214,17,30,.25)}.primary-nav a[href*="yhteisochat.harrasteblogi.com"]:focus-visible,.primary-nav a[href$="/chat"]:focus-visible,.primary-nav a[href$="/chat/"]:focus-visible{outline:3px solid var(--gold);outline-offset:3px}@media(prefers-reduced-motion:reduce){.primary-nav>ul>li>a[href*="yhteisochat.harrasteblogi.com"],.primary-nav>ul>li>a[href$="/chat"],.primary-nav>ul>li>a[href$="/chat/"]{transition:none}}

.hb-info-chat-cta{display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:18px;margin:25px auto;padding:22px 24px;max-width:1200px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}.hb-info-chat-cta__icon{display:grid;place-items:center;width:54px;height:54px;border:1px solid rgba(214,17,30,.18);border-radius:16px;background:linear-gradient(145deg,#fff4f2,#f8f2df);color:var(--red-dark)}.hb-info-chat-cta__icon svg{width:27px;height:27px}.hb-info-chat-cta__eyebrow{display:block;margin-bottom:4px;color:var(--red-dark);font-size:10px;font-weight:900;letter-spacing:.14em}.hb-info-chat-cta__copy h2{margin:0 0 4px;font-size:clamp(17px,2vw,21px)}.hb-info-chat-cta__copy p{margin:0;color:var(--ink-soft);font-size:13px}.hb-info-chat-cta__button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 18px;border:1px solid var(--red);border-radius:999px;background:linear-gradient(135deg,var(--red),var(--red-dark));color:#fff;font-size:13px;font-weight:800;white-space:nowrap;box-shadow:0 8px 20px rgba(214,17,30,.2);transition:transform .18s ease,box-shadow .18s ease}.hb-info-chat-cta__button:hover{transform:translateY(-1px);color:#fff;text-decoration:none;box-shadow:0 11px 24px rgba(214,17,30,.27)}.hb-info-chat-cta__button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}@media(max-width:760px){.hb-info-chat-cta{grid-template-columns:48px minmax(0,1fr);gap:12px;margin:25px 16px;padding:16px;border-radius:15px}.hb-info-chat-cta__icon{width:46px;height:46px;border-radius:13px}.hb-info-chat-cta__button{grid-column:1/-1;width:100%}}@media(prefers-reduced-motion:reduce){.hb-info-chat-cta__button{transition:none}}