/* =========================================================
   service-details.css
   Centered Hero → Information + Photo → Required Documents
   List → Compact Service Title + Price + Apply Now → Footer
========================================================= */

.service-details-page{
  --sdp-navy:#081D3A;
  --sdp-hero-image:none;
  --sdp-navy-soft:#0F2648;
  --sdp-cyan:#0CC0DF;
  --sdp-cyan-dark:#087A94;
  --sdp-text:#5D728C;
  --sdp-border:#E6F2F7;
  --sdp-bg:#F8FDFF;
  background:var(--sdp-bg);
  color:var(--sdp-navy);
}

.sdp-shell{
  width:min(1180px, calc(100% - 3rem));
  margin-inline:auto;
}

/* ========================= HERO ========================= */
.service-details-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:grid;
  place-items:center;
  min-height:320px;
  padding:8.6rem 0 3.8rem;
  color:#fff;
  text-align:center;
  border-bottom:1px solid rgba(12,192,223,.18);
}

.service-details-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-3;
  background-image:var(--sdp-hero-image);
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  transform:scale(1.03);
}

.service-details-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(145deg, rgba(7,24,47,.82) 0%, rgba(8,29,58,.78) 52%, rgba(15,38,72,.82) 100%),
    radial-gradient(circle at 18% 30%, rgba(12,192,223,.18), transparent 33%),
    radial-gradient(circle at 83% 22%, rgba(57,216,245,.10), transparent 31%);
}

.sdp-hero-pattern{
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:.12;
  background-image:radial-gradient(rgba(127,227,240,.62) 1px,transparent 1px);
  background-size:25px 25px;
  mask-image:linear-gradient(to bottom,black,transparent 92%);
}

.sdp-hero-inner{ display:flex; flex-direction:column; align-items:center; }

.sdp-crumb{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:.55rem;
  margin-bottom:1.25rem;
  color:rgba(255,255,255,.58);
  font-size:.76rem;
  font-weight:600;
}
.sdp-crumb a{ transition:color .25s ease; }
.sdp-crumb a:hover,.sdp-crumb a:focus-visible{ color:#7FE3F0; outline:none; }
.sdp-crumb i{ font-size:.55rem; color:rgba(127,227,240,.5); }
.sdp-crumb span{ color:rgba(255,255,255,.82); }

.sdp-category-pill{
  display:inline-flex;
  align-items:center;
  gap:.48rem;
  min-height:34px;
  padding:.35rem .85rem;
  border:1px solid rgba(12,192,223,.28);
  border-radius:999px;
  background:rgba(12,192,223,.10);
  color:#7FE3F0;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.04em;
}

.service-details-hero h1{
  max-width:880px;
  margin:.8rem 0 0;
  color:#fff;
  font-size:clamp(2rem,4.6vw,3.65rem);
  line-height:1.08;
  font-weight:800;
  letter-spacing:-.035em;
  text-wrap:balance;
}

/* ========================= MAIN CONTENT ========================= */
.service-content-section{ padding:4rem 0 4.5rem; }

.sdp-service-layout{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(280px,.72fr);
  gap:1.5rem;
  align-items:stretch;
}

.sdp-info-panel,
.sdp-photo-panel{
  min-width:0;
  border:1px solid var(--sdp-border);
  border-radius:1.55rem;
  background:#fff;
  box-shadow:0 18px 44px -24px rgba(8,29,58,.30);
}

.sdp-info-panel{ padding:2rem; }

.sdp-eyebrow{
  display:block;
  margin-bottom:.38rem;
  color:var(--sdp-cyan-dark);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.sdp-info-header h2{
  margin:0;
  color:var(--sdp-navy);
  font-size:clamp(1.45rem,2.5vw,2rem);
  line-height:1.2;
  font-weight:800;
}

.sdp-info-header p{
  max-width:680px;
  margin:.7rem 0 0;
  color:var(--sdp-text);
  font-size:.94rem;
  line-height:1.8;
}
.sdp-copy-stack{
  margin-top:1.6rem;
  display:grid;
  gap:1rem;
}
.sdp-copy-stack p{
  margin:0;
  color:var(--sdp-text);
  font-size:.92rem;
  line-height:1.9;
}
.sdp-feature-list{
  margin:.15rem 0 0;
  padding:1rem 1rem 1rem 1.15rem;
  border:1px solid var(--sdp-border);
  border-radius:1rem;
  background:#FBFEFF;
}
.sdp-feature-list h3{
  margin:0 0 .75rem;
  color:var(--sdp-navy);
  font-size:.95rem;
  font-weight:800;
}
.sdp-feature-list ul{
  margin:0;
  padding-left:1.15rem;
  display:grid;
  gap:.5rem;
}
.sdp-feature-list li{
  color:var(--sdp-text);
  font-size:.88rem;
  line-height:1.7;
}

.sdp-info-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.75rem;
  margin:1.55rem 0 0;
}

.sdp-info-item{
  min-width:0;
  padding:.9rem 1rem;
  border:1px solid var(--sdp-border);
  border-radius:1rem;
  background:#FBFEFF;
}
.sdp-info-item:first-child{ grid-column:1/-1; }
.sdp-info-item dt{
  display:flex;
  align-items:center;
  gap:.5rem;
  color:var(--sdp-text);
  font-size:.73rem;
  font-weight:700;
}
.sdp-info-item dt i{ width:1rem; color:var(--sdp-cyan-dark); text-align:center; }
.sdp-info-item dd{
  margin:.32rem 0 0;
  color:var(--sdp-navy);
  font-size:.86rem;
  line-height:1.55;
  font-weight:700;
  overflow-wrap:anywhere;
}

/* ========================= DOCUMENT LIST ========================= */
.sdp-documents-block{
  margin-top:1.6rem;
  padding-top:1.5rem;
  border-top:1px solid var(--sdp-border);
}

.sdp-block-heading{
  display:flex;
  align-items:center;
  gap:.78rem;
  margin-bottom:1rem;
}
.sdp-block-icon{
  width:2.55rem;
  height:2.55rem;
  flex:none;
  display:grid;
  place-items:center;
  border-radius:.8rem;
  background:rgba(12,192,223,.12);
  color:var(--sdp-cyan-dark);
}
.sdp-block-heading h3{
  margin:0;
  color:var(--sdp-navy);
  font-size:1rem;
  font-weight:800;
}
.sdp-block-heading p{
  margin:.14rem 0 0;
  color:var(--sdp-text);
  font-size:.75rem;
}

.sdp-document-list{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:.7rem;
}

.sdp-document-item{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:flex-start;
  gap:.75rem;
  min-width:0;
  padding:.8rem .9rem;
  border-radius:.85rem;
  background:#F8FDFF;
  border:1px solid rgba(230,242,247,.92);
}
.sdp-document-number{
  color:var(--sdp-cyan-dark);
  font-size:.92rem;
  line-height:1.6;
  font-weight:800;
}
.sdp-document-name{
  color:var(--sdp-navy);
  font-size:.86rem;
  line-height:1.6;
  font-weight:700;
  overflow-wrap:anywhere;
}

/* ========================= COMPACT APPLY ========================= */
.sdp-compact-apply{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:1rem;
  margin-top:1.65rem;
  padding:1rem;
  border-radius:1.1rem;
  background:linear-gradient(135deg,#081D3A,#0F2648);
  border:1px solid rgba(12,192,223,.22);
  box-shadow:0 16px 35px -22px rgba(8,29,58,.7);
}
.sdp-apply-copy,.sdp-apply-price{ min-width:0; }
.sdp-apply-copy span,.sdp-apply-price span{
  display:block;
  color:#8FA3BE;
  font-size:.65rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.sdp-apply-copy strong{
  display:block;
  margin-top:.22rem;
  color:#fff;
  font-size:.88rem;
  line-height:1.3;
  font-weight:800;
  overflow-wrap:anywhere;
}
.sdp-apply-price{
  padding-left:1rem;
  border-left:1px solid rgba(255,255,255,.1);
  white-space:nowrap;
}
.sdp-apply-price strong{
  display:block;
  margin-top:.18rem;
  color:#7FE3F0;
  font-size:1.08rem;
  font-weight:800;
}

.sdp-btn-primary{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding:.72rem 1.2rem;
  border-radius:.85rem;
  background:var(--sdp-cyan);
  color:var(--sdp-navy);
  font-size:.86rem;
  font-weight:800;
  text-decoration:none;
  white-space:nowrap;
  box-shadow:0 12px 28px -12px rgba(12,192,223,.85);
  transition:transform .25s ease,background-color .25s ease,box-shadow .25s ease;
}
.sdp-btn-primary:hover{ transform:translateY(-2px); background:#39D8F5; box-shadow:0 16px 32px -11px rgba(12,192,223,.95); }
.sdp-btn-primary:focus-visible{ outline:3px solid rgba(127,227,240,.55); outline-offset:3px; }

/* ========================= PHOTO ========================= */
.sdp-photo-panel{
  position:relative;
  overflow:hidden;
  align-self:start;
  justify-self:end;
  width:100%;
  max-width:420px;
  min-height:auto;
  background:#081D3A;
}
.sdp-photo-panel img{
  width:100%;
  height:auto;
  display:block;
  aspect-ratio:4 / 3;
  object-fit:cover;
  object-position:center;
  transition:transform .7s cubic-bezier(.16,.8,.28,1);
}
.sdp-photo-panel:hover img{ transform:scale(1.02); }
.sdp-photo-panel::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(to top,rgba(5,20,40,.78),transparent 40%);
}
.sdp-photo-panel figcaption{
  position:absolute;
  left:1rem;
  right:1rem;
  bottom:1rem;
  z-index:1;
  display:flex;
  align-items:center;
  gap:.62rem;
  padding:.7rem .85rem;
  border-radius:.9rem;
  background:rgba(8,29,58,.78);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-size:.76rem;
  font-weight:700;
}
.sdp-photo-panel figcaption i{ color:#7FE3F0; }

/* ========================= RESPONSIVE ========================= */
@media (max-width:1023px){
  .sdp-shell{ width:min(100% - 2.5rem, 880px); }
  .service-details-hero{ min-height:285px; padding:7.6rem 0 3.2rem; }
  .service-content-section{ padding:3rem 0 3.5rem; }
  .sdp-service-layout{ grid-template-columns:1fr; }
  .sdp-photo-panel{ order:-1; max-width:none; justify-self:stretch; }
  .sdp-photo-panel img{ max-height:380px; }
}

@media (max-width:639px){
  .sdp-shell{ width:calc(100% - 2rem); }
  .service-details-hero{ min-height:245px; padding:6.7rem 0 2.6rem; }
  .service-details-hero h1{ font-size:clamp(1.8rem,9vw,2.45rem); }
  .sdp-crumb{ margin-bottom:1rem; font-size:.7rem; }
  .service-content-section{ padding:1.9rem 0 2.5rem; }
  .sdp-service-layout{ gap:1rem; }
  .sdp-info-panel{ padding:1.2rem; border-radius:1.2rem; }
  .sdp-photo-panel{ border-radius:1.2rem; }
  .sdp-photo-panel img{ max-height:260px; }
  .sdp-info-list{ grid-template-columns:1fr; gap:.65rem; margin-top:1.2rem; }
  .sdp-info-item:first-child{ grid-column:auto; }
  .sdp-document-list{ grid-template-columns:1fr; }
  .sdp-compact-apply{ grid-template-columns:1fr auto; gap:.8rem; }
  .sdp-apply-price{ padding-left:0; border-left:0; text-align:right; }
  .sdp-compact-apply .sdp-btn-primary{ grid-column:1/-1; width:100%; }
}

@media (max-width:374px){
  .sdp-shell{ width:calc(100% - 1.4rem); }
  .sdp-info-panel{ padding:1rem; }
  .sdp-compact-apply{ grid-template-columns:1fr; }
  .sdp-apply-price{ text-align:left; }
  .sdp-compact-apply .sdp-btn-primary{ grid-column:auto; }
}

@media (prefers-reduced-motion:reduce){
  .sdp-photo-panel img,.sdp-btn-primary{ transition:none !important; }
}


/* Service-specific payment note */
.sdp-payment-note{
  display:block;
  margin-top:.18rem;
  color:var(--sdp-text);
  font-size:.72rem;
  line-height:1.45;
  font-weight:600;
}


/* Course details numeric readability */
.service-details-page .sdp-info-item dd,
.service-details-page .sdp-document-name{
  text-wrap:pretty;
}
.service-details-page .sdp-photo-panel img{
  object-position:center;
}