.elementor-58 .elementor-element.elementor-element-9fa9f8e{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:flex-end;--gap:0px 72px;--row-gap:0px;--column-gap:72px;--flex-wrap:nowrap;--overflow:hidden;--padding-top:035px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-58 .elementor-element.elementor-element-32fe71c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:104px;--padding-left:0px;--padding-right:0px;}.elementor-58 .elementor-element.elementor-element-32fe71c.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-58 .elementor-element.elementor-element-475decf > .elementor-widget-container{margin:0px 0px 80px 0px;}.elementor-58 .elementor-element.elementor-element-475decf{font-family:"Noto Sans Thai", Sans-serif;font-size:13px;font-weight:500;line-height:1.5px;letter-spacing:1.5px;color:var( --e-global-color-ac7e4ed );}.elementor-58 .elementor-element.elementor-element-39af2f5 > .elementor-widget-container{margin:0px 0px 48px 0px;}.elementor-58 .elementor-element.elementor-element-39af2f5{font-family:"Noto Sans Thai", Sans-serif;font-size:12px;font-weight:500;line-height:1.5px;letter-spacing:2.4px;color:var( --e-global-color-ac7e4ed );}.elementor-58 .elementor-element.elementor-element-2cb0c01 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-2cb0c01 .elementor-heading-title{font-family:"Anuphan", Sans-serif;font-size:86px;font-weight:200;line-height:1.03em;letter-spacing:-1.3px;color:var( --e-global-color-6944309 );}.elementor-58 .elementor-element.elementor-element-227bcd5 > .elementor-widget-container{margin:22px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-227bcd5 .elementor-heading-title{font-family:"Anuphan", Sans-serif;font-size:39px;font-weight:300;line-height:1.2em;color:var( --e-global-color-c85b781 );}.elementor-58 .elementor-element.elementor-element-22b2cc6{width:var( --container-widget-width, 540px );max-width:540px;--container-widget-width:540px;--container-widget-flex-grow:0;font-size:18px;font-weight:300;line-height:1.8em;color:var( --e-global-color-e7c73d8 );}.elementor-58 .elementor-element.elementor-element-22b2cc6 > .elementor-widget-container{margin:40px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-4e542a0{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:36px 36px;--row-gap:36px;--column-gap:36px;--flex-wrap:nowrap;--margin-top:48px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-58 .elementor-element.elementor-element-71dba19 .elementor-button{background-color:var( --e-global-color-c85b781 );font-family:"Noto Sans Thai", Sans-serif;font-size:15px;font-weight:500;fill:var( --e-global-color-11bdc09 );color:var( --e-global-color-11bdc09 );border-style:none;border-radius:3px 3px 3px 3px;padding:16px 30px 16px 30px;}.elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button{background-color:#72312900;font-family:"Noto Sans Thai", Sans-serif;font-size:15px;font-weight:500;fill:var( --e-global-color-c85b781 );color:var( --e-global-color-c85b781 );border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-ac7e4ed );border-radius:3px 3px 3px 3px;padding:16px 30px 16px 30px;}.elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button:hover, .elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button:focus{background-color:var( --e-global-color-ac7e4ed );color:var( --e-global-color-11bdc09 );}.elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button:hover svg, .elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button:focus svg{fill:var( --e-global-color-11bdc09 );}.elementor-58 .elementor-element.elementor-element-d8b4695{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:36px 36px;--row-gap:36px;--column-gap:36px;--flex-wrap:nowrap;--margin-top:20px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-58 .elementor-element.elementor-element-9522138 .elementor-button{background-color:#02010100;font-family:"Noto Sans Thai", Sans-serif;font-size:15px;font-weight:400;line-height:28px;fill:var( --e-global-color-c85b781 );color:var( --e-global-color-c85b781 );border-style:solid;border-width:0px 0px 1px 0px;border-color:var( --e-global-color-ac7e4ed );border-radius:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-9522138 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-97558d6 > .elementor-widget-container{margin:56px 0px 0px 0px;padding:20px 0px 0px 0px;border-style:solid;border-width:1px 0px 0px 0px;border-color:#72312924;}.elementor-58 .elementor-element.elementor-element-97558d6{font-family:"Noto Sans Thai", Sans-serif;font-size:13px;font-weight:400;line-height:13px;color:var( --e-global-color-17259e2 );}.elementor-58 .elementor-element.elementor-element-6945864{--display:flex;--min-height:748px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;border-style:none;--border-style:none;--border-radius:0px 0px 0px 0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-58 .elementor-element.elementor-element-82e3571{--display:flex;--position:absolute;--min-height:676px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;top:72px;--z-index:0;}.elementor-58 .elementor-element.elementor-element-82e3571:not(.elementor-motion-effects-element-type-background), .elementor-58 .elementor-element.elementor-element-82e3571 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-4057795 );}body:not(.rtl) .elementor-58 .elementor-element.elementor-element-82e3571{left:64px;}body.rtl .elementor-58 .elementor-element.elementor-element-82e3571{right:64px;}.elementor-58 .elementor-element.elementor-element-fa8826e{--display:flex;--position:absolute;--min-height:676px;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;top:0px;--z-index:1;}.elementor-58 .elementor-element.elementor-element-fa8826e:not(.elementor-motion-effects-element-type-background), .elementor-58 .elementor-element.elementor-element-fa8826e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F5EEEA;background-image:url("https://staging.sita-clinic.com/wp-content/uploads/2026/10/melasma-doctor-skin-assessment-sita-clinic.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-58 .elementor-element.elementor-element-fa8826e.e-con{--flex-grow:0;--flex-shrink:0;}body:not(.rtl) .elementor-58 .elementor-element.elementor-element-fa8826e{left:0px;}body.rtl .elementor-58 .elementor-element.elementor-element-fa8826e{right:0px;}.elementor-58 .elementor-element.elementor-element-06ab5e8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-0477b8e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-db92a85{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-9d15dba{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-b787112{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-ce46b41{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-0963a8d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-fb68fbc{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-56daaa8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-ca9de0c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-1a54a21{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-df20986{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-7d2af6f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-58 .elementor-element.elementor-element-6184866{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-58 .elementor-element.elementor-element-9fa9f8e{--content-width:1264px;}.elementor-58 .elementor-element.elementor-element-32fe71c{--width:55.01%;}.elementor-58 .elementor-element.elementor-element-6945864{--width:39.29%;}.elementor-58 .elementor-element.elementor-element-82e3571{--width:520px;}.elementor-58 .elementor-element.elementor-element-fa8826e{--width:496px;}}@media(max-width:1024px) and (min-width:768px){.elementor-58 .elementor-element.elementor-element-32fe71c{--width:42.609%;}.elementor-58 .elementor-element.elementor-element-4e542a0{--width:100%;}.elementor-58 .elementor-element.elementor-element-d8b4695{--width:100%;}.elementor-58 .elementor-element.elementor-element-6945864{--width:47.88%;}.elementor-58 .elementor-element.elementor-element-82e3571{--width:340px;}.elementor-58 .elementor-element.elementor-element-fa8826e{--width:340px;}}@media(max-width:1024px){.elementor-58 .elementor-element.elementor-element-9fa9f8e{--justify-content:flex-start;--padding-top:56px;--padding-bottom:0px;--padding-left:40px;--padding-right:40px;}.elementor-58 .elementor-element.elementor-element-9fa9f8e.e-con{--align-self:flex-start;}.elementor-58 .elementor-element.elementor-element-32fe71c{--padding-top:0px;--padding-bottom:56px;--padding-left:0px;--padding-right:0px;}.elementor-58 .elementor-element.elementor-element-475decf > .elementor-widget-container{margin:0px 0px 28px 0px;}.elementor-58 .elementor-element.elementor-element-475decf{font-size:11px;letter-spacing:1.8px;}.elementor-58 .elementor-element.elementor-element-39af2f5 > .elementor-widget-container{margin:0px 0px 28px 0px;}.elementor-58 .elementor-element.elementor-element-39af2f5{font-size:11px;line-height:1.6em;letter-spacing:1.8px;}.elementor-58 .elementor-element.elementor-element-2cb0c01 .elementor-heading-title{font-size:44px;line-height:1.04em;}.elementor-58 .elementor-element.elementor-element-227bcd5 > .elementor-widget-container{margin:16px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-227bcd5 .elementor-heading-title{font-size:32px;line-height:1.25em;}.elementor-58 .elementor-element.elementor-element-22b2cc6 > .elementor-widget-container{margin:24px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-22b2cc6{font-size:16px;}.elementor-58 .elementor-element.elementor-element-4e542a0{--gap:16px 16px;--row-gap:16px;--column-gap:16px;--margin-top:32px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-58 .elementor-element.elementor-element-71dba19{width:auto;max-width:auto;}.elementor-58 .elementor-element.elementor-element-71dba19.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-58 .elementor-element.elementor-element-71dba19 .elementor-button{font-size:15px;padding:10px 20px 10px 20px;}.elementor-58 .elementor-element.elementor-element-3ca7041{width:auto;max-width:auto;}.elementor-58 .elementor-element.elementor-element-3ca7041.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button{font-size:15px;padding:10px 20px 10px 20px;}.elementor-58 .elementor-element.elementor-element-d8b4695{--gap:16px 16px;--row-gap:16px;--column-gap:16px;--margin-top:32px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-58 .elementor-element.elementor-element-9522138{width:auto;max-width:auto;}.elementor-58 .elementor-element.elementor-element-9522138.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-58 .elementor-element.elementor-element-9522138 .elementor-button{font-size:14px;}.elementor-58 .elementor-element.elementor-element-97558d6 > .elementor-widget-container{margin:40px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-97558d6{line-height:1.3em;letter-spacing:-0.3px;}.elementor-58 .elementor-element.elementor-element-6945864{--min-height:841px;}.elementor-58 .elementor-element.elementor-element-6945864.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-58 .elementor-element.elementor-element-82e3571{--min-height:400px;top:40px;}body:not(.rtl) .elementor-58 .elementor-element.elementor-element-82e3571{left:40px;}body.rtl .elementor-58 .elementor-element.elementor-element-82e3571{right:40px;}.elementor-58 .elementor-element.elementor-element-fa8826e{--min-height:400px;top:0px;}body:not(.rtl) .elementor-58 .elementor-element.elementor-element-fa8826e{left:0px;}body.rtl .elementor-58 .elementor-element.elementor-element-fa8826e{right:0px;}}@media(max-width:767px){.elementor-58 .elementor-element.elementor-element-9fa9f8e{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:30px;--padding-bottom:0px;--padding-left:24px;--padding-right:24px;}.elementor-58 .elementor-element.elementor-element-32fe71c{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-58 .elementor-element.elementor-element-475decf > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-475decf{line-height:1.4em;}.elementor-58 .elementor-element.elementor-element-39af2f5 > .elementor-widget-container{margin:30px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-39af2f5{line-height:1.4em;}.elementor-58 .elementor-element.elementor-element-2cb0c01 > .elementor-widget-container{margin:22px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-2cb0c01 .elementor-heading-title{font-size:46px;letter-spacing:-0.7px;}.elementor-58 .elementor-element.elementor-element-227bcd5 > .elementor-widget-container{margin:14px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-227bcd5 .elementor-heading-title{font-size:24px;line-height:1.3em;}.elementor-58 .elementor-element.elementor-element-22b2cc6 > .elementor-widget-container{margin:20px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-22b2cc6{font-size:15px;line-height:1.75em;}.elementor-58 .elementor-element.elementor-element-4e542a0{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:15px 0px;--row-gap:15px;--column-gap:0px;--margin-top:26px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-58 .elementor-element.elementor-element-71dba19{width:100%;max-width:100%;}.elementor-58 .elementor-element.elementor-element-71dba19 .elementor-button{padding:16px 20px 16px 20px;}.elementor-58 .elementor-element.elementor-element-3ca7041{width:100%;max-width:100%;}.elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button{padding:16px 20px 16px 20px;}.elementor-58 .elementor-element.elementor-element-d8b4695{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:20px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-58 .elementor-element.elementor-element-9522138 > .elementor-widget-container{padding:10px 0px 0px 0px;}.elementor-58 .elementor-element.elementor-element-6945864{--min-height:473px;}}/* Start custom CSS for button, class: .elementor-element-71dba19 */.elementor-58 .elementor-element.elementor-element-71dba19 .elementor-button-text {
    white-space: nowrap;
}/* End custom CSS */
/* Start custom CSS for button, class: .elementor-element-3ca7041 */.elementor-58 .elementor-element.elementor-element-3ca7041 .elementor-button-text {
    white-space: nowrap;
}/* End custom CSS */
/* Start custom CSS *//* =========================================================
   M3 FIX — 01b CONTENTS RAIL
   Match FINAL R2
   ========================================================= */

.sita-melasma-contents {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: #FFFFFF;
}

.sita-melasma-contents-nav {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  background: #FFFFFF;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* ---------------------------------------------------------
   Exact R2 desktop frame:
   full width + 88px page gutters
   --------------------------------------------------------- */

.sita-melasma-contents-inner {
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  padding: 0 88px 88px;
}


/* ---------------------------------------------------------
   Heading row
   --------------------------------------------------------- */

.sita-melasma-contents-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;

  width: 100%;
  padding: 0 0 16px;

  border-bottom: 1px solid rgba(114, 49, 41, 0.20);
}

.sita-melasma-contents-label {
  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-melasma-contents-overline {
  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.20em;

  color: #9A614D;
}


/* ---------------------------------------------------------
   4-column R2 grid
   --------------------------------------------------------- */

.sita-melasma-contents-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 40px;

  width: 100%;
}

.sita-melasma-contents-column {
  display: flex;
  flex-direction: column;
  min-width: 0;
}


/* ---------------------------------------------------------
   Rows
   --------------------------------------------------------- */

.sita-melasma-contents-link {
  display: flex;
  align-items: baseline;
  gap: 14px;

  width: 100%;
  min-width: 0;

  padding: 16px 0;

  border-bottom: 1px solid rgba(114, 49, 41, 0.12);

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;

  color: #2A2422;
  text-decoration: none;
}

.sita-melasma-contents-column
.sita-melasma-contents-link:last-child {
  border-bottom: 0;
}


/* Number */

.sita-melasma-contents-no {
  flex: 0 0 auto;

  font-family: "Anuphan", sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;

  color: #BB6358;
}


/* Text */

.sita-melasma-contents-text {
  min-width: 0;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;

  color: #2A2422;
}


/* ---------------------------------------------------------
   Hover
   --------------------------------------------------------- */

@media (hover: hover) {

  .sita-melasma-contents-link:hover
  .sita-melasma-contents-text {
    color: #723129;
  }

  .sita-melasma-contents-link:hover {
    border-color: rgba(187, 99, 88, 0.55);
  }
}


/* =========================================================
   TABLET <= 1024
   ========================================================= */

@media (max-width: 1024px) {

  .sita-melasma-contents-inner {
    padding-left: 40px;
    padding-right: 40px;
    padding-bottom: 72px;
  }

  .sita-melasma-contents-grid {
    column-gap: 28px;
  }

  .sita-melasma-contents-link,
  .sita-melasma-contents-text {
    font-size: 14px;
  }
}


/* =========================================================
   768 TABLET
   Two columns
   ========================================================= */

@media (max-width: 768px) {

  .sita-melasma-contents-inner {
    padding-left: 32px;
    padding-right: 32px;
    padding-bottom: 56px;
  }

  .sita-melasma-contents-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 32px;
  }

  .sita-melasma-contents-column {
    display: contents;
  }

  .sita-melasma-contents-link {
    border-bottom: 1px solid rgba(114, 49, 41, 0.12);
  }
}


/* =========================================================
   MOBILE <= 767
   One column
   ========================================================= */

@media (max-width: 767px) {

  .sita-melasma-contents-inner {
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 36px;
  }

  .sita-melasma-contents-head {
    padding-bottom: 10px;
  }

  .sita-melasma-contents-overline {
    font-size: 10px;
    letter-spacing: 0.16em;
  }

  .sita-melasma-contents-grid {
    grid-template-columns: 1fr;
    column-gap: 0;
  }

  .sita-melasma-contents-link {
    min-height: 48px;
    gap: 10px;
    padding: 13px 0;
  }

  .sita-melasma-contents-no {
    font-size: 12px;
  }

  .sita-melasma-contents-text {
    font-size: 15px;
    line-height: 1.55;
  }

  .sita-melasma-contents-grid
  .sita-melasma-contents-link:last-child {
    border-bottom: 0;
  }
}
/* =========================================================
   M4 — SECTION 02 / RECOGNITION
   ========================================================= */

.sita-melasma-recognition {
  width: 100%;
  margin: 0;
  padding: 0;
  background: #FBF4F0;
}

.sita-melasma-recognition-inner {
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  padding: 112px 88px;
  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  color: #2A2422;
}


/* ---------------------------------------------------------
   META
   --------------------------------------------------------- */

.sita-melasma-recognition-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
}

.sita-melasma-recognition-label {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  color: #BB6358;
}

.sita-melasma-recognition-overline {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.2em;
  color: #9A614D;
}


/* ---------------------------------------------------------
   INTRO — 7 : 5
   --------------------------------------------------------- */

.sita-melasma-recognition-intro {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 72px;
  align-items: end;
  margin-top: 28px;
}

.sita-melasma-recognition-title {
  margin: 0;
  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;
  color: #2A2422;
}

.sita-melasma-recognition-lead {
  max-width: 440px;
  margin: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* ---------------------------------------------------------
   FIVE SITUATIONS
   --------------------------------------------------------- */

.sita-melasma-recognition-situations {
  margin-top: 64px;
  border-top: 1px solid rgba(114, 49, 41, 0.20);
}

.sita-melasma-recognition-row {
  display: grid;
  grid-template-columns:
    56px
    minmax(0, 1fr)
    minmax(0, 1fr);

  gap: 0 40px;
  align-items: start;

  padding: 28px 0;

  border-bottom: 1px solid rgba(114, 49, 41, 0.14);
}

.sita-melasma-recognition-row:last-child {
  border-bottom: 0;
}

.sita-melasma-recognition-no {
  font-family: "Anuphan", sans-serif;
  font-size: 32px;
  font-weight: 200;
  line-height: 1;

  color: #BB6358;
}

.sita-melasma-recognition-row-title {
  max-width: 520px;

  font-size: 21px;
  font-weight: 500;
  line-height: 1.55;

  color: #723129;
}

.sita-melasma-recognition-row-copy {
  max-width: 560px;
  margin: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* ---------------------------------------------------------
   LOW-COMMITMENT CTA
   Keep the original 7:5 structure.
   Right side remains intentionally empty until a
   consented patient voice exists.
   --------------------------------------------------------- */

.sita-melasma-recognition-conversion {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 72px;
  align-items: start;

  margin-top: 56px;
}

.sita-melasma-recognition-cta {
  min-width: 0;
}

.sita-melasma-recognition-cta-copy {
  max-width: 620px;
  margin: 0;

  font-size: 19px;
  font-weight: 300;
  line-height: 1.8;

  color: #2A2422;
}

.sita-melasma-recognition-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;

  margin-top: 28px;
}

.sita-melasma-recognition-line {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 52px;
  padding: 0 28px;

  border: 1px solid #723129;
  border-radius: 3px;

  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;

  color: #723129;
  background: transparent;
  text-decoration: none;
}

.sita-melasma-recognition-booking {
  display: inline-block;

  padding-bottom: 3px;
  border-bottom: 1px solid rgba(114, 49, 41, 0.35);

  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;

  color: #723129;
  text-decoration: none;
}


/* ---------------------------------------------------------
   WHY MELASMA DIFFERS
   --------------------------------------------------------- */

.sita-melasma-recognition-context {
  margin-top: 80px;
  padding-top: 56px;

  border-top: 1px solid rgba(114, 49, 41, 0.20);
}

.sita-melasma-recognition-context-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 72px;
  align-items: start;
}

.sita-melasma-recognition-context-title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 32px;
  font-weight: 300;
  line-height: 1.3;

  color: #2A2422;
}

.sita-melasma-recognition-context-list {
  border-top: 1px solid rgba(114, 49, 41, 0.20);
}

.sita-melasma-recognition-context-row {
  display: grid;
  grid-template-columns: 44px 260px minmax(0, 1fr);
  gap: 0 32px;
  align-items: start;

  padding: 22px 0;

  border-bottom: 1px solid rgba(114, 49, 41, 0.14);
}

.sita-melasma-recognition-context-row:last-child {
  border-bottom: 0;
}

.sita-melasma-recognition-context-no {
  font-family: "Anuphan", sans-serif;
  font-size: 24px;
  font-weight: 200;
  line-height: 1.1;

  color: #BB6358;
}

.sita-melasma-recognition-context-label {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.55;

  color: #723129;
}

.sita-melasma-recognition-context-copy {
  margin: 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* =========================================================
   1024
   R2: situation label + answer stack within each row
   ========================================================= */

@media (max-width: 1024px) {

  .sita-melasma-recognition-inner {
    padding: 88px 40px;
  }

  .sita-melasma-recognition-intro {
    gap: 48px;
  }

  .sita-melasma-recognition-title {
    font-size: 38px;
  }

  .sita-melasma-recognition-situations {
    margin-top: 52px;
  }

  .sita-melasma-recognition-row {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 0 28px;
    padding: 24px 0;
  }

  .sita-melasma-recognition-no {
    grid-column: 1;
    grid-row: 1 / span 2;
    font-size: 28px;
  }

  .sita-melasma-recognition-row-title {
    grid-column: 2;
  }

  .sita-melasma-recognition-row-copy {
    grid-column: 2;
    max-width: 720px;
    margin-top: 8px;
  }

  .sita-melasma-recognition-conversion {
    gap: 48px;
  }

  .sita-melasma-recognition-context-grid {
    gap: 48px;
  }

  .sita-melasma-recognition-context-row {
    grid-template-columns: 36px 210px minmax(0, 1fr);
    gap: 0 24px;
  }
}


/* =========================================================
   768
   R2: single-column reading flow
   number + label together, answer below
   H3 becomes compact rows
   ========================================================= */

@media (max-width: 768px) {

  .sita-melasma-recognition-inner {
    padding: 56px 32px;
  }

  .sita-melasma-recognition-intro {
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: start;
  }

  .sita-melasma-recognition-title {
    font-size: 34px;
  }

  .sita-melasma-recognition-lead {
    max-width: 620px;
    font-size: 16px;
  }

  .sita-melasma-recognition-situations {
    margin-top: 36px;
  }

  .sita-melasma-recognition-row {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 0 18px;
    padding: 22px 0;
  }

  .sita-melasma-recognition-no {
    grid-column: 1;
    grid-row: 1;
    font-size: 24px;
  }

  .sita-melasma-recognition-row-title {
    grid-column: 2;
    grid-row: 1;

    font-size: 18px;
  }

  .sita-melasma-recognition-row-copy {
    grid-column: 1 / -1;
    grid-row: 2;

    max-width: none;
    margin-top: 10px;

    font-size: 16px;
  }

  .sita-melasma-recognition-conversion {
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 40px;
  }

  .sita-melasma-recognition-cta-copy {
    max-width: 620px;
    font-size: 17px;
  }

  .sita-melasma-recognition-actions {
    display: block;
    margin-top: 22px;
  }

  .sita-melasma-recognition-line {
    width: 100%;
    min-height: 52px;
  }

  .sita-melasma-recognition-booking {
    display: table;
    margin: 14px auto 0;
  }

  .sita-melasma-recognition-context {
    margin-top: 56px;
    padding-top: 40px;
  }

  .sita-melasma-recognition-context-grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .sita-melasma-recognition-context-title {
    font-size: 28px;
  }

  .sita-melasma-recognition-context-row {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 0 14px;
    padding: 18px 0;
  }

  .sita-melasma-recognition-context-no {
    grid-column: 1;
    grid-row: 1;
    font-size: 20px;
  }

  .sita-melasma-recognition-context-label {
    grid-column: 2;
    grid-row: 1;

    font-size: 16px;
  }

  .sita-melasma-recognition-context-copy {
    grid-column: 1 / -1;
    grid-row: 2;

    margin-top: 7px;

    font-size: 15px;
  }
}


/* =========================================================
   MOBILE <= 767
   Final R2 mobile order:
   Hero → Recognition → Contents Rail → Section 03
   ========================================================= */

@media (max-width: 767px) {

  .sita-melasma-recognition-inner {
    padding: 36px 24px 40px;
  }

  .sita-melasma-recognition-overline {
    display: none;
  }

  .sita-melasma-recognition-title {
    margin-top: 16px;
    font-size: 30px;
    line-height: 1.25;
  }

  .sita-melasma-recognition-intro {
    display: block;
    margin-top: 0;
  }

  .sita-melasma-recognition-lead {
    margin-top: 14px;
    font-size: 16px;
    line-height: 1.85;
  }

  .sita-melasma-recognition-situations {
    margin-top: 26px;
  }

  .sita-melasma-recognition-row {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 0 14px;
    padding: 20px 0;
  }

  .sita-melasma-recognition-no {
    font-size: 22px;
  }

  .sita-melasma-recognition-row-title {
    font-size: 17px;
    line-height: 1.5;
  }

  .sita-melasma-recognition-row-copy {
    margin-top: 8px;
    font-size: 15px;
    line-height: 1.8;
  }

  .sita-melasma-recognition-conversion {
    margin-top: 26px;
  }

  .sita-melasma-recognition-cta-copy {
    font-size: 17px;
    line-height: 1.8;
  }

  .sita-melasma-recognition-line {
    margin-top: 20px;
    font-size: 15px;
  }

  .sita-melasma-recognition-booking {
    margin-top: 12px;
    font-size: 14px;
  }

  .sita-melasma-recognition-context {
    margin-top: 36px;
    padding-top: 32px;
  }

  .sita-melasma-recognition-context-grid {
    gap: 20px;
  }

  .sita-melasma-recognition-context-title {
    font-size: 24px;
    line-height: 1.3;
  }

  .sita-melasma-recognition-context-row {
    padding: 16px 0;
  }

  .sita-melasma-recognition-context-no {
    font-size: 18px;
  }

  .sita-melasma-recognition-context-label {
    font-size: 16px;
  }

  .sita-melasma-recognition-context-copy {
    margin-top: 6px;
    font-size: 15px;
    line-height: 1.8;
  }
}
/* =========================================================
   M5 — SECTION 03 / WHAT MELASMA IS
   ========================================================= */

.sita-melasma-what {
  width: 100%;
  margin: 0;
  padding: 0;
  background: #FFFFFF;
}

.sita-melasma-what-inner {
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  padding: 112px 88px;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  color: #2A2422;
}


/* ---------------------------------------------------------
   META
   --------------------------------------------------------- */

.sita-melasma-what-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
}

.sita-melasma-what-label {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  color: #BB6358;
}

.sita-melasma-what-overline {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.2em;
  color: #9A614D;
}


/* ---------------------------------------------------------
   TOP — 7 : 5
   --------------------------------------------------------- */

.sita-melasma-what-top {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 72px;
  align-items: start;

  margin-top: 28px;
}


/* Definition */

.sita-melasma-what-title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}

.sita-melasma-what-definition p {
  max-width: 620px;

  margin: 32px 0 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}

.sita-melasma-what-definition p + p {
  margin-top: 20px;
}


/* Characteristics */

.sita-melasma-what-characteristics {
  padding-top: 24px;
  border-top: 1px solid rgba(114, 49, 41, 0.25);
}

.sita-melasma-what-characteristics-title {
  margin: 0;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.5;

  color: #723129;
}

.sita-melasma-what-character-list {
  margin: 12px 0 0;
}

.sita-melasma-what-character-row {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 20px;

  padding: 16px 0;

  border-bottom: 1px solid rgba(114, 49, 41, 0.12);
}

.sita-melasma-what-character-row:last-child {
  border-bottom: 0;
}

.sita-melasma-what-character-row dt,
.sita-melasma-what-character-row dd {
  margin: 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.7;
}

.sita-melasma-what-character-row dt {
  color: #9A614D;
}

.sita-melasma-what-character-row dd {
  color: #2A2422;
}

.sita-melasma-what-character-note {
  margin: 20px 0 0;

  font-size: 14px;
  font-weight: 300;
  line-height: 1.7;

  color: #9A614D;
}


/* ---------------------------------------------------------
   LOWER MOVEMENT
   --------------------------------------------------------- */

.sita-melasma-what-depth {
  margin-top: 88px;
  padding-top: 56px;

  border-top: 1px solid rgba(114, 49, 41, 0.20);
}

.sita-melasma-what-depth-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: 72px;
  align-items: start;
}


/* ---------------------------------------------------------
   IMAGE P02
   --------------------------------------------------------- */

.sita-melasma-what-media {
  min-width: 0;
  margin: 0;
}

.sita-melasma-what-image {
  display: block;

  width: 100%;
  aspect-ratio: 1 / 1;

  object-fit: cover;
  object-position: center;

  margin: 0;
}



.sita-melasma-what-media figcaption {
  margin-top: 18px;

  font-size: 13px;
  font-weight: 300;
  line-height: 1.7;

  color: #9A614D;
}


/* ---------------------------------------------------------
   CONTRAST
   --------------------------------------------------------- */

.sita-melasma-what-contrast-title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 34px;
  font-weight: 300;
  line-height: 1.3;

  color: #2A2422;
}

.sita-melasma-what-contrast-intro {
  max-width: 620px;

  margin: 24px 0 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}


/* Two comparison groups */

.sita-melasma-what-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 48px;

  margin-top: 36px;
}

.sita-melasma-what-group-title {
  padding-bottom: 12px;

  border-bottom: 1px solid rgba(114, 49, 41, 0.35);

  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.14em;

  color: #9A614D;
}

.sita-melasma-what-group-assess
.sita-melasma-what-group-title {
  color: #723129;
}

.sita-melasma-what-group-row {
  padding: 14px 0;

  border-bottom: 1px solid rgba(114, 49, 41, 0.12);

  font-size: 16px;
  font-weight: 300;
  line-height: 1.7;

  color: #2A2422;
}

.sita-melasma-what-group-row:last-child {
  border-bottom: 0;
}


/* ---------------------------------------------------------
   DEPTH PULL QUOTE
   --------------------------------------------------------- */

.sita-melasma-what-pullquote {
  margin: 36px 0 0;
  padding: 28px 32px;

  border-left: 2px solid #BB6358;

  background: #FBF4F0;
}

.sita-melasma-what-pullquote p {
  margin: 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}

.sita-melasma-what-pullquote strong {
  font-weight: 600;
  color: #723129;
}


/* =========================================================
   TABLET <= 1024
   ========================================================= */

@media (max-width: 1024px) {

  .sita-melasma-what-inner {
    padding: 88px 40px;
  }

  .sita-melasma-what-top,
  .sita-melasma-what-depth-grid {
    gap: 48px;
  }

  .sita-melasma-what-title {
    font-size: 38px;
  }

  .sita-melasma-what-character-row {
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 16px;
  }

  .sita-melasma-what-depth {
    margin-top: 72px;
    padding-top: 48px;
  }

  .sita-melasma-what-groups {
    gap: 28px;
  }

  .sita-melasma-what-contrast-title {
    font-size: 30px;
  }
}


/* =========================================================
   768 — SINGLE-COLUMN READING FLOW
   ========================================================= */

@media (max-width: 768px) {

  .sita-melasma-what-inner {
    padding: 56px 32px;
  }

  .sita-melasma-what-top {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .sita-melasma-what-title {
    font-size: 34px;
  }

  .sita-melasma-what-definition p {
    max-width: none;

    font-size: 16px;
    line-height: 1.85;
  }

  .sita-melasma-what-characteristics {
    padding-top: 20px;
  }

  .sita-melasma-what-depth {
    margin-top: 56px;
    padding-top: 40px;
  }

  .sita-melasma-what-depth-grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .sita-melasma-what-contrast-title {
    font-size: 28px;
  }

  .sita-melasma-what-contrast-intro {
    font-size: 16px;
  }

  .sita-melasma-what-groups {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}


/* =========================================================
   MOBILE <= 767
   R2:
   image full bleed
   contrast groups stacked
   ========================================================= */

@media (max-width: 767px) {

  .sita-melasma-what-inner {
    padding: 36px 24px 40px;
  }

  .sita-melasma-what-overline {
    display: none;
  }

  .sita-melasma-what-top {
    margin-top: 16px;
    gap: 28px;
  }

  .sita-melasma-what-title {
    font-size: 30px;
    line-height: 1.22;
  }

  .sita-melasma-what-definition p {
    margin-top: 20px;

    font-size: 16px;
    line-height: 1.85;
  }

  .sita-melasma-what-definition p + p {
    margin-top: 16px;
  }

  .sita-melasma-what-characteristics-title {
    font-size: 16px;
  }

  .sita-melasma-what-character-row {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 14px;

    padding: 13px 0;
  }

  .sita-melasma-what-character-row dt,
  .sita-melasma-what-character-row dd {
    font-size: 15px;
    line-height: 1.6;
  }

  .sita-melasma-what-character-note {
    font-size: 12px;
  }


  /* Image intentionally breaks the 24px page gutter */

  .sita-melasma-what-depth {
    margin-top: 40px;
    padding-top: 0;

    border-top: 0;
  }

  .sita-melasma-what-depth-grid {
    display: block;
  }

  .sita-melasma-what-media {
    margin-left: -24px;
    margin-right: -24px;
  }

  .sita-melasma-what-image {
    width: calc(100% + 48px);

    aspect-ratio: auto;
    height: 280px;

    object-fit: cover;
  }

  .sita-melasma-what-media figcaption {
    margin: 0;
    padding: 14px 24px 8px;

    font-size: 11px;
    line-height: 1.7;
  }


  .sita-melasma-what-contrast {
    padding-top: 24px;
  }

  .sita-melasma-what-contrast-title {
    font-size: 26px;
    line-height: 1.3;
  }

  .sita-melasma-what-contrast-intro {
    margin-top: 16px;

    font-size: 16px;
    line-height: 1.85;
  }

  .sita-melasma-what-groups {
    display: block;
    margin-top: 22px;
  }

  .sita-melasma-what-group + .sita-melasma-what-group {
    margin-top: 24px;
  }

  .sita-melasma-what-group-title {
    padding-bottom: 8px;

    font-size: 11px;
    letter-spacing: 0.14em;
  }

  .sita-melasma-what-group-row {
    padding: 11px 0;

    font-size: 15px;
    line-height: 1.6;
  }

  .sita-melasma-what-pullquote {
    margin-top: 24px;
    padding: 20px 22px;
  }

  .sita-melasma-what-pullquote p {
    font-size: 15px;
    line-height: 1.8;
  }
}
/* =========================================================
   M6 — SECTION 04 / ASSOCIATED FACTORS
   ========================================================= */

.sita-melasma-factors {
  width: 100%;
  margin: 0;
  padding: 0;
  background: #FBF4F0;
}

.sita-melasma-factors-inner {
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  padding: 112px 88px;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  color: #2A2422;
}


/* META --------------------------------------------------- */

.sita-melasma-factors-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 24px;
}

.sita-melasma-factors-label {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  color: #BB6358;
}

.sita-melasma-factors-overline {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.2em;
  color: #9A614D;
}


/* INTRO — 7 : 5 ----------------------------------------- */

.sita-melasma-factors-intro {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 72px;
  align-items: end;

  margin-top: 28px;
}

.sita-melasma-factors-title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}

.sita-melasma-factors-lead {
  max-width: 440px;
  margin: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* FACTOR LIST -------------------------------------------- */

.sita-melasma-factors-list {
  margin-top: 72px;
  border-top: 1px solid rgba(114, 49, 41, 0.20);
}

.sita-melasma-factors-row {
  display: grid;
  grid-template-columns: 56px 300px minmax(0, 1fr);
  gap: 0 40px;
  align-items: start;

  margin: 0;
  padding: 28px 0;

  border-bottom: 1px solid rgba(114, 49, 41, 0.14);
}

.sita-melasma-factors-row:last-child {
  border-bottom: 0;
}

.sita-melasma-factors-no {
  font-family: "Anuphan", sans-serif;
  font-size: 32px;
  font-weight: 200;
  line-height: 1;

  color: #BB6358;
}

.sita-melasma-factors-name {
  margin: 0;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.5;

  color: #723129;
}

.sita-melasma-factors-copy {
  max-width: 640px;
  margin: 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* CLOSING BRIDGE ----------------------------------------- */

.sita-melasma-factors-closing {
  max-width: 900px;
  margin: 36px 0 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}


/* =========================================================
   TABLET <= 1024
   ========================================================= */

@media (max-width: 1024px) {

  .sita-melasma-factors-inner {
    padding: 88px 40px;
  }

  .sita-melasma-factors-intro {
    gap: 48px;
  }

  .sita-melasma-factors-title {
    font-size: 38px;
  }

  .sita-melasma-factors-list {
    margin-top: 56px;
  }

  .sita-melasma-factors-row {
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 0 28px;

    padding: 24px 0;
  }

  .sita-melasma-factors-no {
    grid-column: 1;
    grid-row: 1 / span 2;

    font-size: 28px;
  }

  .sita-melasma-factors-name {
    grid-column: 2;
    grid-row: 1;
  }

  .sita-melasma-factors-copy {
    grid-column: 2;
    grid-row: 2;

    max-width: 720px;
    margin-top: 8px;
  }
}


/* =========================================================
   768 — SINGLE-COLUMN READING FLOW
   ========================================================= */

@media (max-width: 768px) {

  .sita-melasma-factors-inner {
    padding: 56px 32px;
  }

  .sita-melasma-factors-intro {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .sita-melasma-factors-title {
    font-size: 34px;
  }

  .sita-melasma-factors-lead {
    max-width: 620px;
    font-size: 16px;
    line-height: 1.85;
  }

  .sita-melasma-factors-list {
    margin-top: 32px;
  }

  .sita-melasma-factors-row {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 0 16px;
    padding: 22px 0;
  }

  .sita-melasma-factors-no {
    grid-column: 1;
    grid-row: 1;

    font-size: 24px;
  }

  .sita-melasma-factors-name {
    grid-column: 2;
    grid-row: 1;

    font-size: 18px;
  }

  .sita-melasma-factors-copy {
    grid-column: 1 / -1;
    grid-row: 2;

    max-width: none;
    margin-top: 10px;

    font-size: 15px;
  }

  .sita-melasma-factors-closing {
    max-width: none;
    margin-top: 28px;

    font-size: 16px;
  }
}


/* =========================================================
   MOBILE <= 767
   FINAL R2 REFERENCE: 390px
   ========================================================= */

@media (max-width: 767px) {

  .sita-melasma-factors-inner {
    padding: 36px 24px 40px;
  }

  .sita-melasma-factors-overline {
    display: none;
  }

  .sita-melasma-factors-label {
    font-size: 12px;
  }

  .sita-melasma-factors-intro {
    display: block;
    margin-top: 16px;
  }

  .sita-melasma-factors-title {
    font-size: 30px;
    line-height: 1.25;
  }

  .sita-melasma-factors-title br {
    display: none;
  }

  .sita-melasma-factors-lead {
    margin-top: 14px;

    font-size: 16px;
    line-height: 1.85;
  }

  .sita-melasma-factors-list {
    margin-top: 28px;
  }

.sita-melasma-factors-row {
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 0 14px;

  align-items: baseline;

  padding: 20px 0;
}

.sita-melasma-factors-no {
  font-size: 22px;
  line-height: 1.5;
  align-self: baseline;
}
.sita-melasma-factors-name {
  align-self: baseline;
}

  .sita-melasma-factors-name {
    font-size: 17px;
    line-height: 1.5;
  }

  .sita-melasma-factors-copy {
    margin-top: 8px;

    font-size: 15px;
    line-height: 1.8;
  }

  .sita-melasma-factors-closing {
    margin-top: 24px;

    font-size: 15px;
    line-height: 1.8;
  }
}
/* =========================================================
   SITA MELASMA
   SECTION 05 — PHYSICIAN-LED ASSESSMENT
   CLEAN RESET VERSION
   ========================================================= */


/* ---------------------------------------------------------
   ROOT
   --------------------------------------------------------- */

.sita-m5,
.sita-m5 *,
.sita-m5 *::before,
.sita-m5 *::after {
  box-sizing: border-box;
}

.sita-m5 {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;

  background: #723129;
  color: #FFFFFF;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* ---------------------------------------------------------
   INNER — 1440 canvas / 88px gutters
   --------------------------------------------------------- */

.sita-m5__inner {
  width: 100%;
  max-width: 1440px;

  margin: 0 auto;
  padding: 112px 88px;
}


/* ---------------------------------------------------------
   META
   --------------------------------------------------------- */

.sita-m5__meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;

  gap: 32px;
  width: 100%;
}

.sita-m5__section-label {
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #E3B7AB;
}

.sita-m5__overline {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: 0.20em;
  white-space: nowrap;

  color: #E3B7AB;
}


/* ---------------------------------------------------------
   MAIN GRID — 7 : 5
   --------------------------------------------------------- */

.sita-m5__grid {
  display: grid;
  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 88px;
  align-items: start;

  width: 100%;
  margin-top: 32px;
}

.sita-m5__left,
.sita-m5__right {
  min-width: 0;
}


/* ---------------------------------------------------------
   H2
   --------------------------------------------------------- */

.sita-m5__title {
  display: block;

  max-width: 720px;

  margin: 0;
  padding: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 56px;
  font-weight: 200;
  line-height: 1.12;
  letter-spacing: -0.01em;

  color: #FFFFFF;
}


/* ---------------------------------------------------------
   LEFT BODY
   --------------------------------------------------------- */

.sita-m5__body {
  max-width: 620px;

  margin: 32px 0 0;
  padding: 0;

  font-size: 18px;
  font-weight: 300;
  line-height: 1.85;

  color: #F0DCD4;
}

.sita-m5__body--second {
  margin-top: 20px;
}


/* ---------------------------------------------------------
   CLINIC SYSTEM
   --------------------------------------------------------- */

.sita-m5__system {
  display: block;

  max-width: 700px;

  margin: 44px 0 0;
  padding: 32px 36px;

  border: 1px solid rgba(246, 234, 228, 0.30);
  background: transparent;
}

.sita-m5__system-label {
  margin: 0;

  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;

  letter-spacing: 0.16em;

  color: #E3B7AB;
}

.sita-m5__system-copy {
  margin: 14px 0 0;
  padding: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #FFFFFF;
}


/* ---------------------------------------------------------
   RIGHT COLUMN
   --------------------------------------------------------- */

.sita-m5__right {
  padding-top: 26px;

  border-top: 1px solid rgba(246, 234, 228, 0.30);
}

.sita-m5__list-heading {
  margin: 0 0 8px;

  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;

  letter-spacing: 0.16em;

  color: #E3B7AB;
}


/* ---------------------------------------------------------
   ASSESSMENT ITEMS
   --------------------------------------------------------- */

.sita-m5__item {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);

  gap: 0 18px;
  align-items: baseline;

  width: 100%;

  padding: 20px 0;

  border-bottom: 1px solid rgba(246, 234, 228, 0.18);
}

.sita-m5__item:nth-of-type(6) {
  border-bottom: 0;
}

.sita-m5__number {
  font-family: "Anuphan", sans-serif;

  font-size: 20px;
  font-weight: 200;
  line-height: 1.6;

  color: #E3B7AB;
}

.sita-m5__item-text {
  font-size: 17px;
  font-weight: 400;
  line-height: 1.6;

  color: #FFFFFF;
}


/* ---------------------------------------------------------
   DISCLAIMER
   --------------------------------------------------------- */

.sita-m5__disclaimer {
  max-width: 540px;

  margin: 24px 0 0;
  padding: 0;

  font-size: 14px;
  font-weight: 300;
  line-height: 1.75;

  color: #E3B7AB;
}


/* =========================================================
   TABLET — <= 1024
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m5__inner {
    padding: 88px 40px;
  }

  .sita-m5__grid {
    gap: 56px;
  }

  .sita-m5__title {
    font-size: 46px;
  }

  .sita-m5__body {
    font-size: 17px;
  }

  .sita-m5__system {
    padding: 28px;
  }

  .sita-m5__item-text {
    font-size: 16px;
  }

}


/* =========================================================
   TABLET NARROW — <= 768
   ========================================================= */

@media (max-width: 768px) {

  .sita-m5__inner {
    padding: 56px 32px;
  }

  .sita-m5__grid {
    grid-template-columns: 1fr;
    gap: 44px;

    margin-top: 26px;
  }

  .sita-m5__title {
    max-width: 650px;

    font-size: 38px;
    line-height: 1.16;
  }

  .sita-m5__title br {
    display: none;
  }

  .sita-m5__body {
    max-width: 680px;

    font-size: 16px;
  }

}


/* =========================================================
   MOBILE — <= 767
   FINAL R2 / 390px
   ========================================================= */

@media (max-width: 767px) {

  .sita-m5__inner {
    padding: 40px 24px 44px;
  }


  /* META */

  .sita-m5__meta {
    display: block;
  }

  .sita-m5__overline {
    display: none;
  }

  .sita-m5__section-label {
    font-size: 12px;
  }


  /* GRID */

  .sita-m5__grid {
    display: block;

    margin-top: 18px;
  }


  /* TITLE */

  .sita-m5__title {
    max-width: none;

    font-size: 34px;
    line-height: 1.15;
  }

  .sita-m5__title br {
    display: none;
  }


  /* BODY */

  .sita-m5__body {
    max-width: none;

    margin-top: 20px;

    font-size: 16px;
    line-height: 1.85;
  }

  .sita-m5__body--second {
    margin-top: 16px;
  }


  /* SYSTEM BOX */

  .sita-m5__system {
    max-width: none;

    margin-top: 28px;
    padding: 22px 24px;
  }

  .sita-m5__system-label {
    font-size: 11px;
    letter-spacing: 0.14em;
  }

  .sita-m5__system-copy {
    margin-top: 12px;

    font-size: 15px;
    line-height: 1.85;
  }


  /* RIGHT LIST */

  .sita-m5__right {
    margin-top: 32px;
    padding-top: 0;

    border-top: 0;
  }

  .sita-m5__list-heading {
    margin: 0;
    padding-bottom: 10px;

    border-bottom:
      1px solid rgba(246, 234, 228, 0.30);

    font-size: 11px;
    letter-spacing: 0.14em;
  }


  /* ITEMS */

  .sita-m5__item {
    grid-template-columns: 30px minmax(0, 1fr);

    gap: 0 14px;

    padding: 16px 0;
  }

  .sita-m5__number {
    font-size: 17px;
    line-height: 1.6;
  }

  .sita-m5__item-text {
    font-size: 16px;
    line-height: 1.6;
  }


  /* DISCLAIMER */

  .sita-m5__disclaimer {
    margin-top: 20px;

    font-size: 12px;
    line-height: 1.75;
  }

}
/* =========================================================
   SECTION 05 — FORCE H2 CONTRAST
   Elementor Global Heading Override Fix
   ========================================================= */

#sita-melasma-section-05 h2.sita-m5__title {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;

  margin: 0 !important;

  font-family: "Anuphan", sans-serif !important;
  font-size: 56px !important;
  font-weight: 200 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.01em !important;

  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}


/* Protect nested spans if Elementor inserts any */
#sita-melasma-section-05 h2.sita-m5__title,
#sita-melasma-section-05 h2.sita-m5__title * {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}


/* Tablet */
@media (max-width: 1024px) {

  #sita-melasma-section-05 h2.sita-m5__title {
    font-size: 46px !important;
  }

}


/* Tablet narrow */
@media (max-width: 768px) {

  #sita-melasma-section-05 h2.sita-m5__title {
    font-size: 38px !important;
    line-height: 1.16 !important;
  }

}


/* Mobile */
@media (max-width: 767px) {

  #sita-melasma-section-05 h2.sita-m5__title {
    font-size: 34px !important;
    line-height: 1.15 !important;
  }

}
/* =========================================================
   SITA MELASMA
   SECTION 06 — SITA CARE SYSTEM
   ========================================================= */

.sita-m6,
.sita-m6 *,
.sita-m6 *::before,
.sita-m6 *::after {
  box-sizing: border-box;
}

.sita-m6 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FFFFFF;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* INNER ================================================= */

.sita-m6__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* META ================================================== */

.sita-m6__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;

  gap: 32px;
}

.sita-m6__label {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m6__overline {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: .20em;
  white-space: nowrap;

  color: #9A614D;
}


/* INTRO ================================================= */

.sita-m6__intro {
  display: grid;
  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 72px;
  align-items: end;

  margin-top: 28px;
}

.sita-m6__title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}

.sita-m6__standfirst {
  max-width: 440px;

  margin: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* 5 STAGES ============================================== */

.sita-m6__stages {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));

  gap: 0 32px;

  margin-top: 80px;

  border-top:
    1px solid rgba(114, 49, 41, .25);
}

.sita-m6__stage {
  position: relative;

  min-width: 0;
  padding: 0 24px;
}

.sita-m6__stage:first-child {
  padding-left: 0;
}

.sita-m6__stage:last-child {
  padding-right: 0;
}

.sita-m6__stage:not(:last-child) {
  border-right:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m6__dot {
  display: block;

  width: 9px;
  height: 9px;

  margin-top: -5px;
  margin-bottom: 26px;

  border-radius: 50%;

  background: #BB6358;
}

.sita-m6__number {
  font-family: "Anuphan", sans-serif;
  font-size: 26px;
  font-weight: 200;
  line-height: 1;

  color: #BB6358;
}

.sita-m6__stage-title {
  margin: 12px 0 0;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.45;

  color: #723129;
}

.sita-m6__stage-copy {
  margin: 12px 0 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* CASE-BY-CASE NOTE ==================================== */

.sita-m6__case-note {
  margin-top: 56px;
  padding-top: 28px;

  border-top:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m6__case-note p {
  max-width: 900px;

  margin: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}


/* WHY-SITA LAYER ======================================= */

.sita-m6__why {
  display: grid;
  grid-template-columns:
    minmax(0, 5fr)
    minmax(0, 7fr);

  gap: 72px;
  align-items: start;

  margin-top: 72px;
  padding-top: 56px;

  border-top:
    1px solid rgba(114, 49, 41, .20);
}


/* LEFT */

.sita-m6__why-title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 34px;
  font-weight: 300;
  line-height: 1.3;

  color: #2A2422;
}

.sita-m6__why-copy {
  max-width: 480px;

  margin: 20px 0 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}


/* RIGHT */

.sita-m6__why-list {
  border-top:
    1px solid rgba(114, 49, 41, .20);
}

.sita-m6__why-row {
  display: grid;
  grid-template-columns:
    44px
    minmax(0, 1fr);

  gap: 0 28px;
  align-items: start;

  padding: 24px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m6__why-row:last-child {
  border-bottom: 0;
}

.sita-m6__why-no {
  font-family: "Anuphan", sans-serif;
  font-size: 26px;
  font-weight: 200;
  line-height: 1.1;

  color: #BB6358;
}

.sita-m6__why-heading {
  font-size: 19px;
  font-weight: 500;
  line-height: 1.55;

  color: #723129;
}

.sita-m6__why-row-copy {
  margin: 8px 0 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* ANCHOR OFFSET ========================================= */

#sita-melasma-section-06 {
  scroll-margin-top: 120px;
}


/* =========================================================
   <= 1024px
   Process becomes 3 + 2
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m6__inner {
    padding: 88px 40px;
  }

  .sita-m6__intro {
    gap: 48px;
  }

  .sita-m6__title {
    font-size: 38px;
  }

  .sita-m6__stages {
    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 0 28px;

    margin-top: 64px;
  }

  .sita-m6__stage {
    padding: 0 20px 36px;
  }

  .sita-m6__stage:nth-child(3) {
    border-right: 0;
  }

  .sita-m6__stage:nth-child(4),
  .sita-m6__stage:nth-child(5) {
    margin-top: 36px;
    padding-top: 0;

    border-top:
      1px solid rgba(114, 49, 41, .25);
  }

  .sita-m6__stage:nth-child(4) {
    grid-column: 1;
    padding-left: 0;
  }

  .sita-m6__stage:nth-child(5) {
    grid-column: 2;
  }

  .sita-m6__why {
    gap: 48px;
  }

}


/* =========================================================
   <= 768px
   Process 2 + 2 + 1
   Why layer stacks
   ========================================================= */

@media (max-width: 768px) {

  .sita-m6__inner {
    padding: 56px 32px;
  }

  .sita-m6__intro {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .sita-m6__title {
    font-size: 34px;
  }

  .sita-m6__title br {
    display: none;
  }

  .sita-m6__standfirst {
    max-width: 620px;

    font-size: 16px;
  }

  .sita-m6__stages {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 0 28px;

    margin-top: 48px;
  }

  .sita-m6__stage {
    padding: 0 20px 32px;
  }

  .sita-m6__stage:nth-child(2),
  .sita-m6__stage:nth-child(4) {
    border-right: 0;
  }

  .sita-m6__stage:nth-child(3),
  .sita-m6__stage:nth-child(4),
  .sita-m6__stage:nth-child(5) {
    margin-top: 32px;

    border-top:
      1px solid rgba(114, 49, 41, .25);
  }

  .sita-m6__stage:nth-child(3),
  .sita-m6__stage:nth-child(5) {
    padding-left: 0;
  }

  .sita-m6__stage:nth-child(4) {
    grid-column: auto;
  }

  .sita-m6__stage:nth-child(5) {
    grid-column: 1 / -1;

    max-width: calc(50% - 14px);
  }

  .sita-m6__why {
    grid-template-columns: 1fr;

    gap: 32px;

    margin-top: 56px;
    padding-top: 40px;
  }

  .sita-m6__why-title {
    font-size: 28px;
  }

}


/* =========================================================
   <= 767px
   Mobile: vertical rail
   ========================================================= */

@media (max-width: 767px) {

  .sita-m6__inner {
    padding: 36px 24px;
  }

  .sita-m6__meta {
    display: block;
  }

  .sita-m6__overline {
    display: none;
  }

  .sita-m6__label {
    font-size: 12px;
  }

  .sita-m6__intro {
    display: block;

    margin-top: 16px;
  }

  .sita-m6__title {
    font-size: 30px;
    line-height: 1.25;
  }

  .sita-m6__standfirst {
    margin-top: 14px;

    font-size: 15px;
    line-height: 1.8;
  }


  /* VERTICAL CARE RAIL */

  .sita-m6__stages {
    display: block;

    margin-top: 26px;
    padding-left: 22px;

    border-top: 0;
    border-left:
      1px solid rgba(114, 49, 41, .20);
  }

  .sita-m6__stage,
  .sita-m6__stage:first-child,
  .sita-m6__stage:last-child,
  .sita-m6__stage:nth-child(3),
  .sita-m6__stage:nth-child(4),
  .sita-m6__stage:nth-child(5) {
    position: relative;

    max-width: none;

    margin: 0;
    padding: 0 0 24px;

    border: 0;
  }

  .sita-m6__stage:last-child {
    padding-bottom: 0;
  }

  .sita-m6__dot {
    position: absolute;

    top: 6px;
    left: -27px;

    width: 9px;
    height: 9px;

    margin: 0;
  }

  .sita-m6__number {
    font-size: 18px;
  }

  .sita-m6__stage-title {
    margin-top: 4px;

    font-size: 19px;
    line-height: 1.5;
  }

  .sita-m6__stage-copy {
    margin-top: 6px;

    font-size: 15px;
    line-height: 1.8;
  }


  /* CASE NOTE */

  .sita-m6__case-note {
    margin-top: 32px;
    padding-top: 22px;
  }

  .sita-m6__case-note p {
    font-size: 15px;
    line-height: 1.8;
  }


  /* WHY */

  .sita-m6__why {
    display: block;

    margin-top: 40px;
    padding-top: 32px;
  }

  .sita-m6__why-title {
    font-size: 26px;
    line-height: 1.3;
  }

  .sita-m6__why-title br {
    display: none;
  }

  .sita-m6__why-copy {
    margin-top: 14px;

    font-size: 15px;
    line-height: 1.8;
  }

  .sita-m6__why-list {
    margin-top: 26px;
  }

  .sita-m6__why-row {
    grid-template-columns:
      32px
      minmax(0, 1fr);

    gap: 0 14px;

    padding: 18px 0;
  }

  .sita-m6__why-no {
    font-size: 18px;
    line-height: 1.5;
  }

  .sita-m6__why-heading {
    font-size: 16px;
    line-height: 1.55;
  }

  .sita-m6__why-row-copy {
    margin-top: 6px;

    font-size: 15px;
    line-height: 1.8;
  }

  #sita-melasma-section-06 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SITA MELASMA
   SECTION 07 — WHAT CARE MAY INVOLVE
   ========================================================= */

.sita-m7,
.sita-m7 *,
.sita-m7 *::before,
.sita-m7 *::after {
  box-sizing: border-box;
}

.sita-m7 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FBF4F0;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* =========================================================
   INNER
   1440px canvas / 88px gutters
   ========================================================= */

.sita-m7__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* =========================================================
   META
   ========================================================= */

.sita-m7__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;

  gap: 32px;
}

.sita-m7__label {
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m7__overline {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .20em;

  color: #9A614D;

  white-space: nowrap;
}


/* =========================================================
   INTRO — 7 : 5
   ========================================================= */

.sita-m7__intro {
  display: grid;
  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 72px;
  align-items: end;

  margin-top: 28px;
}

.sita-m7__title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}

.sita-m7__lead {
  max-width: 440px;

  margin: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* =========================================================
   CONTENT — 7 : 5
   ========================================================= */

.sita-m7__content {
  display: grid;
  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 72px;
  align-items: start;

  margin-top: 72px;
}


/* =========================================================
   CARE CATEGORIES
   ========================================================= */

.sita-m7__care {
  min-width: 0;

  border-top:
    1px solid rgba(114, 49, 41, .20);
}

.sita-m7__care-row {
  display: grid;
  grid-template-columns:
    56px
    minmax(0, 1fr);

  gap: 0 32px;
  align-items: start;

  padding: 28px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m7__care-row:last-of-type {
  border-bottom: 0;
}

.sita-m7__care-no {
  font-family: "Anuphan", sans-serif;
  font-size: 32px;
  font-weight: 200;
  line-height: 1;

  color: #BB6358;
}

.sita-m7__care-title {
  margin: 0;

  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;

  color: #723129;
}

.sita-m7__care-copy {
  max-width: 680px;

  margin: 10px 0 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* CARE NOTE ---------------------------------------------- */

.sita-m7__care-note {
  max-width: 760px;

  margin: 32px 0 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}


/* =========================================================
   PHYSICIAN DECISION PANEL
   ========================================================= */

.sita-m7__decision-wrap {
  min-width: 0;
}

.sita-m7__decision {
  margin: 0;
  padding: 36px 40px;

  border:
    1px solid rgba(114, 49, 41, .20);

  background: #FFFFFF;
}

.sita-m7__decision-title {
  margin: 0;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.5;

  color: #723129;
}

.sita-m7__decision-intro {
  margin: 12px 0 0;

  font-size: 15px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* DECISION ROWS ------------------------------------------ */

.sita-m7__decision-list {
  margin-top: 16px;
}

.sita-m7__decision-row {
  display: grid;
  grid-template-columns:
    28px
    minmax(0, 1fr);

  gap: 0 14px;
  align-items: baseline;

  padding: 18px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, .12);
}

.sita-m7__decision-row:first-child {
  padding-top: 18px;
}

.sita-m7__decision-row:last-child {
  border-bottom: 0;
}

.sita-m7__decision-no {
  font-family: "Anuphan", sans-serif;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m7__decision-text {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;

  color: #2A2422;
}


/* DISCLAIMER --------------------------------------------- */

.sita-m7__disclaimer {
  margin: 20px 0 0;

  font-size: 14px;
  font-weight: 300;
  line-height: 1.75;

  color: #9A614D;
}


/* =========================================================
   ANCHOR JUMP OFFSET
   ========================================================= */

#sita-melasma-section-07 {
  scroll-margin-top: 120px;
}


/* =========================================================
   TABLET <= 1024px
   Final R2:
   decision panel moves BELOW the care rows
   full width, decision list becomes 2 × 2
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m7__inner {
    padding: 88px 40px;
  }

  .sita-m7__intro {
    gap: 48px;
  }

  .sita-m7__title {
    font-size: 38px;
  }

  .sita-m7__content {
    grid-template-columns: 1fr;

    gap: 48px;

    margin-top: 56px;
  }

  .sita-m7__decision {
    padding: 32px 36px;
  }

  .sita-m7__decision-list {
    display: grid;
    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    column-gap: 36px;
  }

  .sita-m7__decision-row {
    min-height: 76px;
  }

}


/* =========================================================
   768px
   Single-column reading flow
   ========================================================= */

@media (max-width: 768px) {

  .sita-m7__inner {
    padding: 56px 32px;
  }

  .sita-m7__intro {
    grid-template-columns: 1fr;

    gap: 16px;
  }

  .sita-m7__title {
    font-size: 34px;
  }

  .sita-m7__title br {
    display: none;
  }

  .sita-m7__lead {
    max-width: 620px;

    font-size: 16px;
  }

  .sita-m7__content {
    gap: 36px;

    margin-top: 40px;
  }

  .sita-m7__care-row {
    grid-template-columns:
      44px
      minmax(0, 1fr);

    gap: 0 20px;

    padding: 24px 0;
  }

  .sita-m7__care-no {
    font-size: 26px;
  }

  .sita-m7__care-title {
    font-size: 18px;
  }

  .sita-m7__decision-list {
    display: block;
  }

}


/* =========================================================
   MOBILE <= 767px
   Final R2 390px:
   single column / decision panel last
   ========================================================= */

@media (max-width: 767px) {

  .sita-m7__inner {
    padding: 36px 24px 40px;
  }


  /* META */

  .sita-m7__meta {
    display: block;
  }

  .sita-m7__overline {
    display: none;
  }

  .sita-m7__label {
    font-size: 12px;
  }


  /* INTRO */

  .sita-m7__intro {
    display: block;

    margin-top: 14px;
  }

  .sita-m7__title {
    font-size: 30px;
    line-height: 1.25;
  }

  .sita-m7__title br {
    display: none;
  }

  .sita-m7__lead {
    max-width: none;

    margin-top: 14px;

    font-size: 15px;
    line-height: 1.8;
  }


  /* CONTENT */

  .sita-m7__content {
    display: block;

    margin-top: 26px;
  }


  /* CARE */

  .sita-m7__care-row {
    display: block;

    padding: 18px 0;
  }

  .sita-m7__care-no {
    display: inline-block;

    font-size: 20px;
    line-height: 1;
  }

  .sita-m7__care-content {
    margin-top: 5px;
  }

  .sita-m7__care-title {
    font-size: 17px;
    line-height: 1.5;
  }

  .sita-m7__care-copy {
    margin-top: 8px;

    font-size: 15px;
    line-height: 1.8;
  }

  .sita-m7__care-note {
    margin-top: 22px;

    font-size: 14px;
    line-height: 1.8;
  }


  /* DECISION PANEL LAST */

  .sita-m7__decision-wrap {
    margin-top: 28px;
  }

  .sita-m7__decision {
    padding: 20px 22px;
  }

  .sita-m7__decision-title {
    font-size: 16px;
  }

  .sita-m7__decision-intro {
    margin-top: 10px;

    font-size: 14px;
    line-height: 1.75;
  }

  .sita-m7__decision-list {
    display: block;

    margin-top: 8px;
  }

  .sita-m7__decision-row {
    grid-template-columns:
      28px
      minmax(0, 1fr);

    gap: 0 12px;

    min-height: 0;
    padding: 12px 0;
  }

  .sita-m7__decision-no {
    font-size: 14px;
  }

  .sita-m7__decision-text {
    font-size: 15px;
    line-height: 1.7;
  }

  .sita-m7__disclaimer {
    margin-top: 20px;

    font-size: 13px;
    line-height: 1.8;
  }


  #sita-melasma-section-07 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SITA MELASMA
   SECTION 08 — BEFORE YOU DECIDE
   ========================================================= */

.sita-m8,
.sita-m8 *,
.sita-m8 *::before,
.sita-m8 *::after {
  box-sizing: border-box;
}

.sita-m8 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FFFFFF;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* =========================================================
   INNER
   1440px canvas / 88px gutters
   ========================================================= */

.sita-m8__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* =========================================================
   META
   ========================================================= */

.sita-m8__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;

  gap: 32px;
}

.sita-m8__label {
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m8__overline {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .20em;

  color: #9A614D;

  white-space: nowrap;
}


/* =========================================================
   MAIN GRID — 5 : 7
   ========================================================= */

.sita-m8__grid {
  display: grid;

  grid-template-columns:
    minmax(0, 5fr)
    minmax(0, 7fr);

  gap: 72px;
  align-items: start;

  margin-top: 28px;
}

.sita-m8__left,
.sita-m8__right {
  min-width: 0;
}


/* =========================================================
   LEFT
   ========================================================= */

.sita-m8__title {
  max-width: 500px;

  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}

.sita-m8__intro {
  max-width: 480px;

  margin: 28px 0 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}


/* =========================================================
   P03 IMAGE
   ========================================================= */

.sita-m8__figure {
  width: 100%;

  margin: 36px 0 0;
}

.sita-m8__image {
  display: block;

  width: 100%;
  aspect-ratio: 4 / 5;

  border: 0;

  object-fit: cover;
  object-position: center;
}



/* =========================================================
   QUESTIONS
   ========================================================= */

.sita-m8__questions {
  border-top:
    1px solid rgba(114, 49, 41, .20);
}

.sita-m8__question {
  margin: 0;
  padding: 24px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m8__question-title {
  margin: 0;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
  font-size: 19px;
  font-weight: 500;
  line-height: 1.5;

  color: #723129;
}

.sita-m8__answer {
  margin: 10px 0 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* =========================================================
   MID-PAGE CTA
   ========================================================= */

.sita-m8__cta {
  margin-top: 44px;
  padding-top: 32px;

  border-top:
    1px solid rgba(114, 49, 41, .20);
}

.sita-m8__cta-copy {
  max-width: 620px;

  margin: 0;

  font-size: 19px;
  font-weight: 300;
  line-height: 1.8;

  color: #2A2422;
}

.sita-m8__cta-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;

  gap: 20px;

  margin-top: 26px;
}


/* BUTTON BASE */

.sita-m8__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 52px;

  padding: 0 28px;

  border-radius: 3px;

  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;

  text-decoration: none;

  transition:
    background-color .2s ease,
    color .2s ease,
    border-color .2s ease;
}


/* PRIMARY */

.sita-m8__button--primary {
  border: 1px solid #723129;

  background: #723129;
  color: #FFFFFF;
}

.sita-m8__button--primary:hover,
.sita-m8__button--primary:focus-visible {
  border-color: #BB6358;

  background: #BB6358;
  color: #FFFFFF;
}


/* SECONDARY */

.sita-m8__button--secondary {
  border: 1px solid #723129;

  background: transparent;
  color: #723129;
}

.sita-m8__button--secondary:hover,
.sita-m8__button--secondary:focus-visible {
  border-color: #BB6358;

  background: #FBF4F0;
  color: #723129;
}


/* =========================================================
   ANCHOR OFFSET
   ========================================================= */

#sita-melasma-section-08 {
  scroll-margin-top: 120px;
}


/* =========================================================
   TABLET <= 1024
   R2 keeps 5 : 7
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m8__inner {
    padding: 88px 40px;
  }

  .sita-m8__grid {
    gap: 48px;
  }

  .sita-m8__title {
    font-size: 40px;
  }

  .sita-m8__intro {
    font-size: 16px;
  }

  .sita-m8__question-title {
    font-size: 18px;
  }

}


/* =========================================================
   <= 768
   R2 READING ORDER:
   title → intro → questions → CTA → image
   ========================================================= */

@media (max-width: 768px) {

  .sita-m8__inner {
    padding: 56px 32px;
  }

  .sita-m8__grid {
    display: flex;
    flex-direction: column;

    gap: 0;

    margin-top: 22px;
  }


  /*
   Allows children of left/right to enter
   one mobile reading sequence.
  */

  .sita-m8__left,
  .sita-m8__right {
    display: contents;
  }


  /* ORDER */

  .sita-m8__title {
    order: 10;
  }

  .sita-m8__intro {
    order: 20;
  }

  .sita-m8__questions {
    order: 30;
  }

  .sita-m8__cta {
    order: 40;
  }

  .sita-m8__figure {
    order: 50;
  }


  /* TITLE */

  .sita-m8__title {
    max-width: 620px;

    font-size: 34px;
    line-height: 1.2;
  }

  .sita-m8__title br {
    display: none;
  }


  /* INTRO */

  .sita-m8__intro {
    max-width: 620px;

    margin-top: 16px;
  }


  /* QUESTIONS */

  .sita-m8__questions {
    margin-top: 32px;
  }


  /* IMAGE LAST */

  .sita-m8__figure {
    margin-top: 40px;
  }

  .sita-m8__image {
    aspect-ratio: 4 / 3;
  }

}


/* =========================================================
   MOBILE <= 767
   390px reference
   ========================================================= */

@media (max-width: 767px) {

  .sita-m8__inner {
    padding: 36px 24px 44px;
  }


  /* META */

  .sita-m8__meta {
    display: block;
  }

  .sita-m8__overline {
    display: none;
  }

  .sita-m8__label {
    font-size: 12px;
  }


  /* TITLE */

  .sita-m8__title {
    font-size: 30px;
    line-height: 1.25;
  }


  /* INTRO */

  .sita-m8__intro {
    margin-top: 14px;

    font-size: 16px;
    line-height: 1.85;
  }


  /* QUESTIONS */

  .sita-m8__questions {
    margin-top: 26px;
  }

  .sita-m8__question {
    padding: 20px 0;
  }

  .sita-m8__question-title {
    font-size: 17px;
    line-height: 1.5;
  }

  .sita-m8__answer {
    margin-top: 8px;

    font-size: 15px;
    line-height: 1.8;
  }


  /* CTA */

  .sita-m8__cta {
    margin-top: 32px;
    padding-top: 26px;
  }

  .sita-m8__cta-copy {
    font-size: 17px;
    line-height: 1.8;
  }

  .sita-m8__cta-actions {
    display: grid;
    grid-template-columns: 1fr;

    gap: 12px;

    margin-top: 22px;
  }

  .sita-m8__button {
    width: 100%;
    min-height: 52px;

    padding-inline: 18px;

    text-align: center;
  }


  /* IMAGE */

  .sita-m8__figure {
    margin-top: 32px;
  }

  .sita-m8__image {
    aspect-ratio: 4 / 3;
  }


  #sita-melasma-section-08 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SECTION 08 — MOBILE CTA / IMAGE SPACING FIX
   ========================================================= */

@media (max-width: 767px) {

  #sita-melasma-section-08 .sita-m8__cta {
    padding-bottom: 32px;
  }

  #sita-melasma-section-08 .sita-m8__figure {
    margin-top: 0 !important;
  }

}
/* =========================================================
   SITA MELASMA
   SECTION 09 — CARE JOURNEY
   ========================================================= */

.sita-m9,
.sita-m9 *,
.sita-m9 *::before,
.sita-m9 *::after {
  box-sizing: border-box;
}

.sita-m9 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FBF4F0;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* =========================================================
   INNER
   1440 canvas / 88px gutters
   ========================================================= */

.sita-m9__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* =========================================================
   META
   ========================================================= */

.sita-m9__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;

  gap: 32px;
}

.sita-m9__label {
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m9__overline {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: .20em;
  white-space: nowrap;

  color: #9A614D;
}


/* =========================================================
   INTRO — 7 : 5
   ========================================================= */

.sita-m9__intro {
  display: grid;

  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 72px;
  align-items: end;

  margin-top: 28px;
}

.sita-m9__title {
  max-width: 700px;

  margin: 0;
  padding: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}

.sita-m9__lead {
  max-width: 440px;

  margin: 0;
  padding: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* =========================================================
   JOURNEY TABLE
   phase 220 / stage 300 / description flexible
   ========================================================= */

.sita-m9__journey {
  width: 100%;

  margin-top: 72px;

  border-top:
    1px solid rgba(114, 49, 41, .20);
}

.sita-m9__row {
  display: grid;

  grid-template-columns:
    220px
    300px
    minmax(0, 1fr);

  gap: 0 40px;
  align-items: start;

  padding: 30px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m9__row:last-child {
  border-bottom: 0;
}


/* PHASE LABEL */

.sita-m9__phase {
  padding-top: 6px;

  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;

  letter-spacing: .14em;

  color: #9A614D;
}


/* STAGE TITLE */

.sita-m9__stage {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;

  color: #723129;
}


/* DESCRIPTION */

.sita-m9__description {
  max-width: 620px;

  margin: 0;
  padding: 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* =========================================================
   NOTE
   ========================================================= */

.sita-m9__note {
  max-width: 900px;

  margin: 32px 0 0;
  padding: 0;

  font-size: 14px;
  font-weight: 300;
  line-height: 1.75;

  color: #9A614D;
}


/* =========================================================
   ANCHOR OFFSET
   ========================================================= */

#sita-melasma-section-09 {
  scroll-margin-top: 120px;
}


/* =========================================================
   TABLET <= 1024px
   Keep 3-column relationship,
   but reduce fixed rails
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m9__inner {
    padding: 88px 40px;
  }

  .sita-m9__intro {
    gap: 48px;
  }

  .sita-m9__title {
    font-size: 38px;
  }

  .sita-m9__row {
    grid-template-columns:
      160px
      240px
      minmax(0, 1fr);

    gap: 0 28px;
  }

}


/* =========================================================
   768px
   R2:
   phase → stage → description
   stacked inside each row
   ========================================================= */

@media (max-width: 768px) {

  .sita-m9__inner {
    padding: 56px 32px;
  }


  /* META */

  .sita-m9__meta {
    display: block;
  }

  .sita-m9__overline {
    display: none;
  }


  /* INTRO */

  .sita-m9__intro {
    grid-template-columns: 1fr;

    gap: 16px;

    margin-top: 16px;
  }

  .sita-m9__title {
    max-width: 620px;

    font-size: 34px;
    line-height: 1.2;
  }

  .sita-m9__title br {
    display: none;
  }

  .sita-m9__lead {
    max-width: 620px;

    font-size: 16px;
  }


  /* JOURNEY */

  .sita-m9__journey {
    margin-top: 40px;
  }

  .sita-m9__row {
    display: block;

    padding: 24px 0;
  }

  .sita-m9__phase {
    padding-top: 0;

    font-size: 11px;
  }

  .sita-m9__stage {
    margin-top: 7px;

    font-size: 19px;
  }

  .sita-m9__description {
    max-width: 680px;

    margin-top: 8px;

    font-size: 15px;
  }

}


/* =========================================================
   MOBILE <= 767px
   390px Final R2
   ========================================================= */

@media (max-width: 767px) {

  .sita-m9__inner {
    padding: 36px 24px 40px;
  }


  /* LABEL */

  .sita-m9__label {
    font-size: 12px;
  }


  /* INTRO */

  .sita-m9__intro {
    margin-top: 16px;
  }

  .sita-m9__title {
    font-size: 28px;
    line-height: 1.28;
  }

  .sita-m9__lead {
    margin-top: 0;

    font-size: 15px;
    line-height: 1.8;
  }


  /* ROWS */

  .sita-m9__journey {
    margin-top: 24px;
  }

  .sita-m9__row {
    padding: 18px 0;
  }

  .sita-m9__phase {
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;

    letter-spacing: .14em;
  }

  .sita-m9__stage {
    margin-top: 6px;

    font-size: 18px;
    line-height: 1.5;
  }

  .sita-m9__description {
    margin-top: 6px;

    font-size: 15px;
    line-height: 1.8;
  }


  /* NOTE */

  .sita-m9__note {
    margin-top: 20px;

    font-size: 14px;
    line-height: 1.8;
  }


  #sita-melasma-section-09 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SITA MELASMA
   SECTION 10 — RELATED SKIN RECOVERY
   ========================================================= */

.sita-m10,
.sita-m10 *,
.sita-m10 *::before,
.sita-m10 *::after {
  box-sizing: border-box;
}

.sita-m10 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FFFFFF;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* =========================================================
   INNER
   ========================================================= */

.sita-m10__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* =========================================================
   META
   ========================================================= */

.sita-m10__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;

  gap: 32px;
}

.sita-m10__label {
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m10__overline {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: .20em;

  color: #9A614D;

  white-space: nowrap;
}


/* =========================================================
   MAIN GRID — 7 : 5
   ========================================================= */

.sita-m10__grid {
  display: grid;

  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 72px;
  align-items: start;

  margin-top: 28px;
}


/* =========================================================
   LEFT CONTENT
   ========================================================= */

.sita-m10__title {
  max-width: 700px;

  margin: 0;
  padding: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 40px;
  font-weight: 300;
  line-height: 1.22;

  color: #2A2422;
}

.sita-m10__body {
  max-width: 620px;

  margin: 28px 0 0;
  padding: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.85;

  color: #4A3D39;
}

.sita-m10__body--second {
  margin-top: 18px;
}


/* =========================================================
   RIGHT — RELATED TOPICS
   ========================================================= */

.sita-m10__related {
  min-width: 0;

  margin: 0;
  padding-top: 24px;

  border-top:
    1px solid rgba(114, 49, 41, .25);
}

.sita-m10__related-title {
  margin: 0;

  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .14em;

  color: #9A614D;
}


/* =========================================================
   NON-CLICKABLE ROWS
   Temporary staging state
   ========================================================= */

.sita-m10__related-list {
  margin-top: 10px;
}

.sita-m10__related-row {
  display: flex;
  align-items: center;

  width: 100%;
  min-height: 56px;

  padding: 18px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, .12);

  font-size: 17px;
  font-weight: 400;
  line-height: 1.5;

  color: #2A2422;

  cursor: default;
}

.sita-m10__related-row:last-child {
  border-bottom: 0;
}


/* =========================================================
   NOTE
   ========================================================= */

.sita-m10__note {
  max-width: 440px;

  margin: 20px 0 0;
  padding: 0;

  font-size: 14px;
  font-weight: 300;
  line-height: 1.75;

  color: #9A614D;
}


/* =========================================================
   ANCHOR JUMP
   ========================================================= */

#sita-melasma-section-10 {
  scroll-margin-top: 120px;
}


/* =========================================================
   TABLET <= 1024px
   Still 7 : 5
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m10__inner {
    padding: 88px 40px;
  }

  .sita-m10__grid {
    gap: 48px;
  }

  .sita-m10__title {
    font-size: 36px;
  }

  .sita-m10__body {
    font-size: 16px;
  }

  .sita-m10__related-row {
    font-size: 16px;
  }

}


/* =========================================================
   <= 768px
   Prose first → related rows
   ========================================================= */

@media (max-width: 768px) {

  .sita-m10__inner {
    padding: 56px 32px;
  }


  /* META */

  .sita-m10__meta {
    display: block;
  }

  .sita-m10__overline {
    display: none;
  }


  /* GRID */

  .sita-m10__grid {
    grid-template-columns: 1fr;

    gap: 40px;

    margin-top: 18px;
  }


  /* CONTENT */

  .sita-m10__title {
    max-width: 620px;

    font-size: 32px;
  }

  .sita-m10__title br {
    display: none;
  }

  .sita-m10__body {
    max-width: 680px;

    font-size: 16px;
  }


  /* RELATED */

  .sita-m10__related {
    padding-top: 20px;
  }

}


/* =========================================================
   MOBILE <= 767px
   390px reference
   ========================================================= */

@media (max-width: 767px) {

  .sita-m10__inner {
    padding: 36px 24px 40px;
  }


  /* LABEL */

  .sita-m10__label {
    font-size: 12px;
  }


  /* MAIN */

  .sita-m10__grid {
    gap: 32px;

    margin-top: 14px;
  }

  .sita-m10__title {
    font-size: 28px;
    line-height: 1.26;
  }

  .sita-m10__body {
    margin-top: 18px;

    font-size: 15px;
    line-height: 1.8;
  }

  .sita-m10__body--second {
    margin-top: 14px;
  }


  /* RELATED */

  .sita-m10__related {
    padding-top: 18px;
  }

  .sita-m10__related-title {
    font-size: 11px;
  }

  .sita-m10__related-list {
    margin-top: 8px;
  }

  .sita-m10__related-row {
    min-height: 56px;

    padding: 17px 0;

    font-size: 16px;
    line-height: 1.5;
  }


  /* NOTE */

  .sita-m10__note {
    margin-top: 18px;

    font-size: 13px;
    line-height: 1.75;
  }


  #sita-melasma-section-10 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SITA MELASMA
   SECTION 11 — PATIENT VOICES
   ========================================================= */

.sita-m11,
.sita-m11 *,
.sita-m11 *::before,
.sita-m11 *::after {
  box-sizing: border-box;
}

.sita-m11 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FBF4F0;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* INNER ================================================= */

.sita-m11__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* META ================================================== */

.sita-m11__meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;

  gap: 32px;
}

.sita-m11__label {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m11__overline {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: .20em;
  white-space: nowrap;

  color: #9A614D;
}


/* INTRO ================================================= */

.sita-m11__intro {
  display: grid;
  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 72px;
  align-items: end;

  margin-top: 28px;
}

.sita-m11__title {
  margin: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}

.sita-m11__lead {
  max-width: 440px;

  margin: 0;

  font-size: 17px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* =========================================================
   REVIEWS — 3 COLUMNS
   ========================================================= */

.sita-m11__reviews {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 0 48px;

  margin-top: 72px;

  border-top:
    1px solid rgba(114, 49, 41, .20);
}

.sita-m11__review {
  min-width: 0;

  padding: 36px 40px 32px 0;
}

.sita-m11__review:not(:last-child) {
  border-right:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m11__review:nth-child(2) {
  padding-left: 40px;
}

.sita-m11__review:nth-child(3) {
  padding-right: 0;
  padding-left: 40px;
}


/* REVIEW NUMBER ========================================= */

.sita-m11__review-no {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;

  letter-spacing: .14em;

  color: #BB6358;
}


/* ARRIVAL SITUATION ===================================== */

.sita-m11__situation {
  margin-top: 8px;

  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;

  color: #723129;
}


/* QUOTE ================================================= */

.sita-m11__quote {
  min-height: 150px;

  margin: 20px 0 0;
  padding: 0;

  border: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 21px;
  font-weight: 300;
  line-height: 1.65;

  color: #2A2422;

  quotes: none;
}


/* ATTRIBUTION =========================================== */

.sita-m11__attribution {
  display: grid;
  gap: 3px;

  margin-top: 20px;
  padding-top: 16px;

  border-top:
    1px solid rgba(114, 49, 41, .14);

  font-size: 14px;
  font-weight: 300;
  line-height: 1.65;

  color: #9A614D;
}

.sita-m11__attribution strong {
  font-weight: 500;

  color: #723129;
}


/* =========================================================
   FOOT
   ========================================================= */

.sita-m11__footer {
  display: flex;
  justify-content: space-between;
  align-items: baseline;

  gap: 48px;

  margin-top: 48px;
  padding-top: 24px;

  border-top:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m11__disclaimer {
  max-width: 900px;

  margin: 0;

  font-size: 14px;
  font-weight: 300;
  line-height: 1.75;

  color: #9A614D;
}

.sita-m11__reviews-link {
  flex: none;

  padding-bottom: 3px;

  border-bottom:
    1px solid rgba(114, 49, 41, .35);

  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;

  text-decoration: none;

  color: #723129;

  transition:
    color .2s ease,
    border-color .2s ease;
}

.sita-m11__reviews-link:hover,
.sita-m11__reviews-link:focus-visible {
  color: #BB6358;
  border-color: #BB6358;
}


/* ANCHOR ================================================ */

#sita-melasma-section-11 {
  scroll-margin-top: 120px;
}


/* =========================================================
   <= 1024
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m11__inner {
    padding: 88px 40px;
  }

  .sita-m11__intro {
    gap: 48px;
  }

  .sita-m11__title {
    font-size: 38px;
  }

  .sita-m11__reviews {
    gap: 0 32px;

    margin-top: 56px;
  }

  .sita-m11__review {
    padding-right: 28px;
  }

  .sita-m11__review:nth-child(2) {
    padding-left: 28px;
  }

  .sita-m11__review:nth-child(3) {
    padding-left: 28px;
  }

  .sita-m11__quote {
    font-size: 19px;
  }

}


/* =========================================================
   <= 768
   R2 = TWO COLUMNS THEN ONE
   ========================================================= */

@media (max-width: 768px) {

  .sita-m11__inner {
    padding: 56px 32px;
  }

  .sita-m11__meta {
    display: block;
  }

  .sita-m11__overline {
    display: none;
  }

  .sita-m11__intro {
    grid-template-columns: 1fr;

    gap: 14px;

    margin-top: 16px;
  }

  .sita-m11__title {
    font-size: 34px;
  }

  .sita-m11__lead {
    max-width: 620px;

    font-size: 16px;
  }


  /* 2 + 1 */

  .sita-m11__reviews {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    gap: 0 32px;

    margin-top: 40px;
  }

  .sita-m11__review,
  .sita-m11__review:nth-child(2),
  .sita-m11__review:nth-child(3) {
    padding: 28px 28px 28px 0;
  }

  .sita-m11__review:nth-child(2) {
    padding-left: 28px;
    padding-right: 0;

    border-right: 0;
  }

  .sita-m11__review:nth-child(3) {
    grid-column: 1 / -1;

    padding-left: 0;

    border-top:
      1px solid rgba(114, 49, 41, .14);

    border-right: 0;
  }

  .sita-m11__quote {
    min-height: 0;

    font-size: 18px;
  }

}


/* =========================================================
   MOBILE <= 767
   R2 = THREE STACKED HAIRLINE BLOCKS
   ========================================================= */

@media (max-width: 767px) {

  .sita-m11__inner {
    padding: 36px 24px 40px;
  }

  .sita-m11__label {
    font-size: 12px;
  }

  .sita-m11__title {
    font-size: 30px;
    line-height: 1.24;
  }

  .sita-m11__lead {
    font-size: 15px;
    line-height: 1.8;
  }


  /* STACK ALL THREE */

  .sita-m11__reviews {
    display: block;

    margin-top: 28px;

    border-top:
      1px solid rgba(114, 49, 41, .20);
  }

  .sita-m11__review,
  .sita-m11__review:nth-child(2),
  .sita-m11__review:nth-child(3) {
    display: block;

    width: 100%;

    padding: 24px 0;

    border-right: 0;
    border-top: 0;
    border-bottom:
      1px solid rgba(114, 49, 41, .14);
  }

  .sita-m11__review:last-child {
    border-bottom: 0;
  }

  .sita-m11__review-no {
    font-size: 11px;
  }

  .sita-m11__situation {
    margin-top: 6px;

    font-size: 13px;
  }

  .sita-m11__quote {
    min-height: 0;

    margin-top: 14px;

    font-size: 18px;
    line-height: 1.65;
  }

  .sita-m11__attribution {
    margin-top: 16px;
    padding-top: 14px;

    font-size: 13px;
  }


  /* FOOT */

  .sita-m11__footer {
    display: block;

    margin-top: 28px;
    padding-top: 20px;
  }

  .sita-m11__disclaimer {
    font-size: 13px;
    line-height: 1.75;
  }

  .sita-m11__reviews-link {
    display: inline-block;

    margin-top: 18px;

    font-size: 14px;
  }


  #sita-melasma-section-11 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SITA CLINIC — MELASMA PILLAR PAGE
   SECTION 12 — MELASMA KNOWLEDGE DESK
   FINAL WITH ARTICLE LINKS + ARROWS
   ========================================================= */


/* =========================================================
   01. ROOT
   ========================================================= */

.sita-m12,
.sita-m12 *,
.sita-m12 *::before,
.sita-m12 *::after {
  box-sizing: border-box;
}

.sita-m12 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FFFFFF;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* Remove browser link defaults */

.sita-m12 a {
  color: inherit;
  text-decoration: none;
}


/* =========================================================
   02. INNER
   Desktop canvas = 1440
   Gutter = 88
   ========================================================= */

.sita-m12__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* =========================================================
   03. META
   ========================================================= */

.sita-m12__meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;

  gap: 32px;

  padding-bottom: 22px;

  border-bottom:
    1px solid rgba(114, 49, 41, 0.25);
}

.sita-m12__label {
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m12__overline {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: 0.20em;
  white-space: nowrap;

  color: #9A614D;
}


/* =========================================================
   04. SECTION H2
   ========================================================= */

.sita-m12__title {
  margin: 36px 0 0;
  padding: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #723129;
}


/* Elementor global heading protection */

#sita-melasma-section-12 h2.sita-m12__title {
  color: #723129 !important;
  -webkit-text-fill-color: #723129 !important;
}


/* =========================================================
   05. MAIN GRID
   Featured 5 / Index 7
   ========================================================= */

.sita-m12__grid {
  display: grid;

  grid-template-columns:
    minmax(0, 5fr)
    minmax(0, 7fr);

  gap: 72px;
  align-items: start;

  margin-top: 48px;
}


/* =========================================================
   06. FEATURED ARTICLE
   ========================================================= */

.sita-m12__featured {
  min-width: 0;
}


/* IMAGE -------------------------------------------------- */

.sita-m12__figure {
  width: 100%;

  margin: 0;
  padding: 0;
}

.sita-m12__image {
  display: block;

  width: 100%;
  height: 360px;

  object-fit: cover;
  object-position: center;

  border: 0;
}


/* FEATURED TITLE ----------------------------------------- */

.sita-m12__featured-title {
  margin: 28px 0 0;
  padding: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 32px;
  font-weight: 300;
  line-height: 1.28;

  color: #2A2422;
}


/* Protect H3 from Elementor global heading */

#sita-melasma-section-12 h3.sita-m12__featured-title {
  color: #2A2422 !important;
  -webkit-text-fill-color: #2A2422 !important;
}


/* FEATURED COPY ------------------------------------------ */

.sita-m12__featured-copy {
  max-width: 520px;

  margin: 16px 0 0;
  padding: 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* FEATURED LINK ------------------------------------------ */

.sita-m12__featured-link {
  display: inline-flex;
  align-items: center;

  gap: 8px;

  margin-top: 20px;
  padding-bottom: 3px;

  border-bottom:
    1px solid rgba(114, 49, 41, 0.35);

  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;

  color: #723129 !important;

  transition:
    color 0.2s ease,
    border-color 0.2s ease;
}

.sita-m12__featured-arrow {
  display: inline-block;

  transition:
    transform 0.2s ease;
}

.sita-m12__featured-link:hover,
.sita-m12__featured-link:focus-visible {
  color: #BB6358 !important;

  border-color: #BB6358;
}

.sita-m12__featured-link:hover
.sita-m12__featured-arrow,

.sita-m12__featured-link:focus-visible
.sita-m12__featured-arrow {
  transform: translateX(4px);
}


/* =========================================================
   07. KNOWLEDGE INDEX
   ========================================================= */

.sita-m12__index {
  min-width: 0;

  border-top:
    1px solid rgba(114, 49, 41, 0.20);
}


/* =========================================================
   08. ARTICLE ROW
   NUMBER / CONTENT / ARROW
   ========================================================= */

.sita-m12__row {
  display: grid;

  grid-template-columns:
    56px
    minmax(0, 1fr)
    28px;

  gap: 0 24px;
  align-items: baseline;

  width: 100%;

  margin: 0;
  padding: 24px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, 0.12);

  color: #2A2422;

  cursor: pointer;

  transition:
    color 0.2s ease,
    background-color 0.2s ease;
}

.sita-m12__row:last-of-type {
  border-bottom: 0;
}


/* NUMBER ------------------------------------------------ */

.sita-m12__number {
  font-family: "Anuphan", sans-serif;

  font-size: 24px;
  font-weight: 200;
  line-height: 1;

  color: #BB6358;
}


/* CONTENT ----------------------------------------------- */

.sita-m12__row-content {
  display: block;
  min-width: 0;
}


/* TITLE ------------------------------------------------- */

.sita-m12__row-title {
  display: block;

  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;

  color: #2A2422;

  transition:
    color 0.2s ease;
}


/* DESCRIPTION ------------------------------------------- */

.sita-m12__row-description {
  display: block;

  margin-top: 6px;

  font-size: 15px;
  font-weight: 300;
  line-height: 1.7;

  color: #9A614D;
}


/* ARROW ------------------------------------------------- */

.sita-m12__row-arrow {
  display: block;

  justify-self: end;

  font-size: 18px;
  font-weight: 300;
  line-height: 1.5;

  color: #BB6358;

  transition:
    transform 0.2s ease,
    color 0.2s ease;
}


/* =========================================================
   09. ROW INTERACTION
   Editorial hover — not card-like
   ========================================================= */

.sita-m12__row:hover .sita-m12__row-title,
.sita-m12__row:focus-visible .sita-m12__row-title {
  color: #723129;
}

.sita-m12__row:hover .sita-m12__row-arrow,
.sita-m12__row:focus-visible .sita-m12__row-arrow {
  color: #723129;

  transform: translateX(4px);
}

.sita-m12__row:focus-visible {
  outline: 1px solid rgba(187, 99, 88, 0.55);
  outline-offset: 4px;
}


/* =========================================================
   10. KNOWLEDGE HUB LINK
   ========================================================= */

.sita-m12__hub {
  display: flex;
  justify-content: flex-end;

  margin-top: 28px;
}

.sita-m12__hub-link {
  display: inline-flex;
  align-items: center;

  gap: 8px;

  padding-bottom: 3px;

  border-bottom:
    1px solid rgba(114, 49, 41, 0.35);

  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;

  color: #723129 !important;

  transition:
    color 0.2s ease,
    border-color 0.2s ease;
}

.sita-m12__hub-link span:last-child {
  display: inline-block;

  transition:
    transform 0.2s ease;
}

.sita-m12__hub-link:hover,
.sita-m12__hub-link:focus-visible {
  color: #BB6358 !important;

  border-color: #BB6358;
}

.sita-m12__hub-link:hover span:last-child,
.sita-m12__hub-link:focus-visible span:last-child {
  transform: translateX(4px);
}


/* =========================================================
   11. ANCHOR JUMP OFFSET
   ========================================================= */

#sita-melasma-section-12 {
  scroll-margin-top: 120px;
}


/* =========================================================
   TABLET <= 1024px
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m12__inner {
    padding: 88px 40px;
  }


  /* H2 */

  .sita-m12__title {
    font-size: 38px;
  }


  /* GRID */

  .sita-m12__grid {
    gap: 48px;

    margin-top: 40px;
  }


  /* IMAGE */

  .sita-m12__image {
    height: 320px;
  }


  /* FEATURE */

  .sita-m12__featured-title {
    font-size: 28px;
  }


  /* ROW */

  .sita-m12__row {
    grid-template-columns:
      44px
      minmax(0, 1fr)
      22px;

    gap: 0 18px;

    padding: 22px 0;
  }

  .sita-m12__number {
    font-size: 22px;
  }

  .sita-m12__row-title {
    font-size: 18px;
  }

  .sita-m12__row-arrow {
    font-size: 17px;
  }

}


/* =========================================================
   768px
   Featured first → seven rows
   ========================================================= */

@media (max-width: 768px) {

  .sita-m12__inner {
    padding: 56px 32px;
  }


  /* META */

  .sita-m12__meta {
    display: block;
  }

  .sita-m12__overline {
    display: none;
  }


  /* H2 */

  .sita-m12__title {
    margin-top: 24px;

    font-size: 34px;
  }


  /* STACK */

  .sita-m12__grid {
    grid-template-columns: 1fr;

    gap: 48px;

    margin-top: 32px;
  }


  /* IMAGE */

  .sita-m12__image {
    width: 100%;
    height: auto;

    aspect-ratio: 3 / 2;

    object-fit: cover;
  }


  /* FEATURE */

  .sita-m12__featured-title {
    margin-top: 24px;

    font-size: 28px;
  }

  .sita-m12__featured-title br {
    display: none;
  }

  .sita-m12__featured-copy {
    max-width: 620px;
  }


  /* ROW */

  .sita-m12__row {
    padding: 20px 0;
  }

}


/* =========================================================
   MOBILE <= 767px
   390px reference
   ========================================================= */

@media (max-width: 767px) {

  .sita-m12__inner {
    padding: 36px 24px 40px;
  }


  /* META */

  .sita-m12__meta {
    padding-bottom: 16px;
  }

  .sita-m12__label {
    font-size: 12px;
  }


  /* H2 */

  .sita-m12__title {
    margin-top: 20px;

    font-size: 28px;
    line-height: 1.28;
  }


  /* GRID */

  .sita-m12__grid {
    gap: 36px;

    margin-top: 24px;
  }


  /* FEATURED IMAGE */

  .sita-m12__image {
    width: 100%;
    height: auto;

    aspect-ratio: 3 / 2;
  }


  /* FEATURED TITLE */

  .sita-m12__featured-title {
    margin-top: 20px;

    font-size: 26px;
    line-height: 1.3;
  }

  .sita-m12__featured-copy {
    margin-top: 12px;

    font-size: 15px;
    line-height: 1.8;
  }

  .sita-m12__featured-link {
    margin-top: 16px;

    font-size: 14px;
  }


  /* =======================================================
     KNOWLEDGE ROW
     Number / content / arrow all retained
     ======================================================= */

  .sita-m12__row {
    grid-template-columns:
      32px
      minmax(0, 1fr)
      18px;

    gap: 0 14px;
    align-items: start;

    padding: 17px 0;
  }

  .sita-m12__number {
    font-size: 18px;
    line-height: 1.5;
  }

  .sita-m12__row-title {
    font-size: 16px;
    line-height: 1.55;
  }

  .sita-m12__row-description {
    margin-top: 4px;

    font-size: 14px;
    line-height: 1.65;
  }

  .sita-m12__row-arrow {
    padding-top: 1px;

    font-size: 15px;
    line-height: 1.5;
  }


  /* HUB LINK */

  .sita-m12__hub {
    justify-content: flex-start;

    margin-top: 24px;
  }

  .sita-m12__hub-link {
    font-size: 14px;
  }


  /* ANCHOR */

  #sita-melasma-section-12 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SITA CLINIC — MELASMA PILLAR
   SECTION 13 — FAQ
   ========================================================= */


/* =========================================================
   01. ROOT
   ========================================================= */

.sita-m13,
.sita-m13 *,
.sita-m13 *::before,
.sita-m13 *::after {
  box-sizing: border-box;
}

.sita-m13 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #FBF4F0;
  color: #2A2422;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* =========================================================
   02. INNER
   ========================================================= */

.sita-m13__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 112px 88px;
}


/* =========================================================
   03. META
   ========================================================= */

.sita-m13__meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;

  gap: 32px;
}

.sita-m13__label {
  margin: 0;

  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;

  color: #BB6358;
}

.sita-m13__overline {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: .20em;
  white-space: nowrap;

  color: #9A614D;
}


/* =========================================================
   04. H2
   ========================================================= */

.sita-m13__title {
  margin: 28px 0 0;
  padding: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 48px;
  font-weight: 300;
  line-height: 1.18;

  color: #2A2422;
}


/* Elementor Global Heading protection */

#sita-melasma-section-13 h2.sita-m13__title {
  color: #2A2422 !important;
  -webkit-text-fill-color: #2A2422 !important;
}


/* =========================================================
   05. FAQ GRID
   Desktop / 1024 = 2 × 5
   ========================================================= */

.sita-m13__grid {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 1fr);

  gap: 0 72px;

  margin-top: 64px;
}


/* =========================================================
   06. COLUMN
   ========================================================= */

.sita-m13__column {
  min-width: 0;

  border-top:
    1px solid rgba(114, 49, 41, .20);
}


/* =========================================================
   07. FAQ ITEM
   ========================================================= */

.sita-m13__item {
  margin: 0;
  padding: 28px 0;

  border-bottom:
    1px solid rgba(114, 49, 41, .14);
}

.sita-m13__column
.sita-m13__item:last-child {
  border-bottom: 0;
}


/* =========================================================
   08. H3 / QUESTION
   ========================================================= */

.sita-m13__question {
  margin: 0;
  padding: 0;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* =========================================================
   09. QUESTION BUTTON
   Desktop behaves visually as normal H3
   ========================================================= */

.sita-m13__trigger {
  display: block;

  width: 100%;

  margin: 0;
  padding: 0;

  border: 0;
  border-radius: 0;
  background: transparent;

  font: inherit;

  text-align: left;

  color: #723129;

  cursor: default;

  appearance: none;
  -webkit-appearance: none;
}

.sita-m13__trigger > span:first-child {
  display: block;

  font-size: 19px;
  font-weight: 500;
  line-height: 1.5;

  color: #723129;
}


/* Protect H3/button from Elementor globals */

#sita-melasma-section-13
.sita-m13__question,
#sita-melasma-section-13
.sita-m13__trigger,
#sita-melasma-section-13
.sita-m13__trigger > span:first-child {
  color: #723129 !important;
  -webkit-text-fill-color: #723129 !important;
}


/* Accordion icon hidden outside mobile */

.sita-m13__icon {
  display: none;
}


/* =========================================================
   10. ANSWER
   ========================================================= */

.sita-m13__answer {
  display: block;
}

.sita-m13__answer[hidden] {
  display: none;
}

.sita-m13__answer p {
  margin: 12px 0 0;
  padding: 0;

  font-size: 16px;
  font-weight: 300;
  line-height: 1.8;

  color: #4A3D39;
}


/* =========================================================
   11. DISCLAIMER
   ========================================================= */

.sita-m13__note {
  max-width: 1000px;

  margin: 48px 0 0;
  padding: 24px 0 0;

  border-top:
    1px solid rgba(114, 49, 41, .14);

  font-size: 14px;
  font-weight: 300;
  line-height: 1.75;

  color: #9A614D;
}


/* =========================================================
   12. ANCHOR OFFSET
   ========================================================= */

#sita-melasma-section-13 {
  scroll-margin-top: 120px;
}


/* =========================================================
   TABLET <= 1024
   R2: two columns remain open
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m13__inner {
    padding: 88px 40px;
  }

  .sita-m13__title {
    font-size: 38px;
  }

  .sita-m13__grid {
    gap: 0 48px;

    margin-top: 52px;
  }

  .sita-m13__item {
    padding: 24px 0;
  }

  .sita-m13__trigger > span:first-child {
    font-size: 18px;
  }

  .sita-m13__answer p {
    font-size: 15px;
  }

}


/* =========================================================
   768px
   R2: single column, ALL answers still open
   ========================================================= */

@media (max-width: 768px) {

  .sita-m13__inner {
    padding: 56px 32px;
  }


  /* META */

  .sita-m13__meta {
    display: block;
  }

  .sita-m13__overline {
    display: none;
  }


  /* H2 */

  .sita-m13__title {
    margin-top: 18px;

    font-size: 34px;
    line-height: 1.2;
  }


  /* ONE COLUMN */

  .sita-m13__grid {
    grid-template-columns: 1fr;

    gap: 0;

    margin-top: 40px;
  }


  /*
   Remove duplicate top rule between
   left 01–05 and right 06–10.
  */

  .sita-m13__column + .sita-m13__column {
    border-top: 0;
  }

  .sita-m13__column:first-child
  .sita-m13__item:last-child {
    border-bottom:
      1px solid rgba(114, 49, 41, .14);
  }


  /* TYPOGRAPHY */

  .sita-m13__item {
    padding: 22px 0;
  }

  .sita-m13__trigger > span:first-child {
    font-size: 18px;
  }

  .sita-m13__answer p {
    margin-top: 10px;

    font-size: 15px;
    line-height: 1.8;
  }

}


/* =========================================================
   MOBILE <= 767px
   R2: accordion
   First item open
   ========================================================= */

@media (max-width: 767px) {

  .sita-m13__inner {
    padding: 36px 24px 40px;
  }


  /* META */

  .sita-m13__label {
    font-size: 12px;
  }


  /* H2 */

  .sita-m13__title {
    margin-top: 16px;

    font-size: 28px;
    line-height: 1.28;
  }


  /* FAQ */

  .sita-m13__grid {
    margin-top: 28px;
  }


  /* ITEM */

  .sita-m13__item {
    padding: 0;
  }


  /* =======================================================
     MOBILE ACCORDION TRIGGER
     ======================================================= */

  .sita-m13__trigger {
    display: grid;

    grid-template-columns:
      minmax(0, 1fr)
      28px;

    gap: 18px;
    align-items: center;

    min-height: 64px;

    padding: 17px 0;

    cursor: pointer;
  }

  .sita-m13__trigger > span:first-child {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.5;
  }


  /* PLUS / MINUS */

  .sita-m13__icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    justify-self: end;

    font-family: "Anuphan", sans-serif;

    font-size: 22px;
    font-weight: 200;
    line-height: 1;

    color: #BB6358;
  }

  .sita-m13__icon::before {
    content: "+";
  }

  .sita-m13__trigger[aria-expanded="true"]
  .sita-m13__icon::before {
    content: "−";
  }


  /* ANSWER */

  .sita-m13__answer {
    padding: 0 38px 20px 0;
  }

  .sita-m13__answer p {
    margin: 0;

    font-size: 15px;
    line-height: 1.8;
  }


  /* ACCESSIBLE FOCUS */

  .sita-m13__trigger:focus-visible {
    outline:
      1px solid rgba(187, 99, 88, .55);

    outline-offset: 4px;
  }


  /* NOTE */

  .sita-m13__note {
    margin-top: 32px;
    padding-top: 20px;

    font-size: 13px;
    line-height: 1.75;
  }


  /* ANCHOR */

  #sita-melasma-section-13 {
    scroll-margin-top: 90px;
  }

}
/* =========================================================
   SITA CLINIC — MELASMA PILLAR
   SECTION 14 — FINAL CTA
   ========================================================= */


/* =========================================================
   01. ROOT
   ========================================================= */

.sita-m14,
.sita-m14 *,
.sita-m14 *::before,
.sita-m14 *::after {
  box-sizing: border-box;
}

.sita-m14 {
  width: 100%;
  margin: 0;
  padding: 0;

  background: #723129;
  color: #F6EAE4;

  font-family: "Noto Sans Thai", "Noto Sans", sans-serif;
}


/* Reset links inside section */

.sita-m14 a {
  text-decoration: none;
}


/* =========================================================
   02. INNER
   Desktop R2 = 1440 canvas / 88 gutter
   ========================================================= */

.sita-m14__inner {
  width: 100%;
  max-width: 1440px;

  margin-inline: auto;
  padding: 120px 88px;
}


/* =========================================================
   03. MAIN GRID — 7 : 5
   ========================================================= */

.sita-m14__grid {
  display: grid;

  grid-template-columns:
    minmax(0, 7fr)
    minmax(0, 5fr);

  gap: 88px;
  align-items: end;
}

.sita-m14__main,
.sita-m14__contact {
  min-width: 0;
}


/* =========================================================
   04. SECTION LABEL
   ========================================================= */

.sita-m14__label {
  margin: 0;

  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;

  letter-spacing: .20em;

  color: #E3B7AB;
}


/* =========================================================
   05. H2
   ========================================================= */

.sita-m14__title {
  max-width: 720px;

  margin: 28px 0 0;
  padding: 0;

  font-family: "Anuphan", sans-serif;
  font-size: 60px;
  font-weight: 200;
  line-height: 1.12;
  letter-spacing: -0.01em;

  color: #FFFFFF;
}


/* Elementor heading override protection */

#sita-melasma-section-14
h2.sita-m14__title {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}


/* =========================================================
   06. LEAD
   ========================================================= */

.sita-m14__lead {
  max-width: 600px;

  margin: 28px 0 0;
  padding: 0;

  font-size: 19px;
  font-weight: 300;
  line-height: 1.8;

  color: #F0DCD4;
}


/* =========================================================
   07. CTA ACTIONS
   ========================================================= */

.sita-m14__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;

  gap: 32px;

  margin-top: 44px;
}


/* BUTTON BASE */

.sita-m14__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 54px;

  padding: 0 32px;

  border-radius: 3px;

  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;

  text-align: center;

  transition:
    background-color .2s ease,
    color .2s ease,
    border-color .2s ease,
    transform .2s ease;
}


/* PRIMARY — inverted white */

.sita-m14__button--primary {
  border: 1px solid #FFFFFF;

  background: #FFFFFF;
  color: #723129 !important;
}

.sita-m14__button--primary:hover,
.sita-m14__button--primary:focus-visible {
  border-color: #FBF4F0;

  background: #FBF4F0;
  color: #723129 !important;
}


/* SECONDARY — LINE */

.sita-m14__button--line {
  padding-inline: 28px;

  border:
    1px solid rgba(246, 234, 228, .55);

  background: transparent;

  color: #FFFFFF !important;
}

.sita-m14__button--line:hover,
.sita-m14__button--line:focus-visible {
  border-color: #FFFFFF;

  background:
    rgba(255, 255, 255, .06);

  color: #FFFFFF !important;
}


/* FOCUS */

.sita-m14__button:focus-visible,
.sita-m14__directions:focus-visible {
  outline:
    1px solid rgba(255, 255, 255, .80);

  outline-offset: 4px;
}


/* =========================================================
   08. CONTACT PANEL
   ========================================================= */

.sita-m14__contact {
  margin: 0;
  padding-top: 28px;

  border-top:
    1px solid rgba(246, 234, 228, .30);
}


/* =========================================================
   09. CONTACT ROW
   ========================================================= */

.sita-m14__contact-row {
  display: grid;

  grid-template-columns:
    120px
    minmax(0, 1fr);

  gap: 16px;
  align-items: baseline;

  padding: 12px 0;

  border-bottom:
    1px solid rgba(246, 234, 228, .18);

  font-size: 15px;
  line-height: 1.65;
}

.sita-m14__contact-row--last {
  border-bottom: 0;
}


/* LABEL */

.sita-m14__contact-label {
  color: #E3B7AB;
}


/* VALUE */

.sita-m14__contact-value {
  color: #FFFFFF !important;
}

a.sita-m14__contact-value {
  transition: color .2s ease;
}

a.sita-m14__contact-value:hover,
a.sita-m14__contact-value:focus-visible {
  color: #F0DCD4 !important;
}


/* =========================================================
   10. DIRECTIONS
   ========================================================= */

.sita-m14__directions {
  display: inline-flex;
  align-items: center;

  gap: 8px;

  margin-top: 20px;
  padding-bottom: 3px;

  border-bottom:
    1px solid rgba(246, 234, 228, .35);

  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;

  color: #F6EAE4 !important;

  transition:
    border-color .2s ease,
    color .2s ease;
}

.sita-m14__directions-arrow {
  display: inline-block;

  transition: transform .2s ease;
}

.sita-m14__directions:hover,
.sita-m14__directions:focus-visible {
  border-color: #FFFFFF;

  color: #FFFFFF !important;
}

.sita-m14__directions:hover
.sita-m14__directions-arrow,

.sita-m14__directions:focus-visible
.sita-m14__directions-arrow {
  transform: translateX(4px);
}


/* =========================================================
   11. ANCHOR OFFSET
   ========================================================= */

#sita-melasma-section-14 {
  scroll-margin-top: 120px;
}


/* =========================================================
   TABLET <= 1024
   ========================================================= */

@media (max-width: 1024px) {

  .sita-m14__inner {
    padding: 96px 40px;
  }

  .sita-m14__grid {
    gap: 56px;
  }

  .sita-m14__title {
    font-size: 50px;
  }

  .sita-m14__lead {
    font-size: 17px;
  }

  .sita-m14__actions {
    gap: 16px;
  }

  .sita-m14__button {
    padding-inline: 24px;
  }

  .sita-m14__contact-row {
    grid-template-columns:
      100px
      minmax(0, 1fr);
  }

}


/* =========================================================
   <= 768
   Stack CTA then contact
   ========================================================= */

@media (max-width: 768px) {

  .sita-m14__inner {
    padding: 64px 32px;
  }

  .sita-m14__grid {
    grid-template-columns: 1fr;

    gap: 48px;
  }

  .sita-m14__title {
    max-width: 620px;

    font-size: 42px;
  }

  .sita-m14__lead {
    max-width: 640px;

    font-size: 16px;
  }

}


/* =========================================================
   MOBILE <= 767
   Exact R2 direction
   ========================================================= */

@media (max-width: 767px) {

  .sita-m14__inner {
    padding: 40px 24px 44px;
  }


  /* GRID */

  .sita-m14__grid {
    display: block;
  }


  /* LABEL */

  .sita-m14__label {
    font-size: 11px;
    letter-spacing: .18em;
  }


  /* H2 */

  .sita-m14__title {
    max-width: none;

    margin-top: 18px;

    font-size: 34px;
    line-height: 1.15;
  }

  .sita-m14__title br {
    display: none;
  }


  /* LEAD */

  .sita-m14__lead {
    max-width: none;

    margin-top: 18px;

    font-size: 16px;
    line-height: 1.85;
  }


  /* BUTTONS */

  .sita-m14__actions {
    display: grid;
    grid-template-columns: 1fr;

    gap: 12px;

    margin-top: 26px;
  }

  .sita-m14__button {
    width: 100%;

    min-height: 52px;

    padding: 0 18px;

    font-size: 15px;
  }


  /* CONTACT */

  .sita-m14__contact {
    margin-top: 28px;
    padding-top: 0;

    border-top:
      1px solid rgba(246, 234, 228, .30);
  }


  /* CONTACT ROW */

  .sita-m14__contact-row {
    grid-template-columns:
      92px
      minmax(0, 1fr);

    gap: 12px;

    padding: 11px 0;

    font-size: 14px;
    line-height: 1.65;
  }


  /* DIRECTIONS */

  .sita-m14__directions {
    margin-top: 20px;

    font-size: 14px;
  }


  /* ANCHOR */

  #sita-melasma-section-14 {
    scroll-margin-top: 90px;
  }

}/* End custom CSS */