:root{
  --blue:#3654a3;
  --blue-2:#2a448a;
  --navy:#1c2b5a;
  --sky:#e8eefa;
  --stone:#f2ebe0;
  --sand:#d9c3a0;
  --sun:#f2b632;
  --sun-dark:#d99a12;
  --white:#fff;
  --text:#38415a;
  --muted:#6c7590;
  --line:#e2dccf;
  --r:16px;
  --hf:'Zilla Slab',Georgia,serif;
  --bf:'Hind',system-ui,sans-serif;
}
html{scroll-behavior:smooth}
body{font-family:var(--bf);font-size:1.07rem;color:var(--text);background:var(--white);line-height:1.7;overflow-x:hidden}
h1,h2,h3,h4,h5,h6{font-family:var(--hf);color:var(--navy);font-weight:700;line-height:1.12}
a{color:var(--blue)}
a:hover{color:var(--sun-dark)}
img{max-width:100%;display:block}

/* ---------- Logo: one line, one style ---------- */
.hx-logo{display:inline-flex;align-items:center;gap:.55rem;white-space:nowrap;text-decoration:none;color:var(--navy)}
.hx-mark{width:36px;height:36px;flex:none}
.hx-name{font-family:var(--hf);font-weight:700;font-size:1.55rem;color:inherit}
.hx-logo:hover{color:var(--navy)}

/* ---------- Header ---------- */
.hx-head{position:sticky;top:0;z-index:1030;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:4px solid var(--blue);transition:box-shadow .3s}
.hx-head.scrolled{box-shadow:0 10px 26px -20px rgba(28,43,90,.6)}
.hx-head .navbar{padding:.8rem 0}
.hx-head .nav-link{font-family:var(--hf);font-weight:600;font-size:1.08rem;color:var(--navy)!important;padding:.5rem .9rem!important;border-bottom:3px solid transparent}
.hx-head .nav-link:hover{color:var(--blue)!important;border-bottom-color:var(--sky)}
.hx-head .nav-link.active{color:var(--blue)!important;border-bottom-color:var(--sun)}
.navbar-toggler{border:2px solid var(--navy);border-radius:10px;box-shadow:none!important;width:46px;height:42px;position:relative;padding:0}
.hx-tg,.hx-tg::before,.hx-tg::after{position:absolute;left:11px;width:20px;height:2.5px;background:var(--navy);border-radius:2px}
.hx-tg{top:19px}.hx-tg::before{content:"";left:0;top:-6px}.hx-tg::after{content:"";left:0;top:6px}
@media(max-width:991.98px){.navbar-collapse{padding:1rem 0}.hx-head .hx-btn{margin-top:.6rem}}

/* ---------- Buttons ---------- */
.hx-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-family:var(--hf);font-weight:700;font-size:1.02rem;text-decoration:none;border-radius:10px;padding:.7rem 1.4rem;border:2px solid transparent;transition:all .25s;cursor:pointer}
.hx-btn.sm{padding:.45rem 1rem;font-size:.95rem}
.hx-btn.lg{padding:.95rem 1.9rem;font-size:1.1rem}
.hx-btn.blue{background:var(--blue);color:#fff}
.hx-btn.blue:hover{background:var(--navy);color:#fff;transform:translateY(-2px)}
.hx-btn.sun{background:var(--sun);color:var(--navy)}
.hx-btn.sun:hover{background:var(--sun-dark);color:var(--navy);transform:translateY(-2px)}
.hx-btn.outline{border-color:var(--blue);color:var(--blue);background:transparent}
.hx-btn.outline:hover{background:var(--blue);color:#fff}
.hx-btn.ghost{border-color:rgba(255,255,255,.5);color:#fff}
.hx-btn.ghost:hover{background:#fff;color:var(--navy)}

/* ---------- Shared ---------- */
.hx-tag{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--hf);font-weight:700;font-size:.92rem;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:.9rem}
.hx-tag::before{content:"\2605";color:var(--sun)}
.hx-tag.sm{font-size:.78rem;margin-bottom:.5rem}
.hx-tag.light{color:#c9d6f2}
.hx-h2{font-size:clamp(2.1rem,4vw,3.1rem)}
.hx-muted{color:var(--muted);max-width:640px}
.hx-light{color:#c9d6f2;font-size:1.1rem}
.hx-lead{font-size:1.18rem;color:var(--muted);margin-bottom:2rem}
.hx-sec{padding:5.5rem 0;position:relative}
.hx-stone{background:var(--stone)}
.hx-blue{background:var(--blue);color:#c9d6f2;background-image:radial-gradient(rgba(255,255,255,.08) 1.4px,transparent 1.6px);background-size:22px 22px}
.sun-u{position:relative;white-space:nowrap}
.sun-u::after{content:"";position:absolute;left:-.1em;right:-.1em;bottom:.08em;height:.32em;background:var(--sun);z-index:-1;border-radius:3px}
.lift-hx{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.lift-hx.up{opacity:1;transform:none}

/* ---------- Hero ---------- */
.hx-hero{padding:4.5rem 0 5.5rem;background:linear-gradient(180deg,var(--sky) 0%,var(--white) 100%);position:relative;overflow:hidden}
.hx-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:70px;background:var(--stone);clip-path:polygon(0 70%,20% 40%,45% 75%,70% 35%,100% 60%,100% 100%,0 100%);opacity:.7}
.hx-hero h1{font-size:clamp(2.6rem,5.4vw,4.3rem);margin-bottom:1.3rem;position:relative;z-index:1}
.hx-hero-img{position:relative;z-index:1}
.hx-hero-img img{width:100%;aspect-ratio:4/3.5;object-fit:cover;border-radius:22px;border:8px solid #fff;box-shadow:0 30px 60px -30px rgba(28,43,90,.55);background:var(--sky)}
.hx-hero-card{position:absolute;left:-1.5rem;bottom:1.5rem;display:flex;gap:.8rem;align-items:center;background:var(--navy);color:#fff;padding:1rem 1.2rem;border-radius:14px;box-shadow:0 18px 30px -18px rgba(0,0,0,.6)}
.hx-hero-card .star{width:40px;height:40px;border-radius:50%;background:var(--sun);color:var(--navy);display:grid;place-items:center;font-size:1.2rem}
.hx-hero-card strong{display:block;font-family:var(--hf)}
.hx-hero-card small{color:#c9d6f2}
@media(max-width:575.98px){.hx-hero-card{left:.5rem}}

/* ---------- House explorer ---------- */
.house-wrap{position:relative;background:linear-gradient(180deg,#dbe6f8,#f5f0e6);border-radius:22px;padding:1rem;border:3px solid var(--navy);box-shadow:8px 8px 0 var(--blue)}
.house-svg{width:100%;height:auto;display:block}
.spot{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;border:3px solid #fff;background:var(--sun);box-shadow:0 4px 10px rgba(28,43,90,.4);cursor:pointer;padding:0;transition:transform .2s,background .2s;z-index:2}
.house-stage{position:relative}
.spot:hover,.spot:focus-visible{transform:translate(-50%,-50%) scale(1.15);outline:none}
.spot.on{background:var(--blue)}
.pulse{position:absolute;inset:-8px;border-radius:50%;border:2px solid var(--sun);animation:pulse 2s infinite;pointer-events:none}
.spot.on .pulse{border-color:var(--blue)}
@keyframes pulse{0%{transform:scale(.6);opacity:1}100%{transform:scale(1.5);opacity:0}}
.spot-label{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);white-space:nowrap;background:var(--navy);color:#fff;font-family:var(--hf);font-weight:600;font-size:.82rem;padding:.2rem .6rem;border-radius:6px;opacity:0;transition:opacity .2s;pointer-events:none}
.spot:hover .spot-label,.spot.on .spot-label,.spot:focus-visible .spot-label{opacity:1}
@media(max-width:575.98px){.spot{width:22px;height:22px;border-width:2px}.spot-label{display:none}}
.spot-panels{height:100%}
.spot-panel{display:none;background:#fff;border-radius:22px;padding:1.4rem;height:100%;border:3px solid var(--navy);box-shadow:8px 8px 0 var(--sun)}
.spot-panel.on{display:flex;flex-direction:column;animation:spIn .4s ease}
@keyframes spIn{from{opacity:0;transform:translateX(12px)}}
.sp-img{border-radius:12px;overflow:hidden;aspect-ratio:16/10;margin-bottom:1rem;background:var(--sky)}
.sp-img img{width:100%;height:100%;object-fit:cover}
.spot-panel h3{font-size:1.5rem}
.spot-panel p{color:var(--muted);flex:1}
.spot-panel .hx-note{margin-bottom:1rem}

/* ---------- Spec cards ---------- */
.hx-spec{background:#fff;border-radius:var(--r);overflow:hidden;height:100%;display:flex;flex-direction:column;border:2px solid var(--line);transition:transform .3s,border-color .3s,box-shadow .3s;scroll-margin-top:110px}
.hx-spec:hover{transform:translateY(-6px);border-color:var(--blue);box-shadow:0 22px 40px -26px rgba(28,43,90,.6)}
.hx-spec:target{border-color:var(--sun);box-shadow:0 0 0 4px var(--sun)}
.hx-spec-img{aspect-ratio:16/10;overflow:hidden;background:var(--sky);border-bottom:4px solid var(--sun)}
.hx-spec-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.hx-spec:hover .hx-spec-img img{transform:scale(1.06)}
.hx-spec-body{padding:1.5rem 1.6rem 1.8rem;display:flex;flex-direction:column;flex:1}
.hx-spec-body h3{font-size:1.45rem;margin-bottom:.5rem}
.hx-spec-body p{color:var(--muted);flex:1}
.hx-note{background:var(--sky);border-left:4px solid var(--blue);border-radius:0 10px 10px 0;padding:.6rem .9rem;margin-bottom:1.2rem;font-weight:500;color:var(--navy)}
.hx-note span{display:block;font-family:var(--hf);font-weight:700;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--blue)}
.hx-spec-body .hx-btn{align-self:flex-start}

/* ---------- Badges / path ---------- */
.hx-badge-card{background:var(--blue-2);border-radius:var(--r);padding:1.8rem;height:100%;border:2px solid rgba(255,255,255,.15);transition:transform .3s}
.hx-badge-card:hover{transform:translateY(-5px)}
.hx-badge-card span{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--sun);color:var(--navy);font-size:1.4rem;margin-bottom:1rem}
.hx-badge-card h4{color:#fff;font-size:1.35rem}
.hx-badge-card p{margin:0}
.hx-path{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem;counter-reset:none}
@media(max-width:767.98px){.hx-path{grid-template-columns:1fr 1fr}}
.hp{background:var(--stone);border-radius:var(--r);padding:2rem 1.5rem;text-align:center;position:relative;border-top:6px solid var(--blue);transition:border-color .3s}
.hp:hover{border-top-color:var(--sun)}
.hp span{display:inline-grid;place-items:center;width:58px;height:58px;border-radius:14px;background:var(--navy);color:var(--sun);font-size:1.4rem;margin-bottom:1rem}
.hp h5{font-size:1.4rem}
.hp p{margin:0;color:var(--muted)}

/* ---------- Posts ---------- */
.hx-post{background:#fff;border-radius:var(--r);overflow:hidden;height:100%;display:flex;flex-direction:column;border:2px solid var(--line);transition:transform .3s,box-shadow .3s}
.hx-post:hover{transform:translateY(-6px);box-shadow:0 22px 40px -26px rgba(28,43,90,.55)}
.hx-post-img{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--sky)}
.hx-post-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.hx-post:hover .hx-post-img img{transform:scale(1.06)}
.hx-post-body{padding:1.5rem 1.6rem 1.8rem;display:flex;flex-direction:column;flex:1}
.hx-post-body h3{font-size:1.4rem}
.hx-post-body h3 a{color:var(--navy);text-decoration:none}
.hx-post-body h3 a:hover{color:var(--blue)}
.hx-post-body p{color:var(--muted);flex:1}
.hx-more{font-family:var(--hf);font-weight:700;color:var(--blue);text-decoration:none}

/* ---------- Quotes ---------- */
.hx-quote{margin:0;height:100%;background:var(--sky);border-radius:var(--r);padding:2rem;border-bottom:5px solid var(--sun)}
.hx-quote blockquote{font-family:var(--hf);font-weight:600;font-size:1.3rem;color:var(--navy);line-height:1.4;margin-bottom:1rem}
.hx-quote figcaption{font-weight:600;color:var(--muted)}

/* ---------- CTA ---------- */
.hx-cta{background:var(--navy);color:#c9d6f2;border-radius:24px;padding:clamp(2rem,5vw,3.4rem);position:relative;overflow:hidden}
.hx-cta::before{content:"\2605";position:absolute;right:2rem;top:-1.5rem;font-size:10rem;color:rgba(242,182,50,.12);line-height:1}
.hx-cta h2{color:#fff;font-size:clamp(1.9rem,3.6vw,2.7rem)}
.hx-cta p{margin:0}
.hx-cta>*{position:relative}

/* ---------- Sky head (inner) ---------- */
.hx-sky{padding:4rem 0 3.5rem;background:linear-gradient(180deg,var(--sky),var(--white))}
.hx-sky h1{font-size:clamp(2.3rem,5vw,3.6rem)}
.hx-sky p{color:var(--muted);font-size:1.15rem;max-width:600px}
.hx-window{position:relative;border:8px solid #fff;border-radius:22px;overflow:hidden;box-shadow:10px 10px 0 var(--blue);background:var(--sky)}
.hx-window img{width:100%;aspect-ratio:4/3;object-fit:cover}
.hx-crumb{display:flex;gap:.5rem;font-family:var(--hf);font-weight:600;margin-top:1.3rem;color:var(--muted)}
.hx-crumb a{color:var(--blue);text-decoration:none}
.house-mini{background:linear-gradient(180deg,#dbe6f8,#f5f0e6);border-radius:22px;padding:1rem;border:3px solid var(--navy);box-shadow:8px 8px 0 var(--sun)}
.hx-val{background:#fff;border-radius:var(--r);padding:1.8rem;height:100%;border:2px solid var(--line);transition:transform .3s,border-color .3s}
.hx-val:hover{transform:translateY(-5px);border-color:var(--blue)}
.hx-val span{display:inline-grid;place-items:center;width:50px;height:50px;border-radius:12px;background:var(--sky);color:var(--blue);font-size:1.3rem;margin-bottom:1rem}
.hx-val h4{font-size:1.35rem}
.hx-val p{margin:0;color:var(--muted)}
.hx-jump{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.hx-jump a{font-family:var(--hf);font-weight:600;font-size:.92rem;padding:.35rem .85rem;border-radius:8px;border:2px solid var(--line);text-decoration:none;color:var(--navy)}
.hx-jump a:hover{border-color:var(--blue);background:var(--sky)}
.hx-combo{background:var(--stone);border-radius:24px;padding:clamp(2rem,5vw,3.2rem);border:3px dashed var(--blue)}

/* ---------- Article ---------- */
.hx-article{background:#fff;border-radius:var(--r);padding:clamp(1.6rem,4vw,3rem);border:2px solid var(--line);font-size:1.1rem}
.hx-article>p:first-child{font-size:1.22rem;color:var(--navy)}
.hx-article h2{font-size:1.8rem;margin:2.3rem 0 .7rem;display:flex;align-items:center;gap:.6rem}
.hx-article h2::before{content:"\2605";color:var(--sun);font-size:1.1rem}
.hx-legal{scroll-margin-top:110px}
.hx-legal:first-child h2{margin-top:0}
.hx-art-end{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;background:var(--sky);border-radius:14px;padding:1.5rem 1.6rem;margin-top:2.5rem}
.hx-art-end h4{margin:0}
.hx-art-end p{margin:0;color:var(--muted)}
.hx-aside{position:sticky;top:110px}
.hx-side{background:#fff;border-radius:var(--r);padding:1.6rem;margin-bottom:1rem;border:2px solid var(--line)}
.hx-side.blue{background:var(--blue);border:0;color:#c9d6f2}
.hx-side.blue h5{color:#fff}
.hx-side-post{display:flex;gap:.9rem;align-items:center;padding:.6rem 0;border-top:1px solid var(--line);text-decoration:none;color:var(--navy);font-family:var(--hf);font-weight:600;line-height:1.3}
.hx-side-post img{width:72px;height:72px;border-radius:12px;object-fit:cover;flex:none;background:var(--sky)}
.hx-side-post:hover span{color:var(--blue)}
.hx-toc{display:flex;flex-direction:column}
.hx-toc a{padding:.45rem 0;border-top:1px solid var(--line);text-decoration:none;color:var(--text);font-weight:600}
.hx-toc a:hover{color:var(--blue)}

/* ---------- Contact ---------- */
.hx-info{background:var(--stone);border-radius:var(--r);padding:1.8rem;height:100%;border-left:6px solid var(--blue)}
.hx-info span{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:12px;background:var(--navy);color:var(--sun);font-size:1.2rem;margin-bottom:.9rem}
.hx-info h5{margin-bottom:.2rem}
.hx-info p{margin:0;font-weight:600;color:var(--navy);word-break:break-word}
.hx-info a{color:var(--navy);text-decoration:none}
.hx-info a:hover{color:var(--blue)}
.hx-form{background:#fff;border-radius:var(--r);padding:clamp(1.6rem,4vw,2.6rem);border:3px solid var(--navy);box-shadow:8px 8px 0 var(--sun)}
.hx-form h3{font-size:2rem;margin-bottom:1.2rem}
.hx-form h1{font-size:clamp(2rem,4vw,2.8rem)}
.hx-nl-foot{margin:1.3rem 0 0;color:var(--muted)}
.form-label{font-family:var(--hf);font-weight:600;color:var(--navy)}
.form-control,.form-select{border:2px solid var(--line);border-radius:10px;padding:.75rem 1rem;background:#fbf9f5}
.form-control:focus,.form-select:focus{border-color:var(--blue);box-shadow:0 0 0 .22rem rgba(54,84,163,.15);background:#fff}
.form-check-input:checked{background-color:var(--blue);border-color:var(--blue)}
.hx-pills{display:flex;flex-wrap:wrap;gap:.45rem}
.hx-pills label{cursor:pointer}
.hx-pills input{position:absolute;opacity:0}
.hx-pills span{display:block;padding:.4rem .9rem;border-radius:8px;border:2px solid var(--line);font-weight:600;font-size:.94rem;transition:all .2s;background:#fff}
.hx-pills input:checked+span{background:var(--blue);border-color:var(--blue);color:#fff}
.hx-pills input:focus-visible+span{outline:2px solid var(--sun)}
.form-success{display:none;margin-top:1.2rem;padding:1rem 1.2rem;border-radius:10px;background:#fff6dc;border-left:5px solid var(--sun);font-weight:600;color:var(--navy)}
.form-success.show{display:block}
.hx-map{border-radius:var(--r);overflow:hidden;height:100%;min-height:400px;border:3px solid var(--navy)}
.hx-map iframe{display:block;width:100%;height:100%;min-height:400px;border:0}

/* ---------- Footer ---------- */
.hx-foot{position:relative;background:var(--navy);color:#b6c2e0;padding:3.5rem 0 1.8rem;margin-top:60px}
.hx-foot-wave{position:absolute;left:0;right:0;top:-59px;height:60px;color:var(--navy);line-height:0}
.hx-foot-wave svg{width:100%;height:100%}
.hx-foot .hx-logo{color:#fff}
.hx-foot h6{font-family:var(--hf);font-weight:700;color:var(--sun);font-size:1.05rem;margin-bottom:1rem}
.hx-foot a:not(.hx-btn):not(.hx-logo){display:block;color:#e2e8f5;text-decoration:none;margin-bottom:.5rem;word-break:break-word}
.hx-foot a:not(.hx-btn):not(.hx-logo):hover{color:var(--sun)}
.hx-foot-news{background:var(--blue-2);border-radius:var(--r);padding:1.6rem}
.hx-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;border-top:1px solid rgba(182,194,224,.2);margin-top:2.5rem;padding-top:1.5rem;font-size:.95rem}
.hx-up{position:fixed;right:1.2rem;bottom:1.2rem;width:50px;height:50px;border-radius:12px;background:var(--sun);color:var(--navy);display:grid;place-items:center;font-weight:700;text-decoration:none;opacity:0;pointer-events:none;transition:opacity .3s;z-index:1020;box-shadow:4px 4px 0 var(--navy)}
.hx-up.show{opacity:1;pointer-events:auto}

@media(max-width:767.98px){.hx-sec{padding:4.2rem 0}.hx-hero{padding:3rem 0 4.5rem}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.lift-hx{opacity:1;transform:none}}
