/* Core guide hubs — same visual language as /cinema/, with one accent palette per page */
.hubp{
  --hub-accent:#ff2d7a;
  --hub-accent-soft:#ff6d9f;
  --hub-glow:rgba(255,45,122,.22);
  --hub-bg:#070a12;
  --hub-bg-2:#080b13;
  --hub-bg-3:#0b0f19;
  --hub-panel:#111725;
  --hub-panel-2:#151b29;
  --hub-border:#20283a;
  --hub-border-2:#293248;
  --hub-text:#f7f8fb;
  --hub-muted:#8891a3;
  background:var(--hub-bg);
  color:var(--hub-text);
  overflow:hidden;
}
.hubp-practical{--hub-accent:#ffb000;--hub-accent-soft:#ffd45a;--hub-glow:rgba(255,176,0,.24)}
.hubp-family{--hub-accent:#7468ff;--hub-accent-soft:#a49dff;--hub-glow:rgba(116,104,255,.26)}
.hubp-health{--hub-accent:#24b878;--hub-accent-soft:#7be0ad;--hub-glow:rgba(36,184,120,.24)}
.hubp-out{--hub-accent:#ff2d7a;--hub-accent-soft:#ff7aa7;--hub-glow:rgba(255,45,122,.25)}
.hubp-visit{--hub-accent:#3ba7ff;--hub-accent-soft:#8dceff;--hub-glow:rgba(59,167,255,.25)}

.hubp .wrap{width:min(1240px,calc(100% - 32px))}

/* Hero: same proportions/type/rhythm as Cinema, no photography */
.hubp-hero{
  position:relative;
  padding:72px 0 54px;
  background:
    radial-gradient(circle at 78% 24%,var(--hub-glow),transparent 31%),
    radial-gradient(circle at 18% 84%,rgba(255,255,255,.05),transparent 34%),
    #080b13;
  isolation:isolate;
}
.hubp-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(8,11,19,.98) 0%,rgba(8,11,19,.9) 44%,rgba(8,11,19,.64) 72%,rgba(8,11,19,.9) 100%);
  z-index:-1;
}
.hubp-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);
  gap:54px;
  align-items:center;
}
.hubp-kicker{
  font-size:.72rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  font-weight:900;
  color:var(--hub-accent-soft);
  margin-bottom:18px;
}
.hubp-hero h1{
  margin:0;
  font-size:clamp(4rem,7.8vw,7.8rem);
  line-height:.83;
  letter-spacing:-.07em;
  color:#fff;
  max-width:860px;
}
.hubp-hero h1 em{
  display:block;
  font-family:Georgia,"Times New Roman",serif;
  font-weight:500;
  color:var(--hub-accent);
}
.hubp-hero-copy>p{
  max-width:690px;
  color:#b9c0cf;
  font-size:1.05rem;
  line-height:1.65;
  margin:20px 0 0;
}
.hubp-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.hubp-actions a{
  display:inline-flex;
  padding:12px 16px;
  border-radius:999px;
  font-weight:850;
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  background:rgba(255,255,255,.06);
}
.hubp-actions a:first-child{background:var(--hub-accent);border-color:var(--hub-accent)}
.hubp-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}
.hubp-chips span{
  border:1px solid #2b3242;
  background:#121827;
  color:#c7cedb;
  border-radius:999px;
  padding:7px 10px;
  font-size:.68rem;
  font-weight:850;
}

/* Hero image card: same premium framing as Cinema posters */
.hubp-hero-media{
  position:relative;
  min-height:480px;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:#151b29;
  box-shadow:0 24px 55px rgba(0,0,0,.42);
}
.hubp-hero-media:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(8,11,19,.32));
}
.hubp-hero-media img{
  display:block;
  width:100%;
  height:100%;
  min-height:480px;
  object-fit:cover;
  object-position:center;
}

/* Info strip = Cinema */
.hubp-info-strip{
  background:#111625;
  border-top:1px solid rgba(255,255,255,.07);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.hubp-info-grid{padding:18px 0}
.hubp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.hubp-stats>div{padding:12px 0}
.hubp-stats strong{display:block;color:#fff;font-size:1.05rem;line-height:1.15;font-weight:900}
.hubp-stats span{
  display:block;
  color:#788196;
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:900;
  margin-top:4px;
}

/* Sections/headings = Cinema */
.hubp-guides,.hubp-topics,.hubp-local,.hubp-visuals{padding:62px 0}
.hubp-guides{background:#0b0f19}
.hubp-topics{background:#0f1421}
.hubp-local{background:#080b13}
.hubp-visuals{background:#0f1421;color:#fff}
.hubp-heading{display:flex;justify-content:space-between;align-items:end;gap:26px;margin-bottom:24px}
.hubp-heading>div>span{display:none}
.hubp-heading>div>p{
  font-size:.72rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  font-weight:900;
  color:var(--hub-accent-soft);
  margin:0 0 12px;
}
.hubp-heading h2{
  color:#fff;
  font-size:clamp(2.45rem,5vw,4.8rem);
  letter-spacing:-.055em;
  line-height:.95;
  margin:0;
}
.hubp-heading h2 em{font-family:Georgia,"Times New Roman",serif;color:var(--hub-accent);font-weight:500}
.hubp-heading>p{color:var(--hub-muted);max-width:540px;margin:0;line-height:1.6}

/* Guide cards = Cinema cards */
.hubp-guide-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.hubp-guide-card{
  min-height:270px;
  padding:20px;
  border-radius:22px;
  display:flex;
  flex-direction:column;
  color:#fff;
  background:var(--hub-panel);
  border:1px solid var(--hub-border);
  box-shadow:0 18px 42px rgba(0,0,0,.18);
  transition:transform .25s ease,border-color .25s ease;
}
.hubp-guide-card:hover{transform:translateY(-5px);border-color:var(--hub-accent)}
.hubp-guide-no{font-size:.68rem;letter-spacing:.12em;font-weight:900;color:#788196}
.hubp-guide-type{
  display:inline-flex;
  align-self:flex-start;
  margin-top:26px;
  padding:6px 8px;
  border-radius:999px;
  background:rgba(8,11,19,.82);
  border:1px solid rgba(255,255,255,.13);
  color:#fff;
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.hubp-guide-card h3{font-size:1.35rem;line-height:1.05;color:#fff;margin:14px 0 9px}
.hubp-guide-card p{margin:0;color:#858fa2;line-height:1.5;font-size:.84rem}
.hubp-guide-card b{margin-top:auto;padding-top:18px;color:var(--hub-accent-soft);font-size:.78rem}
.hubp-card-1,.hubp-card-2,.hubp-card-3,.hubp-card-4,.hubp-card-5,.hubp-card-6{background:var(--hub-panel)}

/* Category cards */
.hubp-topic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.hubp-topic{
  min-height:230px;
  background:var(--hub-panel-2);
  border:1px solid #242d3f;
  border-radius:18px;
  padding:20px;
  display:flex;
  flex-direction:column;
}
.hubp-topic>span{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;font-weight:950;color:var(--hub-accent)}
.hubp-topic h3{font-size:1.35rem;color:#fff;margin:20px 0 8px}
.hubp-topic p{color:#8c96aa;line-height:1.5;margin:0}
.hubp-topic b{margin-top:auto;padding-top:16px;color:#fff;font-size:.78rem}

/* Local addresses */
.hubp-pro-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.hubp-pro{
  background:var(--hub-panel);
  border:1px solid var(--hub-border);
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 18px 42px rgba(0,0,0,.18);
  transition:transform .25s ease,border-color .25s ease;
}
.hubp-pro:hover{transform:translateY(-5px);border-color:var(--hub-accent)}
.hubp-pro-media{aspect-ratio:4/3;background:#151b29;overflow:hidden;position:relative}
.hubp-pro-media:after{content:"";position:absolute;inset:auto 0 0;height:44%;background:linear-gradient(180deg,transparent,#111725)}
.hubp-pro-media img{width:100%;height:100%;object-fit:cover}
.hubp-pro-placeholder{height:100%;display:flex;align-items:center;justify-content:center;background:#151b29;color:#788196;font-size:1rem}
.hubp-pro-copy{padding:18px}
.hubp-pro-copy span{display:block;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:#858fa2;font-weight:850}
.hubp-pro-copy h3{font-size:1.35rem;color:#fff;margin:8px 0 14px}
.hubp-pro-copy b{font-size:.8rem;color:var(--hub-accent-soft)}
.hubp-more{margin-top:24px;text-align:center}
.hubp-more a{display:inline-flex;background:var(--hub-accent);color:#fff;border-radius:999px;padding:12px 16px;font-weight:900}

/* Local gallery stays below the hero */
.hubp-visual-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.hubp-visual-card{
  margin:0;
  position:relative;
  min-height:360px;
  border-radius:22px;
  overflow:hidden;
  background:#151b29;
  border:1px solid #242d3f;
  box-shadow:0 18px 42px rgba(0,0,0,.18);
}
.hubp-visual-card>a{display:block;height:100%}
.hubp-visual-card img{display:block;width:100%;height:100%;min-height:360px;object-fit:cover;transition:transform .25s ease}
.hubp-visual-card:hover img{transform:scale(1.025)}
.hubp-visual-card:after{content:"";position:absolute;inset:auto 0 0;height:52%;background:linear-gradient(180deg,transparent,#111725);pointer-events:none}
.hubp-visual-card figcaption{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:18px;display:grid;gap:5px}
.hubp-visual-card figcaption strong{font-size:1.1rem;color:#fff}
.hubp-visual-card figcaption span{font-size:.68rem;color:#8c96aa}
.hubp-visual-card figcaption a{font-size:.72rem;color:var(--hub-accent-soft);font-weight:850}

/* Cinema spotlight */
.hubp-cinema{padding:66px 0;background:#080b13;color:#fff}
.hubp-cinema-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:54px;align-items:center}
.hubp-cinema h2{font-size:clamp(2.45rem,5vw,4.8rem);letter-spacing:-.055em;line-height:.95;color:#fff;margin:0}
.hubp-cinema h2 em{font-family:Georgia,"Times New Roman",serif;color:var(--hub-accent);font-weight:500}
.hubp-cinema p{color:#8891a3;line-height:1.65;max-width:540px}
.hubp-cinema-copy>a{display:inline-flex;background:var(--hub-accent);color:#fff;border-radius:999px;padding:12px 16px;font-weight:900;margin-top:12px}
.hubp-cinema-posters{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:end;perspective:1000px}
.hubp-cinema-posters img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:18px;box-shadow:0 24px 55px rgba(0,0,0,.42);border:1px solid rgba(255,255,255,.08)}
.hubp-cinema-posters img:nth-child(1){transform:rotate(-6deg) translateY(22px)}
.hubp-cinema-posters img:nth-child(2){transform:translateY(-8px);z-index:2}
.hubp-cinema-posters img:nth-child(3){transform:rotate(6deg) translateY(22px)}

/* Ending */
.hubp-ending{padding:66px 0 76px;background:#080b13;color:#fff;border-top:1px solid rgba(255,255,255,.07)}
.hubp-ending span{font-size:.72rem;letter-spacing:.17em;font-weight:900;text-transform:uppercase;color:var(--hub-accent-soft)}
.hubp-ending h2{font-size:clamp(2.45rem,5vw,4.8rem);max-width:980px;line-height:.95;letter-spacing:-.055em;color:#fff;margin:18px 0 24px}
.hubp-ending>div>div{display:flex;gap:10px;flex-wrap:wrap}
.hubp-ending a{display:inline-flex;padding:12px 16px;border-radius:999px;font-weight:850;border:1px solid rgba(255,255,255,.18);color:#fff;background:rgba(255,255,255,.06)}
.hubp-ending a:first-child{background:var(--hub-accent);border-color:var(--hub-accent)}

@media(max-width:1050px){
  .hubp-guide-grid{grid-template-columns:repeat(3,1fr)}
  .hubp-pro-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
  .hubp-hero-grid{grid-template-columns:1fr}
  .hubp-hero-media{max-width:650px}
  .hubp-guide-grid,.hubp-pro-grid{grid-template-columns:repeat(2,1fr)}
  .hubp-topic-grid{grid-template-columns:repeat(2,1fr)}
  .hubp-visual-grid{grid-template-columns:1fr 1fr}
  .hubp-cinema-grid{grid-template-columns:1fr}
  .hubp-cinema-posters{max-width:600px}
}
@media(max-width:620px){
  .hubp .wrap{width:min(100% - 22px,1240px)}
  .hubp-hero{padding:34px 0 30px}
  .hubp-hero h1{font-size:clamp(3.35rem,16vw,4.75rem)}
  .hubp-hero-grid{gap:34px}
  .hubp-hero-media{min-height:330px;border-radius:16px}
  .hubp-hero-media img{min-height:330px}
  .hubp-info-grid{padding:14px 0}
  .hubp-stats{grid-template-columns:1fr;gap:0}
  .hubp-stats>div{padding:9px 0}
  .hubp-heading{display:block}
  .hubp-heading>p{margin-top:11px}
  .hubp-guides,.hubp-topics,.hubp-local,.hubp-visuals,.hubp-cinema{padding:44px 0}
  .hubp-guide-grid{
    display:flex;overflow-x:auto;gap:12px;margin:0 -11px;padding:0 11px 15px;
    scroll-snap-type:x mandatory;scrollbar-width:none
  }
  .hubp-guide-grid::-webkit-scrollbar{display:none}
  .hubp-guide-card{flex:0 0 82%;scroll-snap-align:start}
  .hubp-topic-grid{
    display:flex;overflow-x:auto;gap:11px;margin:0 -11px;padding:0 11px 15px;
    scroll-snap-type:x mandatory;scrollbar-width:none
  }
  .hubp-topic-grid::-webkit-scrollbar{display:none}
  .hubp-topic{flex:0 0 82%;scroll-snap-align:start}
  .hubp-pro-grid{
    display:flex;overflow-x:auto;gap:12px;margin:0 -11px;padding:0 11px 15px;
    scroll-snap-type:x mandatory;scrollbar-width:none
  }
  .hubp-pro-grid::-webkit-scrollbar{display:none}
  .hubp-pro{flex:0 0 82%;scroll-snap-align:start}
  .hubp-visual-grid{
    display:flex;overflow-x:auto;gap:12px;margin:0 -11px;padding:0 11px 15px;
    scroll-snap-type:x mandatory;scrollbar-width:none
  }
  .hubp-visual-grid::-webkit-scrollbar{display:none}
  .hubp-visual-card{flex:0 0 84%;min-height:330px;scroll-snap-align:start}
  .hubp-visual-card img{min-height:330px}
  .hubp-cinema-posters{gap:7px}.hubp-cinema-posters img{border-radius:12px}
}
@media(prefers-reduced-motion:reduce){
  .hubp-guide-card,.hubp-pro,.hubp-visual-card img{transition:none}
}
