/* Honhaar.com — design system */
:root{
  --bg:#fbf7ef;--bg2:#f3ecdf;--card:#ffffff;--ink:#1b1a17;--ink2:#4a463f;--mute:#77716a;--line:#e6ddcd;
  --teal:#0e5e57;--teal2:#0a4741;--tealsoft:#e1efec;--gold:#e8a317;--goldsoft:#fdf1d6;--coral:#d9573b;--green:#2f8f4e;--red:#c0392b;
  --r:16px;--r2:24px;--sh:0 1px 2px rgba(27,26,23,.05),0 8px 28px rgba(27,26,23,.07);
  --fd:"Fraunces",Georgia,"Times New Roman",serif;--fs:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
:root[data-theme="dark"]{
  --bg:#0f1413;--bg2:#141b1a;--card:#18201f;--ink:#f1ede4;--ink2:#c9c3b8;--mute:#9a948a;--line:#26302e;
  --teal:#3fb3a5;--teal2:#5cc7ba;--tealsoft:#163330;--gold:#f2b632;--goldsoft:#33290f;--coral:#f07c62;
  --sh:0 1px 2px rgba(0,0,0,.3),0 8px 28px rgba(0,0,0,.35);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0f1413;--bg2:#141b1a;--card:#18201f;--ink:#f1ede4;--ink2:#c9c3b8;--mute:#9a948a;--line:#26302e;
  --teal:#3fb3a5;--teal2:#5cc7ba;--tealsoft:#163330;--gold:#f2b632;--goldsoft:#33290f;--coral:#f07c62;
  --sh:0 1px 2px rgba(0,0,0,.3),0 8px 28px rgba(0,0,0,.35);}}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 var(--fs);overflow-x:hidden}
img,svg,iframe{max-width:100%}
a{color:var(--teal)}a:hover{color:var(--coral)}
h1,h2,h3{font-family:var(--fd);font-weight:700;line-height:1.15;letter-spacing:-.01em;margin:0 0 .5em}
h1{font-size:clamp(2.1rem,5.2vw,3.6rem)}h2{font-size:clamp(1.6rem,3.4vw,2.35rem)}h3{font-size:1.2rem}
h4{font-size:.8rem;text-transform:uppercase;letter-spacing:.09em;color:var(--mute);margin:0 0 10px}
p{margin:0 0 1em}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:#000;padding:8px 12px;z-index:99}.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.topbar{background:var(--teal2);color:#fff;text-align:center;font-size:.86rem;padding:8px 16px;line-height:1.4}
:root[data-theme="dark"] .topbar{background:#08302c}
.topbar a{color:var(--gold);font-weight:700}
header.site{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:18px;height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-family:var(--fd);font-weight:700;font-size:1.4rem}
.logo .mark{width:34px;height:34px}
nav{margin-left:auto}
.menu{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.menu a{display:block;padding:8px 11px;border-radius:10px;text-decoration:none;color:var(--ink2);font-weight:600;font-size:.93rem}
.menu a:hover,.menu a.active{background:var(--tealsoft);color:var(--teal)}
.m-only{display:none}.m-jump{display:none}
.nav-cta{display:flex;gap:8px;align-items:center}
.icon-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;font-size:1.05rem}
.burger{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border-radius:999px;border:2px solid transparent;font:600 1rem var(--fs);text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;line-height:1.2}
.btn:hover{transform:translateY(-1px)}
.btn-sm{padding:9px 16px;font-size:.9rem}
.btn-gold{background:var(--gold);color:#1b1a17}.btn-gold:hover{color:#1b1a17;box-shadow:0 8px 20px rgba(232,163,23,.35)}
.btn-teal{background:var(--teal);color:#fff}.btn-teal:hover{color:#fff;background:var(--teal2)}
:root[data-theme="dark"] .btn-teal{color:#0f1413}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}.btn-ghost:hover{border-color:var(--teal);color:var(--teal)}
.btn-block{width:100%}
section{padding:72px 0}
.section-alt{background:var(--bg2)}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);background:var(--tealsoft);padding:6px 12px;border-radius:999px;margin-bottom:14px}
.lead{font-size:1.15rem;color:var(--ink2);max-width:680px}
.center{text-align:center}.center .lead{margin-left:auto;margin-right:auto}
.grid{display:grid;gap:22px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;box-shadow:var(--sh)}
.card h3{margin-bottom:.4em}.card p:last-child{margin-bottom:0}
.card.link{text-decoration:none;color:inherit;display:block;transition:transform .15s,border-color .15s}.card.link:hover{transform:translateY(-3px);border-color:var(--teal)}
.ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--goldsoft);font-size:1.35rem;margin-bottom:14px}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:28px;flex-wrap:wrap}
.sec-head p{margin:0;color:var(--ink2)}
/* hero */
.hero{padding:70px 0 60px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;right:-180px;top:-160px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,var(--goldsoft),transparent 70%);z-index:-1}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
.hero h1 em{font-style:normal;color:var(--teal);background:linear-gradient(transparent 62%,var(--goldsoft) 62%)}
.searchbar{display:flex;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:7px;box-shadow:var(--sh);margin:24px 0 14px;max-width:620px}
.searchbar input{flex:1;border:0;background:transparent;font:500 1rem var(--fs);color:var(--ink);padding:0 14px;min-width:0}
.searchbar input:focus{outline:none}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-block;padding:6px 13px;border-radius:999px;border:1px solid var(--line);background:var(--card);font-size:.85rem;color:var(--ink2);text-decoration:none;cursor:pointer;font-family:var(--fs)}
.chip:hover,.chip.on{border-color:var(--teal);color:var(--teal);background:var(--tealsoft)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px;max-width:560px}
.stat b{display:block;font-family:var(--fd);font-size:1.9rem;color:var(--teal)}.stat span{font-size:.86rem;color:var(--mute)}
.hero-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:26px;box-shadow:var(--sh)}
.hero-card h3{display:flex;justify-content:space-between;align-items:center}
.dl-list{list-style:none;padding:0;margin:0}
.dl-list li{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line);font-size:.94rem}
.dl-list li:last-child{border:0}
.dl-list a{font-weight:600;text-decoration:none;color:var(--ink)}.dl-list a:hover{color:var(--teal)}
.pill{display:inline-block;font-size:.74rem;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--tealsoft);color:var(--teal);white-space:nowrap}
.pill.gold{background:var(--goldsoft);color:#8a5d00}:root[data-theme="dark"] .pill.gold{color:var(--gold)}
.pill.coral{background:color-mix(in srgb,var(--coral) 15%,transparent);color:var(--coral)}
/* steps */
.steps{counter-reset:s}
.steps .card{position:relative;padding-top:52px}
.steps .card::before{counter-increment:s;content:counter(s);position:absolute;top:18px;left:24px;width:30px;height:30px;border-radius:50%;background:var(--teal);color:#fff;font-weight:700;display:grid;place-items:center;font-size:.9rem}
/* finder */
.finder{display:grid;grid-template-columns:270px 1fr;gap:26px;align-items:start}
.filters{position:sticky;top:90px}
.filters label.lbl{display:block;font-weight:700;font-size:.85rem;margin:16px 0 8px}
.filters select,.filters input[type=search]{width:100%}
.res-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-wrap:wrap;gap:10px;color:var(--mute);font-size:.92rem}
.sch{display:grid;grid-template-columns:1fr auto;gap:10px 18px;margin-bottom:16px}
.sch h3{font-size:1.12rem;margin:0}
.sch .meta{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.sch p{color:var(--ink2);font-size:.94rem;margin:0}
.sch .acts{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.sch .when{font-size:.84rem;color:var(--mute);text-align:right}
.save{background:none;border:1px solid var(--line);border-radius:10px;padding:6px 10px;cursor:pointer;color:var(--ink2);font:600 .82rem var(--fs)}
.save.on{background:var(--goldsoft);border-color:var(--gold);color:var(--ink)}
.empty{padding:40px;text-align:center;color:var(--mute)}
/* forms */
input,select,textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:500 .98rem var(--fs)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--tealsoft)}
textarea{min-height:120px;resize:vertical}
.field{margin-bottom:14px}.field>label,label.lbl2{display:block;font-weight:600;font-size:.9rem;margin-bottom:6px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r2);padding:30px;box-shadow:var(--sh)}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--ink2);font-weight:500}
.check input{width:18px;height:18px;margin-top:3px;flex:none}
.choice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.choice{position:relative;cursor:pointer}
.choice input{position:absolute;opacity:0;width:1px;height:1px}
.choice span{display:block;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;font-weight:600;font-size:.92rem;background:var(--card);transition:.15s}
.choice input:checked+span{border-color:var(--teal);background:var(--tealsoft);color:var(--teal)}
.choice input:focus-visible+span{outline:3px solid var(--gold)}
.form-msg{margin-top:12px;font-weight:600;font-size:.94rem}.form-msg.ok{color:var(--green)}.form-msg.err{color:var(--red)}
.inline-form{display:flex;gap:8px;flex-wrap:wrap}.inline-form input[type=email]{flex:1;min-width:180px}.inline-form .form-msg{flex-basis:100%;margin:0}
.notice{font-size:.85rem;color:var(--mute);margin-top:14px}
.steps-ind{display:flex;gap:6px;margin-bottom:22px}.steps-ind span{flex:1;height:6px;border-radius:9px;background:var(--line)}.steps-ind span.on{background:var(--gold)}
.step{display:none}.step.active{display:block;animation:fade .3s}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.step-nav{display:flex;justify-content:space-between;gap:10px;margin-top:10px}
.step-title{font-family:var(--fd);font-size:1.35rem;margin-bottom:4px}.step-sub{color:var(--mute);font-size:.9rem;margin-bottom:18px}
/* tools */
.tool-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.tool-tabs button{padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink2);font:600 .92rem var(--fs);cursor:pointer}
.tool-tabs button.on{background:var(--teal);border-color:var(--teal);color:#fff}
:root[data-theme="dark"] .tool-tabs button.on{color:#0f1413}
.tool{display:none}.tool.on{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.out{background:var(--tealsoft);border-radius:var(--r);padding:24px}
.big{font-family:var(--fd);font-size:2.6rem;color:var(--teal);line-height:1.1;margin:4px 0 10px}
.kv{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--teal) 18%,transparent);font-size:.94rem}.kv:last-child{border:0}
.bar{height:10px;background:var(--line);border-radius:9px;overflow:hidden;margin:12px 0}.bar i{display:block;height:100%;background:var(--gold);width:0;transition:width .3s}
.timeline{list-style:none;padding:0;margin:0}.timeline li{padding:10px 0 10px 22px;border-left:2px solid var(--gold);position:relative;font-size:.93rem}
.timeline li::before{content:"";position:absolute;left:-7px;top:16px;width:12px;height:12px;border-radius:50%;background:var(--gold)}
/* articles */
.page-hero{padding:56px 0 36px}
.article{max-width:760px;margin:0 auto}
.article h2{font-size:1.65rem;margin-top:1.6em}.article h3{margin-top:1.3em}
.article ul,.article ol{padding-left:1.3em}.article li{margin-bottom:.4em}
.article blockquote{margin:1.4em 0;padding:16px 20px;border-left:4px solid var(--gold);background:var(--goldsoft);border-radius:0 12px 12px 0}
.byline{color:var(--mute);font-size:.9rem;margin-bottom:24px}
.toc{background:var(--bg2);border-radius:var(--r);padding:18px 22px;margin:20px 0}
.toc ol{margin:0}
.callout{background:var(--tealsoft);border-radius:var(--r);padding:20px 22px;margin:26px 0}
table{width:100%;border-collapse:collapse;font-size:.93rem;margin:16px 0}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}th{background:var(--bg2);font-weight:700}
.table-wrap{overflow-x:auto}
/* videos */
.video{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#000;cursor:pointer}
.video img{width:100%;height:100%;object-fit:cover;opacity:.88}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video .play{position:absolute;inset:0;display:grid;place-items:center}
.video .play span{width:64px;height:64px;border-radius:50%;background:var(--gold);color:#000;display:grid;place-items:center;font-size:1.4rem;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.vcard h3{font-size:1.02rem;margin:14px 0 4px}.vcard p{font-size:.88rem;color:var(--mute);margin:0}
/* contests & tiers */
.countdown{font-family:var(--fd);font-size:clamp(1.8rem,4vw,2.6rem);color:var(--teal)}
.tier{text-align:left}.tier .price{font-family:var(--fd);font-size:2.2rem;color:var(--teal);margin:6px 0 10px}
.tier ul{padding-left:1.1em;margin:0;color:var(--ink2);font-size:.93rem}
.tier.featured{border:2px solid var(--gold);position:relative}
.tier.featured::before{content:"Most chosen";position:absolute;top:-12px;right:18px;background:var(--gold);color:#000;font-size:.74rem;font-weight:700;padding:3px 10px;border-radius:999px}
.band{display:grid;grid-template-columns:1.6fr 1fr;gap:26px;align-items:center;background:var(--teal);color:#fff;border-radius:var(--r2);padding:36px}
.band h2{color:#fff}.band p{color:rgba(255,255,255,.85);margin:0}
:root[data-theme="dark"] .band{background:#0d3f3a}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 20px;margin-bottom:10px}
.faq summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:10px}
.faq summary::after{content:"+";color:var(--teal);font-size:1.3rem;line-height:1}.faq details[open] summary::after{content:"–"}
.faq details p{margin:12px 0 0;color:var(--ink2)}
.kicker-list{list-style:none;padding:0;margin:0}.kicker-list li{padding:8px 0 8px 28px;position:relative}
.kicker-list li::before{content:"✓";position:absolute;left:0;color:var(--green);font-weight:700}
.prize{font-family:var(--fd);font-size:1.8rem;color:var(--gold)}
/* footer */
footer.site{background:var(--bg2);border-top:1px solid var(--line);padding:56px 0 110px;margin-top:20px}
.foot-grid{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:28px}
.foot-grid ul{list-style:none;padding:0;margin:0}.foot-grid li{margin-bottom:7px}
.foot-grid a{color:var(--ink2);text-decoration:none;font-size:.93rem}.foot-grid a:hover{color:var(--teal)}
.foot-brand p{font-size:.93rem;color:var(--ink2);margin:12px 0 16px}
.legal{border-top:1px solid var(--line);margin-top:34px;padding-top:22px;font-size:.84rem;color:var(--mute)}
.mcta{display:none}
.cookie{position:fixed;left:16px;right:16px;bottom:16px;max-width:520px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:var(--sh);z-index:60;display:none;font-size:.9rem}
.cookie.show{display:block}.cookie .acts{display:flex;gap:8px;margin-top:10px}
.reveal{animation:fade .5s both}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}
/* responsive */
@media (max-width:1020px){
  .g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}
  .hero-grid,.tool.on,.band{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}
  .finder{grid-template-columns:1fr}.filters{position:static}
  .burger{display:block}.hide-s{display:none}.m-only{display:block}
  nav{margin-left:auto}
  .menu{display:none;position:absolute;left:0;right:0;top:68px;flex-direction:column;background:var(--bg);border-bottom:1px solid var(--line);padding:10px 16px 16px;box-shadow:var(--sh)}
  .menu.open{display:flex}.menu a{padding:12px}
}
@media (max-width:640px){
  section{padding:52px 0}.wrap{padding:0 16px}
  .g2,.g3,.g4,.row{grid-template-columns:1fr}
  .m-jump{display:inline-flex;margin-top:8px}
  .stats{grid-template-columns:repeat(3,1fr)}.stat b{font-size:1.5rem}
  .sch{grid-template-columns:1fr}.sch .acts{flex-direction:row;align-items:center;justify-content:space-between}.sch .when{text-align:left}
  .mcta{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;padding:10px 12px;background:var(--bg);border-top:1px solid var(--line);z-index:55}.mcta .btn{flex:1;padding:12px}
  .cookie{bottom:76px}
  .form-card{padding:22px}.band{padding:26px}
  .searchbar{border-radius:18px;flex-wrap:wrap}.searchbar .btn{width:100%}
}
@media print{header.site,footer.site,.topbar,.mcta,.cookie,.nav-cta{display:none!important}body{background:#fff;color:#000}}