/* ============================================================================
   Service detail pages (all six services)
   Markup: pages/service-detail.php + includes/service-pages.php
   Loaded only on this page (see the route's "css" key in config.php).
   Shared blocks such as buttons, heroes and closing CTAs live in components.css.
   ========================================================================= */

/* Hero */
.rp-detail-hero{ background:var(--rp-hero-bg); padding:clamp(56px,6vw,80px) 0 clamp(64px,6vw,76px); }
.rp-detail-hero__inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,495px);
  align-items:center;
  gap:clamp(32px,6vw,90px);
}
.rp-detail-hero__tag{
  font-size:13px;
  font-weight:600;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--rp-gold-bright);
  margin:0 0 22px;
}
.rp-detail-hero__name{ font-size:clamp(1.3rem,2vw,1.625rem); line-height:1.3; color:#374151; margin:0 0 18px; }
.rp-detail-hero__title{
  font-size:clamp(2.6rem,5vw,4rem);
  font-weight:400;
  line-height:1.12;
  letter-spacing:-.005em;
  color:var(--rp-ink-blue);
  margin:0 0 30px;
}
.rp-detail-hero__lead{ max-width:500px; font-size:17px; line-height:1.7; color:#374151; margin:0 0 26px; }
.rp-detail-hero__actions{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.rp-detail-hero__actions .rp-btn{
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:20px 56px;
  font-size:14px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.rp-detail-hero__actions svg{ width:13px; height:13px; }
.rp-detail-hero__actions .rp-btn--gold{
  background:var(--rp-gold-bright);
  color:#374151;
  box-shadow:0 14px 28px -14px rgba(214,160,40,.8);
}
.rp-detail-hero__actions .rp-btn--gold:hover{ background:#F0C55A; color:var(--rp-ink-blue); }
.rp-detail-hero__figure{
  margin:0;
  aspect-ratio:495/510;
  overflow:hidden;
  -webkit-clip-path:polygon(23% 0,100% 0,100% 100%,0 100%);
          clip-path:polygon(23% 0,100% 0,100% 100%,0 100%);
}
.rp-detail-hero__figure img{ width:100%; height:100%; object-fit:cover; }
.rp-detail-hero__figure.is-mono img{ filter:grayscale(1) contrast(1.05); }

/* Challenges */
.rp-section.rp-pains{ background:#F8F5F0; padding-block:clamp(72px,8vw,86px) clamp(80px,9vw,110px); }
.rp-pains__header{ max-width:none; margin-bottom:44px; }
.rp-pains__header .rp-heading,
.rp-flowbox__header .rp-heading,
.rp-answers__header .rp-heading{
  font-size:clamp(1.9rem,3.2vw,2.75rem);
  font-weight:400;
  line-height:1.08;
  color:var(--rp-ink-blue);
}
.rp-pains__grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:16px;
  list-style:none;
  margin:0;
  padding:0;
}
.rp-pains__grid li{
  min-height:220px;
  padding:26px 26px 30px;
  background:#FAF8F5;
  border:1px solid #D6D3CE;
}
.rp-pains__no{
  display:block;
  font-family:var(--rp-serif);
  font-size:30px;
  line-height:1;
  font-variant-numeric:lining-nums;
  color:var(--rp-gold-bright);
  margin-bottom:26px;
}
.rp-pains__grid p{ font-size:17px; font-weight:500; line-height:1.65; color:#374151; margin:0; }

/* What we do */
.rp-section.rp-scope{ background:#0A1D38; padding-block:clamp(72px,7.5vw,88px) clamp(90px,11vw,150px); }
.rp-scope__grid{
  display:grid;
  grid-template-columns:minmax(0,350px) minmax(0,704px);
  justify-content:space-between;
  gap:40px;
}
.rp-scope .rp-eyebrow{ font-size:13px; letter-spacing:.14em; color:var(--rp-gold-bright); margin-bottom:22px; }
.rp-scope__title{
  font-size:clamp(2rem,3.4vw,2.75rem);
  font-weight:400;
  line-height:1.1;
  color:#fff;
  margin:0 0 34px;
}
.rp-scope__text{ max-width:340px; font-size:16px; line-height:1.75; color:#B8C0CC; margin:0; }
.rp-scope__list{ display:grid; gap:12px; list-style:none; margin:0; padding:0; }
.rp-scope__list li{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:92px;
  padding:18px 23px;
  background:#12264A;
  border:1px solid rgba(255,255,255,.14);
  font-size:16px;
  font-weight:500;
  color:#fff;
  transition:border-color .3s var(--rp-ease), background-color .3s var(--rp-ease);
}
.rp-scope__list li:hover{ background:#162D55; border-color:rgba(232,182,62,.45); }
.rp-scope__no{
  flex:none;
  font-family:var(--rp-serif);
  font-size:24px;
  font-variant-numeric:lining-nums;
  color:var(--rp-gold-bright);
}

/* How we work */
.rp-section.rp-flowbox{ background:#F9F8F6; padding-block:clamp(72px,8vw,96px) clamp(90px,10vw,130px); }
.rp-flowbox__header{ max-width:none; margin-bottom:40px; }
.rp-flowbox__header .rp-eyebrow,
.rp-answers__header .rp-eyebrow{ font-size:13px; letter-spacing:.2em; color:var(--rp-gold-bright); margin-bottom:22px; }
.rp-flowbox__steps{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  list-style:none;
  margin:0;
  padding:0;
  border:1px solid #D1D1D1;
}
.rp-flowbox__steps li{ min-height:248px; padding:26px 26px 30px; }
.rp-flowbox__steps li + li{ border-left:1px solid #D1D1D1; }
.rp-flowbox__no{
  font-size:13px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--rp-gold-bright);
  margin:0 0 12px;
}
.rp-flowbox__title{ font-size:clamp(1.6rem,2.4vw,2rem); font-weight:400; letter-spacing:0; color:var(--rp-ink-blue); margin:0 0 18px; }
.rp-flowbox__text{ font-size:14.5px; line-height:1.6; color:#4B5563; margin:0; }

/* What you gain */
.rp-section.rp-gains{ background:#F7F5F0; padding-block:clamp(72px,8vw,86px); }
.rp-gains__grid{
  display:grid;
  grid-template-columns:minmax(0,440px) minmax(0,650px);
  justify-content:space-between;
  gap:40px;
}
.rp-gains .rp-eyebrow{ font-size:13px; letter-spacing:.14em; color:var(--rp-gold-bright); margin-bottom:14px; }
.rp-gains__title{
  font-size:clamp(1.9rem,3.2vw,2.6rem);
  font-weight:400;
  line-height:1.12;
  color:var(--rp-ink-blue);
  margin:0;
}
.rp-gains__list{ list-style:none; margin:0; padding:0; }
.rp-gains__list li{ padding:26px 0 30px; font-size:19px; font-weight:500; line-height:1.4; color:#374151; }
.rp-gains__list li:first-child{ padding-top:10px; }
.rp-gains__list li + li{ border-top:1px solid #D1D1D1; }

/* FAQ */
.rp-section.rp-answers{ background:#F9F8F6; padding-block:clamp(72px,8vw,96px) clamp(64px,7vw,80px); }
.rp-answers__header{ max-width:none; margin-bottom:44px; }
.rp-answers__list{ max-width:896px; margin:0 auto; }
.rp-answers__list div{ padding:20px 0 30px; border-bottom:1px solid #D1D1D1; }
.rp-answers__list div:first-child{ padding-top:0; }
.rp-answers__list dt{ font-size:17px; font-weight:600; line-height:1.4; color:#374151; margin:0 0 10px; }
.rp-answers__list dd{ margin:0; font-size:15px; line-height:1.55; color:#4B5563; max-width:860px; }

/* Closing call to action — shares .rp-ready with the services page */
.rp-section.rp-ready--detail{ background:#0A1D38; padding-block:clamp(80px,9vw,96px); }
.rp-ready--detail .rp-ready__header{ margin-bottom:26px; }
.rp-ready--detail .rp-eyebrow{ font-size:13px; letter-spacing:.2em; color:var(--rp-gold-bright); margin-bottom:18px; }
.rp-ready--detail .rp-heading{ font-size:clamp(2rem,3.8vw,3rem); line-height:1.05; margin-bottom:.8em; }
.rp-ready--detail .rp-lead{ max-width:720px; margin-inline:auto; }

@media (max-width:1024px){
  .rp-pains__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .rp-flowbox__steps{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .rp-flowbox__steps li:nth-child(3){ border-left:0; }
  .rp-flowbox__steps li:nth-child(n+3){ border-top:1px solid #D1D1D1; }
}
@media (max-width:860px){
  .rp-detail-hero__inner,
  .rp-scope__grid,
  .rp-gains__grid{ grid-template-columns:1fr; }
  .rp-detail-hero__figure{ max-width:495px; }
}
/* ----------------------------------------------------------------------------
   Mobile hero: photo cover. The photo fills the top of the hero and fades into
   navy; the copy rises over the fade, so the photo is the first thing seen.
   ------------------------------------------------------------------------- */
@media (max-width:860px){
  .rp-detail-hero{ position:relative; isolation:isolate; padding:0; background:#091D36; }
  .rp-detail-hero__figure{
    position:absolute;
    inset:0 0 auto;
    z-index:-1;
    max-width:none;
    height:400px;
    aspect-ratio:auto;
    -webkit-clip-path:none;
            clip-path:none;
  }
  .rp-detail-hero__figure::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(9,29,54,0) 35%, rgba(9,29,54,.75) 72%, #091D36 100%);
  }
  .rp-detail-hero__copy{ padding:290px 0 56px; }
  .rp-detail-hero__name,
  .rp-detail-hero__lead{ color:rgba(255,255,255,.86); }
  .rp-detail-hero__title{ color:#fff; }
  .rp-detail-hero__actions .rp-btn--outline{ color:#fff; border-color:rgba(255,255,255,.6); }
}

@media (max-width:560px){
  .rp-pains__grid,
  .rp-flowbox__steps{ grid-template-columns:1fr; }
  .rp-flowbox__steps li + li{ border-left:0; border-top:1px solid #D1D1D1; }
  .rp-pains__grid li,
  .rp-flowbox__steps li{ min-height:0; }
  .rp-detail-hero__actions .rp-btn{ padding-inline:32px; }
}