/* Landing unified styles (Home + Training) */

/* Containers */
.home-blocks, .training-blocks { max-width: 1100px; margin: 4rem auto 0; }

/* Reset top padding/margins on pages with hero/slider */
.page-news .site-content, .page-training .site-content { padding-top: 0 !important; }
.page-news .content-area, .page-training .content-area { margin-top: 0 !important; padding-top: 0 !important; }
.page-news .site-main, .page-training .site-main { padding-top: 0 !important; }
.page-news .site-main > *:first-child, .page-training .site-main > *:first-child { margin-top: 0 !important; }

/* Hero Tag */
.hero-tag { position: relative; width: 100%; min-height: 48vh; height: 56vh; background-size: cover; background-position: center; margin-top: 0 !important; display: block; }
.hero-tag__overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.35) 60%, rgba(0,0,0,0.45) 100%); display: flex; align-items: flex-end; }
.hero-tag__inner { width: 100%; padding: 3rem 0; color: #fff; }
.hero-tag__title { font-size: clamp(2rem, 4vw, 3rem); margin: 0 0 0.5rem 0; }
.hero-tag__desc { font-size: 1.125rem; opacity: 0.9; margin: 0; }

/* Continuous drift keyframes for slider images: pan inside frame from left to right */
@keyframes news-drift {
  0%   { transform: scale(1.12) translateX(0%); }
  100% { transform: scale(1.12) translateX(-12%); }
}

/* News slider: height 2/3 viewport + overlay */
.page-news .tag-feed { margin-top: 0 !important; height: 66vh !important; max-height: 66vh !important; }
.page-news .tag-feed[style] { height: 66vh !important; }
.page-news .tag-feed .owl-stage-outer,
.page-news .tag-feed .owl-stage,
.page-news .tag-feed .owl-item,
.page-news .tag-feed .tag { height: 100% !important; }
.page-news .tag-feed .tag { position: relative; display: block; overflow: hidden; }
.page-news .tag-feed .tag-image,
.page-news .tag-feed .u-object-fit { width: 110% !important; height: 100% !important; object-fit: cover !important; object-position: left center; display: block !important; will-change: transform; animation: news-drift 30s linear infinite; }
.page-news .tag-feed .tag-image.pan-reset { animation: none !important; transform: scale(1.12) translateX(0%) !important; }
.page-news .tag-feed .tag-content { position: absolute; left: 0; right: 0; bottom: 0; padding: 2rem; color: #fff; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%); }
.page-news .tag-feed .tag-name { display:flex; align-items:center; margin:0; font-size:3.5rem; font-weight:800; color:#fff; letter-spacing:-.01em; word-break:break-word; }
.page-news .tag-feed .tag-name::before { width:0; height:3px; margin-right:0; content:""; background:#fff; transition:.4s var(--animation-base, ease); transition-property:margin-right,width; }
.page-news .tag-feed .tag:hover .tag-name::before { width:30px; margin-right:10px; }
.page-news .tag-feed .tag-description { margin-top:.35rem; opacity:.9; font-size:1rem; }

/* Latest posts section under slider */
.page-news [aria-label="Latest news"] { margin-top: 2rem; display: block; }
.page-news [aria-label="Latest news"] .post-feed { display: block; }

/* Blocks layout */
.hb-block, .tb-block { display: flex !important; align-items: center; margin-bottom: 4rem; gap: 2rem; flex-wrap: nowrap; }
/* Reinforce specificity against base theme rules */
.home-blocks > .hb-block, .training-blocks > .tb-block { display: flex !important; }

/* When gh-canvas is on the block, neutralize its sizing/spacing to let flexbox control it */
.hb-block.gh-canvas, .tb-block.gh-canvas {
    max-width: none;
    padding: 0;
    margin-left: 0;
    margin-right: 0;
}

/* Force children of a landing block to ignore the gh-canvas grid and obey flexbox */
.hb-block.gh-canvas > *, .tb-block.gh-canvas > * {
    grid-column: auto; /* Override gh-canvas's default "main" column */
}

/* Figures */
.hb-figure, .tb-figure { flex: 1 1 50%; aspect-ratio: 16/9; min-width: 0; box-sizing: border-box; }
.hb-figure img, .tb-figure img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; }

/* Aspect ratios via internal tags */
.hb-figure.tag-hash-landing-media-16-9, .tb-figure.tag-hash-landing-media-16-9 { aspect-ratio: 16/9; }
.hb-figure.tag-hash-landing-media-9-16,  .tb-figure.tag-hash-landing-media-9-16  { aspect-ratio: 9/16; }
.hb-figure.tag-hash-landing-media-1-1,   .tb-figure.tag-hash-landing-media-1-1   { aspect-ratio: 1/1; }
.hb-figure.tag-hash-landing-media-3-4,   .tb-figure.tag-hash-landing-media-3-4   { aspect-ratio: 3/4; }
.hb-figure.tag-hash-landing-media-4-3,   .tb-figure.tag-hash-landing-media-4-3   { aspect-ratio: 4/3; }
.hb-figure.tag-hash-landing-media-4-5,   .tb-figure.tag-hash-landing-media-4-5   { aspect-ratio: 4/5; }

/* Content */
.hb-content, .tb-content { flex: 1 1 50%; min-width: 0; box-sizing: border-box; }
.hb-title, .tb-title { font-size: 2rem; margin-bottom: 1rem; }

/*
  In landing blocks that HAVE MEDIA, force the .gh-canvas on the content column
  to fill its flex container instead of centering itself.
  Blocks without media will behave like a normal gh-canvas.
*/
.home-blocks .hb-block.has-media .hb-content.gh-canvas,
.training-blocks .tb-block.has-media .tb-content.gh-canvas {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 1rem; /* Add some breathing room */
}

/* Orientation safety via child ordering (wins over conflicting flex-direction) */
.home-blocks > .hb-block.tag-hash-landing-media-right .hb-figure,
.training-blocks > .tb-block.tag-hash-landing-media-right .tb-figure { order: 2; }
.home-blocks > .hb-block.tag-hash-landing-media-right .hb-content,
.training-blocks > .tb-block.tag-hash-landing-media-right .tb-content { order: 1; }

.home-blocks > .hb-block.tag-hash-landing-media-left .hb-figure,
.training-blocks > .tb-block.tag-hash-landing-media-left .tb-figure { order: 1; }
.home-blocks > .hb-block.tag-hash-landing-media-left .hb-content,
.training-blocks > .tb-block.tag-hash-landing-media-left .tb-content { order: 2; }

/* Custom excerpt embeds */
.hb-embed, .tb-embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.hb-embed iframe, .tb-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Ghost embed cards (video, etc.) responsive like posts */
.hb-content.post-content .kg-embed-card, .tb-content.post-content .kg-embed-card {
  position: relative; width: 100%; overflow: hidden; margin-left: auto; margin-right: auto;
}
.hb-content.post-content .kg-embed-card .js-reframe, .tb-content.post-content .kg-embed-card .js-reframe {
  position: relative; width: 100%; padding-top: 56.25% !important;
}
.hb-content.post-content .kg-embed-card iframe, .tb-content.post-content .kg-embed-card iframe {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
}

/* Width presets for videos (centered) */
.hb-block.vidw-1-3 .kg-embed-card, .tb-block.vidw-1-3 .kg-embed-card { width: 33.333%; max-width: none; }
.hb-block.vidw-1-2 .kg-embed-card, .tb-block.vidw-1-2 .kg-embed-card { width: 50%; max-width: none; }
.hb-block.vidw-2-3 .kg-embed-card, .tb-block.vidw-2-3 .kg-embed-card { width: 66.666%; max-width: none; }
.hb-block.vidw-1   .kg-embed-card, .tb-block.vidw-1   .kg-embed-card { width: 100%; max-width: none; }
.hb-block.vidw-0   .kg-embed-card, .tb-block.vidw-0   .kg-embed-card { width: 480px; max-width: none; }

/* Override aspect ratio via tags by changing reframe padding */
.hb-block.tag-hash-landing-video-16-9 .kg-embed-card .js-reframe, .tb-block.tag-hash-landing-video-16-9 .kg-embed-card .js-reframe { padding-top: 56.25% !important; }
.hb-block.tag-hash-landing-video-9-16  .kg-embed-card .js-reframe, .tb-block.tag-hash-landing-video-9-16  .kg-embed-card .js-reframe { padding-top: 177.78% !important; }
.hb-block.tag-hash-landing-video-1-1   .kg-embed-card .js-reframe, .tb-block.tag-hash-landing-video-1-1   .kg-embed-card .js-reframe { padding-top: 100% !important; }
.hb-block.tag-hash-landing-video-3-4   .kg-embed-card .js-reframe, .tb-block.tag-hash-landing-video-3-4   .kg-embed-card .js-reframe { padding-top: 133.33% !important; }
.hb-block.tag-hash-landing-video-4-3   .kg-embed-card .js-reframe, .tb-block.tag-hash-landing-video-4-3   .kg-embed-card .js-reframe { padding-top: 75% !important; }
.hb-block.tag-hash-landing-video-4-5   .kg-embed-card .js-reframe, .tb-block.tag-hash-landing-video-4-5   .kg-embed-card .js-reframe { padding-top: 125% !important; }
.hb-block.tag-hash-landing-video-5-4   .kg-embed-card .js-reframe, .tb-block.tag-hash-landing-video-5-4   .kg-embed-card .js-reframe { padding-top: 80% !important; }

/* Normalize Ghost post spacing in landing content */
.hb-content.gh-content > * + *, .tb-content.gh-content > * + * { margin-top: 1.5rem; }
.hb-content.gh-content > .kg-gallery-card, .tb-content.gh-content > .kg-gallery-card { margin-top: 1.5rem; }

/* Mobile */
@media (max-width: 768px) {
  .hero-tag { height: 42vh; }
  .page-news .tag-feed { height: 50vh !important; }
}


/* Modal (hb-modal) */
.hb-modal { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 9999; }
.hb-modal[hidden] { display: none !important; }
.hb-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.5); }
.hb-modal__dialog { position: relative; background: #fff; width: min(960px, 92vw); max-height: 90vh; overflow: auto; border-radius: 8px; padding: 1rem; box-shadow: 0 10px 30px rgba(0,0,0,0.2); }
.hb-modal__close { position: absolute; top: .5rem; right: .5rem; background: transparent; border: 0; cursor: pointer; }
.hb-modal__title { margin: 0 0 .75rem 0; }
.hb-modal__body { display: grid; gap: 1rem; }
.hb-members-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
.hb-members-form .gh-portal-input-section { display: block; }
.hb-members-form .gh-portal-input-labelcontainer { margin-bottom: .35rem; }
.hb-members-form .gh-portal-input-label { font-size: .85rem; color: var(--secondary-text-color); }
.hb-members-form .gh-portal-input { width: 100%; border: 1px solid var(--mid-gray-color); border-radius: 6px; padding: .65rem .8rem; font: inherit; color: var(--primary-text-color); background: #fff; }
.hb-members-form .gh-portal-input:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(54,132,229,.15); }
.hb-members-form .gh-portal-btn-container { grid-column: 1 / -1; }
.hb-members-form .gh-portal-btn { width: 100%; border: 0; border-radius: 6px; padding: .9rem 1.2rem; font-weight: 700; cursor: pointer; }
.hb-members-form .gh-portal-btn-primary { background: var(--primary-color); color: #fff; }
.hb-members-form .gh-portal-btn-primary:hover { filter: brightness(0.95); }
.gh-portal-signin { margin-top: .25rem; font-size: .95rem; }
.gh-portal-btn-link { background: transparent; border: 0; color: var(--primary-color); padding: 0; }
@media (max-width: 768px) {
  .hb-members-form { grid-template-columns: 1fr; }
}
.hb-embed--tally { position: relative; padding-bottom: 62.5%; height: 0; overflow: hidden; }
.hb-embed--tally iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
@media (max-width: 768px) { .hb-modal__dialog { padding: .5rem; } }
