/* S'maChic+ simulator — tokens follow the site: pink #D81B60, blush #FDECEF, border #F4D9DE, ink #3D3835, muted #6B625C */
.sim-wrap{width:100%;max-width:760px}
.sim-wrap[data-simulator=full]{max-width:1260px;margin:0 auto}
.sim-card{background:#fff;border:1px solid #F4D9DE;border-radius:24px;padding:22px;display:flex;align-items:center;justify-content:space-between;gap:20px;box-sizing:border-box;color:#3D3835;font-family:"Noto Sans Thai",system-ui,sans-serif;line-height:1.55;box-shadow:0 6px 24px rgba(216,27,96,.06)}
.sim-title{margin:0;font-family:Prompt,sans-serif;font-weight:600;font-size:20px;line-height:1.4}
.sim-intro{margin:6px 0 0;font-size:15px;color:#6B625C}

.sm{position:relative;background:#fff;border-radius:32px;padding:26px 32px 30px;box-sizing:border-box;color:#3D3835;font-family:"Noto Sans Thai",system-ui,sans-serif;font-size:16px;line-height:1.55;box-shadow:0 18px 60px rgba(216,27,96,.10);overflow:hidden}
.sm *{box-sizing:border-box}
.sm h2,.sm h3,.sm p,.sm ul,.sm ol,.sm hr{margin:0}
.sm-i{flex:none;display:block}

/* header + stepper */
.sm-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:28px;margin-bottom:26px}
.sm-logo img{display:block;height:54px;width:auto}
.sm-exit{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 20px;border:1.5px solid #F4C6D2;border-radius:999px;color:#D81B60;font-family:Prompt,sans-serif;font-weight:500;font-size:15px;white-space:nowrap;background:#fff}
.sm-exit .sm-i{width:16px;height:16px}
.sm-steps{list-style:none;padding:0;display:flex;margin:0 4px}
.sm-steps li{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:14.5px;color:#9A918B}
.sm-steps li:not(:last-child)::after{content:"";position:absolute;top:17px;left:calc(50% + 24px);right:calc(-50% + 24px);height:3px;border-radius:3px;background:#ECE5E1}
.sm-steps li.done:not(:last-child)::after{background:linear-gradient(90deg,#D81B60,#F0678F)}
.sm-dot{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid #E4DBD7;font-family:Prompt,sans-serif;font-weight:600;font-size:15px;color:#9A918B;position:relative;z-index:1}
.sm-dot .sm-i{width:18px;height:18px;stroke-width:2.6}
.sm-steps li.done .sm-dot{background:#D81B60;border-color:#D81B60;color:#fff}
.sm-steps li.on .sm-dot{background:#D81B60;border-color:#D81B60;color:#fff;box-shadow:0 0 0 5px #FBD3DE}
.sm-steps li.on{color:#3D3835;font-weight:500}.sm-steps li.done{color:#3D3835}

/* title block */
.sm-pill{display:inline-block;padding:3px 16px;border-radius:999px;background:#FDECEF;border:1px solid #F4C6D2;color:#D81B60;font-size:14px;font-weight:500;margin-bottom:14px}
.sm-h{font-family:Prompt,sans-serif;font-weight:600;font-size:clamp(26px,3.2vw,38px);line-height:1.3;outline:none}
.sm-h em{font-style:normal;color:#D81B60}
.sm-sub{margin-top:12px!important;color:#5C534D;font-size:17px}
.sm-top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:22px}
.sm-top .sm-title{flex:1 1 420px}
.sm-h4tip{max-width:520px}

/* layouts */
.sm-s1,.sm-s5{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,8fr);gap:36px;align-items:start}
.sm-right{display:flex;flex-direction:column;gap:18px}
.sm-intro-img{display:block;width:100%;max-width:300px;margin-top:18px;border-radius:24px}
.sm-body{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:26px;align-items:start}
.sm-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.sm-grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.sm-grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.sm-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:26px}

/* option cards */
.sm-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px;border:1.5px solid #EBDDE0;border-radius:22px;background:#fff;cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s;min-width:0}
.sm-card:hover{border-color:#F2A8BE}
.sm-card.on{border-color:#D81B60;background:#FFF5F8;box-shadow:0 8px 24px rgba(216,27,96,.14)}
.sm-card input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.sm-card:focus-within{outline:3px solid #D81B60;outline-offset:3px}
.sm-card h3{font-family:Prompt,sans-serif;font-weight:600;font-size:17px;line-height:1.4}
.sm-cd{font-size:14.5px;color:#6B625C;line-height:1.5}
.sm-tick{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:50%;border:2px solid #D9CFCB;background:#fff;display:grid;place-items:center;color:transparent;z-index:2}
.sm-tick .sm-i{width:16px;height:16px;stroke-width:3}
.sm-card.on .sm-tick{background:#D81B60;border-color:#D81B60;color:#fff}
.sm-big{padding:18px}.sm-big h3{font-size:20px}.sm-big hr{border:0;border-top:1px solid #F0E2E5;margin:10px 0 6px}
.sm-ph{position:relative;aspect-ratio:5/4;border-radius:16px;margin-bottom:34px;background:linear-gradient(135deg,#FDECEF,#FBD3DE)}
.sm-ph img{width:100%;height:100%;object-fit:cover;border-radius:16px;display:block}
.sm-ph-lg{aspect-ratio:16/8.5}
.sm-ph .sm-ico{position:absolute;left:10px;bottom:-26px}
.sm-ico{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#D81B60;box-shadow:0 4px 14px rgba(216,27,96,.18)}
.sm-ico .sm-i{width:26px;height:26px}
.sm-ico-solo{background:#FDECEF;box-shadow:none;margin-bottom:6px;width:56px;height:56px}
.sm-card.noimg{padding-top:18px}
.sm-bl{list-style:none;padding:0;display:flex;flex-direction:column;gap:8px;margin-top:4px}
.sm-bl li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45}
.sm-bc{flex:none;width:20px;height:20px;border-radius:50%;background:#D81B60;color:#fff;display:grid;place-items:center;margin-top:1px}
.sm-bc .sm-i{width:12px;height:12px;stroke-width:3.2}
.sm-bl.mute .sm-bc{background:#B9B0AB}

/* notes / panels */
.sm-note{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:18px;background:#FDECEF;font-size:14.5px;line-height:1.5;color:#4C4440}
.sm-note b{display:block;color:#D81B60;font-family:Prompt,sans-serif;margin-bottom:2px}
.sm-note.flat{background:#FFF3F6}
.sm-need{align-items:center}
.sm-bulb{flex:none;width:40px;height:40px;border-radius:50%;background:#FFE9C7;color:#E39A1B;display:grid;place-items:center}
.sm-bulb .sm-i{width:22px;height:22px}
.sm-aside{display:flex;flex-direction:column;gap:14px}
.sm-tipbox{padding:16px 18px;border-radius:22px;background:#FDECEF}.sm-tipbox b{display:block;color:#D81B60;font-family:Prompt,sans-serif}.sm-tipbox p{font-size:14px;color:#5C534D;margin-top:2px}
.sm-panel{padding:20px;border-radius:24px;background:#FDF0F3;display:flex;flex-direction:column;gap:12px}
.sm-ph2{display:flex;align-items:center;gap:8px;font-family:Prompt,sans-serif;font-weight:600;font-size:19px}
.sm-spark{color:#F0A13A;display:grid}.sm-spark .sm-i{width:24px;height:24px}
.sm-big-n{color:#D81B60;font-size:24px}
.sm-sel{list-style:none;padding:0;display:flex;flex-direction:column;gap:8px}
.sm-sel li{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 10px;border-radius:16px;background:#fff;font-size:14.5px;line-height:1.35}
.sm-sel li>span:nth-child(2){flex:1;min-width:0}
.sm-mini{flex:none;width:36px;height:36px;border-radius:50%;background:#FDECEF;color:#D81B60;display:grid;place-items:center}
.sm-mini .sm-i{width:19px;height:19px}
.sm-rm{flex:none;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:#9A918B;cursor:pointer;display:grid;place-items:center}
.sm-rm:hover{background:#FDECEF;color:#D81B60}.sm-rm .sm-i{width:16px;height:16px}
.sm-clsp h3{font-family:Prompt,sans-serif;font-size:22px;font-weight:600}
.sm-accent{color:#D81B60;font-weight:600;font-size:15px}
.sm-feat{list-style:none;padding:0;display:flex;flex-direction:column;gap:14px;margin:4px 0}
.sm-feat li{display:flex;gap:12px;align-items:flex-start}.sm-feat b{display:block;font-size:15px}.sm-feat small{display:block;color:#6B625C;font-size:13.5px;line-height:1.45}
.sm-hint{font-size:13.5px;color:#6B625C;line-height:1.5}.sm-hint a{color:#D81B60;text-decoration:underline}
.sm-err{color:#B3123F;font-size:14px;font-weight:500}
.sm-fs{border:0;padding:0;margin:0;min-width:0;display:flex;flex-direction:column;gap:10px}.sm-fs legend{padding:0;margin-bottom:10px;font-weight:500}
.sm-chips{display:flex;flex-wrap:wrap;gap:10px}
.sm-chip{position:relative;min-height:44px;padding:0 18px;display:inline-flex;align-items:center;border:1.5px solid #EBDDE0;border-radius:999px;cursor:pointer;background:#fff;font-size:15px}
.sm-chip input{position:absolute;opacity:0;width:1px;height:1px}
.sm-chip.on{border-color:#D81B60;background:#FDECEF;color:#D81B60;font-weight:500}
.sm-chip:focus-within{outline:3px solid #D81B60;outline-offset:2px}

/* buttons */
.sm-btn{min-height:54px;padding:0 30px;border-radius:999px;border:1.5px solid #D81B60;background:linear-gradient(180deg,#E8307A,#D81B60);color:#fff;font-family:Prompt,sans-serif;font-weight:500;font-size:17px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-align:center;text-decoration:none;box-shadow:0 8px 20px rgba(216,27,96,.25)}
.sm-btn .sm-i{width:20px;height:20px}
.sm-btn.ghost,.sm-btn.outline{background:#fff;color:#D81B60;box-shadow:none}
.sm-btn.link{min-height:36px;padding:0 6px;border:0;background:transparent;color:#D81B60;box-shadow:none;font-size:14.5px}
.sm-btn.link .sm-i{width:16px;height:16px}
.sm-btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.sm-btn:focus-visible,.sm-exit:focus-visible{outline:3px solid #D81B60;outline-offset:3px}

/* result */
.sm-resgrid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.25fr);gap:20px;align-items:stretch}
.sm-rec{position:relative;border:2px solid #F29BB6;border-radius:28px;background:linear-gradient(135deg,#FFF3F6,#FFE3EB);padding:58px 26px 24px}
.sm-recTag{position:absolute;left:0;top:0;padding:8px 20px;border-radius:26px 0 18px 0;background:#D81B60;color:#fff;font-family:Prompt,sans-serif;font-weight:500;font-size:15px}
.sm-crown{position:absolute;right:20px;top:14px;display:inline-flex;align-items:center;gap:6px;padding:4px 14px;border-radius:999px;background:#fff;color:#D81B60;font-size:13.5px;font-weight:500}
.sm-crown .sm-i{width:16px;height:16px}
.sm-recBody{display:flex;flex-direction:column;gap:14px}
.sm-recHead{display:flex;gap:18px;align-items:center}
.sm-letter{font-family:Prompt,sans-serif;font-weight:700;color:#D81B60;font-size:34px;line-height:1}
.sm-letter.big{font-size:84px}
.sm-fit{font-family:Prompt,sans-serif;font-weight:600;font-size:21px;color:#D81B60;line-height:1.3}
.sm-why{font-size:15px;color:#5C534D;margin-top:4px}
.sm-contact{font-family:Prompt,sans-serif;font-size:26px;color:#D81B60}
.sm-seg{display:inline-flex;align-self:flex-start;padding:4px;border-radius:999px;background:#fff}
.sm-seg button{min-height:42px;padding:0 20px;border:0;border-radius:999px;background:transparent;font-family:Prompt,sans-serif;font-size:15px;cursor:pointer;color:#3D3835}
.sm-seg button.on{background:#D81B60;color:#fff}
.sm-price{display:flex;flex-direction:column;gap:8px;background:rgba(255,255,255,.7);border-radius:18px;padding:14px 16px}
.sm-pl{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;font-size:15px}
.sm-pl b{font-weight:600;text-align:right}
.sm-tot{border-top:1px solid #F4D3DC;padding-top:10px;font-size:17px}
.sm-amt{font-family:Prompt,sans-serif;font-weight:600;font-size:20px}
.sm-amt.big{font-size:34px;color:#D81B60}
.sm-per{font-family:Prompt,sans-serif;font-size:16px;margin-left:4px;color:#3D3835;font-weight:500}
.sm-avg{display:block;font-weight:400;color:#6B625C;font-size:13.5px;margin-top:2px}
.sm-ask{color:#6B625C}
.sm-ebtag{background:#D81B60;color:#fff;border-radius:99px;padding:1px 9px;font-size:11.5px;font-weight:500}
.sm-cta{display:flex;flex-wrap:wrap;gap:12px}
.sm-disc{font-size:13px;color:#6B625C}
.sm-alts{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sm-alt{border:1.5px solid #EBDDE0;border-radius:24px;padding:18px;display:flex;flex-direction:column;gap:10px;background:#fff;min-width:0}
.sm-alt h3{font-family:Prompt,sans-serif;font-size:19px;font-weight:600}
.sm-alt .sm-btn{min-height:46px;font-size:15px;padding:0 16px}
.sm-altp{min-height:48px}
.sm-tag{align-self:flex-start;padding:2px 12px;border-radius:999px;background:#F4EFEC;color:#6B625C;font-size:12.5px}
.sm-sums{display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:16px;margin-top:18px}
.sm-sum{border:1.5px solid #F0E2E5;border-radius:22px;padding:16px 18px;background:#fff;display:flex;flex-direction:column;gap:6px;min-width:0}
.sm-sumh{display:flex;justify-content:space-between;align-items:center;gap:8px;font-family:Prompt,sans-serif;font-weight:600;font-size:15.5px}
.sm-sumh>span{display:inline-flex;align-items:center;gap:8px;color:#3D3835}.sm-sumh>span .sm-i{color:#D81B60;width:20px;height:20px}
.sm-tasks{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin-top:4px}
.sm-tasks li{display:flex;gap:8px;align-items:center;font-size:13.5px;line-height:1.3}
.sm-tasks small{display:block;color:#D81B60;font-size:11.5px}
.sm-tasks .sm-mini{width:32px;height:32px}.sm-tasks .sm-mini .sm-i{width:17px;height:17px}

/* form */
.sm-formcard{border:1.5px solid #F0E2E5;border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:14px;background:#fff}
.sm-fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sm-f{display:flex;flex-direction:column;gap:6px;font-size:14.5px;font-weight:500}
.sm-f input,.sm-f select{min-height:50px;padding:0 14px;border:1.5px solid #E4D6D9;border-radius:14px;font:inherit;font-size:16px;font-weight:400;background:#fff;color:#3D3835;width:100%}
.sm-f input:focus,.sm-f select:focus{outline:3px solid #F29BB6;border-color:#D81B60}
.sm-msg{white-space:pre-wrap;word-break:break-word;padding:16px;border-radius:16px;background:#FDF0F3;font-family:inherit;font-size:14.5px;line-height:1.6;margin:0}

@media (max-width:1100px){
  .sm-resgrid{grid-template-columns:1fr}
  .sm-sums{grid-template-columns:1fr 1fr}.sm-sums .sm-sum:nth-child(2){grid-column:1/-1;order:3}
}
@media (max-width:899px){
  .sm{padding:20px 18px 24px;border-radius:26px}
  .sm-head{grid-template-columns:1fr auto;gap:14px 12px;margin-bottom:20px}
  .sm-logo img{height:42px}.sm-exit{min-height:40px;padding:0 14px;font-size:14px}
  .sm-steps{grid-column:1/-1;order:3;margin:0}
  .sm-steps li{font-size:13px;gap:4px}
  .sm-steps li .sm-lbl{display:none}.sm-steps li.on .sm-lbl{display:block}
  .sm-steps li:not(:last-child)::after{left:calc(50% + 22px);right:calc(-50% + 22px)}
  .sm-s1,.sm-s5,.sm-body{grid-template-columns:1fr;gap:20px}
  .sm-aside{order:2}
  .sm-sub{font-size:15.5px}
  .sm-grid2,.sm-grid3,.sm-fgrid,.sm-alts{grid-template-columns:1fr}
  .sm-sums{grid-template-columns:1fr}.sm-sums .sm-sum:nth-child(2){order:0;grid-column:auto}
  .sm-rec{padding:56px 18px 20px}.sm-letter.big{font-size:64px}
  .sm-cta .sm-btn{flex:1 1 100%}
  .sm-foot .sm-btn{flex:1;padding:0 14px}
  .sim-card{flex-direction:column;align-items:stretch}
  .sim-card .sm-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.sm *{transition:none!important}}
.sm p,.sm h2,.sm h3,.sm li,.sm legend{text-wrap:pretty}
.sm-h em{white-space:nowrap}
.sm-alts.one{grid-template-columns:1fr}
@media (max-width:899px){
  .sm-card.noimg:not(.sm-big){display:grid;grid-template-columns:auto 1fr;column-gap:12px;row-gap:2px;align-items:center;padding:12px 50px 12px 12px}
  .sm-card.noimg:not(.sm-big) .sm-ico-solo{grid-row:1/3;width:46px;height:46px;margin:0}
  .sm-card.noimg:not(.sm-big) h3{font-size:15.5px;align-self:end}.sm-card.noimg:not(.sm-big) .sm-cd{align-self:start;font-size:13.5px}
  .sm-foot .sm-btn{font-size:15px}
}
@media (max-width:899px){.sm-ph{aspect-ratio:16/9}.sm-ph-lg{aspect-ratio:16/8.5}.sm-intro-img{display:none}}
