.section.benefits{position:relative;display:block;padding:0;background:#eee9df;isolation:isolate;overflow:hidden}
.benefits-heading{position:absolute;top:44px;left:8%;right:8%;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:24px;pointer-events:none}.benefits-heading h2{font-size:14px;font-weight:450;letter-spacing:0;line-height:1.6;margin:0;color:#796d5a}.benefits-heading h2 br{display:none}.benefits-heading>p:last-child{display:none}.benefits-heading .eyebrow{font-size:10px;letter-spacing:2px}
.benefits-gallery{position:relative}.benefit-stage{display:grid;overflow:hidden;touch-action:pan-y pinch-zoom}.benefit-card{grid-area:1/1;position:relative;box-sizing:border-box;min-height:clamp(650px,86svh,920px);padding:150px 16% 132px 12%;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(ellipse at 95% 20%,#ded4c2 0,transparent 55%),#eee9df;visibility:hidden;opacity:0;pointer-events:none}.benefit-card:nth-child(2){background:radial-gradient(ellipse at 95% 20%,#d7ddcf,transparent 55%),#edf0e7}.benefit-card:nth-child(3){background:radial-gradient(ellipse at 95% 20%,#d8d9d6,transparent 55%),#eeefeb}.benefit-card:nth-child(4){background:radial-gradient(ellipse at 95% 20%,#e5d5c5,transparent 55%),#f1e9e0}.benefit-card.is-active{visibility:visible;opacity:1;pointer-events:auto}.benefit-card.is-leaving{visibility:visible;pointer-events:none}
.benefit-card .why-number{font:13px Georgia,serif;color:#887250;margin-bottom:30px;letter-spacing:2px}.benefit-card .why-number span{font:10px Arial,sans-serif;letter-spacing:3px;margin-left:20px}.benefit-card .why-concern{font-size:15px;color:#80725e;margin:0 0 22px}.benefit-card h3{font-size:clamp(36px,4.6vw,68px);line-height:1.38;font-weight:380;letter-spacing:-2.3px;margin:0;color:#3e3a30}.benefit-card h3 strong{font-weight:640}.benefit-card .why-description{max-width:640px;font-size:15px;line-height:2;color:#6f675a;margin:28px 0}.benefit-card .why-detail{display:inline-block;font-size:11px;color:#8b785b;border-top:1px solid #c9bcaa;padding-top:17px;line-height:1.8}.benefit-card svg{position:absolute;right:8%;top:43%;width:clamp(70px,10vw,150px);height:clamp(70px,10vw,150px);stroke:#a18f72;stroke-width:.65;fill:none;opacity:.45;pointer-events:none}
.benefit-controls{position:absolute;z-index:4;bottom:38px;left:8%;right:8%;display:flex;align-items:center;justify-content:flex-end;gap:22px;border-top:1px solid #bdae963d;padding-top:22px}.benefit-controls::before{content:'한 공간을 위한, 네 가지 기준';margin-right:auto;font-size:12px;color:#81715a}.benefit-controls button{width:52px;height:52px;border:1px solid #af9c80;background:transparent;color:#66543d;border-radius:50%;font-size:23px;cursor:pointer;transition:background .25s,color .25s}.benefit-controls button:hover{background:#66543d;color:#fff}.benefit-count{font-size:12px;letter-spacing:2px;color:#77654d;font-variant-numeric:tabular-nums}.benefit-controls button:focus-visible{outline:2px solid #66543d;outline-offset:4px}
@media(max-width:760px){.benefits-heading{top:30px;left:6%;right:6%}.benefits-heading h2{display:none}.benefit-card{min-height:700px;padding:106px 7% 132px;justify-content:center}.benefit-card h3{font-size:clamp(30px,7.8vw,46px);letter-spacing:-1.4px}.benefit-card .why-concern{font-size:12px;max-width:90%}.benefit-card .why-description{font-size:14px;line-height:1.9}.benefit-card svg{top:70px;right:7%;width:52px;height:52px}.benefit-controls{left:7%;right:7%;bottom:28px;gap:15px}.benefit-controls::before{content:'네 가지 기준';font-size:11px}.benefit-controls button{width:44px;height:44px}}
@media(prefers-reduced-motion:reduce){.benefit-controls button{transition:none}}
.benefit-photo-card .benefit-text{max-width:58%}.benefit-example{position:absolute;right:4%;top:36px;width:29%;margin:0}.benefit-example img{display:block;width:100%;height:220px;object-fit:cover;border-radius:2px}.benefit-example figcaption{font-size:11px;color:#665b4d;line-height:1.6;margin-top:10px}.construction-guide{margin-top:32px;border-top:1px solid #c9bcaa;padding-top:24px}.construction-guide h3{font-size:18px;font-weight:600;margin:0 0 20px}.construction-guide dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:0}.construction-guide dt{font-size:14px;font-weight:600;margin-bottom:9px}.construction-guide dd{font-size:13px;color:#625c52;line-height:1.8;margin:0;word-break:keep-all}.benefit-card .why-detail{max-width:640px;word-break:keep-all}
@media(max-width:760px){.benefit-photo-card .benefit-text{max-width:none}.benefit-example{position:static;width:100%;margin:18px 0 0}.benefit-example img{height:150px;object-position:center 35%}.construction-guide dl{grid-template-columns:1fr 1fr;gap:20px}.construction-guide dt{font-size:13px}.construction-guide dd{font-size:12px}}
.about-copy{align-self:center}.benefits-heading h2{word-break:keep-all}
.section.benefits{padding:48px 8%;background:#eee9df}.benefits-heading{position:relative;inset:auto;display:block;max-width:1120px;margin:0 auto 26px}.benefits-heading .eyebrow{font-size:9px;margin:0 0 10px}.benefits-heading h2{display:block;font-size:clamp(30px,3.2vw,46px);font-weight:650;letter-spacing:-1.5px;color:#403b31;line-height:1.3}.benefits-gallery{max-width:1120px;margin:auto}.benefit-card{min-height:430px;padding:36px 15% 96px 5%;justify-content:center}.benefit-card .why-number{margin-bottom:18px}.benefit-card .why-concern{margin-bottom:12px;font-size:13px}.benefit-card h3{font-size:clamp(28px,3vw,42px);letter-spacing:-1.5px}.benefit-card .why-description{margin:18px 0;font-size:14px;line-height:1.8}.benefit-card .why-detail{padding-top:12px}.benefit-card svg{width:70px;height:70px;right:5%;top:36%}.benefit-controls{bottom:18px;left:5%;right:5%;padding-top:12px;gap:16px}.benefit-controls button{width:40px;height:40px;font-size:20px}
@media(max-width:760px){.section.benefits{padding:36px 5%}.benefits-heading{margin-bottom:20px}.benefits-heading h2{font-size:32px}.benefit-card{min-height:460px;padding:30px 6% 88px}.benefit-card .why-number{margin-bottom:28px}.benefit-card h3{font-size:clamp(25px,6.6vw,32px)}.benefit-card svg{width:34px;height:34px;right:6%;top:22px}.benefit-card .why-description{font-size:13px}.benefit-controls{left:6%;right:6%;bottom:16px}}