/* Reuse the accepted service page typography/spacing without changing it. */
.ad-page .ad-hero { padding-bottom:20px; position:relative; isolation:isolate; background:#001126; }
/* Keep the original 70% navy overlay; move the crossing below the step text.
   Feather only the upper image edge exposed by the 48px position offset. */
.ad-hero::before { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(#001126b3,#001126b3),url('../assets/contact-trails.png') center calc(100% + 48px) / cover no-repeat; mask-image:linear-gradient(to bottom,transparent 48px,#000 144px); }
.ad-hero .ws-breadcrumb { padding:18px 0 24px; }
.ad-hero .ws-hero-grid { grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); gap:clamp(48px,4vw,64px); }
.ad-hero h1 { font-size:clamp(36px,4.2vw,60px); line-height:1.3; margin-bottom:20px; }
.ad-hero .ws-service-name { font-size:20px; line-height:1.5; margin-bottom:14px; }
.ad-hero .ws-lead { font-size:18px; line-height:1.8; max-width:34em; }
.ad-hero .ws-lead > span { display:block; text-wrap:balance; }
.ad-phrase { display:inline-block; max-width:100%; vertical-align:baseline; }
.ad-hero .ws-hero-actions { display:grid; grid-template-columns:max-content 1fr; align-items:center; gap:12px 24px; margin-top:24px; }
.ad-hero .button { min-height:58px; padding:14px 28px; gap:20px; }
.ad-hero .ws-hero-link { grid-column:2; grid-row:1; justify-self:start; min-height:44px; }
.ad-hero .ws-hero-link .icon { transform:rotate(90deg); width:20px; height:20px; flex:none; }
.ad-hero .ws-caption { grid-column:1/-1; grid-row:2; margin:0; color:#d1dfef; font-size:14px; line-height:1.8; text-wrap:balance; }
.ad-hero .ad-hero-image figcaption { display:block; padding-top:10px; font-size:12px; line-height:1.6; font-weight:400; color:#c6d8ee; }
.ad-hero a:focus-visible { outline-color:#c0e3ff; }
.ad-page .ws-page-nav a { min-height:60px; padding:12px 15px; }
.ad-page .ws-heading h2 { text-wrap:balance; }
.ad-page .ws-heading .eyebrow { font-size:13px; font-weight:700; letter-spacing:.1em; }
.ad-page .ws-features { padding-bottom:clamp(56px,5vw,76px); }
.ad-page .ad-scope-note { margin-top:24px; font-size:15px; color:#425572; }
.ad-scope-note .ws-text-link { display:inline-flex; align-items:center; gap:8px; margin-left:8px; font-weight:600; }
.ad-scope-note .icon { transform:rotate(90deg); flex:none; }
.ad-stages { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; margin:20px 0 0; padding:16px 0 8px; border-top:1px solid #ffffff30; gap:24px; }
.ad-stages li { display:grid; grid-template-columns:44px minmax(0,1fr) 16px; gap:12px; align-items:start; }
.ad-stage-icon { display:grid; place-items:center; border:1px solid #89afd4; border-radius:50%; width:44px; height:44px; color:#bddfff; }
.ad-stage-icon .icon { width:23px; height:23px; }
.ad-stage-index { font-size:12px; color:#bad6ef; letter-spacing:.1em; margin-right:10px; }
.ad-stages strong { font-size:20px; font-weight:600; line-height:1.5; }
.ad-stages p { color:#d6e3f2; font-size:14px; line-height:1.7; margin-top:4px; text-wrap:balance; }
.ad-stages li > .icon { color:#bad0e8; width:16px; height:16px; align-self:center; }
.ad-media { display:grid; grid-template-columns:1fr 1fr; gap:32px; padding:28px 0; margin-top:24px; border-block:1px solid #c6d8ed; }
.ad-media h3 { font-size:18px; font-weight:700; margin:0 0 15px; }
.ad-media ul { display:flex; flex-wrap:wrap; list-style:none; gap:10px; margin:0; padding:0; }
.ad-media li { padding:6px 16px; background:#fff; border:1px solid #c1d3eb; border-radius:4px; font-size:14px; font-weight:500; color:#294d87; }
.ad-media p { font-size:14px; line-height:1.9; color:#425572; }
.ad-page .ad-case-grid { grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:44px; row-gap:0; }
.ad-case-grid .ws-case { display:grid; grid-template-rows:subgrid; grid-row:span 7; }
.ad-page .ws-case-facts { font-size:15px; display:grid; grid-template-rows:subgrid; grid-row:span 3; row-gap:0; }
.ad-page .ws-case-facts > div { grid-template-columns:6em minmax(0,1fr); gap:16px; margin-bottom:18px; }
.ad-page .ws-case-facts > div:last-child { margin-bottom:0; }
.ad-case-services { list-style:'・'; margin:0; padding-left:1em; }
.ad-page .ad-case-caption { margin-top:28px; color:#526783; font-size:13px; }
.ad-page .ad-price-condition { display:block; font-size:13px; color:#345a95; margin-bottom:5px; }
.ad-page .site-contact .site-contact-button { width:min(100%,400px); min-height:64px; font-size:18px; font-weight:700; gap:20px; background:var(--gradient); }
.ad-page .site-contact .site-contact-button .icon { width:26px; height:26px; }
.ad-page .ws-related a { max-width:100%; }
.ad-page .ws-related a .icon { flex:none; }
@media(max-width:1100px) {
  .ad-hero .ws-hero-actions { grid-template-columns:1fr; gap:12px; }
  .ad-hero .button { width:100%; }
  .ad-hero .ws-hero-link { grid-column:1; grid-row:3; justify-self:center; }
  .ad-hero .ws-caption { text-align:center; }
}
@media(max-width:980px) {
  .ad-hero .ws-hero-grid { gap:28px; }
  .ad-hero h1 { font-size:clamp(30px,4.2vw,40px); }
  .ad-hero .ws-service-name { font-size:16px; }
  .ad-hero .ws-lead { font-size:17px; }
  .ad-hero .button { width:100%; min-height:56px; padding:12px 18px; }
  .ad-stages { gap:20px; }
  .ad-stages li { grid-template-columns:44px minmax(0,1fr); gap:12px; }
  .ad-stages li > .icon { display:none; }
  .ad-page .ws-page-nav a { padding:12px 7px; }
  .ad-page .ad-case-grid { column-gap:28px; }
}
@media(max-width:700px) {
  .ad-hero::before { display:none; }
  .ad-hero .ws-hero-copy { position:relative; }
  /* Anchor the existing portrait trails near the CTA/photo, at their natural ratio.
     The layer spans the 88% container's full viewport; only its edges fade. */
  .ad-hero .ws-hero-copy::before { content:''; position:absolute; z-index:-1; pointer-events:none; top:0; bottom:-36px; left:50%; transform:translateX(-50%); width:calc(100% / .88); background:linear-gradient(#001126b3,#001126b3),url('../assets/contact-mobile-trails.png') center bottom / 100% auto no-repeat; mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 92%,transparent); }
  .ad-hero .ws-breadcrumb { padding:18px 0 22px; }
  .ad-hero .ws-hero-grid { grid-template-columns:1fr; gap:22px; }
  .ad-hero h1 { font-size:clamp(30px,8.4vw,48px); margin-bottom:20px; }
  .ad-hero .ws-service-name { font-size:15px; margin-bottom:16px; }
  .ad-hero .ws-lead { font-size:17px; line-height:1.8; }
  .ad-hero .ws-hero-actions { margin-top:22px; gap:10px; }
  .ad-hero .button { font-size:15px; }
  .ad-hero .ws-hero-link { font-size:14px; }
  .ad-hero .ws-caption { font-size:14px; }
  .ad-hero .ad-hero-image figcaption { padding-top:8px; }
  .ad-stages { grid-template-columns:1fr; gap:16px; }
  .ad-stages li { padding-bottom:16px; border-bottom:1px solid #ffffff20; }
  .ad-stages li:last-child { border-bottom:0; padding-bottom:0; }
  .ad-stages strong { font-size:19px; }
  .ad-stages p { font-size:14px; }
  .ad-page .ws-page-nav a { min-height:48px; padding:10px 3px; }
  .ad-media { grid-template-columns:1fr; gap:18px; margin-top:20px; padding-block:24px; }
  .ad-media h3 { font-size:17px; }
  .ad-media li { padding:5px 12px; font-size:13px; }
  .ad-page .ad-case-grid { grid-template-columns:1fr; gap:40px; }
  .ad-case-grid .ws-case { display:flex; grid-row:auto; }
  .ad-page .ws-case-facts { display:block; grid-row:auto; }
  .ad-page .ws-case-facts > div { grid-template-columns:1fr; gap:6px; }
  .ad-page .ad-case-caption { font-size:12px; }
  .ad-page .site-contact .site-contact-button { font-size:16px; min-height:60px; gap:14px; }
}