/* Typography and hero composition based on the requested Klarna reference. */
@font-face{font-family:'Klarna Title';src:url('/assets/fonts/klarna-title-bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Klarna Text';src:url('/assets/fonts/klarna-text-regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Klarna Text';src:url('/assets/fonts/klarna-text-medium.woff2') format('woff2');font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:'Klarna Text';src:url('/assets/fonts/klarna-text-bold.woff2') format('woff2');font-weight:650 900;font-style:normal;font-display:swap}
@font-face{font-family:'Klarna Text';src:url('/assets/fonts/klarna-text-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
:root{--font-heading:'Klarna Title',Arial,sans-serif;--font-body:'Klarna Text',Arial,sans-serif}
body,input,select,textarea,button{font-family:var(--font-body)}
h1,h2,h3,h4,h5,h6,h1 em,h2 em,h3 em,.quote-copy h2>span,.service-offer-choice strong{font-family:var(--font-heading)!important;font-weight:700!important;font-style:normal;letter-spacing:normal!important}
h2{line-height:1.1!important}h3,h4{line-height:1.2!important}
.eyebrow{font-weight:500;letter-spacing:.07em}
.button,.text-link{font-family:var(--font-body);font-weight:500}
/* A separate, light header leaves breathing room around the rounded hero. */
body .site-header,body .site-header:not(.is-scrolled),.home-page .site-header:not(.is-scrolled):not(:has(.menu-toggle[aria-expanded="true"])){background:#fff;border-bottom:1px solid #eee;margin-bottom:0;color:#171717}
body .site-header nav>a,body .site-header:not(.is-scrolled) nav>a{color:#171717;text-shadow:none;font-size:12px}
body .site-header nav>a:hover{color:var(--brand-red)}
.home-page .site-header .menu-toggle .brand-icon,body .site-header .menu-toggle .brand-icon{filter:none!important}
body .site-header .nav-inner{gap:22px}
/* All existing hero copy, links and photos stay in place. */
.hero.expert-hero,.hero.services-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;width:calc(100% - 80px);max-width:1440px;min-height:0;margin:32px auto 40px;padding:0;gap:0;overflow:hidden;border-radius:48px;background:#151412}
.hero.expert-hero .hero-visual,.hero.services-hero .hero-visual{position:relative;inset:auto;grid-area:1/1;width:100%;max-width:none;height:auto;margin:0;border-radius:0;z-index:0}
.hero.expert-hero .hero-visual>img,.hero.services-hero .hero-visual>img{display:block;width:100%;height:auto;object-fit:contain;object-position:center;filter:none}
.hero.expert-hero .hero-visual::after,.hero.services-hero .hero-visual::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,12,12,.88),rgba(12,12,12,.72) 39%,rgba(12,12,12,.08) 73%);pointer-events:none}
.hero.expert-hero .hero-copy,.hero.services-hero .hero-copy{position:relative;grid-area:1/1;inset:auto;transform:none;width:54%;max-width:750px;margin:0;padding:48px 40px;z-index:1;color:#fff}
.hero.expert-hero h1,.hero.services-hero h1{font-size:clamp(58px,5.6vw,84px);line-height:.98;letter-spacing:normal;margin:0 0 24px;color:#fff;max-width:none}
.hero h1 .highlight,.hero h1 em{color:#fff;font-weight:700;white-space:normal;background:none}
.hero h1 .highlight:after{display:none}
.hero .hero-copy .eyebrow{font-size:11px;line-height:1.5;margin:0 0 20px;color:#fff}
.hero .hero-description{font-size:18px;line-height:1.4;max-width:550px;margin:0;color:#fff}
.hero .hero-actions{display:flex;flex-wrap:wrap;width:auto;gap:16px 24px;padding:0;margin:24px 0 0;background:transparent}
.hero .hero-actions .button{min-height:52px;padding:15px 22px;border-radius:999px;font-size:15px;line-height:1.3;white-space:normal;background:var(--brand-red);color:#fff;border:0;gap:12px}
.hero .hero-actions .button:hover{background:#ba171b}
.hero .hero-actions .text-link{font-size:14px;line-height:1.4;min-height:44px;color:#fff;padding:0;white-space:normal}
.hero .hero-note{font-size:12px;line-height:1.5;margin:20px 0 0;max-width:500px;color:#eee}
.hero .photo-label,.hero .round-stamp,.hero .image-caption{display:none}
/* Page introductions follow the same title scale and rounded framing. */
.pro-hero.container{position:relative;isolation:isolate;display:grid;width:calc(100% - 80px);max-width:1440px;gap:0;grid-template-columns:1fr;align-items:center;padding:0;margin:32px auto 48px;border-radius:48px;overflow:hidden;background:#151412}
.pro-hero>div{position:relative;grid-area:1/1;z-index:1;width:56%;padding:48px 40px;color:white}
.pro-hero>figure{grid-area:1/1;margin:0;position:relative;z-index:0}
.pro-hero img{width:100%;height:auto;border-radius:0;object-fit:contain}
.pro-hero>figure:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0c0c0cea,#0c0c0cb8 40%,#0c0c0c14 80%)}
.pro-hero h1{font-size:clamp(56px,5.4vw,80px);line-height:1;margin:0 0 24px;color:#fff}
.pro-hero h1 em{color:#fff}.pro-hero .eyebrow{color:#fff;margin:0 0 20px;font-size:11px}
.pro-hero p:not(.eyebrow){color:white;font-size:18px;line-height:1.4;max-width:550px}
.pro-hero .button{min-height:52px;font-size:15px;margin-top:24px}.pro-hero p.pro-hero-note{font-size:12px;line-height:1.5;margin-top:16px}
.knowledge-intro.container{width:calc(100% - 80px);max-width:1440px;padding:64px 48px;margin:32px auto 48px;background:#f1ede5;border-radius:48px}
.knowledge-intro h1{font-size:clamp(48px,5.8vw,84px);line-height:1;max-width:1000px;margin:20px 0 24px}
.knowledge-intro>p:not(.eyebrow){font-size:20px;line-height:1.4;max-width:760px}
@media(max-width:1100px){
 .hero.expert-hero,.hero.services-hero,.pro-hero.container{display:flex;flex-direction:column;align-items:stretch;border-radius:36px;width:calc(100% - 48px);margin-top:24px}
 .hero.expert-hero .hero-copy,.hero.services-hero .hero-copy,.pro-hero>div{order:0;width:100%;max-width:850px;padding:40px;inset:auto;transform:none;margin:0}
 .hero.expert-hero .hero-visual,.hero.services-hero .hero-visual,.pro-hero>figure{order:1;width:100%;flex:none}
 .hero.expert-hero .hero-visual::after,.hero.services-hero .hero-visual::after,.pro-hero>figure:after{background:rgba(12,12,12,.16)}
 .hero.expert-hero h1,.hero.services-hero h1,.pro-hero h1{font-size:64px;line-height:1}
 .hero .hero-description,.pro-hero p:not(.eyebrow){max-width:720px}
 .hero .hero-actions{gap:16px 28px}.knowledge-intro.container{width:calc(100% - 48px);padding:48px 36px;border-radius:36px}
}
@media(max-width:600px){
 body .site-header .nav-inner{gap:12px}
 .hero.expert-hero,.hero.services-hero,.pro-hero.container{width:calc(100% - 32px);margin:16px auto 28px;border-radius:28px}
 .hero.expert-hero .hero-copy,.hero.services-hero .hero-copy,.pro-hero>div{padding:32px 24px}
 .hero.expert-hero h1,.hero.services-hero h1,.pro-hero h1{font-size:clamp(39px,10.5vw,58px);line-height:1.04;margin-bottom:20px}
 .hero .hero-copy .eyebrow,.pro-hero .eyebrow{font-size:10px;line-height:1.5;margin-bottom:16px}
 .hero .hero-description,.pro-hero p:not(.eyebrow){font-size:16px;line-height:1.5}
 .hero .hero-actions{gap:8px;align-items:flex-start;flex-direction:column;margin-top:22px}
 .hero .hero-actions .button,.pro-hero .button{font-size:14px;padding:14px 18px;min-height:50px;gap:8px;max-width:100%;text-align:left}
 .hero .hero-actions .text-link{font-size:14px;min-height:44px}
 .hero .hero-note,.pro-hero p.pro-hero-note{font-size:11px;line-height:1.5;margin-top:12px}
 .knowledge-intro.container{width:calc(100% - 32px);margin:16px auto 28px;border-radius:28px;padding:36px 24px}
 .knowledge-intro h1{font-size:clamp(40px,10.5vw,58px);line-height:1.04}
 .knowledge-intro>p:not(.eyebrow){font-size:17px;line-height:1.5}
}
/* Keep the mobile menu visible against the new white header. */
body.home-page .site-header:not(.is-scrolled):not(:has(.menu-toggle[aria-expanded="true"])) .menu-toggle .brand-icon{filter:none!important}
