/* responsible-ai-hero · isolated, reusable wireframe. No homepage styles. */
.id-responsible-hero{
  --hero-petrol:#09333f;
  --hero-bone:#f4f1e9;
  --hero-mint:#26f7b2;
  --hero-overlay-opacity:.7;
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  min-height:100svh;
  overflow:hidden;
  color:var(--hero-bone);
  background:var(--hero-petrol);
  font-family:var(--id-text,'Hanken Grotesk',system-ui,sans-serif);
}
.id-responsible-hero *{box-sizing:border-box}
.id-responsible-hero__picture,
.id-responsible-hero__picture img,
.id-responsible-hero__animation,
.id-responsible-hero__animation canvas,
.id-responsible-hero__scrim{position:absolute;inset:0;width:100%;height:100%}
.id-responsible-hero__picture{z-index:-3;display:block}
.id-responsible-hero__picture img{display:block;object-fit:cover;object-position:70% center}
.id-responsible-hero__animation{z-index:-1;pointer-events:none;background:var(--hero-petrol);opacity:var(--hero-overlay-opacity)}
.id-responsible-hero__animation canvas{display:block}
.id-responsible-hero__scrim{z-index:-2;pointer-events:none;background:radial-gradient(ellipse at center,rgba(6,38,47,.28),rgba(6,38,47,.06) 75%)}
.id-responsible-hero__content{
  width:100%;
  max-width:1280px;
  margin-inline:auto;
  padding:clamp(88px,10svh,136px) clamp(24px,4.4vw,64px);
  text-align:center;
}
.id-responsible-hero__heading{width:100%;max-width:960px;margin-inline:auto;transform-origin:center center}
.id-responsible-hero__eyebrow{
  display:block;
  width:fit-content;
  max-width:100%;
  margin:0 auto 24px;
  color:var(--hero-mint);
  font-family:var(--id-mono,'Spline Sans Mono',ui-monospace,monospace);
  font-size:clamp(10px,.9vw,12px);
  font-weight:500;
  line-height:1.6;
  letter-spacing:.13em;
  text-transform:uppercase;
  text-align:center;
}
.id-responsible-hero__title{
  max-width:100%;
  margin:0;
  color:var(--hero-bone);
  font-family:var(--id-disp,'Schibsted Grotesk',system-ui,sans-serif);
  font-size:clamp(30px,calc(13px + 4.4vw),64px);
  font-weight:700;
  line-height:1.07;
  letter-spacing:-.045em;
}
.id-responsible-hero__title>span{display:block;max-width:100%;text-wrap:balance}
.id-responsible-hero[data-motion="preparing"] .id-responsible-hero__heading,
.id-responsible-hero[data-motion="preparing"] [data-hero-intro],
.id-responsible-hero[data-motion="preparing"] [data-hero-cta]{opacity:0}
.id-responsible-hero__intro{
  max-width:65ch;
  margin:30px auto 0;
  color:#e4e9e5;
  font-size:clamp(16px,calc(14px + .35vw),19px);
  font-weight:400;
  line-height:1.6;
  text-wrap:pretty;
}
.id-responsible-hero__cta{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  min-height:52px;
  max-width:100%;
  margin-top:32px;
  padding:15px 24px;
  border:1px solid var(--hero-mint);
  border-radius:4px;
  background:var(--hero-mint);
  color:#06262f;
  font-size:15px;
  font-weight:700;
  line-height:1.3;
  text-decoration:none;
  transition:background .2s ease,border-color .2s ease;
}
.id-responsible-hero__cta:hover{background:#b5fce5;border-color:#b5fce5}
.id-responsible-hero__cta:active{translate:0 1px}
.id-responsible-hero__cta:focus-visible{outline:3px solid var(--hero-bone);outline-offset:5px}
.id-responsible-hero[data-motion="running"] .id-responsible-hero__heading,
.id-responsible-hero[data-motion="running"] [data-hero-intro],
.id-responsible-hero[data-motion="running"] [data-hero-cta]{will-change:transform,opacity}
@media(max-width:900px){
  .id-responsible-hero__heading{max-width:100%}
  .id-responsible-hero__intro{max-width:60ch}
  .id-responsible-hero__picture img{object-position:73% center}
}
@media(max-width:620px){
  .id-responsible-hero__content{padding-block:104px 56px}
  .id-responsible-hero__eyebrow{max-width:38ch;font-size:10px;letter-spacing:.08em;margin-bottom:22px}
  .id-responsible-hero__title{line-height:1.1;letter-spacing:-.04em}
  .id-responsible-hero__title>span+span{margin-top:8px}
  .id-responsible-hero__intro{margin-top:26px}
  .id-responsible-hero__cta{margin-top:26px;padding:15px 22px}
  .id-responsible-hero__picture img{object-position:center center}
  .id-responsible-hero__scrim{background:linear-gradient(180deg,rgba(6,38,47,.08),rgba(6,38,47,.35))}
}
@media(prefers-reduced-motion:reduce){
  .id-responsible-hero__heading,
  .id-responsible-hero [data-hero-eyebrow],
  .id-responsible-hero [data-hero-title],
  .id-responsible-hero [data-hero-intro],
  .id-responsible-hero [data-hero-cta]{opacity:1!important;transform:none!important}
  .id-responsible-hero__animation{opacity:var(--hero-overlay-opacity)!important}
  .id-responsible-hero__cta{transition:none}
}