/* =========================================================
   GYEOLHWI PROJECT DETAIL — PC REFINEMENT
   Desktop-only: compact, clearer section hierarchy and premium CTA navigation.
   Mobile layout remains controlled by the existing styles.
   ========================================================= */

/* Nested CTA labels: preserve the current compact mobile appearance. */
.project-consultation-actions .cta-index,
.project-consultation-actions .cta-copy small,
.project-consultation-actions .cta-arrow{display:none}
.project-consultation-actions .cta-copy{display:block}
.project-consultation-actions .cta-copy strong{font:inherit}

@media (min-width:1024px){
  /* Reduce oversized editorial typography while keeping the brand character. */
  .hero-copy h1,
  .case-title h1{
    max-width:12em!important;
    font-size:clamp(3.25rem,4.15vw,4.55rem)!important;
    line-height:1.12!important;
    letter-spacing:-.048em!important;
  }

  .intro-section,
  .case-intro,
  .gallery-section,
  .bathroom-section,
  .work-points,
  .work-section,
  .process-section,
  .related-section{
    padding-top:78px!important;
    padding-bottom:78px!important;
  }

  /* Shared section-heading system: label, compact title, supporting copy. */
  .case-intro .intro-grid,
  .gallery-head,
  .work-section header{
    grid-template-columns:minmax(0,1.08fr) minmax(360px,.72fr)!important;
    gap:54px!important;
    align-items:end!important;
  }

  .case-intro .intro-grid,
  .gallery-head{
    position:relative;
    margin-bottom:32px!important;
    padding-bottom:28px;
    border-bottom:1px solid rgba(31,51,42,.16);
  }

  .case-intro .intro-grid:before,
  .gallery-head:before{
    position:absolute;
    left:0;
    bottom:-1px;
    width:72px;
    height:2px;
    background:#b56a47;
    content:"";
  }

  .case-intro h2,
  .gallery-head h2,
  .work-section header h2,
  .intro-grid h2,
  .work-points h2{
    max-width:760px!important;
    margin-top:10px!important;
    font-size:clamp(2.35rem,3.05vw,3.2rem)!important;
    line-height:1.22!important;
    letter-spacing:-.042em!important;
  }

  .case-intro .intro-grid>div:last-child,
  .gallery-head>p{
    position:relative;
    padding:0 0 0 32px!important;
    border-left:1px solid rgba(31,51,42,.16);
    font-size:.94rem!important;
    line-height:1.82!important;
  }

  .case-intro .intro-grid>div:last-child{
    padding-top:0!important;
    border-left-color:rgba(255,255,255,.2);
  }

  .case-intro .intro-grid{
    margin-bottom:0!important;
    border-bottom-color:rgba(255,255,255,.18);
  }
  .case-intro .intro-grid:before{background:#d6bd8d}

  /* Project 01 room headings: shorter, easier to scan, more structured. */
  .room-head{
    margin-bottom:28px!important;
    padding:0 0 20px!important;
    align-items:flex-end!important;
  }
  .room-head>div:first-child{position:relative;padding-left:18px}
  .room-head>div:first-child:before{
    position:absolute;left:0;top:4px;bottom:3px;width:3px;background:#b56a47;content:"";
  }
  .room-head h2{
    font-size:clamp(2rem,2.55vw,2.7rem)!important;
    line-height:1.2!important;
    letter-spacing:-.035em!important;
  }
  .room-head span{
    display:inline-block;
    padding:5px 9px;
    background:rgba(181,106,71,.09);
    font-family:inherit!important;
    font-weight:850;
    letter-spacing:.12em!important;
  }
  .room-facts{gap:18px!important}
  .room-facts p{
    min-width:116px;
    padding-left:14px;
    border-left:1px solid rgba(31,51,42,.15);
  }

  /* Work and process headings use the same restrained hierarchy. */
  .work-points header{margin-bottom:34px!important}
  .work-section header{margin-bottom:34px!important}
  .process-section header{margin-bottom:24px!important}
  .process-section header h2{
    font-size:1.85rem!important;
    letter-spacing:-.035em!important;
  }

  /* Premium compact bottom navigation: four equal actions on one line. */
  .project-consultation.project-bottom-menu{
    padding:28px 0 30px!important;
    background:#eee8dd!important;
    border-top:1px solid rgba(31,51,42,.10);
  }
  .project-consultation-actions{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:12px!important;
    width:100%!important;
    max-width:none!important;
  }
  .project-consultation-actions .btn{
    position:relative;
    display:grid!important;
    min-height:72px!important;
    padding:0 46px 0 62px!important;
    grid-template-columns:auto 1fr auto;
    gap:14px;
    align-items:center!important;
    justify-content:stretch!important;
    text-align:left!important;
    font-size:.86rem!important;
    box-shadow:0 10px 25px rgba(31,51,42,.07)!important;
    transform:none!important;
  }
  .project-consultation-actions .btn:hover{
    transform:translateY(-2px)!important;
    box-shadow:0 14px 30px rgba(31,51,42,.11)!important;
  }
  .project-consultation-actions .cta-index{
    display:grid;
    width:30px;
    height:30px;
    place-items:center;
    border:1px solid currentColor;
    border-radius:50%;
    opacity:.72;
    font-family:Georgia,serif;
    font-size:.62rem;
    letter-spacing:.04em;
  }
  .project-consultation-actions .cta-copy{
    display:flex;
    min-width:0;
    flex-direction:column;
    gap:2px;
  }
  .project-consultation-actions .cta-copy small{
    display:block;
    opacity:.58;
    font-size:.52rem;
    font-weight:850;
    letter-spacing:.14em;
  }
  .project-consultation-actions .cta-copy strong{
    display:block;
    overflow:hidden;
    font-size:.86rem;
    font-weight:900;
    line-height:1.25;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .project-consultation-actions .cta-arrow{
    display:block;
    opacity:.7;
    font-size:1.05rem;
    transition:transform .18s ease;
  }
  .project-consultation-actions .btn:hover .cta-arrow{transform:translateX(3px)}
  .project-consultation-actions .btn.quote{grid-column:auto!important;background:#f8f5ef!important}
  .project-consultation-actions .btn.quote:hover{background:#1f332a!important}
}

@media (min-width:1024px) and (max-width:1240px){
  .project-consultation-actions .btn{
    min-height:68px!important;
    padding:0 34px 0 48px!important;
    gap:10px;
  }
  .project-consultation-actions .cta-index{width:27px;height:27px}
  .project-consultation-actions .cta-copy small{display:none}
  .project-consultation-actions .cta-copy strong{font-size:.8rem}
}