/* Thai Lanna Treatment — luxury treatment detail pages */
.tl-detail-page{background:#f8f4eb;color:#232e25}

.tl-detail-hero{position:relative;overflow:hidden;background:#f2eadc;border-bottom:1px solid rgba(35,46,37,.10)}
.tl-detail-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 92% 12%,rgba(174,130,82,.12),transparent 30%),radial-gradient(circle at 8% 90%,rgba(35,46,37,.055),transparent 32%)}
.tl-detail-hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,1.03fr) minmax(360px,.97fr);gap:5.5rem;align-items:center;padding-top:5.5rem;padding-bottom:5.5rem}
.tl-detail-title{max-width:760px;font-family:Marcellus,Georgia,serif;font-size:2.25rem;line-height:1.12;letter-spacing:.04em;color:#232e25;text-wrap:balance}
.tl-detail-lede{max-width:720px;margin-top:1.75rem;font-size:1.125rem;line-height:1.75;color:rgba(35,46,37,.70)}
.tl-detail-price-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-top:2rem;max-width:670px}
.tl-detail-price-grid.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:460px}
.tl-price-card{min-height:92px;padding:1.05rem 1rem;border:1px solid rgba(35,46,37,.16);background:rgba(248,244,235,.66);display:flex;flex-direction:column;justify-content:center;text-align:center}
.tl-price-card span{font-size:9px;text-transform:uppercase;letter-spacing:.24em;color:rgba(35,46,37,.58)}
.tl-price-card strong{margin-top:.38rem;font-family:Marcellus,Georgia,serif;font-size:1.55rem;font-weight:400;color:#232e25}
.tl-detail-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.75rem}
.tl-detail-visual{position:relative}
.tl-detail-visual:after{content:"";position:absolute;left:-22px;bottom:-22px;width:44%;height:42%;border-left:1px solid rgba(174,130,82,.55);border-bottom:1px solid rgba(174,130,82,.55);pointer-events:none}
.tl-detail-image-frame{position:relative;padding:5px;border:1px solid rgba(35,46,37,.17);background:#f8f4eb;box-shadow:0 24px 60px rgba(35,46,37,.08)}
.tl-detail-image-frame img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.tl-detail-caption{position:absolute;right:-12px;top:22px;writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:.34em;font-size:8px;color:#8f6637;background:#f2eadc;padding:.85rem .4rem}
.tl-detail-about{padding:6rem 0;background:#f8f4eb}
.tl-detail-about-grid{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(320px,.74fr);gap:6rem;align-items:start}
.tl-detail-copy h2{font-family:Marcellus,Georgia,serif;font-size:1.875rem;line-height:1.16;letter-spacing:.03em;color:#232e25}
.tl-detail-copy p{margin-top:1.5rem;font-size:1rem;line-height:1.75;color:rgba(35,46,37,.72)}
.tl-detail-side{border-top:1px solid rgba(174,130,82,.6);padding-top:1.55rem}
.tl-detail-side-label{font-size:9px;text-transform:uppercase;letter-spacing:.32em;color:#8f6637}
.tl-detail-side h3{margin-top:.7rem;font-family:Marcellus,Georgia,serif;font-size:1.45rem;font-weight:400;line-height:1.3}
.tl-detail-facts{margin-top:1.3rem;border-top:1px solid rgba(35,46,37,.11)}
.tl-detail-fact{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid rgba(35,46,37,.11);font-size:.88rem;color:rgba(35,46,37,.68)}
.tl-detail-fact strong{font-weight:500;color:#232e25;text-align:right}
.tl-benefits{position:relative;overflow:hidden;background:#18231c;color:#f8f4eb;padding:5.4rem 0}
.tl-benefits:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% 0,rgba(174,130,82,.16),transparent 32%),linear-gradient(115deg,transparent 0 57%,rgba(255,255,255,.018) 57% 58%,transparent 58% 100%);pointer-events:none}
.tl-benefits-inner{position:relative}
.tl-benefits .eyebrow{color:#cba778}
.tl-benefits-heading{margin-top:1rem;max-width:760px;font-family:Marcellus,Georgia,serif;font-size:1.875rem;line-height:1.16;letter-spacing:.03em}
.tl-benefit-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:3rem;background:rgba(248,244,235,.13);border:1px solid rgba(248,244,235,.13)}
.tl-benefit{min-height:190px;padding:1.7rem 1.5rem;background:#18231c}
.tl-benefit-num{font-family:Marcellus,Georgia,serif;font-size:1.2rem;color:#cba778}
.tl-benefit p{margin-top:2.6rem;font-size:.95rem;line-height:1.65;color:rgba(248,244,235,.76)}
.tl-faq{padding:6rem 0;background:#f8f4eb}
.tl-faq-head{display:grid;grid-template-columns:.72fr 1.28fr;gap:4rem;align-items:end}
.tl-faq-head h2{font-family:Marcellus,Georgia,serif;font-size:1.875rem;line-height:1.16;letter-spacing:.03em;font-weight:400}
.tl-faq-head p{max-width:580px;justify-self:end;font-size:.98rem;line-height:1.8;color:rgba(35,46,37,.66)}
.tl-faq-list{margin-top:2.7rem;border-top:1px solid rgba(35,46,37,.16)}
.tl-faq-list details{border-bottom:1px solid rgba(35,46,37,.16);padding:0}
.tl-faq-list summary{position:relative;cursor:pointer;list-style:none;padding:1.55rem 3.2rem 1.55rem 0;font-size:1rem;font-weight:500;color:#232e25}
.tl-faq-list summary::-webkit-details-marker{display:none}
.tl-faq-list summary:after{content:"+";position:absolute;right:.2rem;top:50%;transform:translateY(-50%);font-family:Marcellus,Georgia,serif;font-size:1.7rem;font-weight:300;color:#8f6637}
.tl-faq-list details[open] summary:after{content:"–"}
.tl-faq-list details p{max-width:760px;padding:0 3.2rem 1.55rem 0;font-size:.94rem;line-height:1.8;color:rgba(35,46,37,.68)}
.tl-related{padding:5.5rem 0 6rem;background:#f1eadc;border-top:1px solid rgba(35,46,37,.09)}
.tl-related-head{display:flex;align-items:end;justify-content:space-between;gap:2rem}
.tl-related-head h2{margin-top:1rem;font-family:Marcellus,Georgia,serif;font-size:1.875rem;line-height:1.16;letter-spacing:.03em;font-weight:400}
.tl-related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:2.5rem}
.tl-related-card{display:block;background:#f8f4eb;border:1px solid rgba(35,46,37,.11);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.tl-related-card:hover{transform:translateY(-4px);border-color:rgba(174,130,82,.65);box-shadow:0 16px 36px rgba(35,46,37,.08)}
.tl-related-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.tl-related-card-body{padding:1.15rem 1.2rem 1.3rem}
.tl-related-card-title{font-family:Marcellus,Georgia,serif;font-size:1.45rem;line-height:1.3;letter-spacing:.02em;color:#232e25}
.tl-related-card-meta{display:flex;justify-content:space-between;gap:1rem;margin-top:.65rem;font-size:.76rem;color:rgba(35,46,37,.58)}
.tl-related-card-meta span:last-child{color:#8f6637;text-transform:uppercase;letter-spacing:.13em;font-size:.66rem}
.tl-detail-cta{background:#233025;color:#f8f4eb;padding:4.4rem 0;border-top:1px solid rgba(248,244,235,.08)}
.tl-detail-cta-inner{text-align:center}
.tl-detail-cta .eyebrow{color:#cba778}
.tl-detail-cta h2{margin-top:.85rem;font-family:Marcellus,Georgia,serif;font-size:1.875rem;line-height:1.16;letter-spacing:.03em;font-weight:400}
.tl-detail-cta p{margin:1rem auto 0;max-width:620px;color:rgba(248,244,235,.68);line-height:1.75}
.tl-detail-cta .btn-primary{margin-top:1.7rem;background:#f8f4eb;color:#233025}
.tl-detail-cta .btn-primary:hover{background:#e7dcc8}
@media(max-width:1023px){
  .tl-detail-hero-inner{grid-template-columns:1fr;gap:3.5rem;padding-top:4rem;padding-bottom:4.5rem}
  .tl-detail-visual{max-width:700px}
  .tl-detail-about-grid{grid-template-columns:1fr;gap:3.4rem}
  .tl-benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tl-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tl-faq-head{grid-template-columns:1fr;gap:1.1rem}
  .tl-faq-head p{justify-self:start}
}
@media(max-width:767px){
  .tl-detail-hero-inner{padding-top:3rem;padding-bottom:3.6rem}
  .tl-detail-lede{font-size:1rem;line-height:1.72}
  .tl-detail-price-grid,.tl-detail-price-grid.two{grid-template-columns:1fr 1fr;max-width:none}
  .tl-price-card:last-child:nth-child(odd){grid-column:1/-1}
  .tl-detail-actions{flex-direction:column;align-items:stretch}
  .tl-detail-actions a{width:100%}
  .tl-detail-visual:after,.tl-detail-caption{display:none}
  .tl-detail-about{padding:4.2rem 0}
  .tl-benefits{padding:4rem 0}
  .tl-benefit-grid{grid-template-columns:1fr}
  .tl-benefit{min-height:145px}
  .tl-benefit p{margin-top:1.7rem}
  .tl-faq{padding:4.2rem 0}
  .tl-related{padding:4.2rem 0 4.5rem}
  .tl-related-head{display:block}
  .tl-related-head .btn-outline-dark{margin-top:1.5rem}
  .tl-related-grid{grid-template-columns:1fr}
  .tl-related-card{display:grid;grid-template-columns:110px 1fr}
  .tl-related-card img{height:100%;aspect-ratio:auto}
  .tl-detail-cta{padding:3.8rem 0}
}

/* Typography and navigation aligned with the main Thai Lanna site */
.tl-detail-page{font-family:Jost,system-ui,sans-serif}
.tl-detail-title,.tl-detail-copy h2,.tl-benefits-heading,.tl-faq-head h2,.tl-related-head h2,.tl-detail-cta h2{font-family:Marcellus,Georgia,serif}
@media(min-width:640px){
  .tl-detail-title{font-size:3rem;line-height:1}
  .tl-detail-copy h2,.tl-benefits-heading,.tl-faq-head h2,.tl-related-head h2,.tl-detail-cta h2{font-size:2.25rem;line-height:2.5rem;line-height:1.16}
}
@media(min-width:1024px){
  .tl-detail-title{font-size:4.25rem;line-height:1.12}
  .tl-detail-copy h2,.tl-benefits-heading,.tl-faq-head h2,.tl-related-head h2,.tl-detail-cta h2{font-size:2.6rem;line-height:1.16}
}
.tl-mobile-menu-panel[hidden]{display:none!important}
.tl-site-header .tl-menu-toggle{display:inline-flex;align-items:center;justify-content:center}
@media(min-width:1024px){.tl-site-header .tl-menu-toggle{display:none}.tl-mobile-menu-panel{display:none!important}}

/* Treatment length guide — SEO/UX upgrade */
.tl-duration-guide{padding:0 0 6rem;background:#f8f4eb}
.tl-duration-guide h2{margin-top:1rem;font-family:Marcellus,Georgia,serif;font-size:2.25rem;line-height:1.16;letter-spacing:.03em;font-weight:400;color:#232e25}
.tl-duration-intro{max-width:760px;margin-top:1.2rem;font-size:.98rem;line-height:1.8;color:rgba(35,46,37,.72)}
.tl-duration-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2.3rem}
.tl-duration-grid.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:900px}
.tl-duration-card{padding:1.55rem 1.45rem;border:1px solid rgba(35,46,37,.14);background:#f2eadc}
.tl-duration-card h3{font-family:Marcellus,Georgia,serif;font-size:1.2rem;line-height:1.35;font-weight:400;color:#232e25}
.tl-duration-card p{margin-top:.8rem;font-size:.92rem;line-height:1.7;color:rgba(35,46,37,.72)}
@media(max-width:767px){.tl-duration-guide{padding-bottom:4.2rem}.tl-duration-grid,.tl-duration-grid.two{grid-template-columns:1fr}.tl-duration-guide h2{font-size:1.875rem}}
