html, body { max-width: 100%; overflow-x: hidden; }
body { overflow-wrap: break-word; }
.site-header.is-scrolled { backdrop-filter: none; -webkit-backdrop-filter: none; }
.karrdal-brand-logo { max-width: 100%; }
.karrdal-brand-logo svg,
.site-footer svg,
.social-archive svg,
.social-single svg { flex: 0 0 auto; } .footer-navigation { min-width: 0; }
.footer-navigation .footer-menu { list-style: none; margin: 0; padding: 0; }
.site-footer__social-wrap { min-width: 0; }
.site-footer__social { display: flex; align-items: center; } .social-archive { overflow: hidden; background: var(--k-bg); }
.social-archive-hero {
position: relative;
overflow: hidden;
padding: 180px 0 88px;
background: radial-gradient(circle at 80% 10%, color-mix(in srgb, var(--k-surface-soft) 72%, transparent), transparent 33%), linear-gradient(180deg, var(--k-bg), var(--k-bg-alt));
border-bottom: 1px solid color-mix(in srgb, var(--k-border) 28%, transparent);
}
.social-archive-hero__inner { position: relative; z-index: 1; }
.social-archive-hero .eyebrow { margin: 0 0 12px; color: var(--k-accent); font-size: 10px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.social-archive-hero h1 {
max-width: 920px;
margin: 0;
color: var(--k-cream);
font-family: var(--k-serif);
font-size: clamp(68px, 8.2vw, 124px);
font-weight: 400;
letter-spacing: -.05em;
line-height: .9;
overflow-wrap: normal;
}
.social-archive-hero__inner > p:not(.eyebrow) { max-width: 660px; margin: 28px 0 0; color: var(--k-muted); font-size: 15px; line-height: 1.8; }
.social-archive-hero__profiles { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.social-archive-hero__profiles .social-profile-link {
display: inline-flex;
width: auto;
min-width: 0;
min-height: 42px;
align-items: center;
gap: 9px;
padding: 0 15px;
border: 1px solid color-mix(in srgb, var(--k-border) 70%, transparent);
color: var(--k-cream);
background: transparent;
font-size: 10px;
letter-spacing: .1em;
line-height: 1;
text-decoration: none;
text-transform: uppercase;
}
.social-profile-link__icon { display: inline-flex; width: 18px; height: 18px; flex: 0 0 18px; color: var(--k-accent); font-style: normal; }
.social-profile-link__icon svg,
.social-archive-hero__profiles .social-profile-link svg {
display: block !important;
width: 18px !important;
height: 18px !important;
max-width: 18px !important;
max-height: 18px !important;
}
.social-archive-content { padding: 76px 0 110px; background: linear-gradient(180deg, var(--k-bg), var(--k-bg-alt) 72%, var(--k-bg)); }
.social-news-grid--archive { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: color-mix(in srgb, var(--k-border) 30%, transparent); border: 1px solid color-mix(in srgb, var(--k-border) 30%, transparent); }
.social-news-card { min-width: 0; overflow: hidden; background: color-mix(in srgb, var(--k-surface) 48%, var(--k-bg)); }
.social-news-card__media { position: relative; display: block; width: 100%; aspect-ratio: 1.24 / 1; overflow: hidden; background: linear-gradient(145deg, var(--k-surface-soft), var(--k-bg-alt)); }
.social-news-card__media img { width: 100%; height: 100%; object-fit: cover; }
.social-news-card__source { position: absolute; z-index: 2; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border: 1px solid color-mix(in srgb, var(--k-accent) 55%, transparent); background: color-mix(in srgb, var(--k-bg) 82%, transparent); color: var(--k-cream); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.social-news-card__source i { display: inline-flex; width: 15px; height: 15px; color: var(--k-accent); font-style: normal; }
.social-news-card__source svg { width: 15px !important; height: 15px !important; }
.social-news-card__body { display: flex; min-height: 260px; flex-direction: column; padding: 26px 28px; }
.social-news-card__body time { display: block; margin-bottom: 13px; color: var(--k-accent); font-size: 9px; letter-spacing: .11em; text-transform: uppercase; }
.social-news-card__body h2, .social-news-card__body h3 { margin: 0 0 12px; color: var(--k-cream); font-family: var(--k-serif); font-size: 25px; font-weight: 400; line-height: 1.16; }
.social-news-card__body p { margin: 0; color: var(--k-muted); font-size: 13px; line-height: 1.7; }
.social-news-card__actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 22px; }
.social-news-card__read { display: inline-flex; align-items: center; gap: 8px; color: var(--k-accent); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.social-news-card__read i { display: inline-flex; width: 17px; height: 17px; }
.social-news-card__read svg { width: 17px !important; height: 17px !important; }
.social-news-card__external { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border: 1px solid var(--k-border); border-radius: 50%; color: var(--k-accent); }
.social-news-card__external svg { width: 16px !important; height: 16px !important; }
.social-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 48px; }
.social-pagination .page-numbers { display: grid; place-items: center; min-width: 40px; height: 40px; margin: 0; padding: 0 11px; border: 1px solid color-mix(in srgb, var(--k-border) 60%, transparent); color: var(--k-muted); }
@media (max-width: 1100px) {
.social-news-grid--archive { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 920px) {
:root { --k-shell: calc(100vw - 40px); } .site-header { background: color-mix(in srgb, var(--k-bg) 96%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--k-border) 24%, transparent); }
.site-header__inner { min-height: 78px; }
.site-branding { position: relative; z-index: 1202; }
.karrdal-brand-logo--header { width: 174px; max-height: 50px; }
.menu-toggle { position: relative; z-index: 1203; display: block; width: 48px; height: 46px; padding: 8px; cursor: pointer; }
.menu-toggle span:not(.screen-reader-text) { transform-origin: center; transition: transform .22s ease, opacity .18s ease; }
.menu-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.is-open span:nth-child(2) { opacity: 0; }
.menu-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.primary-navigation {
position: fixed !important;
inset: 0 !important;
z-index: 1201 !important;
display: none;
width: 100vw;
height: 100vh;
height: 100dvh;
max-height: 100dvh;
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
flex-direction: column;
align-items: center;
justify-content: flex-start;
gap: 20px;
padding: max(116px, calc(env(safe-area-inset-top) + 96px)) 24px max(34px, calc(env(safe-area-inset-bottom) + 26px));
background: var(--k-bg) !important;
-webkit-overflow-scrolling: touch;
}
.primary-navigation.is-open { display: flex; }
.primary-navigation .primary-menu { display: grid; width: min(100%, 420px); gap: 0; text-align: center; }
.primary-navigation .primary-menu li { margin: 0; padding: 0; }
.primary-navigation .primary-menu a {
display: block;
padding: 13px 8px;
color: var(--k-cream);
font-family: var(--k-serif);
font-size: clamp(28px, 7.5vw, 38px);
font-weight: 400;
letter-spacing: -.02em;
line-height: 1.05;
text-transform: none;
}
.primary-navigation .primary-menu a::after { display: none; }
.primary-navigation .header-cta { min-height: 46px; margin: 10px 0 0; padding-inline: 25px; }
html.nav-open, body.nav-open { overflow: hidden !important; } .site-footer { padding: 34px 0 max(34px, env(safe-area-inset-bottom)); }
.site-footer__grid { grid-template-columns: 1fr; justify-items: center; gap: 24px; text-align: center; }
.site-footer__brand { display: grid; justify-items: center; }
.karrdal-brand-logo--footer { width: 168px; }
.site-footer__brand p { margin-top: 8px; }
.footer-navigation { width: 100%; }
.footer-navigation .footer-menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; }
.footer-navigation .footer-menu a { display: inline-block; padding: 4px 0; font-family: var(--k-sans); font-size: 10px !important; font-weight: 600; letter-spacing: .1em !important; line-height: 1.4; text-transform: uppercase !important; }
.site-footer__social-wrap { justify-self: auto; display: grid; justify-items: center; gap: 10px; }
.site-footer__social-title { font-size: 9px; }
.site-footer__social { justify-self: auto; justify-content: center; }
.site-footer__social a { width: 40px; height: 40px; }
.site-footer__social a svg { width: 18px !important; height: 18px !important; } .social-archive-hero { padding: 128px 0 58px; }
.social-archive-hero::after { display: none; }
.social-archive-hero h1 { max-width: 100%; font-size: clamp(50px, 12vw, 72px); line-height: .96; letter-spacing: -.045em; }
.social-archive-hero__inner > p:not(.eyebrow) { margin-top: 22px; font-size: 14px; line-height: 1.7; }
.social-archive-hero__profiles { margin-top: 24px; }
.social-archive-content { padding: 54px 0 80px; }
}
@media (max-width: 640px) {
:root { --k-shell: calc(100vw - 30px); }
.site-header__inner { min-height: 74px; }
.karrdal-brand-logo--header { width: 158px; max-height: 46px; }
.primary-navigation { padding-left: 20px; padding-right: 20px; }
.primary-navigation .primary-menu a { font-size: clamp(28px, 9vw, 36px); padding-block: 12px; }
.hero { min-height: 620px; }
.hero__inner { min-height: 620px; padding-bottom: 54px; }
.hero h1 { font-size: clamp(46px, 14vw, 66px); line-height: .98; }
.about-section__content { padding-inline: 22px; }
.about-section__copy h2 { font-size: clamp(42px, 12vw, 56px); }
.contact-item { grid-template-columns: 34px minmax(0, 1fr); }
.contact-item p, .contact-item a { overflow-wrap: anywhere; }
.social-archive-hero { padding: 116px 0 46px; }
.social-archive-hero .eyebrow { margin-bottom: 9px; font-size: 9px; }
.social-archive-hero h1 { font-size: clamp(43px, 12.5vw, 58px); line-height: 1; }
.social-archive-hero__profiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
.social-archive-hero__profiles .social-profile-link { justify-content: center; padding-inline: 10px; }
.social-news-grid--archive { grid-template-columns: 1fr; }
.social-news-card__media { aspect-ratio: 1.18 / 1; }
.social-news-card__body { min-height: 0; padding: 23px 22px 24px; }
.social-news-card__body h2, .social-news-card__body h3 { font-size: 24px; }
.social-news-card__actions { padding-top: 20px; }
.social-single__article { padding: 116px 0 72px; }
.social-single__header { margin-bottom: 28px; }
.social-single__header h1 { font-size: clamp(40px, 12vw, 56px); line-height: 1; overflow-wrap: anywhere; }
.social-single__content { gap: 26px; margin-top: 30px; }
.social-single__copy { font-size: 19px; line-height: 1.55; }
.social-single__external { max-width: 100%; padding: 18px; }
} .social-single--manual .social-single__header{max-width:900px}.social-single__intro{max-width:760px;margin:24px 0 0;color:var(--k-muted);font-size:clamp(18px,2vw,24px);line-height:1.65}.social-single--manual .social-single__media{border-color:color-mix(in srgb,var(--k-border) 38%,transparent)}.social-single--manual .social-single__media img{max-height:none;aspect-ratio:auto;object-fit:cover;background:var(--k-bg)}.social-single--manual .social-single__content{display:block;max-width:830px}.social-single__copy--article{font-family:var(--k-sans);font-size:17px;line-height:1.9;white-space:normal}.social-single__copy--article p{margin:0 0 1.5em}.social-single__copy--article h2,.social-single__copy--article h3{margin:2em 0 .7em;color:var(--k-cream);font-family:var(--k-serif);font-weight:400;line-height:1.1}.manual-news-gallery{margin-top:76px;padding-top:54px;border-top:1px solid color-mix(in srgb,var(--k-border) 40%,transparent)}.manual-news-gallery__heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:28px}.manual-news-gallery__heading .eyebrow{margin:0 0 8px;color:var(--k-accent);font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.manual-news-gallery__heading h2{margin:0;color:var(--k-cream);font-family:var(--k-serif);font-size:clamp(42px,5vw,66px);font-weight:400;line-height:1}.manual-news-gallery__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:color-mix(in srgb,var(--k-border) 32%,transparent);border:1px solid color-mix(in srgb,var(--k-border) 32%,transparent)}.manual-news-gallery__item{margin:0;background:var(--k-bg)}.manual-news-gallery__image{aspect-ratio:4/3;overflow:hidden;background:var(--k-surface)}.manual-news-gallery__image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.manual-news-gallery__item:hover .manual-news-gallery__image img{transform:scale(1.02)}.manual-news-gallery__item figcaption{display:grid;gap:5px;padding:18px 20px 20px}.manual-news-gallery__item figcaption strong{color:var(--k-cream);font-family:var(--k-serif);font-size:21px;font-weight:400}.manual-news-gallery__item figcaption span{color:var(--k-muted);font-size:10px;letter-spacing:.04em}.social-news-card--manual .social-news-card__source{background:color-mix(in srgb,var(--k-bg) 88%,transparent)}
@media(max-width:640px){.social-single__intro{margin-top:18px;font-size:17px;line-height:1.6}.social-single__copy--article{font-size:16px;line-height:1.8}.manual-news-gallery{margin-top:52px;padding-top:40px}.manual-news-gallery__grid{grid-template-columns:1fr}.manual-news-gallery__heading h2{font-size:42px}.manual-news-gallery__item figcaption{padding:15px 16px 17px}}
.social-single__media--manual{overflow:hidden}.social-single__media-caption{display:grid;gap:5px;padding:16px 20px 18px;border-top:1px solid color-mix(in srgb,var(--k-border) 28%,transparent);background:color-mix(in srgb,var(--k-surface) 72%,var(--k-bg))}.social-single__media-caption strong{color:var(--k-cream);font-family:var(--k-serif);font-size:20px;font-weight:400}.social-single__media-caption span{color:var(--k-muted);font-size:10px;letter-spacing:.04em} .social-single--manual .social-single__shell{max-width:1040px}
.social-single--manual .social-single__header{max-width:900px}
.social-single--manual .social-single__media{width:min(100%,900px);margin-inline:auto}
.social-single--manual .social-single__media img{width:100%;max-height:590px;object-fit:contain;background:#040b08}
.social-single--manual .social-single__content{width:min(100%,900px);max-width:900px;margin:42px auto 0}
.social-single--manual .social-single__copy--article{width:100%;max-width:none;font-size:18px;line-height:1.82}
.manual-news-byline{display:flex;flex-wrap:wrap;gap:12px 34px;margin-top:28px;padding-top:22px;border-top:1px solid color-mix(in srgb,var(--k-border) 35%,transparent)}
.manual-news-byline>span{display:grid;gap:4px;min-width:150px}
.manual-news-byline small,.manual-news-original small{color:var(--k-accent);font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.manual-news-byline strong{color:var(--k-cream);font-family:var(--k-serif);font-size:19px;font-weight:400}
.manual-news-original{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:48px;padding:22px 24px;border:1px solid color-mix(in srgb,var(--k-border) 48%,transparent);background:color-mix(in srgb,var(--k-surface) 60%,transparent)}
.manual-news-original__copy{display:grid;gap:5px}
.manual-news-original__copy strong{color:var(--k-cream);font-family:var(--k-serif);font-size:23px;font-weight:400}
.manual-news-original__button{flex:0 0 auto;margin:0}
.social-news-card__byline{margin:7px 0 0!important;color:var(--k-accent)!important;font-size:9px!important;font-weight:700;letter-spacing:.08em;line-height:1.4!important;text-transform:uppercase}
@media(max-width:640px){
.social-single--manual .social-single__content{margin-top:28px}
.social-single--manual .social-single__media img{max-height:430px}
.social-single--manual .social-single__copy--article{font-size:16px;line-height:1.78}
.manual-news-byline{gap:12px 22px;margin-top:22px;padding-top:18px}
.manual-news-byline>span{min-width:0}
.manual-news-byline strong{font-size:17px}
.manual-news-original{align-items:flex-start;flex-direction:column;margin-top:38px;padding:19px}
.manual-news-original__button{width:100%;text-align:center}
}