/* Solutions digitales — extend the shared TMConcept palette without affecting other routes. */
body.digitalPage .pageHero {
  min-height: 550px;
  padding: 80px 0;
  background-position: 70% center;
}
body.digitalPage .pageHero h1 {
  max-width: 730px;
  font-size: clamp(2.6rem, 5.2vw, 4.9rem);
  line-height: 1.04;
}
body.digitalPage .pageHero .wrap { padding-block: 0; }
body.digitalPage .pageHero p:not(.hook) { max-width: 595px; }
body.digitalPage #digital {
  padding-top: 58px !important;
  padding-bottom: 88px;
  background: linear-gradient(180deg, #0e1621, #101c28 45%, #0c141e);
}
#digital {
  --digital-copy: #bdc9d3;
  --digital-accent: #f4c542;
}
#digital :is(section, article, div)[id] { scroll-margin-top: 108px; }
#digital :is(a, summary):focus-visible {
  outline: 3px solid #f4c542;
  outline-offset: 5px;
}
#digital .eyebrow { font-size: .875rem; }
#digital :is(h2, h3) { text-wrap: balance; }
#digital h2 { font-size: clamp(2rem, 3.55vw, 3.4rem); line-height: 1.1; }
#digital p { color: var(--digital-copy); }
#digital p.eyebrow { color: var(--gold); }
#digital :is(.digitalIntro, .digitalSectionHead) {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 30px;
}
#digital :is(.digitalIntro, .digitalSectionHead) h2 { margin-bottom: 0; }
#digital :is(.digitalIntro, .digitalSectionHead) > p { margin-bottom: 2px; }
#digital .digitalJumpNav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-block: 1px solid #ffffff20;
  margin-bottom: 56px;
}
#digital .digitalJumpNav a {
  min-height: 108px;
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 22px 20px;
  transition: background .2s ease;
}
#digital .digitalJumpNav a + a { border-left: 1px solid #ffffff20; }
#digital .digitalJumpNav a:hover { background: #f4c5420b; }
#digital .digitalJumpNav a > span:last-child { margin-left: auto; color: var(--gold); }
#digital .digitalJumpNumber { color: var(--gold); font-size: .875rem; font-weight: 700; }
#digital .digitalJumpNav strong { display: block; font-size: 1rem; }
#digital .digitalJumpNav small { display: block; color: #adbecd; font-size: .875rem; line-height: 1.45; margin-top: 5px; }
#digital .digitalPillar {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  padding: 0;
  overflow: hidden;
  border: 1px solid #ffffff22;
  border-radius: 26px;
  background: linear-gradient(145deg, #1a2836, #111c27);
}
#digital .digitalPillar + .digitalPillar { margin-top: 28px; }
#digital .digitalMedia { margin: 0; min-width: 0; position: relative; }
#digital .digitalEcardMedia { min-height: 600px; background: #09131f; }
#digital .digitalEcardMedia img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 76% center;
}
#digital .digitalEcardMedia::after {
  content: "";
  position: absolute;
  inset: 55% 0 0;
  background: linear-gradient(transparent, #07101bf2);
}
#digital .digitalMedia figcaption { color: #fff; display: grid; gap: 7px; }
#digital .digitalMedia figcaption span { font-size: 1rem; font-weight: 700; }
#digital .digitalMedia figcaption small { font-size: .875rem; color: #b9c9d6; }
#digital .digitalEcardMedia figcaption { position: absolute; z-index: 1; inset: auto 30px 28px; }
#digital .digitalPillarCopy { padding: clamp(28px, 4vw, 48px); align-self: center; min-width: 0; }
#digital .digitalBrand { display: grid; gap: 3px; margin-bottom: 26px; }
#digital .digitalBrand > span { color: var(--digital-accent); font-size: 1.45rem; font-weight: 800; letter-spacing: -.025em; }
#digital .digitalBrand > small { color: #bdcad4; font-size: .875rem; }
#digital .digitalPillarCopy h2 { margin-bottom: 22px; }
#digital .digitalBenefits { margin: 28px 0; }
#digital .digitalBenefits > div { padding: 15px 0 15px 17px; border-left: 2px solid var(--digital-accent); }
#digital .digitalBenefits > div + div { margin-top: 9px; }
#digital .digitalBenefits dt { font-weight: 700; color: #edf2f6; }
#digital .digitalBenefits dd { margin: 5px 0 0; color: var(--digital-copy); font-size: 1rem; line-height: 1.55; }
#digital .digitalActions { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-top: 26px; }
#digital .digitalActions .btn { font-size: 1rem; line-height: 1.4; text-align: center; }
#digital .digitalTextLink { color: var(--digital-accent); font-size: .9375rem; font-weight: 700; text-underline-offset: 5px; }
#digital .digitalTextLink:hover { text-decoration: underline; }
#digital .digitalTrack {
  --digital-accent: #9accf5;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  background: linear-gradient(145deg, #122538, #111c29);
}
#digital .digitalTrackMedia {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #0b1723;
}
#digital .digitalTrackMedia img {
  display: block;
  width: 100%;
  max-width: 340px;
  height: auto;
  object-fit: contain;
  border-radius: 16px;
}
#digital .digitalTrackMedia figcaption { margin-top: 24px; text-align: center; }
#digital p.digitalNote { font-size: .875rem; line-height: 1.6; color: #aebdca; }
#digital .digitalBlock { padding: 84px 0 0; }
#digital .digitalUseGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
#digital .digitalUseGrid article {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 30px 27px;
  border: 1px solid #ffffff20;
  border-radius: 20px;
  background: #172432;
}
#digital .digitalTech {
  color: var(--gold);
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: -.04em;
  padding-bottom: 20px;
  border-bottom: 1px solid #ffffff1c;
}
#digital .digitalUseGrid h3 { font-size: 1.5rem; line-height: 1.2; margin: 26px 0 14px; }
#digital .digitalUseGrid ul { padding-left: 20px; color: #c7d1da; margin: 8px 0 27px; }
#digital .digitalUseGrid li { margin-block: 9px; }
#digital .digitalUseGrid li::marker { color: var(--gold); }
#digital .digitalUseGrid .digitalTextLink { margin-top: auto; }
#digital .digitalCompatibility { margin: 24px 0 0; padding-left: 17px; border-left: 2px solid #ffffff42; font-size: .875rem; }
#digital .digitalJourney {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #ffffff2a;
}
#digital .digitalJourney li { padding: 28px 24px 0 0; }
#digital .digitalJourney li + li { border-left: 1px solid #ffffff1c; padding-left: 26px; }
#digital .digitalJourney li > span { color: var(--gold); font-size: 1.8rem; font-weight: 400; }
#digital .digitalJourney h3 { font-size: 1.25rem; margin: 20px 0 12px; }
#digital .digitalJourney p { margin-bottom: 0; }
#digital .digitalFaq { display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: 64px; }
#digital .digitalFaqList { border-top: 1px solid #ffffff30; }
#digital .digitalFaqList details { border-bottom: 1px solid #ffffff24; }
#digital .digitalFaqList summary {
  position: relative;
  padding: 22px 37px 22px 0;
  cursor: pointer;
  list-style: none;
  font-weight: 700;
}
#digital .digitalFaqList summary::-webkit-details-marker { display: none; }
#digital .digitalFaqList summary::after { content: "+"; position: absolute; top: 18px; right: 5px; color: var(--gold); font-size: 1.4rem; }
#digital .digitalFaqList details[open] summary::after { content: "−"; }
#digital .digitalFaqList details p { margin: 0; padding: 0 25px 24px 0; }
#digital .digitalRequest {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: 44px;
  align-items: center;
  margin-top: 84px;
  padding: clamp(26px, 4vw, 48px);
  border: 1px solid #ffffff23;
  border-top: 2px solid #b89331;
  border-radius: 22px;
  background: #142230;
}
#digital .digitalRequest h2 { font-size: clamp(2rem, 3.1vw, 3.05rem); }
#digital .digitalRequest aside { padding: 28px; border: 1px solid #ffffff20; border-radius: 16px; background: #1c2b39; }
#digital .digitalRequest aside h3 { font-size: 1.125rem; }
#digital .digitalRequest aside ul { padding-left: 19px; color: #c6d1da; }
#digital .digitalRequest aside li { margin-bottom: 13px; }
#digital .digitalRequest aside a { color: var(--gold); overflow-wrap: anywhere; }
#digital .digitalRequest .digitalNote { margin: 19px 0 0; }
@media (max-width: 960px) {
  #digital .digitalJumpNav { grid-template-columns: 1fr; }
  #digital .digitalJumpNav a { min-height: 84px; }
  #digital .digitalJumpNav a + a { border-left: 0; border-top: 1px solid #ffffff20; }
  #digital :is(.digitalPillar, .digitalTrack) { grid-template-columns: 1fr; }
  #digital .digitalEcardMedia { min-height: 360px; }
  #digital .digitalEcardMedia img { object-position: center 48%; }
  #digital .digitalTrackMedia { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .75fr); gap: 28px; }
  #digital .digitalTrackMedia img { max-width: 290px; justify-self: center; }
  #digital .digitalTrackMedia figcaption { text-align: left; margin: 0; }
  #digital :is(.digitalIntro, .digitalSectionHead, .digitalFaq, .digitalRequest) { grid-template-columns: 1fr; gap: 24px; }
  #digital .digitalUseGrid { grid-template-columns: 1fr; }
  #digital .digitalUseGrid h3 { margin-top: 22px; }
}
@media (max-width: 620px) {
  body.digitalPage .pageHero { padding: 65px 0; min-height: 530px; }
  body.digitalPage .pageHero h1 { font-size: clamp(2.4rem, 9vw, 3.4rem); }
  body.digitalPage #digital { padding-top: 42px !important; padding-bottom: 64px; }
  #digital .digitalJumpNav { margin-bottom: 34px; }
  #digital .digitalPillar { border-radius: 19px; }
  #digital .digitalPillarCopy { padding: 28px 22px; }
  #digital .digitalEcardMedia { min-height: 310px; }
  #digital .digitalEcardMedia img { object-position: 75% center; }
  #digital .digitalTrackMedia { display: flex; padding: 24px; }
  #digital .digitalTrackMedia img { width: min(100%, 285px); }
  #digital .digitalTrackMedia figcaption { text-align: center; }
  #digital .digitalActions { flex-direction: column; align-items: stretch; }
  #digital .digitalActions .btn { justify-content: center; }
  #digital .digitalBlock { padding-top: 62px; }
  #digital .digitalJourney { grid-template-columns: 1fr; }
  #digital .digitalJourney li, #digital .digitalJourney li + li { display: flex; gap: 20px; padding: 25px 0; border-left: 0; border-bottom: 1px solid #ffffff20; }
  #digital .digitalJourney h3 { margin-top: 0; }
  #digital .digitalJourney li > span { font-size: 1.4rem; }
  #digital .digitalRequest { margin-top: 62px; padding: 28px 21px; }
  #digital .digitalRequest aside { padding: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  html:has(body.digitalPage) { scroll-behavior: auto; }
  #digital .digitalJumpNav a { transition: none; }
}
