/* UI-01-a: お知らせ на штатных записях и редактируемые рекламные места. Токены — hub.css (:root / html[data-theme=dark]). */

/* ---- お知らせ: блок главной ------------------------------------------------ */
.hg-news{padding-block:56px 4px;min-width:0}
.hg-news .hgc-heading{margin-bottom:10px}
.hg-news-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--hg-line)}
.hg-news-item{margin:0;padding:0;border-bottom:1px solid var(--hg-line)}
.hg-news-link{display:grid;grid-template-columns:7.5em minmax(0,1fr) 24px;align-items:start;column-gap:22px;min-height:60px;padding:18px 0;color:var(--hg-ink);text-decoration:none;transition:color .2s var(--hg-ease)}
.hg-news-date{font-family:Montserrat,'Noto Sans JP','Noto Sans JP Fallback',sans-serif;font-size:13px;font-weight:600;letter-spacing:.04em;line-height:1.7;color:var(--hg-muted);font-variant-numeric:tabular-nums;white-space:nowrap;padding-top:2px}
.hg-news-title{font-size:16px;line-height:1.7;overflow-wrap:anywhere;min-width:0}
html[lang=ja] .hg-news-title{line-break:strict;overflow-wrap:anywhere}
.hg-news-list--home .hg-news-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.hg-news-arrow{display:grid;place-items:center;height:1.7em;color:var(--hg-red)}
.hg-news-arrow svg{width:18px;height:18px;transition:transform .25s var(--hg-ease)}
.hg-news-link:hover .hg-news-title,.hg-news-link:focus-visible .hg-news-title{color:var(--hg-red)}
.hg-news-link:hover .hg-news-arrow svg{transform:translateX(5px)}
.hg-news-link:focus-visible{outline:3px solid var(--hg-red);outline-offset:4px;border-radius:3px}
.hg-news-empty{margin:0;padding:24px;border-radius:8px;background:var(--hg-soft);color:var(--hg-muted);font-size:14px;line-height:1.8}

/* ---- お知らせ: архив и отдельная запись ----------------------------------- */
.hg-news-archive .hg-news-list--archive .hg-news-link{padding:22px 0}
.hg-news-single .jp-breadcrumb>span:last-child{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hg-news-archive .jp-page-heading,.hg-news-single .jp-page-heading{padding-bottom:22px}
.hg-news-meta{margin:14px 0 0;color:var(--hg-muted);font-size:13px}
.hg-news-single .hg-news-meta .hg-news-date{padding-top:0}
.hg-news-content{max-width:70ch;font-size:16px;line-height:1.95;color:var(--hg-ink);padding-top:18px;border-top:1px solid var(--hg-line)}
html[lang=ja] .hg-news-content{line-break:strict;overflow-wrap:anywhere}
.hg-news-content>*+*{margin-top:1.1em}
.hg-news-content h2{font-size:22px;line-height:1.45;margin-top:1.8em}
.hg-news-content h3{font-size:18px;line-height:1.5;margin-top:1.5em}
.hg-news-content ul,.hg-news-content ol{padding-left:1.4em}
.hg-news-content li+li{margin-top:.4em}
.hg-news-content img{max-width:100%;height:auto;border-radius:12px}
.hg-news-content a{color:var(--hg-red);text-decoration:underline;text-underline-offset:.18em}
.hg-news-content blockquote{margin:0;padding:4px 0 4px 18px;border-left:3px solid var(--hg-red);color:var(--hg-muted)}
.hg-news-content table{width:100%;border-collapse:collapse;font-size:14px}
.hg-news-content th,.hg-news-content td{padding:10px 12px;border-bottom:1px solid var(--hg-line);text-align:left}
.hg-news-archive .navigation.pagination{margin-top:28px}
.hg-news-archive .nav-links{display:flex;flex-wrap:wrap;gap:8px}
.hg-news-archive .page-numbers{display:inline-grid;place-items:center;min-width:44px;min-height:44px;padding:0 12px;border:1px solid var(--hg-line);border-radius:8px;color:var(--hg-ink);font-size:14px;font-weight:600;text-decoration:none;background:var(--hg-white)}
.hg-news-archive .page-numbers.current{background:var(--hg-ink);border-color:var(--hg-ink);color:var(--hg-paper)}
.hg-news-archive .page-numbers.dots{border-color:transparent;background:transparent}
.hg-news-archive a.page-numbers:hover,.hg-news-archive a.page-numbers:focus-visible{border-color:var(--hg-red);color:var(--hg-red)}

/* ---- рекламные места: пользовательский слот (изображение + HTML-текст) ------ */
.hg-promo-slot--custom{display:block;position:relative;grid-template-columns:none;max-width:100%;min-height:270px;aspect-ratio:7/3;isolation:isolate;background:var(--hg-soft);color:#fff;transition:border-color .2s var(--hg-ease),box-shadow .3s var(--hg-ease)}
.hg-promo-slot--custom:hover,.hg-promo-slot--custom:focus-visible{box-shadow:var(--hg-shadow)}
.hg-promo-media{position:absolute;inset:0;display:block;overflow:hidden;border-radius:inherit}
.hg-promo-media .hg-promo-image,.hg-promo-media img{display:block;width:100%;height:100%;object-fit:cover;filter:none;transition:transform .6s var(--hg-ease)}
.hg-promo-slot--custom:hover .hg-promo-image{transform:scale(1.03)}
.hg-promo-copy--overlay{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:10px;min-height:270px;height:100%;padding:28px 30px 26px;color:#fff;background:linear-gradient(180deg,rgba(17,18,20,.14) 0%,rgba(17,18,20,.3) 34%,rgba(17,18,20,.64) 68%,rgba(17,18,20,.84) 100%)}
.hg-promo-copy--overlay small{display:inline-block;padding:4px 9px;border-radius:4px;background:rgba(17,18,20,.56);color:#fff;letter-spacing:.12em;text-shadow:none;backdrop-filter:blur(2px)}
.hg-promo-text{display:block;font-size:clamp(19px,1.9vw,27px);font-weight:500;line-height:1.42;max-width:26ch;overflow-wrap:anywhere;text-shadow:0 1px 3px rgba(0,0,0,.45)}
.hg-promo-text strong{font-weight:700}
html[lang=ja] .hg-promo-text{line-break:strict}
.hg-promo-text p{margin:0}
.hg-promo-text em{font-style:normal;color:#ffd9d4}
.hg-promo-copy--overlay .hg-promo-cta{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.hg-promo-copy--overlay .hg-promo-cta svg{transition:transform .25s var(--hg-ease)}
.hg-promo-slot--custom:hover .hg-promo-cta svg{transform:translateX(5px)}
/* слот только с текстом: обычная поверхность без скрима */
.hg-promo-slot--text-only{color:var(--hg-ink);background:var(--hg-white)}
.hg-promo-slot--text-only .hg-promo-copy--overlay{background:none;color:var(--hg-ink);justify-content:center}
.hg-promo-slot--text-only .hg-promo-copy--overlay small,.hg-promo-slot--text-only .hg-promo-copy--overlay .hg-promo-cta{color:var(--hg-red);text-shadow:none}
.hg-promo-slot--text-only .hg-promo-copy--overlay small{padding:0;background:none;backdrop-filter:none}
.hg-promo-slot--text-only .hg-promo-text{text-shadow:none}
.hg-promo-slot--text-only .hg-promo-text em{color:var(--hg-red)}
.hg-promo-slot--custom:focus-visible{outline:3px solid var(--hg-red);outline-offset:4px}
html[data-theme=dark] .hg-promo-slot--custom{background:var(--hg-soft)}

/* UI-02-h (R73 06): слот с изображением и текстом — текст на своей панели, сцена целиком (как запасной слот категории hub.css: 42% / 58%).
   Текст не закрывает сюжет; кадр от верхнего края. Desktop — пропорция 7/3 соседнего слота (4:3 в колонке 58 % теряет ~2 % снизу), до 900 px — высота по картинке.
   Иерархия обоих пользовательских слотов: заголовок (strong) крупно, пояснение — обычным размером. Только токены hub.css. */
.hg-promo-slot--custom:has(.hg-promo-media):has(.hg-promo-copy){display:grid;grid-template-columns:minmax(0,42%) minmax(0,58%);min-height:270px;color:var(--hg-ink);background:var(--hg-white)}
html[data-theme=dark] .hg-promo-slot--custom:has(.hg-promo-media):has(.hg-promo-copy){background:var(--hg-soft)}
.hg-promo-slot--custom:has(.hg-promo-copy) .hg-promo-media{position:relative;inset:auto;grid-column:2;grid-row:1;min-width:0;border-radius:0;background:var(--hg-soft)}
.hg-promo-slot--custom:has(.hg-promo-copy) .hg-promo-media img{height:100%;object-position:50% 0}
.hg-promo-slot--custom:has(.hg-promo-media) .hg-promo-copy--overlay{grid-column:1;grid-row:1;min-width:0;min-height:0;justify-content:center;padding:28px 22px 28px 30px;color:var(--hg-ink);background:none}
.hg-promo-slot--custom:has(.hg-promo-media) .hg-promo-copy--overlay small{padding:0;background:none;backdrop-filter:none;color:var(--hg-red)}
.hg-promo-slot--custom:has(.hg-promo-media) .hg-promo-text{text-shadow:none}
.hg-promo-slot--custom:has(.hg-promo-media) .hg-promo-text em{color:var(--hg-red)}
.hg-promo-slot--custom:has(.hg-promo-media) .hg-promo-copy--overlay .hg-promo-cta{color:var(--hg-red);text-shadow:none}
.hg-promo-slot--custom:has(.hg-promo-media):hover,.hg-promo-slot--custom:has(.hg-promo-media):focus-visible{border-color:var(--hg-red)}
.hg-promo-slot--custom .hg-promo-text{font-size:15px;font-weight:400;line-height:1.8;max-width:32em}
/* Заголовок не рвётся посреди слова: японский — по фразам (auto-phrase, Chromium 119+; без поддержки — прежний перенос), строки выровнены. */
.hg-promo-slot--custom .hg-promo-text strong{display:inline-block;margin-bottom:6px;font-size:clamp(20px,1.8vw,26px);line-height:1.4;word-break:auto-phrase;text-wrap:balance}
.hg-promo-slot--custom:has(.hg-promo-media) .hg-promo-text strong{font-size:clamp(19px,1.5vw,22px)}

/* ---- адаптация ----------------------------------------------------------- */
@media(max-width:900px){
  .hg-news{padding-block:40px 0}
  .hg-promo-slot--custom{min-height:230px;aspect-ratio:16/9}
  .hg-promo-copy--overlay{min-height:230px;padding:22px 22px 20px}
  .hg-promo-slot--custom:has(.hg-promo-media):has(.hg-promo-copy){aspect-ratio:auto}
}
@media(max-width:680px){
  .hg-promo-slot--custom:has(.hg-promo-media):has(.hg-promo-copy){grid-template-columns:minmax(0,1fr);min-height:0}
  .hg-promo-slot--custom:has(.hg-promo-copy) .hg-promo-media{grid-column:1;grid-row:1}
  .hg-promo-slot--custom:has(.hg-promo-copy) .hg-promo-media img{height:auto}
  .hg-promo-slot--custom:has(.hg-promo-media) .hg-promo-copy--overlay{grid-column:1;grid-row:2;padding:18px 18px 20px}
  .hg-promo-slot--custom.hg-promo-slot--text-only{aspect-ratio:auto} /* текст не обрезается рамкой 4/3: слот растёт по содержимому */
  .hg-news-link{grid-template-columns:minmax(0,1fr) 22px;row-gap:4px;padding:16px 0}
  .hg-news-date{grid-column:1;font-size:12px}
  .hg-news-title{grid-column:1;font-size:15px;line-height:1.65}
  .hg-news-arrow{grid-column:2;grid-row:1/span 2;align-self:center;height:auto}
  .hg-news-list--home .hg-news-title{-webkit-line-clamp:3}
  .hg-news-content{font-size:15px;line-height:1.9}
  .hg-news-content h2{font-size:20px}
}
@media(max-width:480px){
  .hg-news{padding-block:32px 0}
  .hg-promo-slot--custom{min-height:210px;aspect-ratio:4/3}
  .hg-promo-copy--overlay{min-height:210px;padding:18px 18px 16px;gap:8px}
  .hg-promo-text{font-size:19px;max-width:none}
  .hg-promo-slot--text-only .hg-promo-copy--overlay{padding:18px}
}
@media(prefers-reduced-motion:reduce){
  .hg-news-link,.hg-news-arrow svg,.hg-promo-slot--custom,.hg-promo-media img,.hg-promo-copy--overlay .hg-promo-cta svg{transition:none!important}
  .hg-promo-slot--custom:hover .hg-promo-image,.hg-promo-slot--custom:hover .hg-promo-cta svg,.hg-news-link:hover .hg-news-arrow svg{transform:none!important}
}

/* R84: прежний frame ratio дневной картинки, обе полные сцены без crop; h text panel сохранена. */
.hg-promo-slot--custom:has(.hg-promo-copy) .hg-promo-media--pair{aspect-ratio:var(--hg-promo-pair-ratio,4/3)}
.hg-promo-slot--custom:has(.hg-promo-copy) .hg-promo-media--pair>img{height:100%;object-fit:contain}

/* R84: специфичность pair выше прежнего promo display:block. */
.hg-promo-slot--custom .hg-promo-media--pair .hg-art-night,html[data-theme=dark] .hg-promo-slot--custom .hg-promo-media--pair .hg-art-day{display:none}
html[data-theme=dark] .hg-promo-slot--custom .hg-promo-media--pair .hg-art-night{display:block}
