/* รับซื้อซากคอม.com · Premium home spotlight v1.4
   Scopes two existing home sections; preserves original image width/height
   (2048 x 1024), never crops or changes underlying files. */
.sp-feature,.sp-feature *{box-sizing:border-box}
.sp-feature{position:relative;isolation:isolate;overflow:hidden;padding:clamp(48px,5.7vw,78px) 0;font-family:'Sarabun',sans-serif}
.sp-feature .sp-shell{position:relative;z-index:1}
.sp-feature .sp-head{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(290px,.8fr);align-items:stretch;gap:clamp(22px,3.2vw,43px)}
.sp-feature .sp-head-copy{min-width:0;align-self:center;padding-block:5px}
.sp-feature .sp-overline{display:flex;align-items:center;flex-wrap:wrap;gap:12px;min-height:26px;margin:0 0 17px;font:750 .7rem/1.5 'Prompt',sans-serif;letter-spacing:.1em}
.sp-feature .sp-index{white-space:nowrap;opacity:.75}
.sp-feature .sp-overline-rule{width:30px;height:1px;background:currentColor;opacity:.6}
.sp-feature .sp-overline-label{letter-spacing:.13em}
.sp-feature .sp-head h2{font:750 clamp(2rem,4vw,3.52rem)/1.23 'Prompt','Sarabun',sans-serif;letter-spacing:-.044em;margin:0 0 16px;max-width:800px;text-wrap:balance}
.sp-feature .sp-head h2 span{display:block}
.sp-feature .sp-lead{font-size:clamp(.96rem,1.17vw,1.07rem);line-height:1.94;max-width:730px;margin:0}
.sp-feature .sp-lead strong{font-weight:750}
.sp-feature .sp-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:23px}
.sp-feature .sp-tags span{display:inline-flex;align-items:center;border-radius:8px;padding:8px 11px;font-size:.78rem;font-weight:700;line-height:1.3}
.sp-feature .sp-tags span::before{content:'';width:5px;height:5px;border-radius:50%;margin-right:8px;flex:none}
.sp-feature .sp-button{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 16px;min-height:50px;border-radius:11px;text-align:left;font:750 .87rem/1.5 'Prompt',sans-serif;transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;text-decoration:none}
.sp-feature .sp-button:hover{transform:translateY(-2px)}
.sp-feature .sp-button span:last-child{font-family:'Sarabun',sans-serif;font-size:1.15rem;line-height:1}
.sp-feature .sp-button-primary{color:#10352b;background:linear-gradient(120deg,#d9ffc2,#9de78a);border:1px solid #a6e78f;box-shadow:0 10px 23px rgba(50,161,86,.15)}
.sp-feature .sp-button-primary:hover{background:#e2ffce;box-shadow:0 13px 25px rgba(50,161,86,.23)}
.sp-feature .sp-button-secondary{color:#f2faff;background:#ffffff0b;border:1px solid #b1d0e34e}
.sp-feature .sp-button-secondary:hover{background:#ffffff1a;border-color:#d6e9f299}
/* Section 01 / Dark */
.sp-feature-dark{background:radial-gradient(ellipse at 100% 0%,rgba(50,105,139,.30),transparent 42%),linear-gradient(135deg,#061526 0%,#09233f 52%,#0c2b45 100%);color:#f8fcff;border-block:1px solid #16405b}
.sp-feature-dark:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(to bottom,#000,transparent 66%);pointer-events:none}
.sp-feature-dark:after{content:'';position:absolute;right:-190px;top:-170px;width:475px;height:475px;border:1px solid #e9c48925;border-radius:50%;box-shadow:0 0 0 65px #e9c48908,0 0 0 140px #e9c48904;pointer-events:none}
.sp-feature-dark .sp-overline{color:#bdd8e4}
.sp-feature-dark .sp-overline-label{color:#e4c68f}
.sp-feature-dark .sp-head h2{color:#fff}
.sp-feature-dark .sp-head h2 span{color:#c1f39c}
.sp-feature-dark .sp-lead{color:#c6d9e6}
.sp-feature-dark .sp-lead strong{color:#fff}
.sp-feature-dark .sp-tags span{border:1px solid #67889c75;background:#ffffff0b;color:#d5e5ef}
.sp-feature-dark .sp-tags span:before{background:#c0ee94}
.sp-feature .sp-contact-panel{min-width:0;position:relative;overflow:hidden;padding:clamp(23px,2.6vw,30px);border-radius:20px;border:1px solid #97bdcb52;background:linear-gradient(145deg,#ffffff19,#ffffff07);box-shadow:0 15px 40px #020c1c29}
.sp-feature .sp-contact-panel:before{content:'';position:absolute;top:0;left:23px;right:23px;height:3px;background:linear-gradient(90deg,#e2bd86,#b9ed9d 70%,transparent)}
.sp-feature .sp-panel-top{display:flex;align-items:center;gap:12px;margin-bottom:19px}
.sp-feature .sp-panel-pictogram{display:grid;place-items:center;width:47px;height:47px;flex:none;color:#c7f4b1;background:#a8ec9915;border:1px solid #a8ec995b;border-radius:12px}
.sp-feature .sp-panel-pictogram svg{width:24px;height:24px}
.sp-feature .sp-panel-kicker{font:700 .72rem/1.5 'Prompt',sans-serif;letter-spacing:.1em;color:#cae3e9}
.sp-feature .sp-contact-panel h3{font:750 1.51rem/1.5 'Prompt',sans-serif;letter-spacing:-.03em;color:#fff;margin:0 0 8px}
.sp-feature .sp-contact-panel p{font-size:.87rem;line-height:1.87;color:#c2d4e0;margin:0 0 17px}
.sp-feature .sp-contact-panel .sp-button{display:flex;margin-top:9px}
.sp-feature .sp-panel-note{display:block;color:#a6c0d1;font-size:.71rem;line-height:1.8;margin-top:15px}
/* Shared full-resolution campaign image. No crop. */
.sp-feature .sp-image-card{overflow:hidden;margin:28px 0 0;padding:7px;border-radius:22px;box-shadow:0 22px 48px #03132529}
.sp-feature .sp-image-card a{display:block;overflow:hidden;background:#0a223a;border-radius:9px;outline-offset:-2px}
.sp-feature .sp-image-card .sp-original-image{display:block;width:100%;height:auto;max-height:none;aspect-ratio:2048 / 1024;object-fit:contain;border:0;border-radius:0;margin:0;background:transparent;box-shadow:none;vertical-align:middle}
.sp-feature .sp-image-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding:11px 13px 12px;font-size:.72rem;line-height:1.5}
.sp-feature .sp-image-indicator{display:inline-flex;align-items:center;gap:9px;font:750 .67rem/1.6 'Prompt',sans-serif;letter-spacing:.09em}
.sp-feature .sp-image-indicator i{width:7px;height:7px;flex:none;border-radius:50%;background:#a4e59a;box-shadow:0 0 0 4px #a4e59a17}
.sp-feature .sp-image-caption{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;padding:12px 13px 9px;font-size:.81rem;line-height:1.7}
.sp-feature .sp-image-caption b{margin:0 5px;font-weight:400;opacity:.5}
.sp-feature .sp-enlarge{flex:none;font-weight:750;font-size:.78rem}
.sp-feature .sp-image-card-dark{border:1px solid #7895a561;background:linear-gradient(130deg,#0e334d,#0b263b)}
.sp-feature .sp-image-card-dark .sp-image-toolbar{color:#b5ccda}
.sp-feature .sp-image-card-dark .sp-image-indicator{color:#c8f3b6}
.sp-feature .sp-image-card-dark .sp-image-caption{color:#adc6d7}
.sp-feature .sp-image-card-dark .sp-enlarge{color:#deebf7}
.sp-feature .sp-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:15px}
.sp-feature .sp-step{display:flex;align-items:flex-start;gap:12px;min-width:0;padding:17px;border:1px solid #7393a73a;border-radius:13px;background:#ffffff08;transition:background .2s ease,border-color .2s ease}
.sp-feature .sp-step:hover{background:#ffffff14;border-color:#bbd2dd74}
.sp-feature .sp-step-number{display:grid;place-items:center;min-width:41px;height:41px;flex:none;border:1px solid #b2ef9c40;border-radius:10px;background:#abe79917;color:#c5efb1;font:750 .83rem/1 'Prompt',sans-serif}
.sp-feature .sp-step>div{min-width:0;flex:1}
.sp-feature .sp-step h3{color:#fff;font:700 .95rem/1.5 'Prompt',sans-serif;letter-spacing:0;margin:0 0 4px}
.sp-feature .sp-step p{color:#acc2d4;font-size:.79rem;line-height:1.7;margin:0}
.sp-feature .sp-step-arrow{flex:none;align-self:start;color:#b6d6b9;font-size:1rem}
/* Section 02 / Light */
.sp-feature-light{background:radial-gradient(ellipse at 0% 100%,#e4f4ef,transparent 45%),linear-gradient(140deg,#f8fbfd,#e9eff5);color:#12324e}
.sp-feature-light:before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#d2e0ea,transparent)}
.sp-feature-light .sp-overline{color:#6b8195}
.sp-feature-light .sp-overline-label{color:#28735f}
.sp-feature-light .sp-head h2{color:#14334f}
.sp-feature-light .sp-head h2 span{color:#18786e}
.sp-feature-light .sp-lead{color:#526d81}
.sp-feature-light .sp-lead strong{color:#1e435e}
.sp-feature .sp-stat-note{display:inline-flex;align-items:center;gap:12px;border:1px solid #d9e7ed;background:#fff;box-shadow:0 8px 25px #10395d0a;border-radius:11px;margin-top:21px;padding:11px 14px}
.sp-feature .sp-stat-mark{display:grid;place-items:center;flex:none;width:37px;height:37px;background:#e4f6e5;color:#398c70;border-radius:10px;font-size:1.3rem}
.sp-feature .sp-stat-note strong{display:block;color:#21475c;font:700 .84rem/1.5 'Prompt',sans-serif;margin-bottom:2px}
.sp-feature .sp-stat-note small{display:block;color:#6d8195;font-size:.75rem;line-height:1.55}
.sp-feature .sp-check-panel{position:relative;overflow:hidden;min-width:0;align-self:stretch;border:1px solid #1a4962;border-radius:20px;padding:clamp(22px,2.6vw,30px);background:linear-gradient(135deg,#0c2b47,#143a53);box-shadow:0 15px 37px #0d355326;color:#fff}
.sp-feature .sp-check-panel:after{content:'';position:absolute;right:-55px;top:-75px;width:185px;height:185px;border-radius:50%;border:1px solid #bce8b62a;box-shadow:0 0 0 41px #bce8b610;pointer-events:none}
.sp-feature .sp-check-kicker{display:block;margin-bottom:12px;font:700 .72rem/1.5 'Prompt',sans-serif;letter-spacing:.11em;color:#c6e9b2}
.sp-feature .sp-check-panel h3{font:750 1.45rem/1.5 'Prompt',sans-serif;letter-spacing:-.02em;color:#fff;margin:0 0 14px}
.sp-feature .sp-check-panel ol{position:relative;z-index:1;margin:0;padding:0;list-style:none}
.sp-feature .sp-check-panel li{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid #ffffff2a}
.sp-feature .sp-check-panel li span{flex:none;width:28px;font:800 .9rem/1 'Prompt',sans-serif;color:#bdeca6}
.sp-feature .sp-check-panel li strong{display:block;font:650 .9rem/1.5 'Prompt',sans-serif;color:#fff}
.sp-feature .sp-check-panel li small{display:block;color:#bfd2df;font-size:.76rem;line-height:1.6}
.sp-feature .sp-image-card-light{border:1px solid #cedde9;background:#fff;box-shadow:0 17px 48px #092f4518}
.sp-feature .sp-image-card-light .sp-image-toolbar{color:#6b8294}
.sp-feature .sp-image-card-light .sp-image-indicator{color:#2e7a67}
.sp-feature .sp-image-card-light .sp-image-indicator i{background:#69c58b}
.sp-feature .sp-image-card-light .sp-image-caption{color:#627b8e}
.sp-feature .sp-image-card-light .sp-enlarge{color:#205d66}
.sp-feature .sp-bottom-action{display:flex;align-items:center;justify-content:space-between;gap:20px 35px;margin-top:16px;padding:clamp(21px,2.8vw,31px);border-radius:16px;background:linear-gradient(110deg,#0c2b45,#19445a);box-shadow:0 15px 35px #102f4b19}
.sp-feature .sp-bottom-copy{flex:1;min-width:0}
.sp-feature .sp-action-kicker{display:block;margin-bottom:6px;color:#bee7a6;letter-spacing:.1em;font:700 .72rem/1.5 'Prompt',sans-serif}
.sp-feature .sp-bottom-copy h3{margin:0 0 6px;font:750 clamp(1.12rem,1.8vw,1.45rem)/1.4 'Prompt',sans-serif;color:#fff}
.sp-feature .sp-bottom-copy p{margin:0;color:#bed4e1;font-size:.85rem;line-height:1.8;max-width:620px}
.sp-feature .sp-bottom-buttons{display:flex;gap:9px;flex:none}
.sp-feature .sp-bottom-buttons .sp-button{min-width:168px}
.sp-feature .sp-button-outline{color:#fff;background:#ffffff09;border:1px solid #bad4e462}
.sp-feature .sp-button-outline:hover{background:#ffffff1b;border-color:#e4effbad}
@media(max-width:1020px){
.sp-feature .sp-head{grid-template-columns:minmax(0,1fr) minmax(270px,.85fr);gap:23px}
.sp-feature .sp-head h2{font-size:clamp(2rem,3.6vw,2.8rem)}
.sp-feature .sp-step{padding:15px 12px;gap:9px}
.sp-feature .sp-step-arrow{display:none}
.sp-feature .sp-bottom-action{align-items:flex-start}
.sp-feature .sp-bottom-buttons{flex-direction:column;min-width:175px}
}
@media(max-width:800px){
.sp-feature{padding:51px 0}
.sp-feature .sp-head{grid-template-columns:minmax(0,1fr);gap:24px}
.sp-feature .sp-head h2{font-size:clamp(2rem,5vw,3rem)}
.sp-feature .sp-head-copy{padding:0}
.sp-feature .sp-contact-panel{display:grid;grid-template-columns:1fr 1fr;column-gap:13px}
.sp-feature .sp-contact-panel .sp-panel-top,.sp-feature .sp-contact-panel h3,.sp-feature .sp-contact-panel p,.sp-feature .sp-contact-panel .sp-panel-note{grid-column:1/-1}
.sp-feature .sp-contact-panel .sp-button{align-self:stretch}
.sp-feature .sp-step{display:block}
.sp-feature .sp-step-number{margin-bottom:11px}
.sp-feature .sp-check-panel ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sp-feature .sp-check-panel li{display:block;padding:12px 0}
.sp-feature .sp-check-panel li span{display:block;margin-bottom:7px}
.sp-feature .sp-bottom-action{display:block}
.sp-feature .sp-bottom-buttons{margin-top:17px;flex-direction:row}
}
@media(max-width:620px){
.sp-feature{padding:41px 0}
.sp-feature .sp-overline{font-size:.6rem;gap:8px;margin-bottom:13px}
.sp-feature .sp-overline-rule{width:19px}
.sp-feature .sp-head h2{font-size:clamp(1.7rem,7.25vw,2.4rem);line-height:1.29;margin-bottom:12px}
.sp-feature .sp-lead{font-size:.93rem;line-height:1.86}
.sp-feature .sp-tags{margin-top:18px;gap:7px}
.sp-feature .sp-tags span{padding:7px 8px;font-size:.71rem}
.sp-feature .sp-contact-panel{display:block;border-radius:16px;padding:21px}
.sp-feature .sp-contact-panel h3{font-size:1.33rem}
.sp-feature .sp-contact-panel .sp-button{display:flex}
.sp-feature .sp-image-card{margin-top:19px;padding:4px;border-radius:13px}
.sp-feature .sp-image-card a{border-radius:6px}
.sp-feature .sp-image-toolbar{font-size:.59rem;padding:8px 9px;gap:3px}
.sp-feature .sp-image-indicator{font-size:.57rem;letter-spacing:.02em;gap:6px}
.sp-feature .sp-image-indicator i{width:5px;height:5px}
.sp-feature .sp-image-caption{display:block;padding:8px 9px 7px;font-size:.71rem}
.sp-feature .sp-enlarge{display:block;margin-top:2px;font-size:.71rem}
.sp-feature .sp-steps{grid-template-columns:1fr;gap:8px;margin-top:11px}
.sp-feature .sp-step{display:flex;padding:13px 14px;gap:11px}
.sp-feature .sp-step-number{width:36px;min-width:36px;height:36px;margin:0;border-radius:9px}
.sp-feature .sp-step h3{font-size:.87rem}
.sp-feature .sp-step p{font-size:.75rem}
.sp-feature .sp-stat-note{margin-top:17px;padding:11px;align-items:flex-start}
.sp-feature .sp-check-panel{padding:20px;border-radius:16px}
.sp-feature .sp-check-panel ol{grid-template-columns:1fr;gap:0}
.sp-feature .sp-check-panel li{display:flex;padding:10px 0}
.sp-feature .sp-check-panel li span{margin:0}
.sp-feature .sp-bottom-action{padding:19px;border-radius:13px}
.sp-feature .sp-bottom-copy h3{font-size:1.12rem}
.sp-feature .sp-bottom-copy p{font-size:.8rem}
.sp-feature .sp-bottom-buttons{flex-direction:column;gap:8px}
.sp-feature .sp-bottom-buttons .sp-button{width:100%}
}
@media(prefers-reduced-motion:reduce){.sp-feature .sp-button,.sp-feature .sp-step{transition:none}}