/* Contact-first certificates share the approved layout and retain full hero scenes. */
body.certificate-page .golf-button:not(.motor-secondary){background:var(--doctor-accent)}
body.certificate-page .golf-eyebrow,body.certificate-page .motor-guide-icon,body.certificate-page .motor-guide-link>svg{color:var(--doctor-accent)}
body.certificate-page .motor-how{background:var(--doctor-soft);--accent:var(--doctor-accent)}
body.certificate-page .motor-soft{background:var(--doctor-soft)}
body.certificate-page .brand-mobile-bar.brand-certificate{background:var(--doctor-deep)}
body.certificate-page .brand-mobile-bar.brand-certificate a{background:var(--doctor-accent)}
.cert-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--hero-sky);text-align:center}
.cert-hero-copy{position:absolute;inset:0 0 auto;z-index:2;margin:auto;padding:32px 24px 24px;background:none}
body.certificate-page .cert-hero h1{font-size:clamp(34px,4vw,52px);line-height:1.14;margin:16px 0;letter-spacing:-1.5px}
.cert-hero-copy>p:not(.golf-eyebrow){color:#173248;font-size:16px;line-height:1.75;margin:20px auto 24px}
body.certificate-page .cert-hero-art{display:block;position:relative;width:100%;max-width:none;height:auto;margin:0;object-fit:contain;mask-image:none;-webkit-mask-image:none}
.cert-hero-scene{position:relative;width:100%;margin:0;z-index:0}
.cert-hero-wave{position:absolute;bottom:-1px;left:0;width:100%;height:clamp(18px,3.5vw,55px);z-index:1;pointer-events:none}
body.certificate-page .cert-step-art{position:relative;overflow:hidden;isolation:isolate}
body.certificate-page .cert-step-art img{position:absolute;top:0;left:calc(var(--panel) * -100%);display:block;width:300%;max-width:none;height:100%;object-fit:fill;border-radius:0;transform:none}
.cert-booking{display:flex;align-items:center;justify-content:center;gap:50px;border-top:1px solid #d7e7ee;padding:28px 0 16px;margin:30px auto 0;max-width:900px}
.cert-booking-pair{display:flex;align-items:center;justify-content:center;gap:28px}
.cert-place{display:flex;align-items:center;gap:12px;text-align:left}
.cert-place svg{width:34px;height:40px;flex:none;color:var(--doctor-accent)}
.cert-place span,.cert-price>span{display:block;font-size:11px;color:#526e80;line-height:1.6}
.cert-place strong{display:block;font-size:20px;line-height:1.5;font-weight:500;margin-top:3px}
.cert-price{border-left:1px solid #c9dce5;padding-left:28px;text-align:left}
.cert-price>strong{display:block;font-size:38px;line-height:1.3;font-weight:500;white-space:nowrap}
.cert-price small{font-size:14px;font-weight:400}
.cert-booking>.golf-button{min-width:240px;text-align:center}
.cert-price-note{text-align:center;font-size:11px!important;line-height:1.8!important;color:#526e80;max-width:650px;margin:14px auto 0!important}
.cert-finish{background:var(--doctor-soft);clip-path:polygon(0 1.5%,25% 0,65% 2%,100% 0,100% 98%,70% 100%,30% 98.5%,0 100%);text-align:center;margin:20px 0 50px}
.cert-finish>.golf-wrap{padding-block:65px}
.cert-finish h2{font-size:clamp(30px,3.4vw,44px)}
.cert-finish img{display:block;width:min(100%,550px);height:auto;margin:25px auto 20px;mix-blend-mode:multiply}
.cert-finish p:not(.golf-eyebrow){color:#526e80;font-size:14px}
.cert-finish .cert-booking{max-width:760px}
.cert-back{display:inline-block;margin-top:24px;font-size:13px;text-decoration:underline;text-underline-offset:4px;color:var(--doctor-accent)}
body.certificate-page .motor-guide-link{color:#173248;background:var(--doctor-soft)}
@media(max-width:900px){.cert-booking{flex-direction:column;gap:24px}.cert-booking>.golf-button{width:100%;max-width:600px}}
@media(max-width:760px){
 .cert-hero-copy{padding:30px 20px 24px}
 body.certificate-page .cert-hero h1{font-size:clamp(28px,6.5vw,40px);letter-spacing:-1px}
 .cert-hero-copy>p:not(.golf-eyebrow){font-size:13px;margin:16px auto 20px}
 body.certificate-page .cert-hero-art{width:100%;height:auto;margin:0}
 .cert-hero .motor-actions{gap:10px;flex-wrap:wrap}
 .cert-hero .motor-actions .golf-button{font-size:12px;min-height:44px;padding:12px 17px;min-width:0}
 .cert-hero .golf-eyebrow{font-size:9px;letter-spacing:1.5px}
 .cert-booking{padding-top:24px;margin-top:24px;gap:20px}
 .cert-booking-pair{gap:22px;width:100%}
 .cert-price{padding-left:22px}
 .cert-price>strong{font-size:32px}
 .cert-place strong{font-size:18px}
 .cert-price>span{max-width:145px}
 .cert-price-note{font-size:10px!important}
 .cert-finish>.golf-wrap{padding:45px 24px}
 .cert-finish p:not(.golf-eyebrow){font-size:13px}
}
@media(max-width:400px){
 .cert-booking-pair{gap:14px}.cert-place{gap:7px}.cert-place svg{width:28px;height:34px}
 .cert-price{padding-left:14px}.cert-place strong{font-size:16px}.cert-price>strong{font-size:28px}
 .cert-place span,.cert-price>span{font-size:10px}.cert-price small{font-size:12px}
}

/* Only the four new certificate previews use these components. */
body.certificate-page .motor-guide>div>.golf-eyebrow{width:100%;max-width:none;text-align:left}
@media(max-width:760px){body.certificate-page .motor-guide>div>.golf-eyebrow{text-align:center;margin-inline:auto!important}}
.cert-finish[data-doctor="aupairdoktorn"] img{filter:hue-rotate(99deg) saturate(.62)}
.cert-finish[data-doctor="studentdoktorn"] img{filter:hue-rotate(25deg) saturate(.65)}
.cert-finish[data-doctor="visumdoktorn"] img{filter:hue-rotate(-48deg) saturate(.65)}
.cert-finish[data-doctor="forsakringsdoktorn"] img{filter:saturate(.22)}
@media(max-width:1000px){
 .cert-hero-copy{position:relative;padding-bottom:0}
 .cert-hero-scene{margin-top:-10%;}
}

/* On narrow screens, match the actual top-edge colours behind the copy.
   The image remains whole, unmasked and at its native aspect ratio. */
@media(max-width:1000px){.certificate-page .cert-hero{background:var(--sky-edge)}}

/* Article layout follows the existing Motorsport information page. */
@media(min-width:761px){
 body.certificate-page .cert-article-hero{height:600px;background:var(--doctor-soft)}
 .cert-article-hero .cert-hero-copy{position:relative;inset:auto;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;width:46%;height:100%;margin:0;padding:50px 24px 60px max(28px,calc((100vw - 1120px)/2));text-align:left}
 body.certificate-page .cert-article-hero h1{font-size:clamp(32px,3.6vw,48px);margin:0 0 28px;letter-spacing:-1px}
 .cert-article-hero .cert-hero-scene{position:absolute;left:18%;top:0;width:100%;height:100%;margin:0;mask-image:linear-gradient(90deg,transparent 0%,#000 35%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 35%)}
 body.certificate-page .cert-article-hero .cert-hero-art{width:100%;height:100%;object-fit:cover;object-position:center bottom}
 .cert-article-hero .golf-eyebrow{font-size:9px!important;line-height:1.6}
}
/* Keep the people directly below the actions on wide screens, without stretching the artwork. */
@media(min-width:1001px){
 .cert-hero:not(.cert-article-hero){--head-offset:35vw}
 .cert-hero:not(.cert-article-hero):has(img[src*="studentdoktorn"]){--head-offset:38vw}
 .cert-hero:not(.cert-article-hero):has(img[src*="visumdoktorn"]){--head-offset:39vw}
 .cert-hero:not(.cert-article-hero):has(img[src*="forsakringsdoktorn"]){--head-offset:32.5vw}
 .cert-hero:not(.cert-article-hero) .cert-hero-copy{position:relative;padding-bottom:0}
 .cert-hero:not(.cert-article-hero) .cert-hero-scene{margin-top:calc(28px - var(--head-offset))}
}
/* Article originals have quiet space on the left and the complete consultation on the right. */
@media(min-width:761px){
 body.certificate-page .cert-article-hero{height:clamp(520px,42vw,1100px)}
 .cert-article-hero .cert-hero-copy{width:45%;padding-left:max(28px,calc((100vw - 1120px)/2));padding-right:0}
 .cert-article-hero .cert-hero-scene{left:0;top:0;width:100%;height:100%;margin:0;mask-image:none;-webkit-mask-image:none}
 body.certificate-page .cert-article-hero .cert-hero-art{width:100%;height:100%;object-fit:cover;object-position:center center}
}
@media(max-width:760px){
 body.certificate-page .cert-article-hero{background:var(--doctor-soft)}
 .cert-article-hero .cert-hero-copy{position:relative;padding:30px 20px 8px;background:var(--doctor-soft)}
 .cert-article-hero .cert-hero-scene{width:100%;height:90vw;margin:0;overflow:hidden}
 body.certificate-page .cert-article-hero .cert-hero-art{width:100%;height:100%;object-fit:cover;object-position:right center}
}