/* Service · Gardiennage & surveillance */

/* Hero -------------------------------------------------------------------- */
.gd-hero { position: relative; display: flex; min-height: max(720px, 92svh); background: var(--nuit); overflow: hidden; isolation: isolate; }
.gd-hero__bg { position: absolute; inset: 0; z-index: -1; }
.gd-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; }
.gd-hero__bg::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(11, 18, 32, .96) 0%, rgba(11, 18, 32, .82) 42%, rgba(11, 18, 32, .15) 80%),
    linear-gradient(180deg, rgba(11, 18, 32, .35) 0%, rgba(11, 18, 32, 0) 30%, rgba(11, 18, 32, .5) 100%);
}
.gd-hero__inner { display: flex; justify-content: space-between; align-items: flex-end; gap: 48px; padding-top: calc(var(--header-h) + 96px); padding-bottom: 72px; }
.gd-hero__copy { display: grid; justify-items: start; gap: 28px; max-width: 720px; }
.gd-hero__copy .eyebrow { margin-top: 12px; }
.gd-hero__title { font-size: clamp(38px, 4.7vw, 68px); }
.gd-hero__copy .lead { color: var(--texte-inverse-2); max-width: 590px; font-size: 18px; }
.gd-hero__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.gd-brief { width: 320px; flex: none; border-top: 1px solid rgba(244, 241, 234, .18); }
.gd-brief > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-block: 13px; border-bottom: 1px solid rgba(244, 241, 234, .18); }
.gd-brief dt { font-size: 10px; color: var(--texte-inverse-2); }
.gd-brief dd { font-size: 14px; font-weight: 500; text-align: right; }
@media (max-width: 1023px) {
  .gd-hero__inner { flex-direction: column; align-items: flex-start; }
  .gd-brief { width: 100%; max-width: 480px; }
}
@media (max-width: 767px) {
  .gd-hero { min-height: 0; }
  .gd-hero__bg { bottom: auto; height: 440px; }
  .gd-hero__bg img { object-position: 35% 30%; }
  .gd-hero__bg::after { background: linear-gradient(180deg, rgba(11, 18, 32, .1) 0%, rgba(11, 18, 32, .55) 60%, var(--nuit) 100%); }
  .gd-hero__inner { padding-top: 300px; padding-bottom: 32px; gap: 28px; }
  .gd-hero__copy { gap: 20px; }
  .gd-hero__copy .lead { font-size: 16px; }
  .gd-hero__actions { display: grid; width: 100%; gap: 10px; }
  .gd-hero .breadcrumb li:nth-child(2)::before { display: none; }
  .gd-brief { display: flex; justify-content: space-between; gap: 12px; max-width: none; padding-top: 14px; border-top: 1px solid rgba(244, 241, 234, .18); }
  .gd-brief > div { display: block; padding: 0; border: 0; }
  .gd-brief dt { display: none; }
  .gd-brief dd { font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--texte-inverse-2); text-align: left; font-weight: 400; }
}

/* 01 — Le service -------------------------------------------------------------- */
.gd-service { display: grid; grid-template-columns: 1fr 1.8fr; gap: clamp(32px, 4.4vw, 64px); }
.gd-service__left { display: grid; align-content: start; gap: 20px; }
.gd-service__q { font-family: var(--font-titre); font-size: 21px; font-weight: 500; letter-spacing: -.02em; color: var(--texte-2); }
.gd-service__statement { font-size: clamp(22px, 2.4vw, 34px); line-height: 1.22; letter-spacing: -.028em; padding-bottom: clamp(28px, 3.5vw, 48px); border-bottom: 1px solid var(--ligne); }
.gd-service__cols { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 4.4vw, 64px); padding-top: clamp(28px, 3vw, 40px); }
.gd-service__text { display: grid; gap: 16px; align-content: start; }
.gd-service__text .text { font-size: 16px; }
.gd-label { margin-bottom: 10px; }
.gd-dashes li { display: flex; gap: 14px; padding-block: 12px; border-bottom: 1px solid var(--ligne); font-size: 15px; }
.gd-dashes li::before { content: '–'; color: var(--laiton-encre); font-weight: 600; }
@media (max-width: 1023px) {
  .gd-service, .gd-service__cols { grid-template-columns: 1fr; }
}

/* 02 — Situations ------------------------------------------------------------------ */
.gd-situations { display: grid; grid-template-columns: 500px 1fr; gap: clamp(40px, 5.6vw, 80px); align-items: start; }
.gd-situations__left { display: grid; gap: 28px; position: sticky; top: calc(var(--header-h) + 40px); }
.gd-situations__title { font-size: clamp(34px, 3.4vw, 48px); }
.gd-situations__media { aspect-ratio: 500 / 560; }
.gd-situations__fig figcaption { margin-top: 14px; font-size: 10px; }
.gd-cases { border-top: 1px solid var(--ligne); margin-top: clamp(0px, 12vw, 172px); }
.gd-cases li { display: grid; grid-template-columns: 46px 1fr auto; gap: 8px 0; padding-block: 26px; border-bottom: 1px solid var(--ligne); transition: background var(--t) var(--ease); }
.gd-cases li > div { display: grid; gap: 8px; padding-right: 24px; }
.gd-cases li p { font-size: 15px; line-height: 1.6; color: var(--texte-2); }
.gd-cases li .mono { font-size: 10px; padding-top: 4px; text-align: right; }
.gd-cases__index { font-family: var(--font-mono); font-size: 11px; color: var(--laiton-encre); padding-top: 5px; }
.gd-cases li .h5 { transition: transform 480ms var(--ease); }
.gd-cases li:hover .h5 { transform: translateX(6px); }
@media (max-width: 1023px) {
  .gd-situations { grid-template-columns: 1fr; }
  .gd-situations__left { position: static; }
  .gd-cases { margin-top: 0; }
}
@media (max-width: 599px) {
  .gd-cases li { grid-template-columns: 34px 1fr; }
  .gd-cases li .mono { grid-column: 2; text-align: left; padding: 0; }
}

/* 03 — Étapes -------------------------------------------------------------------- */
.gd-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.gd-steps li { display: grid; align-content: start; gap: 14px; padding-top: 28px; border-top: 1px solid var(--ligne-sombre); position: relative; }
.gd-steps li::before { content: ''; position: absolute; left: 0; top: -1px; width: 100%; height: 2px; background: var(--laiton); transform: scaleX(0); transform-origin: left; transition: transform 700ms var(--ease); }
.gd-steps li:first-child::before, .gd-steps li:hover::before { transform: scaleX(1); }
.gd-steps__num { font-family: var(--font-titre); font-size: clamp(40px, 3.4vw, 48px); font-weight: 500; letter-spacing: -.03em; line-height: 1; color: var(--acier); transition: color var(--t) var(--ease); margin-bottom: 12px; }
.gd-steps li:first-child .gd-steps__num, .gd-steps li:hover .gd-steps__num { color: var(--laiton-clair); }
.gd-steps p { font-size: 14px; line-height: 1.65; color: var(--texte-inverse-2); }
.gd-steps__foot { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: clamp(48px, 5vw, 72px); padding-top: 28px; border-top: 1px solid var(--ligne-sombre); }
.gd-steps__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.gd-steps__delay { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 14px; color: var(--texte-inverse-2); }
@media (max-width: 899px) { .gd-steps { grid-template-columns: 1fr 1fr; gap: 40px 24px; } }
@media (max-width: 499px) {
  .gd-steps { grid-template-columns: 1fr; }
  .gd-steps__actions { display: grid; width: 100%; }
}

/* 04 — Pourquoi --------------------------------------------------------------------- */
.gd-why { display: grid; grid-template-columns: 480px 1fr; gap: clamp(40px, 6.7vw, 96px); align-items: start; }
.gd-why__left { display: grid; gap: 32px; }
.gd-why__title { font-size: clamp(34px, 3.4vw, 48px); }
.gd-why__media { aspect-ratio: 480 / 300; }
.gd-benefits { border-top: 1.5px solid var(--nuit); }
.gd-benefits li { display: grid; grid-template-columns: 1fr 1.3fr; gap: 8px 40px; padding-block: 28px; border-bottom: 1px solid var(--ligne); }
.gd-benefits p { font-size: 15px; line-height: 1.65; color: var(--texte-2); }
@media (max-width: 1023px) {
  .gd-why { grid-template-columns: 1fr; }
}
@media (max-width: 599px) {
  .gd-benefits li { grid-template-columns: 1fr; padding-block: 18px; }
}

/* 05 — Pros / Particuliers ------------------------------------------------------------ */
.gd-audiences { display: grid; grid-template-columns: 1fr 1fr; }
.gd-aud { padding: clamp(56px, 7.8vw, 112px) var(--gutter); }
.gd-aud--pro { background: var(--pierre); display: flex; justify-content: flex-end; }
.gd-aud--part { background: var(--nuit-2); }
.gd-aud__inner { display: grid; justify-items: start; gap: 24px; max-width: 560px; }
.gd-aud .h3 { font-size: clamp(26px, 2.6vw, 38px); }
.gd-aud .text { font-size: 16px; }
.gd-checks { width: 100%; margin-top: 8px; }
.gd-checks li { display: flex; align-items: center; gap: 14px; padding-block: 12px; border-bottom: 1px solid var(--ligne); font-size: 15px; }
.gd-checks .icon { width: 14px; height: 14px; color: var(--laiton-encre); }
.gd-aud--part .gd-checks li { border-color: var(--ligne-sombre); }
.gd-aud--part .gd-checks .icon { color: var(--laiton-clair); }
.gd-aud__actions { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; margin-top: 16px; }
@media (max-width: 899px) {
  .gd-audiences { grid-template-columns: 1fr; }
  .gd-aud--pro { justify-content: flex-start; }
}

/* 06 — Réassurance ------------------------------------------------------------------- */
.gd-trust { background: var(--ivoire); padding-block: 56px 64px; border-bottom: 1px solid var(--ligne); }
.gd-trust__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.gd-trust__grid > div { display: grid; align-content: start; gap: 10px; padding-right: 32px; border-right: 1px solid var(--ligne); }
.gd-trust__grid > div:last-child { border-right: 0; padding-right: 0; }
.gd-trust__grid dt { font-size: 10px; }
.gd-trust__aut { font-family: var(--font-titre); font-size: 17px; font-weight: 600; letter-spacing: -.01em; overflow-wrap: anywhere; }
.gd-trust__value { font-family: var(--font-titre); font-size: 24px; font-weight: 600; letter-spacing: -.025em; }
.gd-trust__note { font-size: 13px; line-height: 1.55; color: var(--texte-2); }
.gd-trust__slot { display: grid; place-items: center; height: 56px; border: 1.5px solid var(--laiton); border-radius: var(--radius); background: rgba(185, 139, 47, .06); }
@media (max-width: 1023px) {
  .gd-trust__grid { grid-template-columns: 1fr 1fr; }
  .gd-trust__grid > div:nth-child(2n) { border-right: 0; padding-right: 0; }
}
@media (max-width: 599px) {
  .gd-trust__grid { grid-template-columns: 1fr; gap: 0; }
  .gd-trust__grid > div { padding: 18px 0; border-right: 0; border-bottom: 1px solid var(--ligne); }
  .gd-trust__grid > div:last-child { border-bottom: 0; }
}

/* 07 — FAQ ------------------------------------------------------------------------------- */
.gd-faq { display: grid; grid-template-columns: 1fr 1.6fr; gap: clamp(40px, 5.6vw, 80px); align-items: start; }
.gd-faq__left { display: grid; gap: 28px; position: sticky; top: calc(var(--header-h) + 40px); }
.gd-faq__title { font-size: clamp(34px, 3.4vw, 48px); }
.gd-faq__left .text { font-size: 16px; max-width: 400px; }
.gd-faq__tel { color: var(--nuit); font-weight: 600; border-bottom: 1px solid var(--laiton); white-space: nowrap; }
.gd-faq .faq__q { padding-block: 24px; }
@media (max-width: 899px) {
  .gd-faq { grid-template-columns: 1fr; }
  .gd-faq__left { position: static; }
}

/* 08 — Services associés ------------------------------------------------------------------- */
.gd-related { display: grid; grid-template-columns: 300px 1fr; gap: clamp(40px, 4.4vw, 64px); align-items: start; }
.gd-related__left { display: grid; justify-items: start; gap: 28px; }
.gd-related__title { font-size: clamp(32px, 2.8vw, 40px); }
.gd-related__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.gd-rel { display: grid; justify-items: start; align-content: start; gap: 14px; }
.gd-rel__media { width: 100%; aspect-ratio: 288 / 260; margin-bottom: 8px; }
.gd-rel__head { display: flex; justify-content: space-between; width: 100%; }
.gd-rel__head .mono { font-size: 10px; }
.gd-rel .text { font-size: 15px; }
.gd-rel .h5 { transition: color var(--t) var(--ease); }
.gd-rel:hover .h5 { color: var(--laiton-encre); }
.gd-rel:hover .link::before { transform: scaleX(1); transform-origin: left; }
@media (max-width: 1023px) {
  .gd-related { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .gd-related__cards { grid-template-columns: 1fr; gap: 40px; }
  .gd-rel__media { aspect-ratio: 16 / 10; }
}