/* In Focus only. Dimensions follow the public SeriesHero/SeriesCollaboration. */
/* Container width comes from the theme token so this template stays aligned with header, footer and every other page. The fallback keeps the previous value if the token is absent. */
.ctx-if { --ctx-if-container:var(--ctx-container-outer,1440px); --ctx-if-hero-offset:265px; background:#002140; color:#fff; font-family:"Noto Sans",sans-serif; font-size:16px; line-height:1.5; width:100%; margin:0; }
.ctx-if *, .ctx-if *::before, .ctx-if *::after { box-sizing:border-box; }
.ctx-if [hidden] { display:none !important; }
/* All link states are listed so they win over the global a/a:visited rules in trf.css and style.css. */
.ctx-if a, .ctx-if a:link, .ctx-if a:visited, .ctx-if a:hover, .ctx-if a:focus, .ctx-if a:active { color:inherit; }
.ctx-if h1,.ctx-if h2,.ctx-if h3,.ctx-if p,.ctx-if figure { color:inherit; padding:0; }
.ctx-if a:focus-visible,.ctx-if button:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
.ctx-if a:hover { text-decoration:underline !important; }
/* Cropped images are matched on the element as well as the class, so the global img height rule cannot leave the frame partly empty. */
.ctx-if .ctx-if-hero__media img, .ctx-if .ctx-if-card__media img, .ctx-if .ctx-if-enhanced-hero > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ctx-if-kicker { background:#003b5b; }
.ctx-if-kicker > div { max-width:var(--ctx-if-container); margin:auto; padding:15px; font-family:Arial,Helvetica,sans-serif; font-size:22px; font-weight:700; }
.ctx-if-hero { background:#00172d; }
.ctx-if-hero__inner { display:flex; flex-direction:column; max-width:var(--ctx-if-container); margin:auto; }
.ctx-if-hero__media { position:relative; width:100%; aspect-ratio:100/52; flex-shrink:0; }
.ctx-if-hero__image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ctx-if-hero__content { min-width:0; padding:23px 15px 24px; }
.ctx-if-hero__header h1 { font-size:27px; line-height:33px; font-weight:700; margin:-1px 0 16px; }
.ctx-if-hero__date { display:block; font-size:13px; line-height:17px; margin-bottom:16px; }
.ctx-if-summary { overflow-wrap:break-word; }
.ctx-if-summary p { font-size:15px; line-height:23px; margin:0 0 15px; }
.ctx-if-summary h2 { font-size:27px; line-height:33px; font-weight:700; margin:0 0 16px; }
.ctx-if-summary a { text-decoration:underline !important; }
.ctx-if-hero__footer { display:flex; flex-direction:column; justify-content:space-between; align-items:flex-start; margin-top:50px; gap:0; }
.ctx-if-partner { display:flex; align-items:center; justify-content:flex-end; min-width:100%; border-top:1px solid rgba(255,255,255,.1); margin-top:20px; padding-top:20px; color:#fff; }
.ctx-if .ctx-if-partner__label { flex-shrink:0; font-size:12px; line-height:28px; font-weight:600; margin:0 12px -2px 0; }
.ctx-if-partner__identity { display:inline-block; line-height:0; flex-shrink:0; }
.ctx-if .ctx-if-partner__logo { display:block; width:130px; height:auto; max-width:100%; max-height:none; margin:0; padding:0; }
.ctx-if-partner__name { display:inline-block; max-width:160px; font-size:14px; line-height:20px; overflow-wrap:anywhere; }
/* Trigger for the shared share popup. Panel styles live in share-popup.css. */
.ctx-if-share { color:#fff; }
.ctx-if .ctx-if-share__button { display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:700; line-height:21px; cursor:pointer; }
.ctx-if .ctx-if-share__button:hover { text-decoration:none !important; }
.ctx-if-share__button svg { flex:0 0 20px; }
.ctx-if-content { max-width:var(--ctx-if-container); margin:auto; padding:20px 15px; }
.ctx-if .ctx-if-section-title { position:relative; padding-left:17px; font-size:18px; line-height:25px; font-weight:600; text-transform:uppercase; letter-spacing:normal; margin:0 0 24px; }
.ctx-if-section-title::before { content:""; position:absolute; width:8px; height:13px; left:0; top:6px; background:var(--ctx-blue-deep, #004a7c); }
.ctx-if-divider { height:1px; border:0; background:rgba(215,240,255,.15); margin:20px 0; }
.ctx-if-latest__grid,.ctx-if-featured__grid,.ctx-if-more__grid { display:flex; flex-direction:column; }
.ctx-if-card { min-width:0; margin:0; padding:0; display:flex; }
.ctx-if-card--latest,.ctx-if-card--more { width:100%; padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid rgba(255,255,255,.08); }
.ctx-if-card--latest:last-child,.ctx-if-card--more:last-child { padding-bottom:0; margin-bottom:0; border:0; }
.ctx-if-card__media { display:block; position:relative; flex-shrink:0; width:40%; aspect-ratio:100/70; align-self:flex-start; background:#002a46; overflow:hidden; }
.ctx-if-card__image { display:block; width:100%; height:100%; position:absolute; inset:0; object-fit:cover; }
.ctx-if-card__flag { position:absolute; bottom:0; left:0; padding:4px 8px; background:#00172dcc; color:white; font-size:11px; line-height:18px; z-index:1; }
.ctx-if-card__info { min-width:0; display:flex; flex-direction:column; padding-left:15px; width:60%; }
/* Topic renders as a solid badge, matching the public card component. */
.ctx-if .ctx-if-card__topic { display:inline-block; align-self:flex-start; background:var(--ctx-blue-deep, #004a7c); color:#fff; border-radius:4px; padding:5px 12px; font-size:11px; font-weight:700; line-height:15px; letter-spacing:.02em; text-transform:uppercase; text-decoration:none; margin-bottom:4px; }
.ctx-if .ctx-if-card__topic:hover { text-decoration:none !important; }
.ctx-if .ctx-if-card__title { font-family:inherit; font-size:15px; line-height:20.5px; font-weight:500; margin:3px 0 0; }
.ctx-if-card__title a { color:inherit; text-decoration:none; }
.ctx-if-card--opinion .ctx-if-card__title::before { content:'“'; font-family:Georgia,serif; font-weight:bold; margin-right:3px; }
.ctx-if .ctx-if-card__date { font-size:13px; line-height:19px; margin:10px 0 0; }
.ctx-if-card--featured { flex-direction:column; margin-bottom:25px; }
.ctx-if-card--featured .ctx-if-card__media { width:100%; aspect-ratio:100/58; }
.ctx-if-card--featured .ctx-if-card__info { width:100%; padding:15px 0 0; }
.ctx-if-card--featured .ctx-if-card__title { font-size:22px; line-height:30px; }
.ctx-if-load-more { display:block; margin:25px auto 0; border:1px solid #fff; color:#fff; background:transparent; font-size:14px; line-height:22px; padding:12px 30px; cursor:pointer; }
.ctx-if-widget { display:flex; flex-direction:column; align-items:flex-start; gap:20px; padding:25px; margin-bottom:25px; color:white; background:var(--ctx-blue-band, #004371); }
.ctx-if .ctx-if-widget__title { font-size:19px; line-height:29.5px; font-weight:600; margin:0; }
.ctx-if-widget p { font-size:14px; line-height:24px; margin:10px 0 0; }
.ctx-if-widget > a { display:flex; align-items:center; justify-content:center; padding:12px 25px; text-decoration:none; color:var(--ctx-blue-deep, #004a7c); background:#fff; text-transform:uppercase; font-size:15px; line-height:24px; width:100%; text-align:center; }
.ctx-if--enhanced { background:var(--ctx-if-background,#042d52); color:var(--ctx-if-foreground,#fff); }
/* The backdrop stacks the title at the bottom, matching the source component. */
.ctx-if-enhanced-hero { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; }
.ctx-if-enhanced-hero__image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ctx-if-enhanced-hero__title-block { z-index:1; position:relative; padding:47px 15px 45px; max-width:var(--ctx-if-container); }
.ctx-if .ctx-if-enhanced-hero h1 { color:#fff; text-align:center; font-family:inherit; font-size:37px; font-weight:700; line-height:112%; margin:0; -webkit-text-stroke:1px color-mix(in srgb,var(--ctx-if-background),40% #000); paint-order:stroke fill; }
.ctx-if-block { margin:0 0 25px; }
.ctx-if-block__body { width:100%; max-width:900px; margin:0 auto; font-size:16px; line-height:26px; text-align:center; overflow-wrap:break-word; }
.ctx-if-block__body p { margin:0 0 14px; font-size:inherit; line-height:inherit; }
.ctx-if-block__body h3 { font-size:24px; line-height:32px; }
.ctx-if-block__body a { text-decoration:underline !important; }
.ctx-if-block__media { max-width:1000px; margin:24px auto; }
.ctx-if-block__image { display:block; width:100%; height:auto; }
.ctx-if-block__media figcaption { font-size:12px; line-height:18px; margin-top:8px; text-align:left; }
.ctx-if-video { position:relative; aspect-ratio:16/9; background:#000; }
.ctx-if-video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.ctx-if-card--enhanced { flex-direction:column; margin-bottom:25px; }
/* The card media inherits the collection colour, so an image shorter than the card does not expose the navy default used by the standard variant. */
.ctx-if--enhanced .ctx-if-card__media { background:color-mix(in srgb,var(--ctx-if-background,#002140),25% #000); }
.ctx-if-card--enhanced .ctx-if-card__media { width:100%; aspect-ratio:100/58; }
.ctx-if-card--enhanced .ctx-if-card__info { width:100%; padding:17px 0 0; }
.ctx-if-card--enhanced .ctx-if-card__title { font-size:20px; line-height:133%; font-weight:600; margin:0 0 12px; }
.ctx-if .ctx-if-card--enhanced .ctx-if-card__topic { margin-bottom:12px; }
.ctx-if .ctx-if-card__teaser { font-size:15px; line-height:144%; margin:0; }
.ctx-if-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(min-width:640px) {
 .ctx-if-kicker > div { padding:20px 25px; }
 .ctx-if-hero__media { aspect-ratio:100/53; }
 .ctx-if-hero__content { padding:23px 30px 32px; }
 .ctx-if-hero__header h1,.ctx-if-summary h2 { font-size:35px; line-height:44px; }
 .ctx-if-hero__date { font-size:14px; line-height:19px; margin-bottom:20px; }
 .ctx-if-summary p { font-size:16px; line-height:24px; }
 .ctx-if-hero__footer { flex-direction:row; }
 .ctx-if .ctx-if-share__button { font-size:16px; line-height:24px; }
 .ctx-if-partner { min-width:0; border:0; margin:0; padding:0; }
 .ctx-if-content { padding:25px; }
 .ctx-if .ctx-if-section-title { margin-bottom:28px; }
 .ctx-if-latest__grid,.ctx-if-featured__grid { flex-direction:row; flex-wrap:wrap; gap:25px; }
 .ctx-if-more__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
 .ctx-if-card--latest,.ctx-if-card--featured { width:calc((100% - 25px)/2); flex-direction:column; padding:0; margin:0; border:0; }
 .ctx-if-card--more { flex-direction:column; padding:0; margin:0; border:0; }
 .ctx-if-card__media { width:100%; aspect-ratio:100/60; }
 .ctx-if-card__info { width:100%; padding:20px 0 0; }
 .ctx-if .ctx-if-card__title { font-size:20px; line-height:28px; }
 .ctx-if-card--featured .ctx-if-card__title { font-size:28px; line-height:36px; }
 .ctx-if-widget { flex-direction:row; align-items:center; justify-content:space-between; padding:38px 36px; }
 .ctx-if-widget > a { width:auto; flex-shrink:0; }
 .ctx-if .ctx-if-widget__title { font-size:23.5px; }
 /* The backdrop is pulled up over the header stack and the negative margin lifts the content that follows by the same amount. The padding restores the space the shift removes, so the title keeps its position on the page. */
 .ctx-if-enhanced-hero { top:calc(var(--ctx-if-hero-offset) * -1); margin-bottom:calc(var(--ctx-if-hero-offset) * -1); padding-top:var(--ctx-if-hero-offset); }
 .ctx-if-enhanced-hero__title-block { padding:60px 25px; }
 .ctx-if .ctx-if-enhanced-hero h1 { font-size:43px; }
 .ctx-if-block__body { font-size:18px; line-height:31px; }
 .ctx-if-card--enhanced { background:#0004; margin-bottom:23px; }
 .ctx-if-card--enhanced .ctx-if-card__info { padding:30px 25px 31px; }
 .ctx-if-card--enhanced .ctx-if-card__title { font-size:30px; line-height:125.5%; margin-bottom:17px; }
 .ctx-if .ctx-if-card--enhanced .ctx-if-card__topic { margin-bottom:19px; }
 .ctx-if .ctx-if-card__teaser { font-size:17px; line-height:163%; }
}
@media(min-width:900px) {
 .ctx-if-hero__inner { flex-direction:row; }
 .ctx-if-hero__media { width:369px; min-height:369px; aspect-ratio:auto; }
 .ctx-if-hero__content { width:100%; padding:23px 20px 29px; display:flex; flex-direction:column; justify-content:space-between; }
 .ctx-if-content { padding:25px 30px; }
 .ctx-if-enhanced-hero__title-block { padding:94px 110px 106px; }
 .ctx-if .ctx-if-enhanced-hero h1 { font-size:62px; line-height:108%; }
 .ctx-if-card--enhanced { flex-direction:row; margin-bottom:30px; }
 .ctx-if-card--enhanced .ctx-if-card__media { width:428px; height:433px; aspect-ratio:auto; align-self:stretch; }
 .ctx-if-card--enhanced .ctx-if-card__info { padding:50px 41px 40px 30px; }
}
@media(min-width:1200px) {
 .ctx-if-kicker > div { padding:20px 30px; }
 .ctx-if-hero__media { width:442px; min-height:442px; }
 .ctx-if-hero__content { padding:34px 35px 38px; }
 .ctx-if-hero__header h1,.ctx-if-summary h2 { font-size:38px; line-height:46px; }
 .ctx-if-hero__date { margin-bottom:19px; }
 .ctx-if-summary p { font-size:18px; line-height:27px; }
 .ctx-if .ctx-if-partner__label { margin-right:14px; }
 .ctx-if .ctx-if-partner__logo { width:156px; }
 .ctx-if-content { padding:30px; }
 .ctx-if-latest__grid { gap:30px; }
 .ctx-if-card--latest { width:calc((100% - 90px)/4); }
 .ctx-if-card__media { aspect-ratio:100/59; }
 .ctx-if-more__grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:30px; }
 .ctx-if-divider { margin:30px 0; }
 .ctx-if .ctx-if-enhanced-hero h1 { font-size:69px; line-height:119%; }
 .ctx-if-block__body p { margin-bottom:18px; }
 .ctx-if-card--enhanced .ctx-if-card__media { width:569px; height:auto; aspect-ratio:100/58; }
 .ctx-if-card--enhanced .ctx-if-card__title { margin-bottom:19px; }
}