:root{--red:#e60012;--ink:#121826;--muted:#5f6570;--line:#e7e9ed;--soft:#f7f8fa;--navy:#0d1b2f;--max:1024px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.75}a{text-decoration:none;color:inherit}img{display:block;width:100%}.container{width:min(var(--max),calc(100% - 96px));margin:auto}
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid rgba(0,0,0,.04)}.header-inner{height:78px;display:flex;align-items:center}.logo{font-size:24px;font-weight:800}.logo span{color:var(--red)}.nav{margin-left:auto;display:flex;gap:30px;align-items:center;font-size:13px}.nav .active{color:var(--red)}.contact-btn{background:var(--red);color:#fff;padding:12px 21px;border-radius:5px;font-weight:700}
.breadcrumb{font-size:11px;color:#7b8190;padding:14px 0}.hero{padding:56px 0 52px;background-image:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.94) 38%,rgba(255,255,255,.38) 62%,rgba(255,255,255,.06) 100%),url("/assets/images/service/hero-background.webp");background-position:center;background-size:cover;background-repeat:no-repeat}.eyebrow{color:var(--red);font-size:12px;font-weight:800}.hero h1{font-size:44px;line-height:1.2;margin:7px 0 14px}.hero p{max-width:650px;color:#444;font-size:13px}
.services{padding:48px 0 64px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.service-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 10px 30px rgba(16,24,40,.05)}.service-card img{height:130px;object-fit:cover}.service-body{display:flex;flex:1;flex-direction:column;padding:18px}.service-body h2{font-size:18px;line-height:1.45;margin:0 0 8px}.service-body p{color:#4d5561;font-size:12px;margin:0 0 16px}.service-link{margin-top:auto;color:var(--red);font-weight:800;font-size:12px}
.footer{background:var(--navy);color:#fff;padding:36px 0 44px}.footer-grid{display:grid;grid-template-columns:1.15fr .8fr 1fr;gap:44px}.footer p,.footer a{font-size:11px;color:#d8deea}.footer-links{display:grid;gap:4px}.footer h4{margin:0 0 10px}
@media(max-width:980px){.container{width:min(var(--max),calc(100% - 48px))}.nav{display:none}.service-grid,.footer-grid{grid-template-columns:1fr}.service-card{display:grid;grid-template-columns:220px 1fr}.service-card img{height:100%}}
@media(max-width:640px){.container{width:calc(100% - 28px)}.hero{padding:48px 0;background-image:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.84)),url("/assets/images/service/hero-background.webp");background-position:68% center}.hero h1{font-size:38px}.services{padding:42px 0 54px}.service-card{display:flex}.service-card img{height:190px}.service-body{padding:22px}.service-body h2{font-size:20px}.service-body p{font-size:13px}.footer{padding:40px 0 50px}.footer-grid{gap:36px}.footer p,.footer a{font-size:12px}}

.services{position:relative;overflow:hidden;padding:78px 0 96px}
.services:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(230,0,18,.055),transparent 34rem),linear-gradient(180deg,#fff 0%,#f7f8fa 100%);pointer-events:none}
.services .container{position:relative}
.services .service-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;counter-reset:service-card}
.services .service-card{counter-increment:service-card;position:relative;display:flex;min-width:0;border:1px solid rgba(18,24,38,.08);border-radius:18px;background:#fff;box-shadow:0 18px 44px rgba(16,24,40,.09)}
.services .service-card:before{content:"SERVICE  0" counter(service-card);position:absolute;z-index:2;top:20px;left:20px;padding:7px 11px;border:1px solid rgba(255,255,255,.65);border-radius:999px;background:rgba(13,27,47,.78);color:#fff;font-size:10px;font-weight:800;letter-spacing:.13em;line-height:1;box-shadow:0 8px 22px rgba(13,27,47,.18);backdrop-filter:blur(8px)}
.services .service-card>img{height:240px;object-fit:cover;transition:transform .5s ease}
.services .service-body{position:relative;flex:1;padding:28px 26px 30px;border-top:3px solid var(--red)}
.services .service-body:after{content:"0" counter(service-card);position:absolute;top:13px;right:20px;color:rgba(230,0,18,.075);font-size:68px;font-weight:800;line-height:1;letter-spacing:-.05em;pointer-events:none}
.services .service-body h2{position:relative;z-index:1;margin:0 0 12px;padding-right:48px;font-size:22px;letter-spacing:.01em}
.services .service-body p{position:relative;z-index:1;margin:0 0 24px;color:#5b6471;font-size:13px;line-height:1.9}
.services .service-link{position:relative;z-index:1;display:inline-flex;align-items:center;width:max-content;padding-bottom:4px;border-bottom:1px solid rgba(230,0,18,.35);font-size:12px;letter-spacing:.04em;transition:gap .25s ease,color .25s ease}

@media(hover:hover){.services .service-card:hover>img{transform:scale(1.04)}.services .service-card:hover .service-link{color:#b9000e}}

@media(max-width:980px){.services{padding:64px 0 76px}.services .service-grid{grid-template-columns:1fr;gap:20px}.services .service-card{display:grid;grid-template-columns:minmax(240px,40%) minmax(0,1fr)}.services .service-card>img{height:100%;min-height:240px}.services .service-body{border-top:0;border-left:3px solid var(--red)}}
@media(max-width:640px){.services{padding:48px 0 60px}.services:before{background:linear-gradient(180deg,#fff,#f7f8fa)}.services .service-card{display:flex;border-radius:14px}.services .service-card>img{height:205px;min-height:0}.services .service-body{padding:25px 22px 27px;border-top:3px solid var(--red);border-left:0}.services .service-body h2{font-size:20px}.services .service-body p{font-size:13px}.services .service-body:after{font-size:58px}}