
:root{--navy:#0B2242;--blue:#3568B8;--cyan:#24A8E0;--light:#A4C8E1;--pale:#EAF4FA;--ink:#122038;--text:#41506A;--border:#DCE5EE;--surface:#F7FAFC;--shadow:0 18px 50px rgba(17,42,78,.09);--radius:22px;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);line-height:1.65;background:#fff}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.container{width:min(calc(100% - 40px),var(--max));margin:auto}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-bottom:1px solid rgba(11,34,66,.08)}.header-inner{height:86px;display:flex;align-items:center;justify-content:space-between;gap:25px}.logo img{width:190px}.nav{display:flex;align-items:center;gap:24px}.nav a{font-size:.93rem;font-weight:700;color:#263750}.nav a.active{color:var(--blue)}.menu-btn{display:none;border:1px solid var(--border);background:#fff;border-radius:12px;padding:9px 12px;font-weight:700}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 20px;border-radius:12px;border:1px solid transparent;font-weight:800;transition:.2s}.btn-primary{background:var(--blue);color:#fff}.btn-outline{border-color:var(--blue);color:var(--blue);background:#fff}.btn-light{background:#fff;color:var(--navy)}.btn:hover{transform:translateY(-2px)}
.hero{padding:90px 0 70px;background:radial-gradient(circle at 88% 20%,rgba(164,200,225,.7),transparent 30%),linear-gradient(135deg,#fff,#f4f9fc);overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:65px;align-items:center}.eyebrow{font-size:.77rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:var(--blue);margin-bottom:12px}.hero h1,.page-hero h1{font-size:clamp(3.2rem,6vw,5.7rem);line-height:.95;letter-spacing:-.06em;margin:0 0 22px}.hero h1 span,.page-hero h1 span{color:var(--blue)}.hero p,.page-hero p{font-size:1.06rem;color:var(--text);max-width:690px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-visual{min-height:455px;border-radius:34px;position:relative;overflow:hidden;background:linear-gradient(145deg,var(--navy),#173b6c 60%,var(--blue));box-shadow:var(--shadow)}.screen{position:absolute;background:#fff;border:8px solid #111a28;border-radius:18px;box-shadow:0 20px 45px rgba(0,0,0,.28);overflow:hidden}.desktop{width:76%;height:62%;right:7%;top:13%;transform:rotate(2deg)}.phone{width:21%;height:45%;left:8%;bottom:8%;border-width:6px;border-radius:24px;transform:rotate(-5deg)}.screen-top{height:18%;background:#f6f8fb;border-bottom:1px solid #e7edf3}.screen-body{padding:9%;height:82%;background:linear-gradient(140deg,#fff,#eef6fb)}.mock-title{height:12px;width:66%;background:var(--navy);border-radius:999px;margin-bottom:9px}.mock-title.blue{width:44%;background:var(--blue)}.mock-line{height:7px;width:84%;background:#cbd9e6;margin:7px 0;border-radius:999px}.mock-button{height:18px;width:30%;background:var(--blue);border-radius:5px;margin-top:13px}
.trust{padding:25px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.trust-inner{display:flex;justify-content:center;gap:40px;flex-wrap:wrap;color:#8290a3;font-size:.8rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.section{padding:86px 0}.section.alt{background:var(--surface)}.section-head{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:36px}.section-head h2,.service-group-title h2{font-size:clamp(2.2rem,4vw,3.7rem);line-height:1.02;letter-spacing:-.05em;margin:0}.section-head p,.service-group-title p{max-width:570px;color:var(--text);margin:0}
.path-choice{display:grid;grid-template-columns:1fr 1fr;gap:22px}.path-card{min-height:420px;border-radius:30px;padding:34px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow);border:1px solid var(--border)}.path-card.digital{background:linear-gradient(145deg,var(--navy),#173b6c 62%,var(--blue));color:#fff}.path-card.creative{background:radial-gradient(circle at 82% 18%,rgba(255,255,255,.55),transparent 22%),linear-gradient(145deg,var(--pale),var(--light))}.path-kicker{font-size:.77rem;text-transform:uppercase;letter-spacing:.13em;font-weight:900;opacity:.82}.path-card h3{font-size:clamp(2.1rem,4vw,3.5rem);line-height:.98;letter-spacing:-.05em;margin:14px 0}.path-card p{max-width:520px;margin:0 0 18px}.path-card.digital p{color:#d9e5f2}.path-card.creative p{color:var(--text)}.mini-tags{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.mini-tags span{font-size:.75rem;font-weight:800;border-radius:999px;padding:7px 10px}.digital .mini-tags span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18)}.creative .mini-tags span{background:rgba(255,255,255,.7);border:1px solid rgba(53,104,184,.15)}
.dual-intro{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.copy h2{font-size:clamp(2.3rem,4.3vw,4rem);line-height:1;letter-spacing:-.05em;margin:0 0 20px}.copy p{color:var(--text)}.dual-balance{display:grid;grid-template-columns:1fr 1fr;gap:14px}.balance-box{min-height:200px;padding:24px;border:1px solid var(--border);border-radius:22px;background:#fff}.balance-box.digital{border-top:4px solid var(--blue)}.balance-box.creative{border-top:4px solid var(--cyan)}.balance-box h4{font-size:1.25rem;margin:20px 0 8px}.balance-box p{margin:0;color:var(--text)}.card-mark{width:48px;height:48px;border-radius:14px;background:var(--pale);display:grid;place-items:center;color:var(--blue);font-weight:900}.branch-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}.branch-link{padding:18px;border:1px solid var(--border);background:#fff;border-radius:16px}.branch-link strong{display:block}.branch-link span{display:block;color:var(--text);font-size:.87rem;margin-top:4px}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{background:#fff;border:1px solid var(--border);border-radius:22px;padding:24px;box-shadow:0 8px 24px rgba(17,42,78,.035)}.card.primary{border-top:4px solid var(--blue)}.card h3{margin:24px 0 8px}.card p{margin:0;color:var(--text);font-size:.93rem}.badge{display:inline-flex;margin-top:16px;background:var(--pale);color:var(--blue);border-radius:999px;padding:6px 10px;font-size:.72rem;font-weight:900}
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.work-card{border:1px solid var(--border);border-radius:22px;overflow:hidden;background:#fff}.work-art{height:235px;padding:26px;display:flex;align-items:flex-end}.art-1{background:linear-gradient(145deg,#12315d,#3568B8)}.art-2{background:linear-gradient(145deg,#EAF4FA,#A4C8E1)}.art-3{background:linear-gradient(145deg,#16283f,#24A8E0)}.art-4{background:linear-gradient(145deg,#f0f5fa,#c9dced)}.art-5{background:linear-gradient(145deg,#18294a,#5178b8)}.art-6{background:linear-gradient(145deg,#a4c8e1,#eef7fb)}.mini-logo{background:#fff;padding:13px;border-radius:10px;box-shadow:0 18px 38px rgba(0,0,0,.14);font-weight:800}.work-card-body{padding:20px}.work-card-body small{color:var(--blue);font-weight:900;text-transform:uppercase;letter-spacing:.08em}.work-card-body h3{margin:7px 0 5px}.work-card-body p{margin:0;color:var(--text);font-size:.92rem}
.page-hero{padding:78px 0;background:linear-gradient(135deg,#f5faff,#dfeef7)}.page-hero h1{font-size:clamp(3rem,5vw,4.8rem)}.subnav{padding:14px 0;background:var(--surface);border-bottom:1px solid var(--border)}.subnav-inner{display:flex;gap:9px;flex-wrap:wrap}.subnav a{padding:8px 12px;border:1px solid var(--border);background:#fff;border-radius:999px;font-size:.83rem;font-weight:800}.service-group-title{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:30px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center}.panel{min-height:450px;border-radius:30px;background:linear-gradient(145deg,var(--pale),var(--light));padding:34px}.panel.dark{background:linear-gradient(145deg,var(--navy),#173c6f);color:#fff}.panel-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;height:100%}.panel-block{min-height:165px;border-radius:18px;background:rgba(255,255,255,.8);padding:20px;display:flex;align-items:end;font-weight:800}.checks{display:grid;gap:12px;margin:24px 0}.check{display:flex;gap:12px;color:var(--text)}.check b{color:var(--blue)}
.cta{padding:40px;border-radius:28px;background:linear-gradient(120deg,var(--pale),var(--light));display:flex;justify-content:space-between;gap:30px;align-items:center}.cta h2{font-size:clamp(2rem,4vw,3.3rem);line-height:1.02;letter-spacing:-.04em;margin:0 0 8px}.cta p{margin:0;color:var(--text)}
.ai-note{border:1px solid var(--border);border-radius:18px;padding:20px;background:#fff;display:flex;gap:14px}.ai-dot{width:12px;height:12px;border-radius:50%;background:var(--light);margin-top:7px}
.process-list{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.process-step{border:1px solid var(--border);border-radius:20px;padding:23px;background:#fff}.process-step .n{font-size:2.5rem;font-weight:900;color:var(--light)}.process-step h3{margin:28px 0 7px}.process-step p{margin:0;color:var(--text);font-size:.9rem}
.contact-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:55px}.contact-card{background:var(--navy);color:#fff;border-radius:28px;padding:34px}.contact-card p,.contact-card a{color:#d9e5f2}.contact-lines{display:grid;gap:18px;margin-top:28px}.contact-line small{display:block;color:var(--light);font-weight:900;text-transform:uppercase;letter-spacing:.08em}.form{border:1px solid var(--border);border-radius:28px;padding:28px;box-shadow:var(--shadow)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}label{font-size:.86rem;font-weight:800}input,select,textarea{width:100%;padding:13px 14px;border:1px solid var(--border);border-radius:12px;background:#fff}textarea{min-height:145px;resize:vertical}.notice{font-size:.8rem;color:#738097}
.filter-bar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:28px}.filter-btn{padding:9px 14px;border-radius:999px;border:1px solid var(--border);background:#fff;font-weight:800;cursor:pointer}.filter-btn.active,.filter-btn:hover{background:var(--blue);color:#fff;border-color:var(--blue)}.hidden{display:none!important}
.site-footer{margin-top:75px;background:var(--navy);color:#fff;padding:54px 0 22px}.footer-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr 1fr;gap:32px}.footer-logo{width:190px;background:#fff;padding:10px 14px;border-radius:12px}.site-footer p,.site-footer a{color:#c7d5e5}.footer-links{display:grid;gap:8px}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:34px;padding-top:18px;display:flex;justify-content:space-between;color:#96abc0;font-size:.83rem}
@media(max-width:1000px){.nav{display:none;position:absolute;left:20px;right:20px;top:78px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:20px;box-shadow:var(--shadow);flex-direction:column;align-items:flex-start}.nav.open{display:flex}.menu-btn{display:block}.hero-grid,.path-choice,.dual-intro,.split,.contact-grid{grid-template-columns:1fr}.services-grid{grid-template-columns:repeat(2,1fr)}.work-grid{grid-template-columns:repeat(2,1fr)}.process-list{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.container{width:min(calc(100% - 28px),var(--max))}.logo img{width:155px}.hero,.section{padding:62px 0}.hero-visual{min-height:360px}.services-grid,.work-grid,.process-list,.dual-balance,.branch-nav,.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.section-head,.service-group-title,.cta{flex-direction:column;align-items:flex-start}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column}}
