/* BRF component styles — consumed by every <Name>.jsx in components/ */

/* ── Button ─────────────────────────────────────────── */
.brf-btn{display:inline-flex;align-items:center;gap:8px;border:2px solid transparent;border-radius:var(--radius-none);font-family:var(--font-core);font-weight:var(--fw-bold);font-size:var(--fs-button);line-height:1;letter-spacing:.2px;padding:13px 22px;cursor:pointer;text-decoration:none;transition:background-color var(--dur-base) var(--ease-brand),color var(--dur-base) var(--ease-brand),border-color var(--dur-base) var(--ease-brand)}
.brf-btn:hover{text-decoration:none}
.brf-btn--sm{padding:9px 16px;font-size:var(--fs-small)}
.brf-btn--light{background:var(--brf-white);color:var(--brf-blue);border-color:var(--brf-white)}
.brf-btn--light:hover{background:transparent;color:var(--brf-white);border-color:var(--brf-white)}
.brf-btn--solid{background:var(--brf-blue-link);color:var(--brf-white);border-color:var(--brf-blue-link)}
.brf-btn--solid:hover{background:var(--brf-blue);color:var(--brf-white);border-color:var(--brf-blue)}
.brf-btn--outline{background:transparent;color:var(--brf-blue);border-color:var(--brf-blue)}
.brf-btn--outline:hover{background:var(--brf-blue);color:var(--brf-white)}
.brf-btn__arrow{font-weight:var(--fw-regular)}

/* ── Text link with chevron (»mehr ›«) ───────────────── */
.brf-textlink{display:inline-flex;align-items:center;gap:6px;color:var(--brf-blue);font-weight:var(--fw-bold);font-size:var(--fs-body)}
.brf-textlink:hover{color:var(--brf-grey-900);text-decoration:none}

/* ── SectionHeading ─────────────────────────────────── */
.brf-heading{display:flex;flex-direction:column;gap:24px}
.brf-heading__rule{width:var(--rule-w);height:var(--rule-h);background:var(--rule-accent)}
.brf-heading--short{gap:18px}
.brf-heading--short .brf-heading__rule{width:85px;height:3px}
.brf-heading--short .brf-heading__title{font-size:17px}
.brf-heading__title{font-size:var(--fs-section-label);font-weight:var(--fw-bold);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-heading);margin:0}
.brf-heading--light .brf-heading__title{color:var(--brf-white)}
.brf-heading--light .brf-heading__rule{background:var(--brf-white)}

/* ── TeaserCard (Sektion) ───────────────────────────── */
.brf-teaser{position:relative;display:block;overflow:hidden;color:var(--brf-white);text-decoration:none;aspect-ratio:403/300}
.brf-teaser:hover,.brf-teaser:focus{color:var(--brf-white);text-decoration:none}
.brf-teaser img{width:100%;height:100%;object-fit:cover;display:block}
.brf-teaser__bar{position:absolute;left:0;right:0;bottom:0;height:84px;display:flex;align-items:center;justify-content:center;padding:0 20px;background:transparent;transition:background-color var(--dur-base) var(--ease-brand)}
.brf-teaser__label{font-size:var(--fs-teaser-title);font-weight:var(--fw-teaser-title);line-height:1.2;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.brf-teaser:hover .brf-teaser__bar{background:var(--brf-blue)}
.brf-teaser:hover .brf-teaser__label{text-shadow:none}

/* ── NewsCard ───────────────────────────────────────── */
.brf-news{position:relative;display:block;overflow:hidden;text-decoration:none;color:var(--brf-white);aspect-ratio:403/300}
.brf-news:hover,.brf-news:focus{color:var(--brf-white);text-decoration:none}
.brf-news img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--dur-base) var(--ease-brand)}
.brf-news__scrim{position:absolute;inset:0;background:var(--scrim-image)}
.brf-news__body{position:absolute;left:30px;right:30px;bottom:26px;transition:transform var(--dur-base) var(--ease-brand)}
.brf-news:hover .brf-news__body{transform:translateY(-20px)}
.brf-news__title{font-size:var(--fs-card-title);font-weight:var(--fw-bold);line-height:1.5;color:var(--brf-white);margin:0}
.brf-news__rule{width:130px;height:3px;background:var(--brf-white);margin-top:18px;opacity:0;transform:translateY(18px);transition:opacity var(--dur-base) var(--ease-brand),transform var(--dur-base) var(--ease-brand)}
.brf-news:hover .brf-news__rule{opacity:1;transform:translateY(0)}
.brf-news__date{display:block;font-size:var(--fs-small);color:var(--brf-grey-600);margin-bottom:10px}

/* ── HeroBanner ─────────────────────────────────────── */
.brf-hero{position:relative;width:100%;height:733px;overflow:hidden;background:var(--brf-navy)}
.brf-hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.brf-hero__inner{position:relative;height:100%;width:100%;max-width:none;display:flex;align-items:flex-end;padding:0}
.brf-hero__box{background:var(--brf-blue);padding:52px 56px 40px;max-width:760px;margin-left:var(--hero-box-left)}
.brf-hero__title{font-size:var(--fs-hero);font-weight:var(--fw-hero-title);line-height:1.14;text-transform:uppercase;color:var(--brf-white);margin:0}
.brf-hero__sub{font-size:var(--fs-hero-sub);font-weight:var(--fw-hero-sub);line-height:1.238;letter-spacing:var(--ls-hero-sub);text-transform:uppercase;color:var(--brf-white);margin:56px 0 0}

/* ── InfoTable ──────────────────────────────────────── */
.brf-table{width:100%;border-collapse:collapse;font-size:var(--fs-body)}
.brf-table td{padding:9px 0;border-bottom:1px solid var(--border-subtle);vertical-align:top}
.brf-table td:last-child{text-align:right;white-space:nowrap}
.brf-table tr:last-child td{border-bottom:0}

/* ── PartnerLogo ────────────────────────────────────── */
.brf-partner{display:flex;align-items:center;justify-content:center;background:var(--brf-white);padding:6px 10px}
.brf-partner img{max-width:100%;max-height:100%;width:auto;height:auto}

/* ── Icon ───────────────────────────────────────────── */
.brf-icon{display:block;object-fit:contain}

/* ── TopBar ─────────────────────────────────────────── */
.brf-topbar{background:var(--brf-blue);color:var(--brf-white);height:var(--header-topbar-h)}
.brf-topbar__inner{height:100%;display:flex;align-items:center;justify-content:space-between;font-size:var(--fs-topbar)}
.brf-topbar__group{display:flex;align-items:center;gap:16px}
.brf-topbar a{color:var(--brf-white);text-decoration:none}
.brf-topbar a:hover{color:var(--brf-white);text-decoration:underline}
.brf-topbar__sep{opacity:.55}
.brf-topbar__contact{display:flex;align-items:center;justify-content:flex-start;gap:22px;margin:0 auto 0 0}
.brf-topbar__item{display:inline-flex;align-items:center;gap:7px}

/* ── MainNav ────────────────────────────────────────── */
.brf-nav{display:flex;align-items:center;gap:0}
.brf-nav__item{position:relative}
.brf-nav__link{display:block;padding:0 24px;font-size:var(--fs-nav);font-weight:var(--fw-bold);letter-spacing:var(--ls-nav);text-transform:uppercase;color:var(--brf-grey-900);text-decoration:none;line-height:1;transition:color var(--dur-fast) var(--ease-brand)}
.brf-nav__item:hover>.brf-nav__link,.brf-nav__link--current{color:var(--brf-blue)}
.brf-nav__link:hover{text-decoration:none}
.brf-nav__sub{position:absolute;top:100%;left:24px;margin-top:36px;min-width:200px;background:var(--surface-menu);list-style:none;padding:0;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity var(--dur-base) var(--ease-brand),transform var(--dur-base) var(--ease-brand),visibility var(--dur-base);z-index:40}
.brf-nav__item:hover .brf-nav__sub{opacity:1;visibility:visible;transform:translateY(0)}
.brf-nav__sub a{display:block;padding:15px 24px;font-size:var(--fs-submenu);font-weight:var(--fw-regular);text-transform:uppercase;color:var(--brf-grey-900);border-bottom:1px solid rgba(0,0,0,.06);text-decoration:none}
.brf-nav__sub li:last-child a{border-bottom:0}
.brf-nav__sub a:hover{background:var(--surface-menu-hover);color:var(--brf-grey-900);text-decoration:none}

/* ── SiteHeader ─────────────────────────────────────── */
.brf-header{background:var(--brf-white);position:relative;z-index:30}
.brf-header__inner{height:var(--header-h);display:flex;align-items:center;justify-content:space-between}
.brf-header__logo img{height:var(--logo-h);width:auto}

/* ── SiteFooter ─────────────────────────────────────── */
.brf-footer{background:var(--brf-blue);color:var(--brf-white);padding:52px 0 0}
.brf-footer__wrap{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}
.brf-footer__cols{display:grid;grid-template-columns:1fr 1.35fr 1.3fr;gap:26px;padding-bottom:64px}
.brf-footer__h{font-size:17px;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.3px;line-height:1.5;margin:0 0 26px;color:var(--brf-white)}
.brf-footer__body{font-size:14px;line-height:1.55}
.brf-footer__body strong{display:block;font-weight:var(--fw-bold);margin-bottom:2px}
.brf-footer a{color:var(--brf-white)}
.brf-footer a:hover{color:var(--brf-white);text-decoration:underline}
.brf-footer .brf-table{font-size:14px}
.brf-footer .brf-table td{border-bottom:0;padding:0 0 22px;color:var(--brf-white)}
.brf-footer .brf-table td:first-child{padding-left:18px}
.brf-footer .brf-table td:last-child{text-align:left}
.brf-footer__logos{display:grid;grid-template-columns:auto auto;gap:14px 24px;align-items:start;justify-content:start}
.brf-footer__logos .brf-partner{width:140px;height:58px}
.brf-footer__logos .brf-partner--wide{width:146px;height:28px;padding:3px 8px}
.brf-footer__logos-col{display:grid;gap:14px}
.brf-socket{border-top:1px solid rgba(255,255,255,.28);padding:20px 0 26px;font-size:14px;line-height:1.55;color:var(--brf-white);text-align:right}

/* ── TextField ──────────────────────────────────────── */
.brf-field{display:block}
.brf-field__label{display:block;font-size:var(--fs-small);font-weight:var(--fw-black);text-transform:uppercase;color:var(--brf-blue-link);margin-bottom:10px}
.brf-field__input{width:100%;height:40px;padding:0 15px;background:var(--brf-white);border:1px solid var(--border-hairline);border-radius:0;font-size:var(--fs-small);color:var(--brf-grey-900);outline:none;transition:border-color var(--dur-base) var(--ease-brand)}
.brf-field__input::placeholder{color:var(--text-placeholder)}
.brf-field__input:focus{border-color:var(--brf-blue)}
.brf-field__hint{display:block;margin-top:8px;font-size:var(--fs-small);font-weight:var(--fw-light);font-style:italic;color:var(--brf-black)}

/* ── ImageBand — skyline photo, multiplied arrow shape, copy on top ── */
.brf-band{position:relative;width:100%;min-height:530px;display:flex;align-items:center;overflow:hidden;background-repeat:no-repeat;background-position:center;background-size:cover;background-attachment:fixed}
.brf-band__shape{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;mix-blend-mode:multiply;opacity:var(--band-shape-opacity);pointer-events:none;background:var(--brf-blue);clip-path:var(--band-shape)}
.brf-band__shape--file{background:none;clip-path:none}
.brf-band__inner{position:relative;width:100%}
.brf-band__col{margin-left:46%;max-width:670px;color:var(--brf-white);padding:54px 0}
.brf-band__col p{font-size:15px;line-height:1.75;margin:0 0 1.5em}
.brf-band__col .brf-heading__title{color:var(--brf-white)}
.brf-band__col .brf-heading__rule{background:var(--brf-white)}
.brf-totop{position:absolute;right:28px;bottom:26px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:var(--brf-white);color:var(--brf-blue);border:0;cursor:pointer;font-size:19px;line-height:1;transition:background-color var(--dur-base) var(--ease-brand)}
.brf-totop:hover{background:var(--brf-t2-700)}
.brf-footer{position:relative}

/* ── SkylineBand — closes the page above the footer ── */
.brf-skyline{width:100%;background:var(--surface-page);line-height:0}
.brf-skyline img{width:100%;height:auto;display:block;position:relative;top:57px;left:-5px}
