/* === portal chrome === */
/* portal-chrome: gazetapl — prepared hat, styles untouched (pack_prepared_chrome.py) */
@font-face {

  font-display: block;

  font-family: robotocondensed;

  font-stretch: 75%;

  font-style: normal;

  font-weight: 400 700;

  src: url(../index/roboto-variable-wdth-wght-latin-ext-v1.woff2) format("woff2");

}

@font-face {

  font-display: block;

  font-family: oswald;

  font-style: normal;

  font-weight: 300 400 700;

  src: url(../index/oswald-variable-wght-latin-ext-v1.woff2) format("woff2");

}

@font-face {

  font-display: block;

  font-family: roboto;

  font-stretch: 100%;

  font-style: normal;

  font-weight: 400 500 700 900;

  src: url(../index/roboto-variable-wdth-wght-latin-ext-v1.woff2) format("woff2");

}

:root {

  --theme-color: #beff96;

}

body {

  font-synthesis: none;

}

* {

  box-sizing: border-box;

  margin: 0;

  padding: 0;

}

html,
body {

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

}

fieldset,
img {

  border: 0;

}

a {

  color: inherit;

  text-decoration: none;

}

a:hover {

  text-decoration: none;

}

.adviewDFPBanner {

  height: 100%;

  position: relative;

}

.adviewDFPBanner > :nth-child(2) {

  position:relative;

  top: 0;

}

.adviewDFPBanner .banLabel {

  width: 100%;

  margin-top: 8px;

  position: absolute;

  top: -20px;

}

body {

  padding-top: 100px;

  transition: padding-top 0.7s;

}

.navigation-top {

  z-index: 1000001;

  background-color: #fff;

  width: 100%;

  position:relative;

  top:auto;

}

.navigation-top__box {

  align-items: center;

  width: 1300px;

  height: 100px;

  margin: 0 auto;

  transition: height 0.2s ease-out;

  display: flex;

}

.navigation-top__box > * {

  overflow: hidden;

}

.navigation-top__logo {

  max-width: 126px;

  height: 50px;

  margin: 0 20px;

  transition: all 0.4s ease-in-out;

}

.navigation-top__logo img {

  width: auto;

  max-width: 126px;

  height: 50px;

}

.navigation-top__logo a {

  align-items: center;

  height: 100%;

  transition: all 0.2s ease-out;

  display: flex;

}

.navigation-top__main-nav {

  flex-wrap: wrap;

  flex: 1;

  justify-content: start;

  align-items: center;

  height: 50px;

  padding: 0 0 0 20px;

  display: flex;

  position: relative;

}

.navigation-top__link {

  text-transform: uppercase;

  color: #111;

  align-items: center;

  height: 50px;

  padding: 0 10px;

  font-family: oswald;

  font-size: 16px;

  font-weight: 400;

  line-height: 19px;

  display: flex;

}

.navigation-top__link--drop-down-button {

  text-transform: uppercase;

  justify-content: center;

  align-items: center;

  gap: 10px;

  height: 100%;

  padding-left: 10px;

  font-family: oswald;

  font-size: 16px;

  font-weight: 700;

  display: flex;

}

.navigation-top__link--drop-down-button:hover {

  cursor: pointer;

}

.navigation-top__main-icons {

  height: 100%;

  margin-left: auto;

  padding: 0 20px;

  display: flex;

  overflow: visible;

}

.navigation-top__main-icons span {

  padding-top: 5px;

  position: relative;

  top:auto;

  left: 0;

}

.navigation-top__main-icons-img {

  width: 22px;

  height: 22px;

  margin-bottom: 0;

}

.navigation-top__main-icons-link {

  color: #111;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  height: 100%;

  padding: 0 21px;

  font-family: roboto;

  font-size: 11px;

  display: flex;

  position: relative;

}

.navigation-top__overlay {

  z-index: 1;

  background-color: #fff;

  position: relative;

}

[data-option="nav_tooltip_wyborcza"] {

  position: relative;

}

[data-option="nav_tooltip_wyborcza"]:hover .disappearingTooltip {

  opacity: 1;

  z-index: 2;

}

[data-option="nav_tooltip_wyborcza"] span {

  text-align: center;

  color: #fff;

  z-index: 2;

  white-space: nowrap;

  text-transform: uppercase;

  cursor: pointer;

  background-color: #111;

  padding: 6px 12px;

  font-family: robotocondensed;

  font-size: 12px;

  font-weight: 700;

  line-height: 14px;

  transition: opacity 0.3s ease-in-out;

}

[data-option="nav_tooltip_wyborcza"] span:hover {

  opacity: 0.8;

}

[data-option="nav_tooltip_wyborcza"] .navigation-top__main-icons-img {

  display: none;

}

.disappearingTooltip {

  color: #fff;

  white-space: nowrap;

  z-index: 1;

  background-color: #757575;

  padding: 8px 12px;

  font-size: 11px;

  font-weight: 400;

  line-height: 15px;

  transition: all 0.3s ease-in-out;

  position: absolute;

  bottom: -2px;

  right: 15px;

}

.disappearingTooltip:before {

  content: "";

  border-bottom: 9px solid #757575;

  border-left: 0 solid #0000;

  border-right: 9px solid #0000;

  width: 0;

  height: 0;

  transition: all 0.3s ease-in-out;

  position: absolute;

  top: -7px;

  right: 15px;

}

.disappearingTooltip--hidden {

  opacity: 0;

  z-index: -1;

}

@media (width>=1260px) {

  .chart__arrow: hover {

    background-color: #757575;

  }

}

/* --- stub footer (librarian-generated) --- */
.land-footer-slim {

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 12px;

  padding: 28px 16px 32px;

  text-align: center;

}

.land-footer-slim img,
.land-footer-slim svg {

  display: block;

  height: auto;

  width: auto;

  max-height: 32px;

  max-width: 180px;

}

.land-footer-slim .land-footer-copy {

  margin: 0;

  font-size: 13px;

  line-height: 1.4;

}

/* Donor sticky-hat clone must not enter document flow (nested scrollbar + ghost height) */
#sticky-nav,
[class*="stickyPrimaryNav"],
[class*="sticky-nav"] {

  display: none !important;

  height: 0 !important;

  overflow: hidden !important;

  pointer-events: none !important;

}

/* Horizontal channel/nav strip only — never a vertical bar inside the hat.
   Outer wrap stays overflow hidden (or the page grows a 320 scrollbar).
   Inner nowrap list is the only overflow-x:auto. */
#bbc-header .hZiVmC,
#bbc-header [class*="HeaderNav"],
#bbc-header .kidpOc {

  overflow-x: auto !important;

  overflow-y: hidden !important;

  max-width: 100% !important;

  min-width: 0 !important;

}

[data-mol-fe-xpmodule-navigation] [class*="subListWrapper"] {

  overflow-x: hidden !important;

  overflow-y: hidden !important;

  max-width: 100% !important;

  min-width: 0 !important;

}

[data-mol-fe-xpmodule-navigation] [class*="channeList"],
[data-mol-fe-xpmodule-navigation] [class*="carouselViewport"] {

  overflow-x: auto !important;

  overflow-y: hidden !important;

  max-width: 100% !important;

  min-width: 0 !important;

}

#bbc-header .hZiVmC,
[data-mol-fe-xpmodule-navigation] {

  max-width: 100% !important;

}

/* === chrome typography isolation: hat/footer must not inherit the article ===
   landing-style-zones.md locks font-family per zone but left line-height open.
   Every land template sets `body { line-height: 1.6 }` for the article, and that
   value inherits straight into the portal chrome. Packs are cut as resting-state
   snapshots of the donor's own markup, so a stray `<br>` / text node inside
   <header> (O Globo ships one) gets its anonymous line box inflated by the
   article's line-height — the logo row slides down and overflows the hat.

   Measured on O Globo: content row +8px lower than the library reference,
   overflowing the 97px hat by 29px instead of 21px. Nothing in the pack changed;
   the land's body typography leaked in.

   `normal` is not a taste call: the library preview.html has no body line-height,
   so this is exactly the value the frozen reference/*.png were rendered with.
   Chrome rules that DO set their own line-height keep winning on specificity. */
header,
header.main-header,
#header,
#bbc-header,
#gcom-bar-container,
.header_exposed_menu,
.sapo-bsu,
.bsu-container,
.ec-hat,
.h,
#nav-wm-container,
.site-header,
#masthead,
[data-mol-fe-xpmodule-navigation],
[class*="mastHead"],
footer#pages-footer,
footer.site-footer,
footer.land-footer-slim {

  line-height: normal;

}

/* === stray <br> inside the portal hat is a donor artefact, not content ===
   Packs are resting-state snapshots of the donor's markup, so a bare `<br>`
   left as the FIRST child of <header> comes along for the ride (O Globo ships
   exactly that, right before .header__content).

   It creates a line box at the top of the hat, so `.header__content` — which is
   `height:100%` + `align-items:center` — starts BELOW the hat's top edge and
   centres itself against the shifted area instead of the hat. Measured on
   O Globo @1280: the logo row sat 24px below the hat's centre and overflowed
   the 97px bar; after this rule, 5px (the logo glyph box).

   A <br> directly inside a portal header is never meaningful content, so this
   is safe for every pack: it restores the hat to the library reference rather
   than restyling it. Reported as "шапка сломана / контент не посередине". */
header > br,
#header > br,
#bbc-header > br,
#masthead > br,
.site-header > br,
.main-header > br {

  display: none;

}

/* === ADAPTIVE (sanctioned by the owner, task 31, 2026-09-14) =================
   The donor gazeta.pl has no responsive hat at all: .navigation-top__box is a
   hard 1300px box, so at 320/375 the nav row is simply cut off and the page
   scrolls horizontally. Owner asked explicitly for a mobile adaptation of this
   prepared hat, so this is a recorded deviation (adaptive-ledger.json), not a
   restyle: every rule below lives inside @media, desktop stays byte-identical.

   Pattern per landing-portal-chrome-lessons.md §2: outer box keeps overflow
   hidden, the nav row itself is the single overflow-x:auto scroll strip
   (overflow-y:hidden so no nested vertical scrollbar appears). */
@media (max-width: 1340px) {

  .navigation-top__box {

    width: 100%;

    max-width: 1300px;

  }

}

@media (max-width: 900px) {

  body {

    padding-top: 0;

  }

  .navigation-top__box {

    height: 64px;

    padding: 0 4px;

  }

  .navigation-top__logo {

    max-width: 96px;

    height: 36px;

    margin: 0 8px;

    flex: 0 0 auto;

  }

  .navigation-top__logo img {

    max-width: 96px;

    height: 36px;

  }

  .navigation-top__box > .navigation-top__main-nav {

    flex: 1 1 0;

    width: 0;

    min-width: 0;

    height: 64px;

    padding: 0;

    flex-wrap: nowrap;

    overflow-x: auto;

    overflow-y: hidden;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;

  }

  .navigation-top__main-nav::-webkit-scrollbar {

    display: none;

  }

  .navigation-top__link {

    height: 64px;

    padding: 0 8px;

    font-size: 14px;

    line-height: 17px;

    white-space: nowrap;

    flex: 0 0 auto;

  }

  .navigation-top__link--drop-down-button {

    padding-left: 8px;

    padding-right: 8px;

    font-size: 14px;

    gap: 6px;

    flex: 0 0 auto;

  }

  .navigation-top__main-icons {

    display: none;

  }

}

@media (max-width: 480px) {

  .navigation-top__box {

    height: 56px;

  }

  .navigation-top__logo {

    max-width: 82px;

    height: 30px;

    margin: 0 6px;

  }

  .navigation-top__logo img {

    max-width: 82px;

    height: 30px;

  }

  .navigation-top__box > .navigation-top__main-nav,
  .navigation-top__link {

    height: 56px;

  }

  .navigation-top__link {

    font-size: 13px;

    padding: 0 7px;

  }

  .navigation-top__link--drop-down-button {

    font-size: 13px;

  }

}

/* === land-fixes === */
/* Post-transplant fixes: layout + footer chrome (do not use global * reset in article CSS) */
.article-wrap {

  display: block;

  max-width: 1000px;

  margin: 0 auto;

  padding: 30px 16px;

  width: 100%;

}

.article-wrap .sidebar {

  display: none !important;

}

.article-wrap > article {

  max-width: 700px;

  margin-left: auto;

  margin-right: auto;

  width: 100%;

  float: none;

}

@media (max-width: 768px) {

  .article-wrap {

    padding: 20px 10px;

  }

}

@media (max-width: 480px) {

  .article-wrap {

    padding: 16px 8px;

  }

}

/* Footer buttons: .site-footer a{color:#fff} + white .footer__button = invisible text/icon */
.site-footer a.button,
.site-footer .footer__button {

  background-color: #fff !important;

  background-image: none !important;

  border-color: #fff !important;

  color: #00af00 !important;

  text-decoration: none !important;

  white-space: nowrap;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 0.35em;

  line-height: 1.25 !important;

  font-weight: 600 !important;

  font-size: 0.95rem !important;

  padding: 0.45em 1.35em 0.4em !important;

  max-width: none !important;

  max-height: none !important;

  overflow: visible !important;

  vertical-align: middle;

}

.site-footer .footer__button .eco-sprite,
.site-footer .footer__button svg {

  color: #00af00 !important;

  fill: none !important;

  stroke: currentColor;

  flex-shrink: 0;

  width: 1.1em;

  height: 1.1em;

  margin-right: 0.35em !important;

}

.site-footer .footer__get-in-touch {

  margin: 0 0 0 0.75rem;

}

.site-footer .footer-newsletter__actions .footer__button {

  margin-left: auto;

  margin-right: auto;

}

.site-info.site-footer__info.site-info--en-version {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: center;

  gap: 0.75rem 1.25rem;

  text-align: center;

}

.site-info .footer__get-in-touch {

  margin-bottom: 0 !important;

}

.site-footer a.button:hover,
.site-footer .footer__button:hover {

  background-color: #00d700 !important;

  background-image: none !important;

  border-color: #00d700 !important;

  color: #fff !important;

}

.site-footer .footer__button:hover .eco-sprite,
.site-footer .footer__button:hover svg {

  color: #fff !important;

}

@media (max-width: 639px) {

  .site-footer .footer__get-in-touch {

    margin: 0.5rem 0 0;

  }

  .site-info.site-footer__info.site-info--en-version {

    flex-direction: column;

    gap: 0.65rem;

  }

}

/* Hat-static lives in hat-static.css (appended last by unstick_portal_hat).
   Do not duplicate here: #bbc-header > * / HeaderStyled / stickyPrimaryNav
   wrecks the BBC grid and draws a nested vertical scrollbar in the hat. */
/* === article === */
/* === localized fonts === */
@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:400;

  font-display:swap;

  src:url('../index/Libre_Franklin-400-normal-0.woff2') format('woff2');

  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:400;

  font-display:swap;

  src:url('../index/Libre_Franklin-400-normal-1.woff2') format('woff2');

  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:400;

  font-display:swap;

  src:url('../index/Libre_Franklin-400-normal-2.woff2') format('woff2');

  unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:400;

  font-display:swap;

  src:url('../index/Libre_Franklin-400-normal-3.woff2') format('woff2');

  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:400;

  font-display:swap;

  src:url('../index/Libre_Franklin-400-normal-4.woff2') format('woff2');

  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:500;

  font-display:swap;

  src:url('../index/Libre_Franklin-500-normal-5.woff2') format('woff2');

  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:500;

  font-display:swap;

  src:url('../index/Libre_Franklin-500-normal-6.woff2') format('woff2');

  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:500;

  font-display:swap;

  src:url('../index/Libre_Franklin-500-normal-7.woff2') format('woff2');

  unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:500;

  font-display:swap;

  src:url('../index/Libre_Franklin-500-normal-8.woff2') format('woff2');

  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:500;

  font-display:swap;

  src:url('../index/Libre_Franklin-500-normal-9.woff2') format('woff2');

  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:600;

  font-display:swap;

  src:url('../index/Libre_Franklin-600-normal-10.woff2') format('woff2');

  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:600;

  font-display:swap;

  src:url('../index/Libre_Franklin-600-normal-11.woff2') format('woff2');

  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:600;

  font-display:swap;

  src:url('../index/Libre_Franklin-600-normal-12.woff2') format('woff2');

  unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:600;

  font-display:swap;

  src:url('../index/Libre_Franklin-600-normal-13.woff2') format('woff2');

  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:600;

  font-display:swap;

  src:url('../index/Libre_Franklin-600-normal-14.woff2') format('woff2');

  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:700;

  font-display:swap;

  src:url('../index/Libre_Franklin-700-normal-15.woff2') format('woff2');

  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:700;

  font-display:swap;

  src:url('../index/Libre_Franklin-700-normal-16.woff2') format('woff2');

  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:700;

  font-display:swap;

  src:url('../index/Libre_Franklin-700-normal-17.woff2') format('woff2');

  unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:700;

  font-display:swap;

  src:url('../index/Libre_Franklin-700-normal-18.woff2') format('woff2');

  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:700;

  font-display:swap;

  src:url('../index/Libre_Franklin-700-normal-19.woff2') format('woff2');

  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:800;

  font-display:swap;

  src:url('../index/Libre_Franklin-800-normal-20.woff2') format('woff2');

  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:800;

  font-display:swap;

  src:url('../index/Libre_Franklin-800-normal-21.woff2') format('woff2');

  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:800;

  font-display:swap;

  src:url('../index/Libre_Franklin-800-normal-22.woff2') format('woff2');

  unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:800;

  font-display:swap;

  src:url('../index/Libre_Franklin-800-normal-23.woff2') format('woff2');

  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:800;

  font-display:swap;

  src:url('../index/Libre_Franklin-800-normal-24.woff2') format('woff2');

  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:900;

  font-display:swap;

  src:url('../index/Libre_Franklin-900-normal-25.woff2') format('woff2');

  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:900;

  font-display:swap;

  src:url('../index/Libre_Franklin-900-normal-26.woff2') format('woff2');

  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:900;

  font-display:swap;

  src:url('../index/Libre_Franklin-900-normal-27.woff2') format('woff2');

  unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:900;

  font-display:swap;

  src:url('../index/Libre_Franklin-900-normal-28.woff2') format('woff2');

  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family:'Libre Franklin';

  font-style:normal;

  font-weight:900;

  font-display:swap;

  src:url('../index/Libre_Franklin-900-normal-29.woff2') format('woff2');

  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

/* === moved from index.html inline <style> (single source of truth) === */
* {

  box-sizing:border-box;

  margin:0;

  padding:0
}

body {

  font-family:'Libre Franklin',sans-serif;

  color:#1a1a1a;

  background:#fff;

  line-height:1.6;

  font-size:16px
}

  .ln-menu span {

  width:20px;

  height:2px;

  background:#1a1a1a;

  display:block
}

  article {

  max-width:720px;

  margin:28px auto;

  padding:0 16px
}

h1.headline {

  font-weight:900;

  font-size:34px;

  line-height:1.18;

  letter-spacing:-0.5px;

  color:#1a1a1a;

  margin-bottom:16px
}

.subheadline {

  font-size:18px;

  line-height:1.55;

  color:#555;

  margin-bottom:20px;

  font-weight:400
}

.live-badge {

  display:inline-flex;

  align-items:center;

  gap:6px;

  background:#d32f2f;

  color:#fff;

  font-size:11px;

  font-weight:700;

  padding:4px 10px;

  border-radius:3px;

  letter-spacing:.5px;

  margin-bottom:12px
}

.live-badge::before {

  content:'';

  width:7px;

  height:7px;

  background:#fff;

  border-radius:50%;

  animation:pulse 1.2s ease-in-out infinite
}

@keyframes pulse {

  0%,100% {

    opacity:1
  }

  50% {

    opacity:.4
  }

}

.author-block {

  margin-bottom:24px;

  padding-bottom:16px;

  border-bottom:1px solid #e0e0e0
}

.author-names {

  font-size:14px
}

.author-names b {

  font-weight:700
}

.author-location {

  font-size:13px;

  color:#999;

  margin-top:2px
}

.article-img {

  aspect-ratio:auto;

  display:block;

  width:100%;

  max-width:100%;

  height:auto;

  margin:24px 0 6px;

  border-radius:0
}

@media (max-width: 720px) {

  .article-img {

    width:100vw;

    max-width:100vw;

    margin:24px calc((100% - 100vw)/2) 6px
  }

}

.photo-caption {

  font-size:13px;

  color:#888;

  margin-bottom:24px;

  font-style:italic;

  padding-bottom:8px;

  border-bottom:1px solid #f0f0f0
}

.photo-slot {

  background:#f0f2f5;

  border:2px dashed #ccc;

  padding:60px 20px;

  text-align:center;

  color:#888;

  font-size:14px;

  margin:24px 0 6px;

  border-radius:4px;

  line-height:1.5
}

article p {

  font-size:17px;

  line-height:1.75;

  margin-bottom:18px
}

article h2 {

  font-weight:800;

  font-size:24px;

  margin:34px 0 14px;

  color:#1a1a1a
}

.quote-block {

  border-left:4px solid #003d6b;

  padding:18px 22px;

  margin:24px 0;

  background:#fef8f4
}

.quote-block p {

  font-style:italic;

  font-size:18px;

  line-height:1.7;

  margin-bottom:10px
}

.quote-block p:last-child {

  margin-bottom:0
}

.dialogue {

  margin:22px 0
}

.dialogue .q {

  font-size:16px;

  line-height:1.65;

  margin-bottom:14px
}

.dialogue .q b:first-child {

  font-weight:900;

  color:#003d6b
}

.dialogue .a {

  font-size:17px;

  line-height:1.7;

  margin-bottom:14px
}

.dialogue .a b:first-child {

  font-weight:900;

  color:#1a1a1a
}

.reactions-block {

  margin:30px 0
}

.reaction-card {

  background:#fafafa;

  border:1px solid #e0e0e0;

  border-radius:6px;

  padding:16px 18px;

  margin-bottom:14px
}

.reaction-card .rc-source {

  font-size:12px;

  font-weight:700;

  color:#003d6b;

  text-transform:uppercase;

  letter-spacing:.5px;

  margin-bottom:6px
}

.reaction-card .rc-text {

  font-size:15px;

  line-height:1.6
}

.reaction-card .rc-author {

  font-size:13px;

  color:#888;

  margin-top:6px
}

.qa-block {

  margin:24px 0
}

.qa-block .q {

  font-weight:700;

  font-size:16px;

  color:#003d6b;

  margin-top:20px;

  margin-bottom:8px
}

.qa-block .a {

  font-size:17px;

  line-height:1.7;

  margin-bottom:8px;

  padding-left:14px;

  border-left:2px solid #e0e0e0
}

.qa-block .narration {

  font-style:italic;

  font-size:16px;

  color:#555;

  margin:12px 0
}

a.platform-link,a.platform-link:link,a.platform-link:visited {

  color:#003d6b!important;

  text-decoration:underline;

  font-weight:600
}

.viewer-counter {

  background:#1a1a1a;

  color:#fff;

  padding:14px 20px;

  margin:28px 0;

  border-radius:4px;

  display:flex;

  align-items:center;

  gap:14px;

  font-size:14px
}

.viewer-dot {

  width:10px;

  height:10px;

  background:#00e676;

  border-radius:50%;

  flex-shrink:0;

  animation:pulse2 1.5s ease-in-out infinite
}

@keyframes pulse2 {

  0%,100% {

    opacity:1;

    transform:scale(1)
  }

  50% {

    opacity:.85;

    transform:scale(1.15)
  }

}

.viewer-counter .count-num {

  font-weight:800;

  font-size:18px;

  color:#00e676;

  min-width:30px;

  text-align:center;

  transition:opacity .3s
}

.income-cta-block {

  background:#fef8f4;

  border-left:4px solid #003d6b;

  padding:24px 26px;

  margin:30px 0
}

.income-cta-block h3 {

  margin:0 0 12px;

  font-size:20px;

  font-weight:700;

  color:#003d6b
}

.income-cta-block p {

  font-size:16px
}

.income-scroll {

  margin:18px 0
}

table.income {

  width:100%;

  border-collapse:collapse;

  font-size:14px
}

table.income thead th {

  background:#003d6b;

  color:#fff;

  text-align:left;

  padding:12px 14px;

  font-weight:600;

  font-size:13px
}

table.income tbody td {

  padding:14px;

  border-bottom:1px solid #e0e0e0;

  background:#fff
}

table.income tbody tr:nth-child(odd) td {

  background:#fafafa
}

table.income .capital {

  font-weight:700
}

table.income .income-base {

  color:#2e7d32;

  font-weight:600;

  text-align:center
}

table.income .income-growth {

  color:#003d6b;

  font-weight:700;

  text-align:center
}

table.income .capital,table.income .income-base,table.income .income-growth {

  white-space:nowrap
}

@media(max-width:768px) {

  table.income {

    table-layout:fixed;

    width:100%
  }

  table.income .capital,table.income .income-base,table.income .income-growth {

    white-space:normal
  }

  table.income thead th {

    font-size:11px;

    padding:7px 6px;

    line-height:1.3
  }

  table.income tbody td {

    font-size:13px;

    padding:9px 6px;

    line-height:1.3
  }

}

@media(max-width:480px) {

  table.income thead th {

    font-size:10px;

    padding:6px 5px
  }

  table.income tbody td {

    font-size:12px;

    padding:8px 5px
  }

}

.calculator-block {

  background:#fff;

  border:2px solid #003d6b;

  border-radius:6px;

  padding:24px;

  margin:24px 0
}

.calculator-block h4 {

  font-size:18px;

  font-weight:700;

  margin:0 0 18px;

  color:#003d6b;

  text-transform:uppercase;

  letter-spacing:.5px
}

.calc-row {

  display:flex;

  justify-content:space-between;

  align-items:baseline;

  margin-bottom:12px
}

.calc-label {

  font-size:14px;

  color:#666
}

.calc-amount {

  font-size:26px;

  font-weight:700
}

#calcSlider {

  width:100%;

  height:6px;

  -webkit-appearance:none;

  appearance:none;

  background:#ddd;

  border-radius:3px;

  outline:none;

  margin:8px 0 6px
}

#calcSlider::-webkit-slider-thumb {

  -webkit-appearance:none;

  width:22px;

  height:22px;

  background:#003d6b;

  border-radius:50%;

  cursor:pointer;

  border:2px solid #fff;

  box-shadow:0 1px 3px rgba(0,0,0,.3)
}

#calcSlider::-moz-range-thumb {

  width:22px;

  height:22px;

  background:#003d6b;

  border-radius:50%;

  cursor:pointer;

  border:2px solid #fff
}

.calc-range-labels {

  display:flex;

  justify-content:space-between;

  font-size:12px;

  color:#999;

  margin-bottom:18px
}

.calc-result {

  background:#fef8f4;

  border-left:4px solid #003d6b;

  padding:14px 16px;

  margin-bottom:18px
}

.calc-result-label {

  font-size:13px;

  color:#666;

  margin-bottom:4px
}

.calc-result-value {

  font-size:22px;

  font-weight:800;

  color:#003d6b;

  line-height:1.2;

  margin-bottom:8px;

  white-space:nowrap
}

.calc-disclaimer {

  font-size:11px;

  color:#999;

  font-style:italic
}

.registration-block {

  background:#fef8f4;

  border:1px solid #003d6b;

  padding:26px;

  margin:30px 0;

  border-radius:4px
}

.registration-block h2 {

  margin-top:0;

  color:#003d6b
}

.reg-step {

  display:flex;

  gap:14px;

  align-items:flex-start;

  margin-bottom:14px
}

.reg-step-num {

  background:#003d6b;

  color:#fff;

  width:28px;

  height:28px;

  border-radius:50%;

  display:flex;

  align-items:center;

  justify-content:center;

  font-weight:700;

  font-size:14px;

  flex-shrink:0
}

.reg-step-text {

  font-size:15px;

  line-height:1.5
}

.deadline-line {

  font-size:16px;

  margin:18px 0
}

.deadline-line b {

  font-weight:700;

  color:#003d6b
}

.seats-line {

  font-size:15px;

  margin:14px 0;

  color:#555
}

.seats-line b {

  font-weight:800;

  color:#003d6b
}

.cta-button {

  display:block;

  background:#003d6b;

  color:#fff;

  text-align:center;

  padding:20px;

  text-decoration:none;

  font-size:17px;

  font-weight:800;

  letter-spacing:1px;

  margin:28px 0;

  border-radius:4px;

  text-transform:uppercase;

  transition:background .2s
}

.cta-button:hover {

  background:#002a52
}

.cta-button.cta-calc {

  margin:0;

  padding:16px;

  font-size:15px
}

.fb-section {

  background:#f0f2f5;

  padding:32px 0 60px;

  margin-top:30px;

  border-top:1px solid #e0e0e0
}

.fb-header {

  max-width:680px;

  margin:0 auto 20px;

  padding:0 20px;

  font-size:17px;

  font-weight:700;

  color:#050505
}

.fb-comments-container {

  max-width:680px;

  margin:0 auto;

  padding:0 20px
}

.fb-comment {

  display:flex;

  gap:8px;

  margin-bottom:16px
}

.fb-comment.fb-reply {

  margin-left:44px
}

.fb-avatar {

  width:36px;

  height:36px;

  border-radius:50%;

  color:#fff;

  font-size:13px;

  font-weight:600;

  display:flex;

  align-items:center;

  justify-content:center;

  flex-shrink:0
}

.av-blue {

  background:#1877F2
}

.av-pink {

  background:#ec407a
}

.av-orange {

  background:#fb8c00
}

.av-teal {

  background:#00897b
}

.av-red {

  background:#e53935
}

.av-grey {

  background:#757575
}

.av-green {

  background:#43a047
}

.av-purple {

  background:#8e24aa
}

.av-amber {

  background:#c89c00
}

.av-brown {

  background:#6d4c41
}

.av-indigo {

  background:#3949ab
}

.fb-comment-body {

  flex:1;

  min-width:0
}

.fb-comment-bubble {

  background:#fff;

  border-radius:18px;

  padding:8px 12px
}

.fb-comment-author {

  font-size:13px;

  font-weight:600;

  color:#050505;

  margin-bottom:2px
}

.fb-comment-text {

  font-size:14px;

  color:#050505;

  line-height:1.4
}

.fb-screenshot {

  margin-top:8px
}

.fb-screenshot img {

  max-width:240px!important;

  width:100%!important;

  height:auto;

  border-radius:8px;

  border:1px solid #ddd;

  display:block;

  margin:0!important
}

.fb-comment-meta {

  display:flex;

  gap:14px;

  padding:5px 12px 0;

  font-size:12px;

  color:#65676B;

  align-items:center
}

.fb-comment-meta .meta-action {

  font-weight:600;

  cursor:pointer
}

.fb-comment-meta .meta-likes {

  margin-left:auto;

  background:#fff;

  border:1px solid #ced0d4;

  border-radius:12px;

  padding:1px 8px;

  font-size:11px
}

footer.site-footer {

  background:#1a1a1a;

  padding:30px 20px;

  font-size:12px;

  color:#aaa;

  text-align:center
}

  @media(max-width:768px) {

  h1.headline {

    font-size:28px
  }

  .subheadline {

    font-size:16px
  }

  article p,.dialogue .a {

    font-size:18px
  }

  .income-cta-block {

    padding:20px 16px
  }

  .calculator-block {

    padding:18px 14px
  }

}

@media(max-width:480px) {

  h1.headline {

    font-size:24px
  }

  .subheadline {

    font-size:15px
  }

  article p {

    font-size:17px
  }

  .calc-amount {

    font-size:22px
  }

  .calc-result-value {

    font-size:19px
  }

}

.sticky-cta {

  position:fixed;

  bottom:calc(14px + env(safe-area-inset-bottom));

  left:50%;

  transform:translateX(-50%);

  width:calc(100% - 32px);

  max-width:420px;

  background:#003d6b;

  color:#fff;

  text-align:center;

  padding:16px 20px;

  text-decoration:none;

  font-size:16px;

  font-weight:800;

  letter-spacing:.6px;

  text-transform:uppercase;

  z-index:9999;

  box-shadow:0 4px 18px rgba(0,0,0,.28);

  border-radius:10px;

  transition:background .2s
}

body {

  padding-bottom:90px
}

.sticky-cta:hover {

  background:#002a52
}

  .main-header {

  border-bottom: 1px solid #e0e0e0;

  padding: 18px 0;

}

.main-header-inner {

  max-width: 1200px;

  margin: 0 auto;

  padding: 0 20px;

  display: grid;

  grid-template-columns: auto 1fr auto;

  align-items: center;

  gap: 20px;

}

.menu-icon {

  font-size: 18px;

  font-weight: 700;

  color: #1a1a1a;

  letter-spacing: 1px;

  cursor: pointer;

  text-decoration: none;

}

.logo {

  text-align: center;

}

.logo img {

  height: 52px;

  width: auto;

  display: inline-block;

}

.header-actions {

  display: flex;

  gap: 12px;

  align-items: center;

}

.btn-login {

  border: 1px solid #1a1a1a;

  background: #fff;

  padding: 8px 18px;

  font-size: 12px;

  font-weight: 600;

  cursor: pointer;

  letter-spacing: 0.5px;

  text-decoration: none;

  color: #1a1a1a;

}

.btn-subscribe {

  background: #ffd400;

  border: 1px solid #ffd400;

  padding: 8px 18px;

  font-size: 12px;

  font-weight: 700;

  cursor: pointer;

  letter-spacing: 0.5px;

  text-decoration: none;

  color: #1a1a1a;

}

.currency-strip {

  border-bottom: 1px solid #e0e0e0;

  padding: 8px 0;

  font-size: 11px;

}

.currency-strip-inner {

  max-width: 1200px;

  margin: 0 auto;

  padding: 0 20px;

  display: flex;

  gap: 20px;

  align-items: center;

  flex-wrap: wrap;

}

.currency-strip-inner a {

  color: #444;

  text-decoration: none;

}

.currency-strip-inner span {

  color: #444;

}

.currency-strip-inner b {

  font-weight: 700;

  color: #1a1a1a;

}

.currency-strip-inner .right {

  margin-left: auto;

  color: #888;

  font-size: 10px;

  letter-spacing: 0.3px;

}

@media(max-width:768px) {

  .main-header {

    padding:10px 0 4px
  }

  .main-header-inner {

    grid-template-columns:auto 1fr auto;

    gap:10px
  }

  .header-actions .btn-login {

    display:none
  }

  .menu-icon {

    font-size:24px
  }

  .main-header-inner {

    align-items:center
  }

  .logo img {

    height:36px;

    margin-top:8px
  }

  .logo img {

    height:42px
  }

  .header-actions .btn-login {

    display:none
  }

  .currency-strip {

    padding:6px 0
  }

  .currency-strip-inner {

    flex-wrap:nowrap;

    overflow-x:auto;

    gap:14px;

    -webkit-overflow-scrolling:touch
  }

  .currency-strip-inner::-webkit-scrollbar {

    display:none
  }

  .currency-strip-inner span {

    white-space:nowrap
  }

  .currency-strip-inner .right {

    display:none
  }

}

@media(max-width:480px) {

  .logo img {

    height:36px
  }

  .btn-subscribe {

    font-size:8px;

    padding:4px 8px;

    line-height:1.2
  }

}

footer {

  background: #f4f4f4;

  padding: 30px 20px;

  margin-top: 60px;

  border-top: 1px solid #e0e0e0;

  font-size: 12px;

  color: #888;

  text-align: center;

}

  /* ==== GROWTH CHART BLOCK ==== */
.growth-block {

  background: #ffffff;

  border: 1px solid #dde4ed;

  border-radius: 12px;

  padding: 24px 14px 16px;

  margin: 26px 0;

  box-shadow: 0 2px 10px rgba(0,61,107,0.06);

}

.growth-header {

  display: flex;

  justify-content: space-between;

  align-items: flex-start;

  margin-bottom: 18px;

  gap: 12px;

}

.growth-block h4 {

  font-size: 18px;

  font-weight: 800;

  color: #003d6b;

  margin-bottom: 2px;

  letter-spacing: -0.2px;

}

.growth-intro {

  font-size: 12px;

  color: #7a8598;

  line-height: 1.35;

}

.growth-ticker {

  display: flex;

  flex-direction: column;

  align-items: flex-end;

  gap: 3px;

  flex-shrink: 0;

}

.growth-ticker-symbol {

  font-size: 12px;

  font-weight: 800;

  color: #003d6b;

  letter-spacing: 1px;

  font-family: 'Courier New', monospace;

  background: #eef4fb;

  padding: 2px 7px;

  border-radius: 3px;

}

.growth-ticker-live {

  font-size: 10px;

  font-weight: 700;

  color: #16a34a;

  letter-spacing: 0.6px;

  display: flex;

  align-items: center;

  gap: 5px;

}

.growth-ticker-dot {

  width: 6px;

  height: 6px;

  background: #16a34a;

  border-radius: 50%;

  animation: livePulse 1.4s infinite;

}

@keyframes livePulse {

  0%, 100% {

    opacity: 1;

  }

  50% {

    opacity: 0.3;

  }

}

.growth-chart-wrap {

  background: linear-gradient(180deg, #fbfcfe 0%, #f5f8fc 100%);

  border-radius: 8px;

  padding: 22px 12px 4px;

  margin-bottom: 12px;

  border: 1px solid #e8eef5;

}

.growth-chart-header {

  display: flex;

  justify-content: space-between;

  align-items: flex-end;

  margin-bottom: 14px;

  padding: 0 4px;

}

.growth-chart-title {

  display: flex;

  flex-direction: column;

  gap: 1px;

}

.growth-chart-total {

  font-size: 26px;

  font-weight: 800;

  color: #003d6b;

  line-height: 1.1;

  letter-spacing: -0.5px;

  font-family: -apple-system, 'SF Pro Display', sans-serif;

}

.growth-chart-change {

  font-size: 14px;

  font-weight: 700;

  color: #16a34a;

}

.growth-chart-period {

  font-size: 10.5px;

  color: #8a95a5;

  text-transform: uppercase;

  letter-spacing: 0.6px;

  font-weight: 600;

}

.growth-chart {

  width: 100%;

  height: auto;

  display: block;

}

#growthLine {

  transition: none;

  filter: drop-shadow(0 1px 2px rgba(0,61,107,0.2));

}

#growthArea {

  transition: none;

}

.growth-point {

  fill: #ffffff;

  stroke: #003d6b;

  stroke-width: 3;

  transition: r 0.15s;

}

.growth-point-label {

  font-size: 20px;

  font-weight: 800;

  fill: #ffffff;

  font-family: -apple-system, sans-serif;

}

.growth-point-label-final {

  font-size: 22px;

  font-weight: 900;

  fill: #ffffff;

}

.growth-point-bg {

  fill: #002a52;

  opacity: 0.95;

}

.growth-point-bg-final {

  fill: #003d6b;

  opacity: 1;

}

.growth-slider-wrap {

  padding: 10px 14px;

  background: #f7f9fc;

  border-radius: 8px;

  margin-bottom: 10px;

  border: 1px solid #e8eef5;

}

.growth-row {

  display: flex;

  justify-content: space-between;

  align-items: baseline;

  margin-bottom: 6px;

}

.growth-label {

  font-size: 13px;

  color: #6a7180;

  font-weight: 600;

}

.growth-amount {

  font-size: 20px;

  font-weight: 800;

  color: #003d6b;

  letter-spacing: -0.3px;

}

.growth-range-labels {

  display: flex;

  justify-content: space-between;

  font-size: 11px;

  color: #8a95a5;

  margin-top: 2px;

  font-weight: 600;

}

#growthSlider {

  width: 100%;

  height: 5px;

  -webkit-appearance: none;

  appearance: none;

  background: #dbe4f0;

  border-radius: 3px;

  outline: none;

  margin: 3px 0 3px;

}

#growthSlider::-webkit-slider-thumb {

  -webkit-appearance: none;

  appearance: none;

  width: 22px;

  height: 22px;

  background: #003d6b;

  border-radius: 50%;

  cursor: pointer;

  border: 2.5px solid #fff;

  box-shadow: 0 2px 6px rgba(0,61,107,0.35);

}

#growthSlider::-moz-range-thumb {

  width: 22px;

  height: 22px;

  background: #003d6b;

  border-radius: 50%;

  cursor: pointer;

  border: 2.5px solid #fff;

  box-shadow: 0 2px 6px rgba(0,61,107,0.35);

}

@media (max-width: 640px) {

  .growth-block {

    padding: 18px 12px 14px;

    margin: 20px 0;

  }

  .growth-block h4 {

    font-size: 16px;

  }

  .growth-chart-total {

    font-size: 22px;

  }

  .growth-chart-change {

    font-size: 13px;

  }

  .growth-amount {

    font-size: 18px;

  }

  .growth-header {

    flex-direction: row;

    align-items: flex-start;

    gap: 10px;

    margin-bottom: 14px;

  }

  .growth-ticker {

    align-items: flex-end;

  }

  .growth-chart-wrap {

    padding: 18px 8px 4px;

    margin-bottom: 10px;

  }

  .growth-slider-wrap {

    padding: 8px 12px;

    margin-bottom: 6px;

  }

  .growth-point-label {

    font-size: 20px;

  }

  .growth-point-label-final {

    font-size: 22px;

  }

}

  /* ==== STICKY CTA PULSE (blue) ==== */
.sticky-cta.pulse {

  animation: stickyPulse 1.2s ease-out;

}

@keyframes stickyPulse {

  0% {

    box-shadow: 0 4px 18px rgba(0,0,0,0.28), 0 0 0 0 rgba(0,61,107,0.7);

    transform: translateX(-50%) scale(1);

  }

  50% {

    box-shadow: 0 4px 18px rgba(0,0,0,0.28), 0 0 0 14px rgba(0,61,107,0);

    transform: translateX(-50%) scale(1.025);

  }

  100% {

    box-shadow: 0 4px 18px rgba(0,0,0,0.28), 0 0 0 0 rgba(0,61,107,0);

    transform: translateX(-50%) scale(1);

  }

}

@media (prefers-reduced-motion: reduce) {

  .sticky-cta.pulse {

    animation: none;

  }

}

/* land-style-zones:end */
/* === круглые аватары на любой ширине ======================================
   На 375px flex-ряд сжимал .author-avatar до 36×44 — круг превращался в овал
   (landing-visual-qa.md: avatar_oval = дефект). Виновник — отсутствие
   min-width/flex-basis: у контейнера не хватало места, и он забирал его у
   аватара, а не у текста.
   Обе оси и flex-basis пиним явно; текст рядом ужимается сам.             */
.author-avatar,
.fb-avatar,
.person-card-photo,
.fb-input-avatar {

  flex: 0 0 auto !important;

  flex-shrink: 0 !important;

  aspect-ratio: 1 !important;

  border-radius: 50% !important;

  object-fit: cover;

}

.author-avatar {

  width: 44px !important;

  height: 44px !important;

  min-width: 44px !important;

}

.fb-avatar,
.fb-input-avatar {

  width: 40px !important;

  height: 40px !important;

  min-width: 40px !important;

}

.person-card-photo {

  width: 56px !important;

  height: 56px !important;

  min-width: 56px !important;

}

@media (max-width: 479px) {

  .author-avatar {

    width: 40px !important;

    height: 40px !important;

    min-width: 40px !important;

  }

  .fb-avatar, .fb-input-avatar {

    width: 36px !important;

    height: 36px !important;

    min-width: 36px !important;

  }

  .person-card-photo {

    width: 48px !important;

    height: 48px !important;

    min-width: 48px !important;

  }

}

/* === blocks lifted VERBATIM from reference 170 (landing-copy-block-verbatim.md) === */
.reactions-block h2 {

  margin-top: 28px
}

.reaction-card {

  background:#fafafa;

  border:1px solid #e0e0e0;

  border-radius:6px;

  padding:16px 18px;

  margin-bottom:14px
}

.reaction-card .rc-source {

  font-size:12px;

  font-weight:700;

  color:#003d6b;

  text-transform:uppercase;

  letter-spacing:.5px;

  margin-bottom:6px
}

.reaction-card .rc-text {

  font-size:15px;

  line-height:1.6
}

.reaction-card .rc-author {

  font-size:13px;

  color:#888;

  margin-top:6px
}

.calculator-block {

  background:#fff;

  border:2px solid #003d6b;

  border-radius:6px;

  padding:24px;

  margin:24px 0
}

.calculator-block h4 {

  font-size:18px;

  font-weight:700;

  margin:0 0 18px;

  color:#003d6b;

  text-transform:uppercase;

  letter-spacing:.5px
}

.calc-row {

  display:flex;

  justify-content:space-between;

  align-items:baseline;

  margin-bottom:12px
}

.calc-label {

  font-size:14px;

  color:#666
}

.calc-amount {

  font-size:26px;

  font-weight:700
}

#calcSlider {

  width:100%;

  height:6px;

  -webkit-appearance:none;

  appearance:none;

  background:#ddd;

  border-radius:3px;

  outline:none;

  margin:8px 0 6px
}

#calcSlider::-webkit-slider-thumb {

  -webkit-appearance:none;

  width:22px;

  height:22px;

  background:#003d6b;

  border-radius:50%;

  cursor:pointer;

  border:2px solid #fff;

  box-shadow:0 1px 3px rgba(0,0,0,.3)
}

#calcSlider::-moz-range-thumb {

  width:22px;

  height:22px;

  background:#003d6b;

  border-radius:50%;

  cursor:pointer;

  border:2px solid #fff
}

.calc-range-labels {

  display:flex;

  justify-content:space-between;

  font-size:12px;

  color:#999;

  margin-bottom:18px
}

.calc-result {

  background:#fef8f4;

  border-left:4px solid #003d6b;

  padding:14px 16px;

  margin-bottom:18px
}

.calc-result-label {

  font-size:13px;

  color:#666;

  margin-bottom:4px
}

.calc-result-value {

  font-size:22px;

  font-weight:800;

  color:#003d6b;

  line-height:1.2;

  margin-bottom:8px;

  white-space:nowrap
}

.calc-disclaimer {

  font-size:11px;

  color:#999;

  font-style:italic
}

.cta-button.cta-calc {

  margin:0;

  padding:16px;

  font-size:15px
}

@media (max-width: 768px) {

  .calculator-block {

    padding:18px 14px
  }

  .calc-amount {

    font-size:22px
  }

  .calc-result-value {

    font-size:19px
  }

}

/* Hat stays in the page flow. Never position:fixed/sticky on the portal hat/nav —
   a hanging bar distracts from the article. Bottom .sticky-cta is allowed.

   Do NOT set position on `#bbc-header > *` or every HeaderStyled child — that
   wrecks the BBC grid (logo/nav vanish, leftover blue sliver).
   Do NOT leave overflow-x:auto without overflow-y:hidden: CSS then computes
   overflow-y to auto and draws a nested vertical scrollbar in the hat. */
header,
header.main-header,
#bbc-header,
.sapo-bsu,
.bsu-container,
.ec-hat,
.h,
#nav-wm-container,
.site-header,
#masthead,
[data-mol-fe-xpmodule-navigation],
[class*="mastHead"],
[class*="desktopNavBarContainer"],
[class*="mobileNavBarContainer"],
[class*="HeaderNav"] {

  position: relative !important;

  top: auto !important;

}

/* Donor sticky-hat clone must not enter document flow (nested scrollbar + ghost height) */
#sticky-nav,
[class*="stickyPrimaryNav"],
[class*="sticky-nav"] {

  display: none !important;

  height: 0 !important;

  overflow: hidden !important;

  pointer-events: none !important;

}

/* Horizontal channel/nav strip only — never a vertical bar inside the hat.
   Outer wrap stays overflow hidden (or the page grows a 320 scrollbar).
   Inner nowrap list is the only overflow-x:auto. */
#bbc-header .hZiVmC,
#bbc-header [class*="HeaderNav"],
#bbc-header .kidpOc {

  overflow-x: auto !important;

  overflow-y: hidden !important;

  max-width: 100% !important;

  min-width: 0 !important;

}

[data-mol-fe-xpmodule-navigation] [class*="subListWrapper"] {

  overflow-x: hidden !important;

  overflow-y: hidden !important;

  max-width: 100% !important;

  min-width: 0 !important;

}

[data-mol-fe-xpmodule-navigation] [class*="channeList"],
[data-mol-fe-xpmodule-navigation] [class*="carouselViewport"] {

  overflow-x: auto !important;

  overflow-y: hidden !important;

  max-width: 100% !important;

  min-width: 0 !important;

}

#bbc-header .hZiVmC,
[data-mol-fe-xpmodule-navigation] {

  max-width: 100% !important;

}

/* === chrome typography isolation: hat/footer must not inherit the article ===
   landing-style-zones.md locks font-family per zone but left line-height open.
   Every land template sets `body { line-height: 1.6 }` for the article, and that
   value inherits straight into the portal chrome. Packs are cut as resting-state
   snapshots of the donor's own markup, so a stray `<br>` / text node inside
   <header> (O Globo ships one) gets its anonymous line box inflated by the
   article's line-height — the logo row slides down and overflows the hat.

   Measured on O Globo: content row +8px lower than the library reference,
   overflowing the 97px hat by 29px instead of 21px. Nothing in the pack changed;
   the land's body typography leaked in.

   `normal` is not a taste call: the library preview.html has no body line-height,
   so this is exactly the value the frozen reference/*.png were rendered with.
   Chrome rules that DO set their own line-height keep winning on specificity. */
header,
header.main-header,
#header,
#bbc-header,
#gcom-bar-container,
.header_exposed_menu,
.sapo-bsu,
.bsu-container,
.ec-hat,
.h,
#nav-wm-container,
.site-header,
#masthead,
[data-mol-fe-xpmodule-navigation],
[class*="mastHead"],
footer#pages-footer,
footer.site-footer,
footer.land-footer-slim {

  line-height: normal;

}

/* === stray <br> inside the portal hat is a donor artefact, not content ===
   Packs are resting-state snapshots of the donor's markup, so a bare `<br>`
   left as the FIRST child of <header> comes along for the ride (O Globo ships
   exactly that, right before .header__content).

   It creates a line box at the top of the hat, so `.header__content` — which is
   `height:100%` + `align-items:center` — starts BELOW the hat's top edge and
   centres itself against the shifted area instead of the hat. Measured on
   O Globo @1280: the logo row sat 24px below the hat's centre and overflowed
   the 97px bar; after this rule, 5px (the logo glyph box).

   A <br> directly inside a portal header is never meaningful content, so this
   is safe for every pack: it restores the hat to the library reference rather
   than restyling it. Reported as "шапка сломана / контент не посередине". */
header > br,
#header > br,
#bbc-header > br,
#masthead > br,
.site-header > br,
.main-header > br {

  display: none;

}

/* land-dead-nav: chrome + related cards look like links, do not navigate */
a:not([href]),
a[href=""],
a[data-testid="internal-link"] {

  cursor: pointer !important;

}

/* adaptive-only: polskie etykiety ("Lubię to" / "Odpowiedz") są dłuższe niż
   hiszpańskie w szablonie, więc wiersz meta wypychał 6px poziomego scrolla @320.
   Zmiana wyłącznie w @media (landing-no-restyle.md), desktop bez zmian. */
@media (max-width: 360px) {

  .fb-comment-meta {

    gap: 8px;

    font-size: 11px;

    flex-wrap: wrap;

  }

  .fb-comment-meta .meta-likes {

    font-size: 10px;

    padding: 1px 6px;

  }

}

/* chrome donor leak: gazeta.pl ma szapkę position:fixed i dlatego trzyma
   body{padding-top:100px}. W pakiecie szapka wraca do przepływu strony
   (landing-no-sticky-hat.md), więc ten padding zostawia 100px pustki nad
   artykułem. Zerowanie = przywrócenie referencji pakietu, nie restyling. */
body.gazetapl-portal-chrome {

  padding-top: 0;

}

/* adaptive-only: polski tekst CTA jest dłuższy niż w szablonie i na 320/375
   rozbijał przycisk na dwie wysokie linie (visual_layout_audit: cta_multiline) */
@media (max-width: 480px) {

  .registration-block .cta-button {

    font-size: 14px;

    letter-spacing: 0;

  }

}

/* landing-chrome-installer.md: wewnętrzny kontener szapki nie może wystawać
   poza kolumnę artykułu (720px) o więcej niż 200px na stronę → max 1120px.
   Tło szapki zostaje pełnej szerokości; skracamy tylko rząd treści,
   a odstępy/ikony dopasowujemy w kolejności priorytetów z reguły. */
@media (min-width: 901px) {

  .navigation-top__box {

    max-width: 1120px;

  }

  .navigation-top__main-nav {

    padding-left: 10px;

  }

  .navigation-top__link {

    padding: 0 7px;

  }

  .navigation-top__main-icons {

    padding: 0 8px;

  }

  .navigation-top__main-icons-link {

    padding: 0 14px;

  }

}

/* land-style-zones:start */
/* Hat = portal stack. Article/comments = source families. No font-size here. */
article,
article p, article li, article h1, article h2, article h3, article h4,
article .headline, article .breadcrumb, article .author-block,
article .author-name, article .author-meta, article .interview-meta,
article .qa, article .qa .a, article .qa .q,
.fb-section, .fb-comment, .fb-comment-text, .fb-comment-author,
.fb-comment-meta, .fb-header, .fb-input-area {

  font-family: 'Libre Franklin', sans-serif !important;

}

/* land-style-zones:end */
/* adaptive-only: tytuł z TZ jest znacznie dłuższy niż w szablonie, więc 32px
   @320 zajmowało cały ekran (landing-tester FONT h1, kap ~22px) */
@media (max-width: 360px) {

  article h1.headline {

    font-size: 22px;

    line-height: 1.25;

  }

}

@media (min-width: 361px) and (max-width: 480px) {

  article h1.headline {

    font-size: 26px;

    line-height: 1.25;

  }

}

/* Bialy pas nad i pod stopka (zglodzone przez wlasciciela, task 31).
   Zrodlo 1: land-fix z instalacji chrome dawal footer{margin-top:60px} —
   miedzy szarą sekcja komentarzy (#f0f2f5) a szara stopka (#f4f4f4)
   swiecil bialy background body.
   Zrodlo 2: body{padding-bottom:90px} (miejsce pod sticky CTA z szablonu 485)
   rysowal bialy pas PONIZEJ stopki. Odstep przenosimy do samej stopki,
   wiec miejsce pod sticky CTA zostaje, ale jest juz w kolorze stopki. */
footer.land-footer-slim {

  margin-top: 0;

  padding-bottom: 122px;

}

body {

  padding-bottom: 0;

}

/* wlasciciel (task 31): tytul z TZ jest bardzo dlugi — na mobilce jeszcze
   mniejszy kegl, zeby fold nie byl zajety samym naglowkiem. Tylko @media. */
@media (max-width: 360px) {

  article h1.headline {

    font-size: 20px;

    line-height: 1.28;

  }

}

@media (min-width: 361px) and (max-width: 480px) {

  article h1.headline {

    font-size: 22px;

    line-height: 1.28;

  }

}

/* adaptive-only: nowy tekst CTA z referencji ("PRZEJDŹ NA OFICJALNĄ STRONĘ →")
   jest dłuższy niż poprzedni i na 320/375 łamał sticky na dwie linie (83px).
   Sticky CTA ma być jednoliniowy (landing-mobile-mandatory.md). */
@media (max-width: 480px) {

  .sticky-cta {

    font-size: 14px;

    letter-spacing: 0;

    padding: 15px 12px;

    white-space: nowrap;

  }

}

@media (max-width: 340px) {

  .sticky-cta {

    font-size: 13px;

    padding: 15px 8px;

  }

}