/* Special Caulking / Original Editorial Design 2026 */
:root { --brand-dark:#101c2a; --brand-surface:#17273a; --brand-orange:#ed793f; --brand-orange-hover:#cb5b2a; --text-main:#182a36; --text-muted:#647987; --bg-light:#f6f8f9; --border-light:#e1e7ea; }
html {scroll-behavior:smooth} body {background:#f6f8f9;color:#162736;letter-spacing:-.018em}
.top-bar {background:rgba(255,255,255,.96); backdrop-filter:blur(14px);border-bottom:1px solid #dce4e9;height:74px;box-shadow:0 2px 18px rgba(15,36,51,.025)}
.bar-inner{max-width:1200px;padding:0 32px}
.brand-logo{font-size:22px;letter-spacing:-.055em;color:#172c39}
.logo-badge{background:#132b3c;border-radius:100px;padding:5px 10px;letter-spacing:0;font-size:10px}
.btn-yt-top,.btn-blog-top,.btn-kakao-top{border-radius:100px;padding:10px 15px;font-size:12px}
.wrap{max-width:1200px;padding:92px 32px}
.top-bar+section.wrap {max-width:none;padding:0;background:linear-gradient(128deg,#102635 0%,#172f40 58%,#264254 100%);position:relative;overflow:hidden}
.top-bar+section.wrap::before{content:'';position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.075);border-radius:50%;right:-200px;top:-200px;box-shadow:0 0 0 90px rgba(255,255,255,.013),0 0 0 190px rgba(255,255,255,.01)}
.hero-container{position:relative;z-index:1;max-width:1200px;margin:auto;padding:102px 32px 106px;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:70px;align-items:center}
.hero-container>div:first-child{min-width:0}
.hero-container .tag-label{color:#f4be9a;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);letter-spacing:.07em;text-transform:uppercase;font-size:12px;padding:9px 16px;margin-bottom:28px}
.main-title{font-size:clamp(38px,4vw,59px);line-height:1.18;color:#fff;letter-spacing:-.066em;margin-bottom:28px;font-weight:900;overflow-wrap:anywhere}
.main-title em{display:block;color:#ffa773;font-size:.82em;margin-top:13px;letter-spacing:-.06em}
.sub-copy{color:#c9d6de;font-size:16px;line-height:1.92;max-width:650px;margin-bottom:30px}
.point-bullets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 20px;margin:32px 0 38px}
.bullet-row{font-size:13px;font-weight:600;color:#e0eaf0;gap:10px;align-items:flex-start}
.bullet-icon{background:#f7a773;color:#152c39;flex:none;margin-top:2px;width:19px;height:19px}
.btn-main-cta,.btn-sub-kakao{padding:17px 21px;border-radius:100px;font-weight:800;font-size:14px;box-shadow:none;transition:transform .2s,background .2s}
.btn-main-cta{background:#ee854c}.btn-main-cta:hover{transform:translateY(-2px)}
.btn-sub-kakao{background:transparent;color:white;border:1px solid rgba(255,255,255,.4)}.btn-sub-kakao:hover{background:rgba(255,255,255,.08)}
.hero-photo-wrap{border-radius:8px 86px 8px 86px;border:8px solid rgba(255,255,255,.13);box-shadow:25px 35px 70px rgba(0,0,0,.25);transform:rotate(1.1deg);aspect-ratio:4/5;background:#0b2534}
.hero-photo-wrap img{width:100%;height:100%;object-fit:cover}
.compare-section{background:#f0f5f5;border:0}
.section-header{max-width:780px;margin-bottom:48px}
.section-header h2{font-size:clamp(26px,3vw,38px);line-height:1.25;letter-spacing:-.055em;color:#142b3b}
.section-header p{font-size:16px;color:#71818c;line-height:1.8}
.tag-label{background:#e7f0f3;color:#36647a;border:1px solid #d2e0e7;letter-spacing:.035em;font-size:12px;border-radius:100px;padding:7px 15px}
.compare-grid{gap:20px}.compare-box{padding:36px;border-radius:24px}.compare-bad{background:#fff; border:1px solid #dfebeb}.compare-good{background:#e2f3ed;border:1px solid #bedecf}
.compare-title{font-size:24px;color:#1b3544}.compare-list{gap:16px;font-size:15px}
.principles-grid{gap:14px}.prin-card{padding:30px 24px;border-radius:20px;background:#fff;box-shadow:0 9px 24px rgba(27,53,68,.035)}
.prin-num{font-size:27px;color:#dd7f51;letter-spacing:-.04em}.prin-card h4{font-size:17px}.prin-card p{line-height:1.75;font-size:13px}
.stat-banner{border-radius:28px;background:#173344;padding:44px 24px}.stat-num{color:#ffab79}
.portfolio-grid{gap:24px}.port-card{border-radius:22px;box-shadow:0 14px 38px rgba(25,46,62,.08);border:0}
.port-img-holder{aspect-ratio:1.55}.port-img-holder img{transition:transform .5s}.port-card:hover .port-img-holder img{transform:scale(1.035)}
.port-desc{padding:25px 28px 29px}.port-step-tag{color:#d36e3a;letter-spacing:.07em;font-size:11px}.port-desc h4{font-size:19px}.port-desc p{font-size:14px;line-height:1.75}
.before-after-showcase{margin:0;padding:48px 0 54px;border-top:1px solid #e4e9ed}
.ba-headline{text-align:center;margin:0 auto 34px;max-width:680px}.ba-kicker{color:#d27949;letter-spacing:.2em}.ba-kicker::before{background:#d27949}.ba-headline h3{font-size:clamp(27px,3vw,36px);letter-spacing:-.06em}.ba-headline p{font-size:14px}
.ba-grid{gap:16px}.ba-item{border:0;border-radius:22px;box-shadow:0 12px 35px rgba(13,38,57,.12)}.ba-stage{aspect-ratio:3/4}.ba-label{background:rgba(11,27,39,.78);border-radius:6px;letter-spacing:.08em}.ba-handle{width:44px;height:44px;color:#173344;box-shadow:0 7px 22px rgba(0,0,0,.23)}
.media-cta-container{gap:20px}.media-card{padding:34px;border-radius:22px}.card-blog{background:linear-gradient(135deg,#10283a,#254354)}.card-yt{background:linear-gradient(135deg,#2d2223,#593331)}
.btn-media-action{border-radius:12px}.faq-card{border-radius:16px;background:white;box-shadow:0 8px 22px rgba(12,39,55,.03)}
.bottom-cta-wrap{background:#122737}.site-bottom-footer{background:#0b1c28}
@media(max-width:1024px){.hero-container{gap:36px;grid-template-columns:1fr 0.88fr}.point-bullets{grid-template-columns:1fr}.hero-photo-wrap{border-radius:9px 54px 9px 54px}.ba-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:768px){.top-bar{height:68px}.bar-inner{padding:0 16px}.brand-logo{font-size:17px}.header-actions{gap:4px}.btn-yt-top,.btn-blog-top,.btn-kakao-top{font-size:11px;padding:8px}.hero-container{grid-template-columns:1fr;padding:62px 20px 66px;gap:38px}.main-title{font-size:clamp(30px,8vw,43px);margin-bottom:22px}.main-title em{margin-top:10px}.sub-copy{font-size:14px}.point-bullets{grid-template-columns:1fr;gap:13px}.cta-cluster{flex-direction:column}.btn-main-cta,.btn-sub-kakao{justify-content:center}.hero-photo-wrap{width:min(100%,460px);margin:auto;transform:none;aspect-ratio:4/3;border-radius:14px 60px 14px 60px}.wrap{padding:65px 18px}.compare-box{padding:25px}.section-header h2{font-size:28px}.principles-grid{grid-template-columns:1fr 1fr}.portfolio-grid{grid-template-columns:1fr}.media-cta-container{grid-template-columns:1fr}.ba-grid{grid-template-columns:1fr;gap:14px}.ba-stage{aspect-ratio:4/3}.before-after-showcase{padding:40px 0}.stat-banner{grid-template-columns:1fr}.mobile-float-bar{display:block}}
@media(max-width:420px){.principles-grid{grid-template-columns:1fr}.brand-logo{font-size:15px}.logo-badge{display:none}.header-actions a{font-size:10px;padding:7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}