/* Sub-page layout unification.

   Reference: /lasik/nova — the only page already built on the target grid.
     .ce-nova-sec__inner   max-width 1232px; padding 0 24px
     .dn-faq__inner        max-width 1232px; padding 0 24px
   Every content width below is that one number. Do not add a second band here:
   subpage.css caps .dn-geo-block at 900px and .dn-sub-hero__intro-inner at
   1160px, and mixing a third value is what put these pages out of step.

   Load order: this file comes after subpage.css, so equal-specificity rules win.
   Note: .introduce_wrap .dn-geo-block carries max-width:100% !important in
   subpage.css. That is deliberate and is left alone. */

:root{
  --ce-unify-max: 1232px;          /* nova .ce-nova-sec__inner */
  --ce-unify-gutter: 24px;         /* nova inner padding */
  --ce-unify-gutter-mobile: 16px;
  --ce-rail-clear: 79px;           /* right quick rail: 67px wide + 12px gap */
  --ce-step-top: 72px;
  --ce-step-bottom: 80px;
}

/* ------------------------------------------------------------------
   1. Body bands.
   ------------------------------------------------------------------ */
.dn-geo-block,
.dn-sub-hero__intro-inner{
  max-width: var(--ce-unify-max);
}

.dn-geo-block{
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--ce-unify-gutter);
  padding-right: var(--ce-unify-gutter);
  padding-top: 0;
  padding-bottom: 40px;
}

@media (min-width: 1200px){
  .dn-sub-hero__intro-inner{ max-width: var(--ce-unify-max); }
}

/* Higher-specificity guard for pages that opt in with .ce-unify on the wrapper.
   Same values as above; this only outranks competing two-class rules. */
.ce-unify .dn-geo-block,
.ce-unify .dn-sub-hero__intro-inner{
  max-width: var(--ce-unify-max);
  padding-left: var(--ce-unify-gutter);
  padding-right: var(--ce-unify-gutter);
}

/* ------------------------------------------------------------------
   2. Physician pages.
   .cont2 carries a 1920px max-width, so the content spanned the full
   viewport with 100px side padding.
   ------------------------------------------------------------------ */
.doctor_wrap .cont_box1 > .cont.cont2{
  max-width: var(--ce-unify-max) !important;
  padding-left: var(--ce-unify-gutter);
  padding-right: var(--ce-unify-gutter);
}
.doctor_wrap .cont_box1{
  padding-top: var(--ce-step-top);
  padding-bottom: var(--ce-step-bottom);
}

/* ------------------------------------------------------------------
   3. Pages built on the dn-loc-* shell (about/location, news/*, support/*).
   These class names exist only on those fragments, so nothing else moves.
   ------------------------------------------------------------------ */

/* Split band — remove the one-sided right gutter. subpage.css sets
   padding-right:118px with no left counterpart, which pushes the whole band
   off centre and leaves dead space on the right. The body column already
   carries 88px of padding, which clears the 79px rail on its own, so the
   band can run full bleed symmetrically. */
.dn-loc-split{ padding-right: 0; }

@media (min-width: 1280px){
  /* keep text clear of the rail without shifting the whole band */
  .dn-loc-split:not(.dn-loc-split--alt) > .dn-loc-split__body{
    padding-right: calc(88px + var(--ce-rail-clear));
  }
}

/* Centred container for the blocks below the split bands. */
.dn-loc-map,
.dn-loc-map-nav,
.dn-loc-map-actions,
.ce-page-note{
  max-width: var(--ce-unify-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--ce-unify-gutter);
  padding-right: var(--ce-unify-gutter);
  box-sizing: border-box;
}

.dn-loc-map{ margin-bottom: 60px; }
.dn-loc-map-nav{ padding-top: 24px; padding-bottom: 80px; }

/* Standing note block. Six of these pages reused the map wrapper (#locationMap)
   to hold a plain sentence. That id is styled as an 820x460 grey map
   placeholder, so the sentence floated inside a large empty grey rectangle.
   Those fragments now use .ce-page-note instead; the wording is unchanged. */
.ce-page-note{
  margin-top: 0;
  margin-bottom: 60px;
}
.ce-page-note__inner{
  border-left: 3px solid var(--dn-bronze, #6392c5);
  background: var(--dn-cream, #e5eef7);
  border-radius: 0 8px 8px 0;
  padding: 22px 26px;
  font-size: 1.0rem;
  line-height: 1.75;
  color: var(--dn-dark, #0A1E30);
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.ce-page-note__inner p{ margin: 0; }

/* ------------------------------------------------------------------
   4. Narrow viewports.
   ------------------------------------------------------------------ */
@media (max-width: 1279px){
  .dn-loc-map,
  .dn-loc-map-nav,
  .dn-loc-map-actions,
  .ce-page-note{ padding-left: 36px; padding-right: 36px; }
  .dn-loc-map-nav{ padding-bottom: 56px; }
}

@media (max-width: 768px){
  .dn-geo-block,
  .ce-unify .dn-geo-block,
  .ce-unify .dn-sub-hero__intro-inner{
    padding-left: var(--ce-unify-gutter-mobile);
    padding-right: var(--ce-unify-gutter-mobile);
  }
  .dn-geo-block{
    max-width: 100%;
    padding-bottom: 28px;
  }
  .doctor_wrap .cont_box1 > .cont.cont2{
    padding-left: var(--ce-unify-gutter-mobile);
    padding-right: var(--ce-unify-gutter-mobile);
  }
  .doctor_wrap .cont_box1{ padding-top: 36px; padding-bottom: 36px; }
}

@media (max-width: 767px){
  .dn-loc-map,
  .dn-loc-map-nav,
  .dn-loc-map-actions,
  .ce-page-note{ padding-left: 20px; padding-right: 20px; }
  .ce-page-note{ margin-bottom: 40px; }
  .ce-page-note__inner{ padding: 18px 20px; font-size: 0.95rem; }
  .dn-loc-map{ margin-bottom: 40px; }
  .dn-loc-map-nav{ padding-top: 16px; padding-bottom: 40px; }
}

/* ------------------------------------------------------------------
   4. Stacked variant of the dn-loc split band (opt-in class).
   A two-column band only works when both columns are about as tall.
   Where one side holds a wide map graphic and the other holds the full
   contact block, the graphic side is left mostly empty and the transport
   cards are squeezed into a third of half the page. Stacking the band
   gives the graphic the full width and the cards room to breathe.
   ------------------------------------------------------------------ */
@media (min-width: 961px){
  .dn-loc-split--stack{ flex-direction: column; min-height: 0; }
  .dn-loc-split--stack > .dn-loc-split__img,
  .dn-loc-split--stack > .dn-loc-split__body{ flex: none; width: 100%; }
  .dn-loc-split--stack > .dn-loc-split__img--padded{
    order: 0;
    height: auto;
    padding: 52px 88px 44px;
  }
  .dn-loc-split--stack > .dn-loc-split__img--padded .ce-photo-tag-box{
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
  }
  .dn-loc-split--stack > .dn-loc-split__body{
    order: 1;
    padding: 56px 88px 76px;
  }
  /* Contact rows sit two-up so the lines stay a comfortable reading length. */
  .dn-loc-split--stack .dn-loc-info{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 64px;
    row-gap: 0;
  }
  .dn-loc-split--stack .dn-loc-info__divider{ display: none; }
  .dn-loc-split--stack .dn-loc-info__item{
    padding: 24px 0;
    border-top: 1px solid var(--dn-border, #C7D0D9);
  }
  .dn-loc-split--stack .dn-loc-info__item:nth-child(1),
  .dn-loc-split--stack .dn-loc-info__item:nth-child(3){
    border-top: none;
    padding-top: 0;
  }
  .dn-loc-split--stack .dn-loc-transport-mini{ margin-top: 40px; }
  .dn-loc-split--stack .dn-loc-transport-mini__card{
    padding: 30px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}

/* ------------------------------------------------------------------
   5. Shared components that carried their own container width.
   The rule below overrides only max-width; padding stays as authored
   (each already uses a 20-24px gutter). Card-style and reading-width
   blocks (.dn-kakao-cta__inner, .dn-geo-content .cont) keep their own width.
   ------------------------------------------------------------------ */
.dn-insight-slider,
.dn-natural-results__inner,
.dn-author-signature,
.site-related{
  max-width: var(--ce-unify-max);
}
