@charset "UTF-8";
:root{--lake-950:#0b2029;--lake-900:#102c36;--lake-800:#163d49;--lake-700:#20515f;--lake-600:#2d6a77;--lake-400:#6e9da5;--lake-300:#9ebfc4;--lake-200:#c8dbde;--lake-100:#eaf2f2;--paper:#f8faf9;--white:#fff;--ink:#172126;--muted:#67777d;--line:rgba(16,44,54,.14);--max:1240px;--ease:cubic-bezier(.2,.75,.25,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Apple SD Gothic Neo","Noto Sans KR",sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,input{font:inherit}.wrap{width:min(calc(100% - 48px),var(--max));margin-inline:auto}.skip{position:fixed;left:10px;top:-60px;z-index:999;background:#fff;padding:10px 14px}.skip:focus{top:10px}.eyebrow{font-size:11px;letter-spacing:.22em;font-weight:750;color:var(--lake-600);margin:0 0 22px}.site-header{position:fixed;inset:0 0 auto;z-index:40;transition:.25s var(--ease);border-bottom:1px solid transparent}.site-header.scrolled{background:rgba(248,250,249,.88);backdrop-filter:blur(18px);border-color:var(--line)}.nav-shell{height:82px;width:min(calc(100% - 48px),var(--max));margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center}.brand span:last-child{display:flex;flex-direction:column;line-height:1}.brand strong{font-size:16px;letter-spacing:.12em}.brand small{font-size:8px;letter-spacing:.24em;color:var(--muted);margin-top:7px}.brand-mark{width:30px;height:30px;border:1px solid var(--lake-700);border-radius:50%;position:relative;overflow:hidden}.brand-mark i{position:absolute;left:4px;right:4px;height:1px;background:var(--lake-600);top:13px}.brand-mark i:last-child{top:18px;opacity:.45}.desktop-nav{display:flex;gap:34px;margin-left:auto;margin-right:38px}.desktop-nav a{font-size:13px;color:#34444a;position:relative}.desktop-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:1px;background:var(--lake-600);transition:.22s}.desktop-nav a:hover:after{right:0}.nav-actions{display:flex;align-items:center;gap:22px}.locale{font-size:11px;letter-spacing:.16em;font-weight:800}.menu-button{display:none;border:0;background:none;width:34px;height:34px;padding:7px}.menu-button span{display:block;height:1px;background:var(--ink);margin:6px 0}.mobile-nav{display:none}
.hero{min-height:100svh;position:relative;overflow:hidden;background:linear-gradient(135deg,#f9fbfa 15%,#eef5f4 72%,#e6f0f0)}.hero:after{content:"";position:absolute;left:0;right:0;bottom:92px;height:1px;background:var(--line)}.hero-glow{position:absolute;width:70vw;height:70vw;border-radius:50%;right:-30vw;top:-30vw;background:radial-gradient(circle,rgba(69,130,142,.17),rgba(234,242,242,0) 67%)}.hero-grid{position:relative;min-height:calc(100svh - 93px);padding-top:150px;padding-bottom:80px;display:grid;grid-template-columns:1.3fr .7fr;align-items:center;gap:6vw}.hero-copy h1,.page-hero h1{font-size:clamp(42px,5.7vw,82px);line-height:1.08;letter-spacing:-.045em;font-weight:560;margin:0}.hero-copy h1 em{font-style:normal;color:var(--lake-600);font-weight:580}.hero-lead{font-size:clamp(16px,1.4vw,19px);max-width:680px;color:#526269;margin:36px 0 0}.hero-actions{display:flex;gap:12px;margin-top:42px}.button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:0 22px;border:1px solid var(--lake-800);font-size:12px;font-weight:700;letter-spacing:.04em;transition:.2s}.button.primary{background:var(--lake-900);color:#fff}.button.primary:hover{background:var(--lake-700);transform:translateY(-2px)}.button.ghost:hover{background:#fff}.button.light{border-color:#dbe8e9;background:#fff;color:var(--lake-900)}.button.disabled{opacity:.48;cursor:not-allowed}.hero-visual{display:grid;place-items:center;min-height:410px}.lake-orbit{width:min(30vw,360px);aspect-ratio:1;position:relative;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(32,81,95,.16)}.lake-orbit:before,.lake-orbit:after,.lake-orbit span{content:"";position:absolute;border-radius:50%;border:1px solid rgba(32,81,95,.12)}.lake-orbit:before{inset:10%}.lake-orbit:after{inset:22%}.lake-orbit span:nth-child(1){width:135%;height:36%;border-radius:50%;transform:rotate(-12deg)}.lake-orbit span:nth-child(2){width:112%;height:22%;border-radius:50%;transform:rotate(11deg)}.lake-orbit span:nth-child(3){width:80%;height:12%;border-radius:50%;transform:rotate(-6deg)}.lake-orbit b{font-size:28px;letter-spacing:.18em;color:var(--lake-700);font-weight:450}.depth-label{position:absolute;right:2%;bottom:18%;display:flex;align-items:center;gap:12px;color:var(--lake-700);font-size:9px;letter-spacing:.18em}.depth-label i{width:54px;height:1px;background:var(--lake-400)}.hero-strip{height:93px;display:flex;align-items:center;gap:34px;font-size:10px;letter-spacing:.2em;font-weight:700;color:#62747a;position:relative;z-index:1}.hero-strip i{width:32px;height:1px;background:var(--lake-300)}
.section{padding-top:140px;padding-bottom:140px}.section-head{max-width:790px;margin-bottom:70px}.section-head h2{font-size:clamp(34px,4vw,56px);line-height:1.14;letter-spacing:-.04em;margin:0;font-weight:550}.section-head>p:last-child{color:var(--muted);font-size:17px;max-width:620px;margin:24px 0 0}.section-head.row{max-width:none;display:flex;justify-content:space-between;align-items:end;gap:50px}.section-head.row>p{max-width:470px;margin:0;color:var(--muted)}.practice-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.practice-card{min-height:320px;padding:32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative;transition:.28s var(--ease)}.practice-card:hover{background:#fff;transform:translateY(-3px)}.practice-card>span{font-size:10px;color:var(--lake-600);letter-spacing:.15em}.practice-card h3{font-size:25px;margin:56px 0 14px;letter-spacing:-.03em}.practice-card p{color:var(--muted);font-size:14px;margin:0;max-width:310px}.practice-card>a{position:absolute;right:28px;bottom:25px;font-size:22px;color:var(--lake-600)}.people-section{background:#edf3f2}.people-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.person-card{display:block}.person-image{height:430px;background:#dfe8e7;overflow:hidden}.person-image img{width:100%;height:100%;object-fit:cover;object-position:center 25%;filter:saturate(.78) contrast(.96);transition:.5s var(--ease)}.person-card:hover .person-image img{transform:scale(1.025);filter:saturate(.9)}.person-meta{padding:24px 2px}.person-meta h3{font-size:26px;margin:0 0 4px;letter-spacing:-.03em}.person-meta>p{font-size:13px;color:var(--muted);margin:0 0 17px}.tags{display:flex;flex-wrap:wrap;gap:7px}.tags span{border:1px solid rgba(32,81,95,.18);border-radius:99px;padding:5px 10px;font-size:10px;color:var(--lake-700)}.tags.large span{font-size:11px;padding:7px 12px}.view-link{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:23px;padding-top:14px;font-size:12px}.view-link b{font-size:18px;font-weight:400}.insights-preview{padding-bottom:160px}.text-link{font-size:12px;border-bottom:1px solid var(--lake-600);padding-bottom:3px}.insight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.insight-grid.full{grid-template-columns:repeat(3,1fr)}.insight-card{padding:28px;min-height:320px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}.insight-card>div{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.13em;color:var(--lake-600)}.insight-card h3{font-size:23px;line-height:1.35;letter-spacing:-.025em;margin:55px 0 15px}.insight-card p{font-size:14px;color:var(--muted);margin:0}.coming{margin-top:auto;padding-top:30px;color:#8c999d;font-size:10px}.contact-band{background:var(--lake-950);color:#fff;padding:120px 0}.contact-band .eyebrow{color:var(--lake-300)}.contact-band h2{font-size:clamp(38px,5vw,68px);line-height:1.1;letter-spacing:-.04em;margin:0}.contact-band p:not(.eyebrow){color:#b8c7ca}.contact-band .button{margin-top:26px}
.page-hero{padding-top:190px;padding-bottom:100px}.page-hero h1{max-width:1000px}.page-hero>p:last-child{font-size:18px;color:var(--muted);max-width:700px;margin-top:32px}.narrative{display:grid;grid-template-columns:repeat(3,1fr);padding-top:40px;border-top:1px solid var(--line)}.metric{padding:30px 30px 30px 0}.metric strong{font-size:35px;font-weight:500;color:var(--lake-700);display:block}.metric span{font-size:12px;color:var(--muted)}.split-copy{display:grid;grid-template-columns:1fr 2fr;gap:80px;border-top:1px solid var(--line)}.split-copy h2{font-size:42px;line-height:1.2;letter-spacing:-.035em;margin:0 0 30px}.split-copy div p{font-size:17px;color:var(--muted);max-width:750px}.people-list{padding-bottom:20px}.profile-hero{padding-top:160px;display:grid;grid-template-columns:.75fr 1.25fr;gap:8vw;align-items:end;min-height:760px}.profile-photo{height:610px;background:#dfe8e7;overflow:hidden}.profile-photo img{width:100%;height:100%;object-fit:cover;object-position:center 20%;filter:saturate(.82)}.profile-intro{padding-bottom:65px}.profile-intro h1{font-size:clamp(50px,6vw,84px);letter-spacing:-.05em;line-height:1;margin:0 0 18px;font-weight:550}.profile-role{font-size:16px;color:var(--muted);margin-bottom:28px}.profile-email{display:inline-block;margin-top:36px;font-size:13px;border-bottom:1px solid var(--lake-500);padding-bottom:4px}.profile-details{display:grid;grid-template-columns:1fr 2fr;gap:80px;border-top:1px solid var(--line)}.profile-label h2{font-size:32px;line-height:1.2}.expand-all{border:0;border-bottom:1px solid var(--lake-600);background:none;padding:0 0 3px;font-size:11px;color:var(--lake-700);cursor:pointer}.profile-detail{border-top:1px solid var(--line)}.profile-detail:last-child{border-bottom:1px solid var(--line)}.profile-detail summary{list-style:none;cursor:pointer;padding:27px 3px;display:flex;align-items:center;justify-content:space-between;font-size:18px;font-weight:600}.profile-detail summary::-webkit-details-marker{display:none}.profile-detail summary i{width:18px;height:18px;position:relative}.profile-detail summary i:before,.profile-detail summary i:after{content:"";position:absolute;background:var(--lake-600);left:0;right:0;height:1px;top:8px;transition:.2s}.profile-detail summary i:after{transform:rotate(90deg)}.profile-detail[open] summary i:after{transform:rotate(0)}.detail-body{padding:0 50px 30px 2px}.detail-body ul{margin:0;padding:0;list-style:none}.detail-body li{padding:8px 0;color:#53636a;font-size:14px}.detail-body li:before{content:"—";color:var(--lake-400);margin-right:11px}.practice-list{padding-top:40px}.practice-row{display:grid;grid-template-columns:70px .9fr 1.1fr;gap:38px;padding:46px 0;border-top:1px solid var(--line);scroll-margin-top:100px}.practice-row:last-child{border-bottom:1px solid var(--line)}.practice-row>span{font-size:10px;color:var(--lake-600);letter-spacing:.15em}.practice-row h2{font-size:30px;letter-spacing:-.035em;margin:0}.practice-row p{color:var(--muted);margin:0;max-width:560px}.filter-row{display:flex;gap:8px;margin-bottom:35px}.filter-row button{border:1px solid var(--line);background:transparent;border-radius:99px;padding:8px 14px;font-size:9px;letter-spacing:.1em}.filter-row button.active{background:var(--lake-900);color:#fff}.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:10vw;padding-top:40px}.contact-info h2,.verify-card h2{font-size:30px}.contact-info>p{color:var(--muted)}.contact-note{margin-top:50px;padding:22px;border-left:2px solid var(--lake-300);font-size:13px;color:var(--muted)}.verify-card{background:#fff;border:1px solid var(--line);padding:36px}.verify-card .step{font-size:10px;color:var(--lake-600);letter-spacing:.2em}.verify-card label{display:block;font-size:12px;margin:32px 0 16px}.verify-card input{display:block;width:100%;border:0;border-bottom:1px solid var(--line);background:#f5f7f6;padding:15px;margin-top:8px}.verify-card>p{font-size:12px;color:var(--muted);margin-top:20px}.site-footer{background:#091c24;color:#d6e0e2;padding:70px max(24px,calc((100vw - var(--max))/2)) 25px}.footer-main{display:flex;justify-content:space-between;gap:60px}.footer-brand{font-size:18px;letter-spacing:.16em;font-weight:700}.footer-main p{color:#91a5aa;font-size:12px}.footer-meta{text-align:right}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:55px;padding-top:20px;display:flex;justify-content:space-between;font-size:9px;color:#71888e;letter-spacing:.08em}
.reveal{opacity:0;transform:translateY(16px);transition:.65s var(--ease)}.reveal.visible{opacity:1;transform:none}
@media(max-width:1100px){.desktop-nav{display:none}.menu-button{display:block}.mobile-nav{position:fixed;top:82px;left:0;right:0;background:rgba(248,250,249,.97);padding:20px 24px 35px;border-bottom:1px solid var(--line);display:grid;gap:18px;transform:translateY(-130%);opacity:0;transition:.25s;pointer-events:none}.mobile-nav.open{transform:none;opacity:1;pointer-events:auto}.hero-grid{grid-template-columns:1fr;padding-top:150px}.hero-visual{display:none}.practice-grid{grid-template-columns:repeat(2,1fr)}.people-grid{grid-template-columns:repeat(2,1fr);gap:18px}.person-image{height:470px}.insight-grid,.insight-grid.full{grid-template-columns:repeat(2,1fr)}.profile-hero{grid-template-columns:.9fr 1.1fr}.profile-photo{height:520px}.profile-details{grid-template-columns:1fr 2fr;gap:45px}}
@media(max-width:720px){.wrap{width:min(calc(100% - 34px),var(--max))}.nav-shell{width:calc(100% - 34px);height:72px}.site-header.scrolled .nav-shell{height:66px}.brand strong{font-size:13px}.brand small{display:none}.brand-mark{width:27px;height:27px}.mobile-nav{top:72px}.hero{min-height:auto}.hero-grid{min-height:760px;padding-top:135px;padding-bottom:80px;display:flex;align-items:flex-end}.hero-copy h1,.page-hero h1{font-size:clamp(40px,12.4vw,60px)}.hero-lead{font-size:15px;line-height:1.75}.hero-actions{flex-direction:column;align-items:stretch}.button{width:100%}.hero-strip{gap:12px;overflow:hidden;white-space:nowrap;height:72px}.hero-strip i{width:14px}.section{padding-top:92px;padding-bottom:92px}.section-head{margin-bottom:45px}.section-head h2{font-size:38px}.section-head.row{display:block}.section-head.row>p{margin-top:20px}.practice-grid{grid-template-columns:1fr}.practice-card{min-height:260px}.practice-card h3{margin-top:42px}.people-grid{grid-template-columns:1fr}.person-image{height:500px}.person-meta{padding-bottom:36px}.insight-grid,.insight-grid.full{grid-template-columns:1fr}.insight-card{min-height:285px}.contact-band{padding:90px 0}.page-hero{padding-top:145px;padding-bottom:65px}.narrative{grid-template-columns:1fr}.metric{border-bottom:1px solid var(--line)}.split-copy{grid-template-columns:1fr;gap:20px}.split-copy h2{font-size:34px}.profile-hero{grid-template-columns:1fr;gap:35px;padding-top:120px;min-height:auto}.profile-photo{height:470px}.profile-intro{padding-bottom:0}.profile-intro h1{font-size:56px}.profile-details{grid-template-columns:1fr;gap:20px}.profile-label{margin-bottom:18px}.practice-row{grid-template-columns:42px 1fr;gap:18px}.practice-row p{grid-column:2}.contact-layout{grid-template-columns:1fr;gap:50px}.verify-card{padding:25px}.footer-main{display:block}.footer-meta{text-align:left;margin-top:35px}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}}

.footer-brand small{font-size:12px;letter-spacing:.2em;color:#80999f;margin-left:8px;font-weight:500}.service-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);padding-top:0}.pillar{padding:48px 34px 20px 0;border-right:1px solid var(--line);min-height:270px}.pillar+ .pillar{padding-left:34px}.pillar:last-child{border-right:0}.pillar>span,.practice-context article>span{font-size:9px;letter-spacing:.16em;color:var(--lake-600)}.pillar h3{font-size:25px;line-height:1.25;margin:38px 0 16px;letter-spacing:-.025em}.pillar p{font-size:14px;color:var(--muted);margin:0}.practice-context{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:20px}.practice-context article{padding:42px 34px 42px 0;border-right:1px solid var(--line)}.practice-context article+article{padding-left:34px}.practice-context article:last-child{border-right:0}.practice-context h2{font-size:25px;margin:26px 0 14px;letter-spacing:-.03em}.practice-context p{font-size:14px;color:var(--muted);margin:0}.read-more{margin-top:auto;padding-top:30px;color:var(--lake-700);font-size:11px;font-weight:650}.insight-card{transition:.25s var(--ease)}a.insight-card:hover{transform:translateY(-4px);border-color:rgba(45,106,119,.35);box-shadow:0 16px 50px rgba(11,32,41,.06)}.filter-row button:disabled{opacity:.42;cursor:not-allowed}.guide-hero{padding-top:190px;padding-bottom:90px;max-width:1100px}.guide-hero h1{font-size:clamp(42px,5.2vw,72px);line-height:1.1;letter-spacing:-.045em;margin:0;max-width:1000px;font-weight:560}.guide-summary{font-size:19px;line-height:1.75;color:var(--muted);max-width:780px;margin:34px 0}.guide-meta{display:flex;gap:18px;align-items:center;font-size:10px;letter-spacing:.12em;color:var(--lake-600)}.guide-meta span:before{content:"";display:inline-block;width:26px;height:1px;background:var(--lake-300);vertical-align:middle;margin-right:16px}.guide-body{display:grid;grid-template-columns:220px minmax(0,760px);gap:80px;border-top:1px solid var(--line);padding-top:70px;padding-bottom:150px}.guide-body aside{display:flex;flex-direction:column;gap:24px;align-items:flex-start;font-size:10px;letter-spacing:.13em;color:var(--lake-600);position:sticky;top:120px;align-self:start}.guide-body aside a{border-bottom:1px solid var(--lake-300);padding-bottom:3px}.guide-intro{font-size:22px!important;line-height:1.75!important;color:#33464e!important;margin:0 0 65px!important;letter-spacing:-.015em}.guide-content section{padding:42px 0;border-top:1px solid var(--line)}.guide-content section h2{font-size:28px;line-height:1.35;margin:0 0 18px;letter-spacing:-.03em}.guide-content section p{font-size:16px;line-height:1.9;color:var(--muted);margin:0}.guide-note{margin-top:55px;background:#edf3f2;padding:25px 28px;color:#617279;font-size:12px;line-height:1.75}.guide-cta{margin-top:28px;width:auto}.people-section .section-head.row>p{max-width:520px}
@media(max-width:1100px){.service-pillars,.practice-context{grid-template-columns:1fr}.pillar,.pillar+.pillar,.practice-context article,.practice-context article+article{padding:34px 0;border-right:0;border-bottom:1px solid var(--line);min-height:0}.guide-body{grid-template-columns:160px minmax(0,1fr);gap:45px}}
@media(max-width:720px){.people-grid{grid-template-columns:1fr}.person-image{height:500px}.service-pillars,.practice-context{display:block}.guide-hero{padding-top:145px;padding-bottom:60px}.guide-hero h1{font-size:42px}.guide-summary{font-size:16px}.guide-body{display:block;padding-top:42px;padding-bottom:100px}.guide-body aside{position:static;flex-direction:row;justify-content:space-between;margin-bottom:46px}.guide-intro{font-size:19px!important}.guide-content section h2{font-size:24px}.guide-content section p{font-size:15px}.guide-cta{width:100%}}

/* v003: richer practice, firm heritage and insight navigation */
.heritage-section{border-top:1px solid var(--line)}
.heritage-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.heritage-card{min-height:270px;padding:34px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.28)}
.heritage-card>span{font-size:9px;letter-spacing:.18em;color:var(--lake-600)}
.heritage-card h3{font-size:25px;letter-spacing:-.03em;margin:52px 0 16px}
.heritage-card p{font-size:14px;color:var(--muted);margin:0}
.practice-copy>p{margin:0;color:var(--muted);max-width:620px}
.practice-copy ul{list-style:none;margin:24px 0 0;padding:0;border-top:1px solid var(--line)}
.practice-copy li{padding:10px 0 10px 18px;border-bottom:1px solid var(--line);position:relative;font-size:13px;color:#526269}
.practice-copy li:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--lake-400);position:absolute;left:0;top:19px}
.insight-toolbar{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:38px}
.insight-toolbar .filter-row{margin-bottom:0}
.insight-search{width:min(360px,100%);display:block;font-size:9px;letter-spacing:.12em;color:var(--lake-600)}
.insight-search input{width:100%;margin-top:8px;border:0;border-bottom:1px solid var(--line);background:transparent;padding:10px 0 11px;color:var(--ink);outline:none}
.insight-search input:focus{border-color:var(--lake-600)}
.insight-card[hidden]{display:none!important}
.search-empty{border-top:1px solid var(--line);padding:26px 0;color:var(--muted);font-size:14px}
.related-guides{margin-top:90px;padding-top:52px;border-top:1px solid var(--line)}
.related-guides>h2{font-size:32px;letter-spacing:-.035em;margin:0 0 28px}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.related-grid a{padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:190px;display:flex;flex-direction:column;transition:.2s}
.related-grid a:hover{background:#fff}
.related-grid span{font-size:8px;letter-spacing:.13em;color:var(--lake-600)}
.related-grid strong{font-size:18px;line-height:1.45;margin:32px 0 18px;font-weight:600;letter-spacing:-.02em}
.related-grid b{margin-top:auto;color:var(--lake-600);font-weight:400}
@media(max-width:1100px){.heritage-grid{grid-template-columns:1fr}.heritage-card{min-height:0}.related-grid{grid-template-columns:1fr}.related-grid a{min-height:140px}}
@media(max-width:720px){.insight-toolbar{display:block}.insight-search{margin-top:26px}.heritage-card h3{margin-top:30px}.related-guides{margin-top:65px}.practice-copy{grid-column:2}.practice-copy ul{margin-top:18px}}

/* v004: CMS-authored guide body */
.cms-body>p:first-child{font-size:22px;line-height:1.75;color:#33464e;margin:0 0 65px;letter-spacing:-.015em}.cms-body>h2{font-size:28px;line-height:1.35;margin:0;padding:42px 0 18px;border-top:1px solid var(--line);letter-spacing:-.03em}.cms-body>p{font-size:16px;line-height:1.9;color:var(--muted);margin:0 0 42px}.cms-body>ul{margin:0 0 42px;padding:0 0 0 20px;color:var(--muted);font-size:15px;line-height:1.9}.cms-body>h2+ul{margin-top:0}@media(max-width:720px){.cms-body>p:first-child{font-size:19px}.cms-body>h2{font-size:24px}.cms-body>p{font-size:15px}}

/* v006 verified-email consultation */
.contact-live{align-items:start}.contact-form-shell{background:#fff;border:1px solid var(--line);padding:38px;min-width:0}.contact-progress{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:38px}.contact-progress i{height:3px;background:#dfe8e7;transition:.25s}.contact-progress i.active{background:var(--lake-600)}.contact-step[hidden]{display:none!important}.contact-step .step{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border:1px solid var(--lake-300);border-radius:50%;font-size:10px;color:var(--lake-700);margin-bottom:20px}.contact-step h2{font-size:30px;letter-spacing:-.035em;margin:0 0 10px}.contact-step>p{font-size:13px;color:var(--muted);margin:0 0 28px;line-height:1.7}.contact-step form>label,.contact-fields label{display:block;font-size:11px;font-weight:700;letter-spacing:.02em;margin-bottom:20px}.contact-step input,.contact-step textarea,.contact-step select{display:block;width:100%;margin-top:8px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:13px 14px;outline:none;border-radius:0;font:inherit}.contact-step input:focus,.contact-step textarea:focus,.contact-step select:focus{border-color:var(--lake-500);box-shadow:0 0 0 3px rgba(36,95,107,.08)}.contact-step textarea{resize:vertical;line-height:1.65}.contact-step label small{font-weight:400;color:var(--muted);margin-left:5px}.contact-fields.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.contact-step .button{width:auto;margin-top:4px}.contact-message{min-height:20px;margin-top:14px;font-size:12px;line-height:1.6}.contact-message.error{color:#9d3434}.contact-message.ok{color:#28664b}.contact-inline-actions{display:flex;align-items:center;gap:18px}.contact-link-button{border:0;background:none;color:var(--lake-700);font-size:11px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.verification-code{font-size:24px!important;letter-spacing:.3em;font-variant-numeric:tabular-nums}.contact-honeypot{position:absolute!important;left:-99999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.contact-consent{display:flex!important;align-items:flex-start;gap:10px;font-weight:400!important;color:var(--muted);line-height:1.55}.contact-consent input{width:16px!important;height:16px;margin:2px 0 0!important;flex:0 0 auto}.contact-system-note{padding:13px 15px;margin-bottom:25px;background:#fff6df;border:1px solid #ead8a6;font-size:12px;line-height:1.6;color:#715d2b}.contact-security{margin-top:38px;border-top:1px solid var(--line);display:grid;grid-template-columns:35px 1fr;gap:0}.contact-security span,.contact-security p{padding-top:14px;padding-bottom:14px;border-bottom:1px solid var(--line);margin:0}.contact-security span{font-size:9px;color:var(--lake-600);letter-spacing:.1em}.contact-security p{font-size:12px;color:var(--muted)}.contact-success{padding:20px 0 10px}.contact-success .button{margin-top:12px}.cf-turnstile{margin:4px 0 20px;min-height:65px}.contact-step button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:760px){.contact-form-shell{padding:25px 20px}.contact-fields.two{grid-template-columns:1fr;gap:0}.contact-inline-actions{align-items:stretch;flex-direction:column}.contact-inline-actions .button{width:100%}.contact-step .button{width:100%}}

/* v011: launch-content polish */
.method-section{background:linear-gradient(180deg,#f7faf9 0%,#eef4f3 100%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.method-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(64,100,105,.18);border-left:1px solid rgba(64,100,105,.18)}
.method-card{min-height:330px;padding:34px 30px;border-right:1px solid rgba(64,100,105,.18);border-bottom:1px solid rgba(64,100,105,.18);display:flex;flex-direction:column;background:rgba(255,255,255,.23)}
.method-card>span{font:500 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--lake-500)}
.method-card>small{margin-top:54px;font-size:9px;letter-spacing:.18em;color:var(--lake-600)}
.method-card h3{margin:14px 0 15px;font-size:22px;line-height:1.35;letter-spacing:-.025em}
.method-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.8}
.method-card:after{content:"";width:34px;height:1px;background:var(--lake-300);margin-top:auto}
.principles-section{border-top:1px solid var(--line)}
.principles-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.principle{padding:32px 28px;min-height:260px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}
.principle b{font:500 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--lake-500)}
.principle h3{font-size:22px;letter-spacing:-.025em;margin:54px 0 14px}
.principle p{font-size:13px;line-height:1.8;color:var(--muted);margin:0}
.engagement-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.engagement-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.engagement-card{padding:38px 36px 42px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:245px}
.engagement-card>span{font-size:9px;letter-spacing:.16em;color:var(--lake-600)}
.engagement-card h3{font-size:25px;line-height:1.35;letter-spacing:-.03em;margin:38px 0 14px}
.engagement-card p{font-size:14px;line-height:1.8;color:var(--muted);margin:0;max-width:560px}
.footer-links{display:flex;flex-direction:column;gap:8px;font-size:12px;letter-spacing:.02em}
.footer-links a{color:inherit;opacity:.7;transition:.2s}.footer-links a:hover{opacity:1;transform:translateX(2px)}
@media(max-width:1100px){.method-grid,.principles-grid{grid-template-columns:repeat(2,1fr)}.method-card{min-height:280px}.footer-main{grid-template-columns:1.4fr .7fr 1fr}}
@media(max-width:720px){.method-grid,.principles-grid,.engagement-grid{grid-template-columns:1fr}.method-card,.principle,.engagement-card{min-height:0}.method-card>small,.principle h3{margin-top:30px}.method-card:after{margin-top:28px}.footer-main{display:grid;grid-template-columns:1fr;gap:28px}.footer-links{flex-direction:row;flex-wrap:wrap;gap:10px 18px}}

/* v013: additional information, expressed in the original META IP visual language */
.industry-section{padding-bottom:120px}.industry-section .practice-card{min-height:300px}.industry-section .practice-card:nth-child(5){grid-column:auto}.quiet-links{display:flex;justify-content:flex-end;gap:32px;margin-top:28px}.sector-tags{margin-top:24px}.sector-tags span{border-radius:0;background:transparent}.basics-side-note{font-size:13px;color:var(--muted);line-height:1.8;margin:28px 0 16px;max-width:230px}.basics-details .profile-detail summary span{display:flex;align-items:baseline;gap:16px}.basics-details .profile-detail summary small{font-size:9px;letter-spacing:.15em;color:var(--lake-600);font-weight:700}.basics-details .detail-body p{font-size:15px;color:var(--muted);line-height:1.9;margin:0}.basics-note{margin:36px 0 26px}
@media(max-width:720px){.quiet-links{justify-content:flex-start;flex-direction:column;gap:12px}.basics-side-note{max-width:none}.basics-details .profile-detail summary span{align-items:flex-start}.industry-section{padding-bottom:80px}}

/* v014: mobile refinement and launch-readiness polish */
.mobile-nav-backdrop{display:none}
.mobile-nav-head,.mobile-locale{display:none}
@media(max-width:900px){
  body.menu-open{overflow:hidden}
  .nav-shell{height:72px;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
  .brand strong{font-size:14px;letter-spacing:.08em}.brand small{font-size:8px;letter-spacing:.09em}
  .nav-actions{gap:14px}.locale{display:none}
  .menu-button{width:44px;height:44px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;border:0;background:transparent;position:relative;z-index:72}
  .menu-button span{display:block;width:22px;height:1px;background:currentColor;transition:transform .25s ease,opacity .2s ease}
  .menu-button[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
  .menu-button[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
  .mobile-nav-backdrop{display:block;position:fixed;inset:0;border:0;background:rgba(12,31,34,.24);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:68}
  .mobile-nav-backdrop.open{opacity:1;pointer-events:auto}
  .mobile-nav{display:flex;position:fixed;top:0;right:0;height:100dvh;width:min(88vw,390px);padding:max(22px,env(safe-area-inset-top)) 26px max(28px,env(safe-area-inset-bottom));background:#f8fbfa;box-shadow:-24px 0 70px rgba(20,48,52,.15);transform:translateX(105%);transition:transform .28s cubic-bezier(.2,.8,.2,1);z-index:70;flex-direction:column;overflow:auto}
  .mobile-nav.open{transform:translateX(0)}
  .mobile-nav-head{display:flex;align-items:center;padding-bottom:26px;padding-right:52px;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:.12em}
  .mobile-nav-head small{font-family:serif;color:var(--lake-600);margin-left:5px}
  .mobile-nav>a:not(.mobile-locale){display:flex;align-items:center;justify-content:space-between;padding:19px 0;border-bottom:1px solid var(--line);font-size:20px;letter-spacing:-.02em;color:var(--ink)}
  .mobile-nav>a span{font-size:13px;color:var(--lake-500)}
  .mobile-locale{display:inline-flex!important;margin-top:auto;padding-top:30px;font-size:12px!important;letter-spacing:.12em;color:var(--lake-700)!important;border-bottom:0!important}
  .hero{min-height:auto;padding-top:110px}.hero-grid{grid-template-columns:1fr;min-height:auto;gap:38px}.hero-copy{padding:42px 0 0}.hero-copy h1{font-size:clamp(42px,11vw,64px);line-height:1.04}.hero-lead{max-width:36rem}.hero-visual{min-height:320px;margin-top:0}.lake-orbit{transform:scale(.78)}
  .page-hero{padding-top:150px;padding-bottom:74px}.page-hero h1{font-size:clamp(38px,10vw,58px);line-height:1.08}.page-hero>p:last-child{max-width:none}
  .profile-hero{grid-template-columns:1fr;padding-top:126px}.profile-photo{max-width:520px}.profile-intro{padding:12px 0 0}
  .people-grid,.practice-grid,.insights-grid{grid-template-columns:1fr 1fr}
  .section{padding-top:78px;padding-bottom:78px}
}
@media(max-width:640px){
  .wrap{width:min(100% - 36px,var(--wrap))}.hero-grid.wrap{width:min(100% - 36px,var(--wrap))}
  .hero-copy h1{font-size:clamp(39px,12vw,52px)}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions .button{text-align:center;width:100%}
  .hero-visual{min-height:270px}.lake-orbit{transform:scale(.66)}
  .people-grid,.practice-grid,.insights-grid{grid-template-columns:1fr}
  .person-card{grid-template-columns:116px 1fr;min-height:190px}.person-image{min-height:190px}.person-meta{padding:22px 18px}.person-meta h3{font-size:23px}.tags{gap:6px}.tags span{font-size:9px;padding:6px 8px}
  .profile-photo{aspect-ratio:4/5}.profile-intro h1{font-size:44px}.profile-details{grid-template-columns:1fr}.profile-label{position:static;margin-bottom:24px}.profile-detail summary{padding:20px 0}.detail-body{padding:0 0 25px}
  .section-head.row,.split-copy{grid-template-columns:1fr;gap:28px}.section-head.row>p{max-width:none}
  .article-hero h1{font-size:clamp(35px,10vw,48px)}.article-body{grid-template-columns:1fr}.article-side{position:static}
  .contact-layout{grid-template-columns:1fr}.contact-aside{position:static}
  .footer-bottom{gap:10px;flex-direction:column;align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1!important;transform:none!important}}

/* v015: mobile outer gutter refinement
   Keep all primary content comfortably away from viewport edges while
   respecting device safe areas. This intentionally overrides earlier
   720px/640px wrap-width rules. */
@media(max-width:720px){
  :root{--mobile-gutter:clamp(22px,6.4vw,28px)}

  .wrap,
  .hero-grid.wrap,
  .nav-shell{
    width:100%;
    max-width:var(--max);
    padding-left:max(var(--mobile-gutter),env(safe-area-inset-left));
    padding-right:max(var(--mobile-gutter),env(safe-area-inset-right));
  }

  .site-footer{
    padding-left:max(var(--mobile-gutter),env(safe-area-inset-left));
    padding-right:max(var(--mobile-gutter),env(safe-area-inset-right));
  }

  /* Full-width bordered/card surfaces should still retain generous
     interior breathing room on phones. */
  .practice-card,
  .insight-card,
  .method-card,
  .principle,
  .engagement-card{
    padding-left:24px;
    padding-right:24px;
  }

  .contact-form-shell,
  .verify-card{
    padding-left:24px;
    padding-right:24px;
  }

  .guide-note,
  .contact-note{
    padding-left:22px;
    padding-right:22px;
  }

  .profile-detail summary{
    padding-left:2px;
    padding-right:2px;
  }

  .detail-body{
    padding-left:2px;
    padding-right:8px;
  }
}

@media(max-width:360px){
  :root{--mobile-gutter:22px}
  .practice-card,
  .insight-card,
  .method-card,
  .principle,
  .engagement-card,
  .contact-form-shell,
  .verify-card{
    padding-left:21px;
    padding-right:21px;
  }
}

/* v016: iPhone/Safari mobile spacing hardening + cache-bust release.
   Keep visible copy and full-width actions away from viewport edges even if
   nested layout rules change later. */
@media(max-width:720px){
  :root{--mobile-gutter:clamp(24px,7vw,32px)}

  .wrap,
  .hero-grid.wrap,
  .nav-shell{
    width:100%!important;
    max-width:var(--max);
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:max(var(--mobile-gutter),env(safe-area-inset-left))!important;
    padding-right:max(var(--mobile-gutter),env(safe-area-inset-right))!important;
  }

  /* Hero gets an explicit inner safeguard so its typography/buttons can
     never sit flush against the viewport on narrow Safari layouts. */
  .hero-grid.wrap > .hero-copy{
    width:100%;
    min-width:0;
    margin-left:0;
    margin-right:0;
  }

  .hero-actions{
    width:100%;
    gap:12px;
  }

  .hero-actions .button{
    max-width:100%;
  }

  .hero-copy h1,
  .hero-copy .eyebrow,
  .hero-lead{
    max-width:100%;
    overflow-wrap:break-word;
  }

  .hero-strip.wrap{
    padding-left:max(var(--mobile-gutter),env(safe-area-inset-left))!important;
    padding-right:max(var(--mobile-gutter),env(safe-area-inset-right))!important;
  }
}


/* v018: explicit mobile header controls.
   Locale switch sits immediately LEFT of the rightmost menu button.
   Do not rely on inherited currentColor for the menu glyph on iOS Safari. */
@media(max-width:900px){
  .nav-actions{
    display:flex;
    align-items:center;
    gap:10px;
    margin-left:auto;
    flex:0 0 auto;
  }

  .nav-actions .locale{
    display:inline-flex!important;
    order:1;
    align-items:center;
    justify-content:center;
    min-width:32px;
    height:42px;
    padding:0 2px;
    color:var(--lake-800);
    font-size:11px;
    line-height:1;
    font-weight:800;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    z-index:72;
  }

  .nav-actions .menu-button{
    order:2;
    display:flex!important;
    width:42px;
    height:42px;
    flex:0 0 42px;
    padding:0;
    border:1px solid rgba(32,81,95,.58);
    border-radius:50%;
    background:rgba(248,250,249,.82);
    color:var(--lake-800)!important;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    position:relative;
    z-index:72;
    -webkit-appearance:none;
    appearance:none;
  }

  .nav-actions .menu-button span{
    display:block!important;
    width:19px;
    height:1.5px;
    min-height:1.5px;
    margin:0;
    border:0;
    border-radius:2px;
    background:var(--lake-700)!important;
    opacity:1!important;
    transform-origin:center;
  }

  .nav-actions .menu-button[aria-expanded="true"] span:first-child{
    transform:translateY(3.25px) rotate(45deg);
  }
  .nav-actions .menu-button[aria-expanded="true"] span:last-child{
    transform:translateY(-3.25px) rotate(-45deg);
  }

  /* The language switch is deliberately outside the drawer on mobile. */
  .mobile-locale{display:none!important}
}

@media(max-width:390px){
  .nav-actions{gap:8px}
  .nav-actions .locale{min-width:28px;font-size:10.5px}
  .nav-actions .menu-button{width:40px;height:40px;flex-basis:40px}
}

/* v019: mobile drawer alignment fix.
   Earlier breakpoint rules left `left:0` active, which over-constrained the
   fixed-width drawer and caused the remaining viewport gap to appear on the
   right. Pin the drawer to the right edge and leave the breathing room left. */
@media(max-width:900px){
  .mobile-nav{
    left:auto!important;
    right:0!important;
    margin:0!important;
  }
}


/* v021: practice detail pages — preserve the existing META IP visual language. */
.practice-detail-hero{max-width:1080px}
.practice-detail-hero>p:last-of-type{max-width:820px}
.practice-detail-actions{display:flex;align-items:center;gap:26px;margin-top:38px}
.practice-detail-actions .button{width:auto}
.practice-detail-scope{display:grid;grid-template-columns:minmax(220px,.72fr) minmax(0,1.5fr);gap:90px;border-top:1px solid var(--line)}
.practice-detail-label h2{font-size:32px;line-height:1.25;letter-spacing:-.035em;margin:12px 0 0}
.practice-detail-copy>p{font-size:19px;line-height:1.78;color:#33464e;margin:0 0 32px;max-width:760px}
.practice-detail-copy ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.practice-detail-copy li{padding:18px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted);line-height:1.65;position:relative;padding-left:22px}
.practice-detail-copy li:before{content:"";position:absolute;left:1px;top:27px;width:8px;height:1px;background:var(--lake-500)}
.practice-detail-decisions{padding-top:40px}
.practice-decision-grid{grid-template-columns:repeat(3,1fr)}
.practice-detail-process{padding-top:90px}
.practice-detail-link{display:inline-block;margin-top:26px}
.practice-row h2 a{transition:color .2s var(--ease)}
.practice-row h2 a:hover{color:var(--lake-600)}
.related-professionals{background:linear-gradient(180deg,rgba(237,243,242,.6),rgba(237,243,242,0));max-width:none;padding-left:max(calc((100vw - var(--max))/2),24px);padding-right:max(calc((100vw - var(--max))/2),24px)}
.related-professionals>.section-head,.related-professionals>.practice-people-grid{max-width:var(--max);margin-left:auto;margin-right:auto}
.practice-people-grid{grid-template-columns:repeat(4,1fr)}
.practice-related-guides{padding-top:110px;padding-bottom:150px}
@media(max-width:1100px){
  .practice-detail-scope{grid-template-columns:1fr 1.65fr;gap:50px}
  .practice-decision-grid{grid-template-columns:1fr 1fr}
  .practice-people-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
  .practice-detail-actions{align-items:stretch;flex-direction:column;gap:16px}
  .practice-detail-actions .button{width:100%}
  .practice-detail-actions .text-link{align-self:flex-start}
  .practice-detail-scope{display:block;padding-top:72px;padding-bottom:72px}
  .practice-detail-label{margin-bottom:30px}
  .practice-detail-label h2{font-size:29px}
  .practice-detail-copy>p{font-size:17px}
  .practice-decision-grid{grid-template-columns:1fr}
  .practice-detail-process{padding-top:70px}
  .practice-people-grid{grid-template-columns:1fr}
  .practice-related-guides{padding-top:80px;padding-bottom:100px}
  .related-professionals{padding-left:max(var(--mobile-gutter),env(safe-area-inset-left))!important;padding-right:max(var(--mobile-gutter),env(safe-area-inset-right))!important}
}


/* v022: industry directory and detail pages. */
.industry-directory{padding-top:65px;padding-bottom:145px}
.industry-directory-card{min-height:340px}
.industry-directory-card h2{font-size:26px;line-height:1.25;margin:46px 0 16px;letter-spacing:-.025em}
.industry-detail-hero{max-width:1080px}
.industry-context-scope{border-top:1px solid var(--line)}
.industry-practice-links{padding-top:85px;padding-bottom:115px}
.industry-practice-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:1100px){.industry-practice-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){
  .industry-directory{padding-top:40px;padding-bottom:95px}
  .industry-directory-card{min-height:280px}
  .industry-directory-card h2{font-size:24px;margin-top:38px}
  .industry-practice-links{padding-top:70px;padding-bottom:90px}
  .industry-practice-grid{grid-template-columns:1fr}
}

/* v023: information architecture + IP Guide discovery polish. */
.desktop-nav a.active:after{right:0}
.mobile-nav>a.active{color:var(--lake-700);font-weight:700}
.mobile-nav>a.active span{color:var(--lake-700)}
@media(min-width:901px) and (max-width:1120px){
  .desktop-nav{gap:20px;margin-right:20px}
  .desktop-nav a{font-size:12px}
  .nav-actions{gap:14px}
}

.topic-filter{display:flex;flex-wrap:wrap;gap:8px;max-width:760px}
.topic-filter button{border:1px solid var(--line);background:transparent;border-radius:99px;padding:9px 14px;font-size:10px;line-height:1;letter-spacing:.04em;color:#4f6168;cursor:pointer;transition:.18s var(--ease)}
.topic-filter button:hover{border-color:rgba(45,106,119,.42);color:var(--lake-700)}
.topic-filter button.active{background:var(--lake-900);border-color:var(--lake-900);color:#fff}
.insight-results-meta{display:flex;justify-content:space-between;gap:24px;margin:-16px 0 34px;padding-bottom:17px;border-bottom:1px solid var(--line);font-size:9px;letter-spacing:.12em;color:#819096}
.insight-results-meta span:first-child{color:var(--lake-600);font-weight:700}
.insight-topics{display:flex;flex-wrap:wrap;gap:7px;margin:22px 0 -2px}
.insight-topics small{font-size:8px;line-height:1;letter-spacing:.08em;color:var(--lake-600);border:1px solid rgba(45,106,119,.2);padding:6px 8px;border-radius:99px}

.detail-back-link{display:inline-block;margin-bottom:34px;font-size:10px;letter-spacing:.08em;color:var(--lake-600);border-bottom:1px solid transparent;transition:.18s}
.detail-back-link:hover{border-color:var(--lake-300)}
.guide-topic-line{display:flex;flex-wrap:wrap;gap:8px;margin:-7px 0 26px}
.guide-topic-line a{font-size:9px;letter-spacing:.08em;color:var(--lake-700);border:1px solid rgba(45,106,119,.22);border-radius:99px;padding:7px 10px;background:rgba(255,255,255,.4)}
.guide-sequence{display:grid;grid-template-columns:1fr 1fr;margin-top:70px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.guide-sequence a{min-height:145px;padding:26px 28px 28px 0;display:flex;flex-direction:column;gap:17px;transition:.2s var(--ease)}
.guide-sequence a+a{border-left:1px solid var(--line);padding-left:28px;padding-right:0;text-align:right;align-items:flex-end}
.guide-sequence a:hover{background:linear-gradient(90deg,rgba(234,242,242,.45),transparent)}
.guide-sequence a.next:hover{background:linear-gradient(270deg,rgba(234,242,242,.45),transparent)}
.guide-sequence small{font-size:9px;letter-spacing:.12em;color:var(--lake-600)}
.guide-sequence strong{font-size:17px;line-height:1.5;font-weight:600;letter-spacing:-.02em;max-width:300px}
.guide-sequence .next:only-child{grid-column:2}

@media(max-width:720px){
  .topic-filter{flex-wrap:nowrap;overflow-x:auto;margin-left:calc(-1 * var(--mobile-gutter));margin-right:calc(-1 * var(--mobile-gutter));padding:0 var(--mobile-gutter) 8px;scrollbar-width:none}
  .topic-filter::-webkit-scrollbar{display:none}
  .topic-filter button{flex:0 0 auto}
  .insight-results-meta{display:block;margin-top:-5px}
  .insight-results-meta span{display:block}
  .insight-results-meta span+span{margin-top:6px;letter-spacing:.03em;line-height:1.5}
  .insight-topics{margin-top:18px}
  .detail-back-link{margin-bottom:26px}
  .guide-topic-line{margin-bottom:22px}
  .guide-sequence{grid-template-columns:1fr;margin-top:55px}
  .guide-sequence a,.guide-sequence a+a{grid-column:auto!important;min-height:0;padding:24px 0;text-align:left;align-items:flex-start;border-left:0}
  .guide-sequence a+a{border-top:1px solid var(--line)}
  .guide-sequence strong{max-width:none}
}


/* ==========================================================
   METAIP v008
   Minimal visual substitution:
   - preserve original layout
   - original MetaIP logo
   - dark navigation bar
   - legacy team portrait in former orbit position
   ========================================================== */

/* --- Header: preserve original 82px geometry --- */

.site-header{
  background:rgba(10,27,37,.97);
  border-bottom:1px solid rgba(255,255,255,.10);
}

.site-header.scrolled{
  background:rgba(10,27,37,.94);
  backdrop-filter:blur(18px);
  border-color:rgba(255,255,255,.11);
}

.metaip-brand-logo{
  display:flex;
  align-items:center;
  flex:0 0 auto;
}

.metaip-brand-logo img{
  display:block;
  width:138px;
  height:auto;
  max-height:56px;
  object-fit:contain;
}

.desktop-nav a{
  color:rgba(255,255,255,.82);
}

.desktop-nav a:hover,
.desktop-nav a.active{
  color:#fff;
}

.desktop-nav a:after{
  background:rgba(255,255,255,.82);
}

.locale{
  color:#fff;
}

.menu-button{
  color:#fff;
}

.menu-button span{
  background:#fff;
}

/* --- Hero photograph: occupy original orbit zone only --- */

.hero-visual{
  position:relative;
  display:grid;
  place-items:center;
}

.metaip-hero-photo{
  position:relative;
  width:min(31vw,390px);
  aspect-ratio:1 / 1;
  display:grid;
  place-items:center;
}

.metaip-hero-photo img{
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center center;

  opacity:.97;

  -webkit-mask-image:
    radial-gradient(
      ellipse 50% 50% at 50% 50%,
      #000 0%,
      #000 52%,
      rgba(0,0,0,.96) 62%,
      rgba(0,0,0,.72) 73%,
      rgba(0,0,0,.32) 84%,
      transparent 100%
    );

  mask-image:
    radial-gradient(
      ellipse 50% 50% at 50% 50%,
      #000 0%,
      #000 52%,
      rgba(0,0,0,.96) 62%,
      rgba(0,0,0,.72) 73%,
      rgba(0,0,0,.32) 84%,
      transparent 100%
    );

  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
}

/* 아주 약한 ambient glow만 추가 */
.metaip-hero-photo:after{
  content:"";
  position:absolute;
  inset:13%;
  z-index:-1;
  border-radius:50%;
  background:rgba(83,143,158,.12);
  filter:blur(40px);
}

/* Mobile drawer logo */
.metaip-mobile-brand img{
  width:128px;
  height:auto;
  max-height:50px;
  object-fit:contain;
}

/* 기존 drawer는 밝은 배경이므로 흰 로고의 가독성을 위해
   drawer head 부분만 header와 동일한 dark field를 부여 */
@media(max-width:900px){
  .metaip-mobile-brand{
    margin:-22px -26px 12px;
    padding:22px 26px;
    background:#0a1b25;
    border-bottom:0;
  }
}

/* 기존 반응형 정책을 존중: 작은 화면에서는 원래처럼 hero visual 숨김 */
@media(max-width:1100px){
  .metaip-brand-logo img{
    width:126px;
  }
}

@media(max-width:720px){
  .metaip-brand-logo img{
    width:112px;
    max-height:45px;
  }
}



/* ==========================================================
   METAIP v009
   Hero typography + stronger photographic edge feathering
   ========================================================== */

.metaip-hero-photo{
  position:relative;
  width:min(34vw,420px);
  aspect-ratio:1 / 1;
  overflow:visible;
}

/*
   사각형 네 변 모두에서 투명하게 사라지는 마스크.
   가운데 약 62% 영역은 선명하게 유지하고,
   외곽으로 갈수록 단계적으로 배경에 녹인다.
*/
.metaip-hero-photo img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center center;

  -webkit-mask-image:
    linear-gradient(to right,
      transparent 0%,
      rgba(0,0,0,.18) 5%,
      rgba(0,0,0,.72) 13%,
      #000 23%,
      #000 77%,
      rgba(0,0,0,.72) 87%,
      rgba(0,0,0,.18) 95%,
      transparent 100%),
    linear-gradient(to bottom,
      transparent 0%,
      rgba(0,0,0,.18) 5%,
      rgba(0,0,0,.72) 13%,
      #000 23%,
      #000 77%,
      rgba(0,0,0,.72) 87%,
      rgba(0,0,0,.18) 95%,
      transparent 100%);

  -webkit-mask-composite: source-in;

  mask-image:
    linear-gradient(to right,
      transparent 0%,
      rgba(0,0,0,.18) 5%,
      rgba(0,0,0,.72) 13%,
      #000 23%,
      #000 77%,
      rgba(0,0,0,.72) 87%,
      rgba(0,0,0,.18) 95%,
      transparent 100%),
    linear-gradient(to bottom,
      transparent 0%,
      rgba(0,0,0,.18) 5%,
      rgba(0,0,0,.72) 13%,
      #000 23%,
      #000 77%,
      rgba(0,0,0,.72) 87%,
      rgba(0,0,0,.18) 95%,
      transparent 100%);

  mask-composite: intersect;

  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}

/* 가장자리 색이 갑자기 끝나는 느낌을 한 번 더 완화 */
.metaip-hero-photo:before{
  content:"";
  position:absolute;
  inset:-8%;
  z-index:-1;
  background:radial-gradient(
    ellipse at center,
    rgba(174,207,217,.20) 0%,
    rgba(174,207,217,.10) 45%,
    transparent 72%
  );
  filter:blur(20px);
}



/* ==========================================================
   METAIP v010
   About page: greeting portrait + non-italic hero emphasis
   ========================================================== */

.about-greeting{
  align-items:start;
}

.about-greeting-portrait{
  min-width:0;
}

.about-greeting-portrait .eyebrow{
  margin-bottom:24px;
}

.about-greeting-photo{
  width:min(100%,320px);
  aspect-ratio:4 / 5;
  overflow:hidden;
  background:#dfe8e7;
}

.about-greeting-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 16%;
  filter:saturate(.88) contrast(.98);
}

.about-greeting-name{
  width:min(100%,320px);
  margin:18px 0 0;
  display:flex;
  align-items:baseline;
  gap:10px;
}

.about-greeting-name strong{
  font-size:18px;
  font-weight:650;
  letter-spacing:-.02em;
}

.about-greeting-name span{
  color:var(--muted);
  font-size:12px;
}

.about-greeting-copy h2{
  margin-top:0;
}

@media(max-width:720px){
  .about-greeting{
    grid-template-columns:1fr;
    gap:42px;
  }

  .about-greeting-photo{
    width:min(78vw,320px);
  }

  .about-greeting-name{
    width:min(78vw,320px);
  }
}



/* ==========================================================
   METAIP v011
   - About title line breaks
   - Greeting portrait
   - Hero portrait: preserve people, blend surrounding field
   ========================================================== */

/* ---------- ABOUT GREETING ---------- */

.about-greeting{
  align-items:start;
}

.about-greeting-portrait{
  min-width:0;
}

.about-greeting-portrait .eyebrow{
  margin-bottom:24px;
}

.about-greeting-photo{
  width:min(100%,320px);
  aspect-ratio:4 / 5;
  overflow:hidden;
  background:#dfe8e7;
}

.about-greeting-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 16%;
  filter:saturate(.9) contrast(.98);
}

.about-greeting-name{
  width:min(100%,320px);
  margin:18px 0 0;
  display:flex;
  gap:10px;
  align-items:baseline;
}

.about-greeting-name strong{
  font-size:18px;
  font-weight:650;
}

.about-greeting-name span{
  font-size:12px;
  color:var(--muted);
}

.about-greeting-copy h2{
  margin-top:0;
}


/* ---------- HOME HERO PHOTO ---------- */

/*
   v009의 넓은 transparency mask를 사실상 무효화한다.
   사람 자체는 거의 온전히 보존한다.
*/
.metaip-hero-photo{
  width:min(35vw,440px);
  aspect-ratio:1;
  position:relative;
  display:grid;
  place-items:center;
  isolation:isolate;
}

/*
   사진 주변에 사진 자체의 studio background와 가까운 색을 만들고,
   그 바깥에서 원래 hero 색으로 자연스럽게 소멸시킨다.
*/
.metaip-hero-photo::before{
  content:"";
  position:absolute;
  z-index:-2;
  inset:-18%;

  background:
    radial-gradient(
      ellipse at 50% 47%,
      rgba(191,215,226,.96) 0%,
      rgba(191,215,226,.94) 35%,
      rgba(174,211,228,.78) 52%,
      rgba(162,205,229,.48) 67%,
      rgba(222,237,238,.22) 79%,
      rgba(238,245,244,0) 92%
    );

  filter:blur(4px);
}

/*
   사진의 위/아래 색 차이도 주변 field에 약하게 반영.
*/
.metaip-hero-photo::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-9%;

  background:
    linear-gradient(
      to bottom,
      rgba(191,215,226,.48) 0%,
      rgba(183,214,227,.34) 45%,
      rgba(162,205,229,.40) 100%
    );

  -webkit-mask-image:
    radial-gradient(
      ellipse at center,
      #000 15%,
      rgba(0,0,0,.82) 49%,
      rgba(0,0,0,.28) 72%,
      transparent 100%
    );

  mask-image:
    radial-gradient(
      ellipse at center,
      #000 15%,
      rgba(0,0,0,.82) 49%,
      rgba(0,0,0,.28) 72%,
      transparent 100%
    );
}

/*
   인물 사진은 94% 이상 선명하게 유지.
   실제 파일의 네모난 경계만 약 4~5% 구간에서 없앤다.
*/
.metaip-hero-photo img{
  position:relative;
  z-index:1;

  width:91%;
  height:91%;
  max-width:none;

  object-fit:cover;
  object-position:center center;

  opacity:1;

  -webkit-mask-image:
    linear-gradient(to right,
      transparent 0%,
      #000 5%,
      #000 95%,
      transparent 100%),
    linear-gradient(to bottom,
      transparent 0%,
      #000 5%,
      #000 95%,
      transparent 100%);

  -webkit-mask-composite:source-in;

  mask-image:
    linear-gradient(to right,
      transparent 0%,
      #000 5%,
      #000 95%,
      transparent 100%),
    linear-gradient(to bottom,
      transparent 0%,
      #000 5%,
      #000 95%,
      transparent 100%);

  mask-composite:intersect;

  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}

@media(max-width:720px){
  .about-greeting{
    grid-template-columns:1fr;
    gap:42px;
  }

  .about-greeting-photo,
  .about-greeting-name{
    width:min(78vw,320px);
  }
}


/* ==========================================================
   METAIP v012
   Hero portrait surrounding field: more circular
   ========================================================== */

/*
   바깥쪽 확장 영역을 명확한 원형 halo로 만든다.
   사진 자체는 사각 구도를 유지한다.
*/
.metaip-hero-photo::before{
  inset:-17%;
  border-radius:50%;

  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(191,215,226,.98) 0%,
      rgba(191,215,226,.94) 38%,
      rgba(176,211,227,.78) 54%,
      rgba(162,205,229,.48) 68%,
      rgba(218,235,237,.20) 82%,
      rgba(238,245,244,0) 100%
    );

  filter:blur(8px);
}

/*
   사진 바로 뒤에도 조금 더 작은 원형 색면을 둬서
   사각 사진과 바깥 halo 사이를 자연스럽게 연결한다.
*/
.metaip-hero-photo::after{
  inset:-8%;
  border-radius:50%;

  background:
    linear-gradient(
      to bottom,
      rgba(191,215,226,.72) 0%,
      rgba(181,213,227,.62) 46%,
      rgba(162,205,229,.66) 100%
    );

  opacity:.82;
  filter:blur(9px);

  -webkit-mask-image:
    radial-gradient(
      circle at center,
      #000 0%,
      #000 48%,
      rgba(0,0,0,.78) 66%,
      rgba(0,0,0,.30) 82%,
      transparent 100%
    );

  mask-image:
    radial-gradient(
      circle at center,
      #000 0%,
      #000 48%,
      rgba(0,0,0,.78) 66%,
      rgba(0,0,0,.30) 82%,
      transparent 100%
    );
}


/* ==========================================================
   METAIP v013
   Hero portrait halo blended into the hero background
   ========================================================== */

/*
   Hero 오른쪽 배경(#eef5f4 ~ #e6f0f0)에 거의 맞춘다.
   원형은 형태가 아니라 사진과 배경 사이의 완충영역으로만 사용.
*/
.metaip-hero-photo::before{
  inset:-18%;
  border-radius:50%;

  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(226,239,241,.96) 0%,
      rgba(230,241,242,.92) 38%,
      rgba(232,242,242,.76) 56%,
      rgba(234,243,243,.46) 72%,
      rgba(236,244,244,.18) 86%,
      rgba(238,245,244,0) 100%
    );

  filter:blur(10px);
}

/*
   사진 바로 뒤에는 원본 사진의 청색 배경과
   hero 배경 사이의 중간색만 아주 약하게 남긴다.
*/
.metaip-hero-photo::after{
  inset:-7%;
  border-radius:50%;

  background:
    radial-gradient(
      circle at center,
      rgba(207,226,233,.58) 0%,
      rgba(216,233,237,.43) 48%,
      rgba(226,239,240,.22) 72%,
      transparent 100%
    );

  opacity:.72;
  filter:blur(11px);

  -webkit-mask-image:
    radial-gradient(
      circle at center,
      #000 0%,
      #000 52%,
      rgba(0,0,0,.65) 70%,
      rgba(0,0,0,.18) 87%,
      transparent 100%
    );

  mask-image:
    radial-gradient(
      circle at center,
      #000 0%,
      #000 52%,
      rgba(0,0,0,.65) 70%,
      rgba(0,0,0,.18) 87%,
      transparent 100%
    );
}


/* ==========================================================
   METAIP v014
   Header logo scale refinement: ~70% of previous size
   ========================================================== */

.metaip-brand-logo img{
  width:96px;
  max-height:40px;
}

.metaip-mobile-brand img{
  width:90px;
  max-height:38px;
}

@media(max-width:1100px){
  .metaip-brand-logo img{
    width:88px;
    max-height:37px;
  }
}

@media(max-width:720px){
  .metaip-brand-logo img{
    width:78px;
    max-height:33px;
  }
}



/* ==========================================================
   METAIP v015
   Practice page: legacy MetaIP artwork in the first viewport
   ========================================================== */

.practice-visual-hero{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr);
  gap:72px;
  align-items:center;
  min-height:680px;
  padding-bottom:90px;
}

.practice-visual-copy{
  min-width:0;
}

.practice-visual-copy h1{
  margin:0;
}

.practice-visual-lead{
  max-width:610px;
  margin:34px 0 0;
  color:var(--muted);
  font-size:17px;
  line-height:1.85;
  word-break:keep-all;
}


/* ---- Original MetaIP artwork collage ---- */

.practice-legacy-collage{
  position:relative;
  width:min(100%,520px);
  height:500px;
  justify-self:end;
}

.practice-art{
  position:absolute;
  margin:0;
  overflow:hidden;
  background:rgba(255,255,255,.55);
  box-shadow:0 18px 48px rgba(16,44,54,.08);
}

.practice-art img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

/* tall artwork: rear left */
.practice-art-a{
  width:185px;
  height:314px;
  left:10px;
  top:42px;
  z-index:1;
  transform:translateY(9px);
}

/* tall artwork: rear right */
.practice-art-b{
  width:185px;
  height:314px;
  right:0;
  top:12px;
  z-index:2;
}

/* wider artwork: foreground */
.practice-art-c{
  width:330px;
  height:316px;
  left:96px;
  bottom:0;
  z-index:3;
  background:rgba(255,255,255,.70);
}

/*
   사각 카드 느낌을 조금 줄이고
   기존 hero 배경 속에 자연스럽게 놓이도록 외곽을 약화
*/
.practice-art-a,
.practice-art-b,
.practice-art-c{
  border:1px solid rgba(16,44,54,.06);
}

.practice-legacy-collage::before{
  content:"";
  position:absolute;
  inset:5% -4% -2% 5%;
  z-index:0;
  background:
    radial-gradient(
      circle at 54% 48%,
      rgba(198,224,228,.44) 0%,
      rgba(218,235,237,.20) 56%,
      transparent 80%
    );
  filter:blur(12px);
}


/* ---- Keep the rest of the practice page untouched ---- */

@media(max-width:1100px){
  .practice-visual-hero{
    grid-template-columns:1fr;
    gap:45px;
    min-height:auto;
    padding-bottom:72px;
  }

  .practice-legacy-collage{
    justify-self:center;
    width:min(100%,520px);
  }
}

@media(max-width:640px){
  .practice-visual-hero{
    padding-bottom:55px;
  }

  .practice-visual-lead{
    font-size:15px;
  }

  .practice-legacy-collage{
    height:390px;
    width:100%;
  }

  .practice-art-a{
    width:138px;
    height:234px;
    left:0;
    top:40px;
  }

  .practice-art-b{
    width:138px;
    height:234px;
    right:0;
    top:10px;
  }

  .practice-art-c{
    width:245px;
    height:234px;
    left:50%;
    transform:translateX(-50%);
    bottom:0;
  }
}


/* ==========================================================
   METAIP v016
   Practice context: three primary service pillars
   ========================================================== */

.practice-context{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  margin-top:0;
  padding-top:18px;
  border-top:0;
}

.practice-context article{
  position:relative;
  min-height:280px;
  padding:38px 32px 34px;
  overflow:hidden;

  background:
    linear-gradient(
      155deg,
      rgba(255,255,255,.98) 0%,
      rgba(244,248,248,.96) 100%
    );

  border:0;
  border-top:4px solid #0a1b25;

  box-shadow:
    0 10px 32px rgba(11,32,41,.045);
}

/* subtle large numbering in the background */
.practice-context article::before{
  position:absolute;
  right:22px;
  top:18px;

  font-size:78px;
  line-height:1;
  font-weight:700;
  letter-spacing:-.06em;

  color:rgba(10,27,37,.045);
  pointer-events:none;
}

.practice-context article:nth-child(1)::before{
  content:"01";
}

.practice-context article:nth-child(2)::before{
  content:"02";
}

.practice-context article:nth-child(3)::before{
  content:"03";
}

.practice-context article > span{
  position:relative;
  z-index:1;

  display:block;
  margin:0 0 42px;

  color:#50666e;
  font-size:10px;
  line-height:1.3;
  font-weight:750;
  letter-spacing:.16em;
}

.practice-context h2{
  position:relative;
  z-index:1;

  margin:0 0 18px;
  max-width:260px;

  color:#172126;
  font-size:28px;
  line-height:1.25;
  font-weight:600;
  letter-spacing:-.035em;
}

.practice-context p{
  position:relative;
  z-index:1;

  max-width:330px;
  margin:0;

  color:#68787e;
  font-size:14px;
  line-height:1.82;
  word-break:keep-all;
}

/* give each pillar a very restrained MetaIP tonal variation */
.practice-context article:nth-child(1){
  background:
    linear-gradient(155deg,#ffffff 0%,#f1f6f6 100%);
}

.practice-context article:nth-child(2){
  background:
    linear-gradient(155deg,#ffffff 0%,#f3f5f7 100%);
}

.practice-context article:nth-child(3){
  background:
    linear-gradient(155deg,#ffffff 0%,#eef5f7 100%);
}

@media(max-width:900px){
  .practice-context{
    grid-template-columns:1fr;
    gap:14px;
  }

  .practice-context article{
    min-height:0;
    padding:30px 28px 30px;
  }

  .practice-context article > span{
    margin-bottom:26px;
  }

  .practice-context h2{
    max-width:none;
  }

  .practice-context p{
    max-width:680px;
  }
}


/* ==========================================================
   METAIP v018
   Practice / WHEN TO INVOLVE US
   ========================================================== */

.engagement-section{
  position:relative;
  margin-top:50px;
  margin-bottom:40px;
  padding:82px 64px 70px;

  background:
    linear-gradient(
      135deg,
      #0a1b25 0%,
      #102b38 58%,
      #163947 100%
    );

  color:#fff;
  overflow:hidden;
}

/* 아주 약한 배경 깊이만 추가 */
.engagement-section::before{
  content:"";
  position:absolute;
  width:430px;
  height:430px;
  right:-170px;
  top:-210px;
  border-radius:50%;
  background:rgba(118,180,194,.08);
  pointer-events:none;
}

.engagement-section .section-head{
  position:relative;
  z-index:1;
  margin-bottom:54px;
}

.engagement-section .section-head.row{
  align-items:end;
}

.engagement-section .eyebrow{
  color:#8fb7c0;
}

.engagement-section .section-head h2{
  color:#fff;
}

.engagement-section .section-head.row > p{
  color:rgba(255,255,255,.66);
  line-height:1.85;
}


/* four decision moments */

.engagement-grid{
  position:relative;
  z-index:1;

  display:grid;
  grid-template-columns:repeat(4,1fr);

  border-top:1px solid rgba(255,255,255,.20);
  border-bottom:1px solid rgba(255,255,255,.16);
}

.engagement-card{
  position:relative;
  min-height:300px;
  padding:32px 27px 32px;

  background:transparent;
  border:0;
  border-right:1px solid rgba(255,255,255,.14);

  transition:
    background .22s ease,
    transform .22s ease;
}

.engagement-card:last-child{
  border-right:0;
}

.engagement-card:hover{
  background:rgba(255,255,255,.045);
  transform:translateY(-3px);
}

.engagement-card > span{
  display:block;
  margin-bottom:66px;

  color:#8fb7c0;
  font-size:9px;
  line-height:1.4;
  font-weight:750;
  letter-spacing:.16em;
}

.engagement-card h3{
  margin:0 0 18px;

  color:#fff;
  font-size:22px;
  line-height:1.38;
  font-weight:600;
  letter-spacing:-.025em;
  word-break:keep-all;
}

.engagement-card p{
  margin:0;

  color:rgba(255,255,255,.60);
  font-size:13px;
  line-height:1.82;
  word-break:keep-all;
}


/* 번호는 정보 계층만 잡아주는 정도로 약하게 */

.engagement-card::before{
  position:absolute;
  top:28px;
  right:24px;

  color:rgba(255,255,255,.08);
  font-size:52px;
  line-height:1;
  font-weight:700;
  letter-spacing:-.05em;
}

.engagement-card:nth-child(1)::before{content:"01";}
.engagement-card:nth-child(2)::before{content:"02";}
.engagement-card:nth-child(3)::before{content:"03";}
.engagement-card:nth-child(4)::before{content:"04";}


@media(max-width:1000px){
  .engagement-section{
    padding:64px 42px 58px;
  }

  .engagement-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .engagement-card:nth-child(2){
    border-right:0;
  }

  .engagement-card:nth-child(-n+2){
    border-bottom:1px solid rgba(255,255,255,.14);
  }
}

@media(max-width:640px){
  .engagement-section{
    margin-top:25px;
    padding:52px 26px 46px;
  }

  .engagement-grid{
    grid-template-columns:1fr;
  }

  .engagement-card,
  .engagement-card:nth-child(2){
    min-height:0;
    padding:27px 2px 30px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.14);
  }

  .engagement-card:last-child{
    border-bottom:0;
  }

  .engagement-card > span{
    margin-bottom:30px;
  }
}


/* ==========================================================
   METAIP v019
   Practice list: clearer hierarchy, restrained corporate style
   ========================================================== */

.practice-list{
  padding-top:95px;
  padding-bottom:120px;
}

.practice-row{
  position:relative;

  display:grid;
  grid-template-columns:86px minmax(220px,.78fr) minmax(0,1.22fr);
  gap:42px;

  padding:42px 34px 44px 0;

  border-top:1px solid rgba(16,44,54,.15);

  transition:
    background .22s ease,
    padding-left .22s ease;
}

.practice-row:last-child{
  border-bottom:1px solid rgba(16,44,54,.15);
}

/* 번호 */
.practice-row > span{
  display:flex;
  align-items:flex-start;
  justify-content:center;

  padding-top:4px;

  color:#0a1b25;
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
}

/* 번호 왼쪽의 짧은 MetaIP accent */
.practice-row::before{
  content:"";
  position:absolute;
  left:0;
  top:42px;

  width:3px;
  height:34px;

  background:#173d49;
  opacity:.22;

  transition:
    height .22s ease,
    opacity .22s ease;
}

.practice-row:hover{
  background:rgba(255,255,255,.58);
  padding-left:10px;
}

.practice-row:hover::before{
  height:58px;
  opacity:.85;
}


/* 업무명 */
.practice-row h2{
  margin:0;

  font-size:29px;
  line-height:1.28;
  font-weight:620;
  letter-spacing:-.035em;
  word-break:keep-all;
}

.practice-row h2 a{
  transition:color .2s ease;
}

.practice-row h2 a:hover{
  color:#20515f;
}


/* 설명 */
.practice-copy{
  min-width:0;
}

.practice-copy > p{
  margin:0;

  max-width:640px;

  color:#5e6e74;
  font-size:15px;
  line-height:1.88;
  word-break:keep-all;
}


/* 세부 업무 */
.practice-copy ul{
  list-style:none;
  margin:25px 0 0;
  padding:0;

  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:26px;

  border-top:1px solid rgba(16,44,54,.10);
}

.practice-copy li{
  position:relative;

  padding:11px 8px 11px 17px;

  border-bottom:1px solid rgba(16,44,54,.08);

  color:#596a70;
  font-size:12px;
  line-height:1.55;
}

.practice-copy li::before{
  content:"";
  position:absolute;
  left:1px;
  top:18px;

  width:5px;
  height:5px;
  border-radius:50%;

  background:#6e9da5;
}


/* 상세 보기 */
.practice-detail-link{
  display:inline-block;

  margin-top:25px;
  padding-bottom:4px;

  color:#173d49;
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
}


/* tablet */
@media(max-width:900px){
  .practice-row{
    grid-template-columns:62px minmax(190px,.8fr) minmax(0,1.2fr);
    gap:25px;
    padding-right:10px;
  }

  .practice-row h2{
    font-size:25px;
  }
}


/* mobile */
@media(max-width:640px){
  .practice-list{
    padding-top:70px;
    padding-bottom:85px;
  }

  .practice-row{
    grid-template-columns:44px 1fr;
    gap:12px 18px;

    padding:30px 0 34px;
  }

  .practice-row:hover{
    padding-left:0;
  }

  .practice-row::before{
    top:30px;
    height:28px;
  }

  .practice-row > span{
    justify-content:flex-start;
  }

  .practice-row h2{
    font-size:24px;
  }

  .practice-copy{
    grid-column:2;
  }

  .practice-copy > p{
    font-size:14px;
  }

  .practice-copy ul{
    grid-template-columns:1fr;
    margin-top:20px;
  }
}


/* ==========================================================
   METAIP v020
   Practice / INDUSTRY FOCUS
   ========================================================== */

.industry-section{
  padding-top:110px;
  padding-bottom:130px;
  border-top:1px solid rgba(16,44,54,.11);
}

.industry-section .section-head{
  margin-bottom:58px;
}

.industry-section .practice-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;

  border:0;
}

.industry-section .practice-card{
  position:relative;
  min-height:270px;

  padding:34px 38px 36px;

  border:0;
  border-left:4px solid rgba(23,61,73,.28);

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.96) 0%,
      rgba(241,246,246,.92) 100%
    );

  box-shadow:
    0 8px 30px rgba(11,32,41,.04);

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.industry-section .practice-card:hover{
  transform:translateY(-3px);

  border-left-color:#173d49;

  box-shadow:
    0 15px 38px rgba(11,32,41,.075);
}

.industry-section .practice-card > span{
  display:block;

  margin-bottom:46px;

  color:#647b83;
  font-size:10px;
  font-weight:750;
  letter-spacing:.15em;
}

.industry-section .practice-card h3{
  margin:0 0 15px;

  font-size:27px;
  line-height:1.28;
  font-weight:620;
  letter-spacing:-.035em;
}

.industry-section .practice-card p{
  max-width:520px;
  margin:0;

  color:#65767c;
  font-size:14px;
  line-height:1.82;
  word-break:keep-all;
}


/* 기술 키워드는 pill보다 작은 taxonomy label처럼 */
.industry-section .sector-tags{
  display:flex;
  flex-wrap:wrap;
  gap:0 16px;

  margin-top:25px;
  padding-top:17px;

  border-top:1px solid rgba(16,44,54,.09);
}

.industry-section .sector-tags span{
  position:relative;

  padding:3px 0;

  border:0;
  border-radius:0;

  color:#536a72;
  font-size:10px;
  line-height:1.45;
}

.industry-section .sector-tags span + span::before{
  content:"·";
  position:absolute;
  left:-10px;
  color:#9babad;
}


/* 상세 페이지 화살표 */
.industry-section .practice-card > a{
  right:31px;
  bottom:27px;

  color:#173d49;
  font-size:20px;
}


/*
   현재 데이터가 홀수인 경우 마지막 영역을 넓게 사용.
   단순 카드 나열보다 디렉터리의 마무리 느낌을 준다.
*/
.industry-section .practice-card:last-child:nth-child(odd){
  grid-column:1 / -1;
  min-height:235px;

  padding-right:120px;

  background:
    linear-gradient(
      105deg,
      rgba(236,244,244,.98) 0%,
      rgba(248,250,249,.97) 70%
    );
}


/* 배경에 아주 약한 기술 패턴 */
.industry-section .practice-card::before{
  content:"";
  position:absolute;
  right:30px;
  top:26px;

  width:55px;
  height:55px;

  border-top:1px solid rgba(32,81,95,.10);
  border-right:1px solid rgba(32,81,95,.10);

  pointer-events:none;
}


@media(max-width:800px){
  .industry-section .practice-grid{
    grid-template-columns:1fr;
  }

  .industry-section .practice-card,
  .industry-section .practice-card:last-child:nth-child(odd){
    grid-column:auto;
    min-height:0;
    padding:30px 30px 34px;
  }

  .industry-section .practice-card > span{
    margin-bottom:30px;
  }
}


/* ==========================================================
   METAIP v021
   Home portrait:
   - no blur
   - no halo
   - dark 1pt frame
   - height synchronized with left hero content
   ========================================================== */

.metaip-hero-photo{
  position:relative;
  width:auto;
  height:auto;
  aspect-ratio:auto;
  display:block;
}

/* v011~v013에서 사용한 원형/그라데이션 halo 완전 제거 */
.metaip-hero-photo::before,
.metaip-hero-photo::after{
  content:none !important;
  display:none !important;
  background:none !important;
  filter:none !important;
}

/* 사진 자체도 feather/mask 없이 또렷하게 */
.metaip-hero-photo img{
  display:block;
  position:relative;
  z-index:1;

  width:var(--metaip-hero-photo-height, 390px);
  height:var(--metaip-hero-photo-height, 390px);
  max-width:none;

  object-fit:cover;
  object-position:center center;

  opacity:1;

  border:1pt solid #102c36;
  box-sizing:border-box;

  filter:none;

  -webkit-mask:none !important;
  mask:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

/*
  JS가 META IP · SEOUL 상단 위치에 맞춰 margin-top을 설정.
  기존 orbit 영역의 중앙 정렬 규칙은 사용하지 않는다.
*/
@media(min-width:1101px){
  .hero-visual:has(.metaip-hero-photo){
    align-self:start;
    min-height:0;
    place-items:center;
  }
}


/* ==========================================================
   METAIP v022
   Home portrait exact vertical alignment
   ========================================================== */

.hero .hero-visual{
  position:relative;
  align-self:stretch;
  display:block;
  min-height:0;
}

/* 기존 원형/blur/halo 전부 제거 */
.hero .metaip-hero-photo::before,
.hero .metaip-hero-photo::after{
  content:none !important;
  display:none !important;
}

.hero .metaip-hero-photo{
  position:absolute;
  left:50%;
  transform:translateX(-50%);

  margin:0;
  padding:0;

  aspect-ratio:auto;

  background:transparent;
  box-shadow:none;
  filter:none;
}

.hero .metaip-hero-photo img{
  display:block;

  width:100%;
  height:100%;
  max-width:none;

  object-fit:cover;
  object-position:center center;

  opacity:1;

  border:1pt solid #102c36;
  box-sizing:border-box;

  border-radius:0;
  box-shadow:none;
  filter:none;

  -webkit-mask:none !important;
  mask:none !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}


/* ==========================================================
   METAIP v023
   Preserve complete team portrait without cropping
   ========================================================== */

.hero .metaip-hero-photo{
  overflow:visible;
}

/*
   원본 전체 표시.
   cover 금지: 어깨나 좌우 인물을 자르지 않는다.
*/
.hero .metaip-hero-photo img{
  width:100%;
  height:100%;

  object-fit:contain !important;
  object-position:center center;

  border:1pt solid #102c36;
  background:transparent;

  -webkit-mask:none !important;
  mask:none !important;
  filter:none !important;
}


/* ==========================================================
   METAIP v024
   Restore home portrait frame
   ========================================================== */

.hero .metaip-hero-photo{
  border:1pt solid #102c36 !important;
  box-sizing:border-box;
  background:transparent;
}

.hero .metaip-hero-photo img{
  border:0 !important;
  box-sizing:border-box;
}


/* ==========================================================
   METAIP v025
   Home portrait: right-edge alignment
   ========================================================== */

/*
   사진의 오른쪽 테두리 = hero wrap의 오른쪽 경계.
   사진은 그 경계에서 왼쪽 방향으로 확장된다.
*/
@media(min-width:1101px){
  .hero .metaip-hero-photo{
    left:auto !important;
    right:0 !important;
    transform:none !important;
  }
}


/* ==========================================================
   METAIP v026
   Home hero:
   - title line break after "혁신의 가치를"
   - copy always renders above portrait
   ========================================================== */

.hero-grid{
  position:relative;
}

/* 글자가 항상 이미지보다 위 */
.hero-copy{
  position:relative;
  z-index:5;
}

/* 이미지는 아래 레이어 */
.hero-visual{
  z-index:1;
}

/*
   사진이 왼쪽 글자 영역까지 들어오는 경우에도
   텍스트 자체가 사진 뒤로 숨지 않도록 한다.
*/
.hero-copy h1,
.hero-copy .eyebrow,
.hero-copy .hero-lead,
.hero-copy .hero-actions{
  position:relative;
  z-index:6;
}


/* ==========================================================
   METAIP v027
   Practice / INDUSTRY FOCUS only
   ========================================================== */

.industry-section{
  padding-top:110px;
  padding-bottom:130px;
  border-top:1px solid rgba(16,44,54,.11);
}

.industry-section .section-head{
  margin-bottom:58px;
}

.industry-section .practice-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  border:0;
}

.industry-section .practice-card{
  position:relative;
  min-height:270px;
  padding:34px 38px 36px;

  border:0;
  border-left:4px solid rgba(23,61,73,.28);

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.96) 0%,
      rgba(241,246,246,.92) 100%
    );

  box-shadow:0 8px 30px rgba(11,32,41,.04);

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.industry-section .practice-card:hover{
  transform:translateY(-3px);
  border-left-color:#173d49;
  box-shadow:0 15px 38px rgba(11,32,41,.075);
}

.industry-section .practice-card > span{
  display:block;
  margin-bottom:46px;

  color:#647b83;
  font-size:10px;
  font-weight:750;
  letter-spacing:.15em;
}

.industry-section .practice-card h3{
  margin:0 0 15px;

  font-size:27px;
  line-height:1.28;
  font-weight:620;
  letter-spacing:-.035em;
}

.industry-section .practice-card p{
  max-width:520px;
  margin:0;

  color:#65767c;
  font-size:14px;
  line-height:1.82;
  word-break:keep-all;
}

.industry-section .sector-tags{
  display:flex;
  flex-wrap:wrap;
  gap:0 16px;

  margin-top:25px;
  padding-top:17px;

  border-top:1px solid rgba(16,44,54,.09);
}

.industry-section .sector-tags span{
  position:relative;
  padding:3px 0;

  border:0;
  border-radius:0;

  color:#536a72;
  font-size:10px;
  line-height:1.45;
}

.industry-section .sector-tags span + span::before{
  content:"·";
  position:absolute;
  left:-10px;
  color:#9babad;
}

.industry-section .practice-card > a{
  right:31px;
  bottom:27px;
  color:#173d49;
  font-size:20px;
}

.industry-section .practice-card:last-child:nth-child(odd){
  grid-column:1 / -1;
  min-height:235px;
  padding-right:120px;

  background:
    linear-gradient(
      105deg,
      rgba(236,244,244,.98) 0%,
      rgba(248,250,249,.97) 70%
    );
}

.industry-section .practice-card::before{
  content:"";
  position:absolute;
  right:30px;
  top:26px;

  width:55px;
  height:55px;

  border-top:1px solid rgba(32,81,95,.10);
  border-right:1px solid rgba(32,81,95,.10);

  pointer-events:none;
}

@media(max-width:800px){
  .industry-section .practice-grid{
    grid-template-columns:1fr;
  }

  .industry-section .practice-card,
  .industry-section .practice-card:last-child:nth-child(odd){
    grid-column:auto;
    min-height:0;
    padding:30px 30px 34px;
  }

  .industry-section .practice-card > span{
    margin-bottom:30px;
  }
}


/* ==========================================================
   METAIP v028
   Expanded click areas
   No visual redesign
   ========================================================== */

.metaip-wide-hitarea{
  cursor:pointer;
}

/*
 * 내부의 실제 링크는 기존 모양 그대로 유지.
 * 카드 전체 클릭 기능은 JS가 담당하므로
 * pseudo-element overlay를 사용하지 않는다.
 *
 * 따라서:
 * - 텍스트 선택 가능
 * - 다른 interactive control을 가리지 않음
 * - hover 디자인 변경 없음
 */

/* ==========================================================
   METAIP v030
   Practice / IP BASICS
   ========================================================== */

.practice-ip-basics{
  position:relative;

  margin-top:12px;
  padding-top:72px;
  padding-bottom:76px;

  border-top:1px solid rgba(16,44,54,.14);
  border-bottom:1px solid rgba(16,44,54,.14);
}

.practice-ip-basics > .eyebrow{
  padding-top:7px;
}

.practice-ip-basics > div{
  max-width:720px;
}

.practice-ip-basics h2{
  margin-top:0;
  margin-bottom:22px;

  font-size:38px;
  line-height:1.25;
  letter-spacing:-.035em;
}

.practice-ip-basics > div > p{
  max-width:650px;
  margin-bottom:28px;

  color:#62737a;
  line-height:1.9;
  word-break:keep-all;
}

/*
 * 실제 버튼의 외형은 그대로 둔다.
 * 전체 영역 클릭 기능은 기존 wide-hitarea JS가 담당한다.
 */
.practice-ip-basics.metaip-wide-hitarea{
  cursor:pointer;
}

@media(max-width:720px){
  .practice-ip-basics{
    padding-top:52px;
    padding-bottom:56px;
  }

  .practice-ip-basics h2{
    font-size:30px;
  }
}


/* ==========================================================
   METAIP v031
   Industries / directory only
   ========================================================== */

.industry-directory{
  padding-top:86px;
  padding-bottom:124px;
}

/*
 * 산업 전체 목록:
 * 별도의 카드 덩어리를 띄우기보다
 * 정돈된 2열 directory로 보이게 한다.
 */
.industry-directory .practice-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;

  border-top:1px solid rgba(16,44,54,.18);
  border-left:1px solid rgba(16,44,54,.10);
}


/* ----------------------------------------------------------
   individual sector
   ---------------------------------------------------------- */

.industry-directory .industry-directory-card{
  position:relative;

  min-height:305px;
  padding:37px 42px 39px;

  border:0;
  border-right:1px solid rgba(16,44,54,.10);
  border-bottom:1px solid rgba(16,44,54,.14);

  background:#fff;
  box-shadow:none;

  overflow:hidden;

  transition:
    background .20s ease,
    border-color .20s ease;
}


/*
 * 상단 code
 */
.industry-directory .industry-directory-card > span{
  display:block;

  margin:0 0 48px;

  color:#71868d;
  font-size:10px;
  line-height:1;
  font-weight:760;
  letter-spacing:.16em;
}


/*
 * 산업명
 */
.industry-directory .industry-directory-card h2{
  max-width:430px;
  margin:0 0 17px;

  color:#102c36;
  font-size:29px;
  line-height:1.28;
  font-weight:620;
  letter-spacing:-.037em;
  word-break:keep-all;
}


/*
 * 설명
 */
.industry-directory .industry-directory-card > p{
  max-width:510px;
  margin:0;

  color:#66777d;
  font-size:14px;
  line-height:1.86;
  word-break:keep-all;
}


/*
 * 키워드:
 * pill 형태보다 taxonomy 표기처럼 보이게 정돈
 */
.industry-directory .sector-tags{
  display:flex;
  flex-wrap:wrap;
  gap:0 17px;

  margin-top:27px;
  padding-top:17px;

  border-top:1px solid rgba(16,44,54,.085);
}

.industry-directory .sector-tags span{
  position:relative;

  padding:2px 0;

  border:0;
  border-radius:0;

  color:#526970;
  background:none;

  font-size:10px;
  line-height:1.5;
}

.industry-directory .sector-tags span + span::before{
  content:"·";

  position:absolute;
  left:-10px;

  color:#a1afb2;
}


/*
 * 기존 작은 화살표는 시각적 방향표시 역할만 한다.
 * 실제 클릭 범위는 v030 wide-hitarea 로직이 카드 전체에 적용된다.
 */
.industry-directory .industry-directory-card > a{
  position:absolute;
  right:34px;
  top:31px;

  width:auto;
  height:auto;

  color:#49636c;
  font-size:19px;
  line-height:1;

  opacity:.68;

  transition:
    opacity .18s ease,
    transform .18s ease;
}


/*
 * MetaIP식 짧은 세로 accent.
 * 카드 모양 자체를 바꾸지 않고 hover 위치를 알려준다.
 */
.industry-directory .industry-directory-card::before{
  content:"";

  position:absolute;
  left:0;
  top:0;

  width:3px;
  height:0;

  background:#173d49;

  transition:height .22s ease;
}


/* ----------------------------------------------------------
   hover
   ---------------------------------------------------------- */

.industry-directory .industry-directory-card:hover{
  transform:none;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f5f8f8 100%
    );

  border-color:rgba(16,44,54,.17);
  box-shadow:none;
}

.industry-directory .industry-directory-card:hover::before{
  height:100%;
}

.industry-directory .industry-directory-card:hover > a{
  opacity:1;
  transform:translate(2px,-2px);
}


/*
 * 홀수 개일 경우 마지막 산업은 전체 폭 사용.
 * 데이터 개수가 바뀌어도 자연스럽게 끝난다.
 */
.industry-directory .industry-directory-card:last-child:nth-child(odd){
  grid-column:1 / -1;

  min-height:255px;
  padding-right:150px;
}


/* ----------------------------------------------------------
   responsive
   ---------------------------------------------------------- */

@media(max-width:850px){

  .industry-directory{
    padding-top:68px;
    padding-bottom:95px;
  }

  .industry-directory .practice-grid{
    grid-template-columns:1fr;
  }

  .industry-directory .industry-directory-card,
  .industry-directory .industry-directory-card:last-child:nth-child(odd){
    grid-column:auto;

    min-height:0;
    padding:32px 31px 35px;
  }

  .industry-directory .industry-directory-card > span{
    margin-bottom:32px;
  }

  .industry-directory .industry-directory-card h2{
    font-size:26px;
  }

  .industry-directory .industry-directory-card > a{
    right:28px;
    top:28px;
  }
}

@media(max-width:520px){

  .industry-directory .industry-directory-card,
  .industry-directory .industry-directory-card:last-child:nth-child(odd){
    padding:29px 25px 32px;
  }

  .industry-directory .industry-directory-card h2{
    font-size:24px;
  }

}


/* ==========================================================
   METAIP v033
   Home hero / visual asset #27
   ========================================================== */

.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

/*
 * 사진은 별도 객체로 배치하지 않고
 * hero 전체 배경으로 사용.
 *
 * 강한 네이비 overlay를 사용해
 * 사진은 분위기만 남고 텍스트가 주인공이 되도록 한다.
 */
.hero::before{
  content:"";
  position:absolute;
  inset:0;

  background-image:
    linear-gradient(
      90deg,
      rgba(7,29,38,.91) 0%,
      rgba(8,32,42,.86) 48%,
      rgba(8,32,42,.77) 100%
    ),
    url("/assets/metaip-visual/home-hero.jpeg");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  z-index:0;
  pointer-events:none;
}

/*
 * 기존 META IP glow는 배경사진과 경쟁하지 않게 약화.
 */
.hero .hero-glow{
  opacity:.18;
  z-index:1;
}

/*
 * 기존 오른쪽 인물사진 영역 제거.
 * DOM을 없애지 않아도 layout에 참여하지 않는다.
 */
.hero .hero-visual{
  display:none !important;
}

/*
 * hero는 이제 별도 오른쪽 column이 필요하지 않음.
 */
.hero .hero-grid{
  position:relative;
  z-index:2;

  grid-template-columns:1fr !important;
}

/*
 * 텍스트 폭은 지나치게 넓어지지 않도록 유지.
 */
.hero .hero-copy{
  position:relative;
  z-index:3;

  width:min(760px,100%);
  max-width:760px;
}

/*
 * 이전 인물사진용 요소가 혹시 남아 있어도
 * 완전히 보이지 않게 한다.
 */
.hero .metaip-hero-photo{
  display:none !important;
}

/*
 * 중간 화면에서도 배경사진 방식만 사용.
 * 별도 반응형 위치 계산 없음.
 */
@media(max-width:1100px){
  .hero::before{
    background-position:center center;
  }
}

@media(max-width:640px){
  .hero::before{
    background-image:
      linear-gradient(
        rgba(7,29,38,.89),
        rgba(7,29,38,.89)
      ),
      url("/assets/metaip-visual/home-hero.jpeg");

    background-position:center center;
  }
}


/* ==========================================================
   METAIP v034
   Home hero / very light photographic background
   ========================================================== */

.hero{
  background:#f7f9f8;
}

/*
 * 사진 자체를 원본보다 밝고 부드럽게 보정.
 * 어두운 네이비 overlay는 완전히 제거.
 */
.hero::before{
  content:"";
  position:absolute;
  inset:0;

  background:
    url("/assets/metaip-visual/home-hero.jpeg")
    center center / cover no-repeat;

  filter:
    brightness(1.30)
    contrast(.78)
    saturate(.55);

  transform:scale(1.01);

  opacity:1;
  z-index:0;
  pointer-events:none;
}

/*
 * 흰색 veil.
 * 사진은 확실히 인식되지만 전체 화면은
 * 거의 흰색에 가까운 인상을 갖도록 한다.
 */
.hero::after{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.88) 0%,
      rgba(255,255,255,.80) 48%,
      rgba(255,255,255,.72) 100%
    );

  z-index:1;
  pointer-events:none;
}

/* 기존 glow는 필요 없음 */
.hero .hero-glow{
  opacity:0 !important;
}

/* content는 배경 위 */
.hero .hero-grid{
  position:relative;
  z-index:3;
}


/* ----------------------------------------------------------
   Light hero typography
   ---------------------------------------------------------- */

.hero .hero-copy,
.hero .hero-copy h1{
  color:#102c36;
}

.hero .hero-copy h1 em{
  color:#315e69;
}

.hero .hero-copy .eyebrow{
  color:#486a72;
}

.hero .hero-copy .hero-lead{
  color:rgba(16,44,54,.73);
}


/* ----------------------------------------------------------
   Buttons
   ---------------------------------------------------------- */

.hero .hero-actions .button.primary{
  background:#102c36;
  border-color:#102c36;
  color:#fff;
}

.hero .hero-actions .button.primary:hover{
  background:#173d49;
  border-color:#173d49;
  color:#fff;
}

.hero .hero-actions .button.ghost{
  background:rgba(255,255,255,.42);
  border-color:rgba(16,44,54,.32);
  color:#102c36;
}

.hero .hero-actions .button.ghost:hover{
  background:rgba(255,255,255,.75);
  border-color:rgba(16,44,54,.55);
}


/* 모바일에서도 같은 밝은 방향 유지 */
@media(max-width:640px){
  .hero::before{
    background-position:center center;

    filter:
      brightness(1.34)
      contrast(.76)
      saturate(.50);
  }

  .hero::after{
    background:rgba(255,255,255,.82);
  }
}


/* ==========================================================
   METAIP v035
   Home hero:
   original photograph + uniform translucent white veil
   ========================================================== */

.hero{
  background:#fff;
}

/*
 * 원본 사진을 그대로 사용한다.
 * brightness / contrast / saturation 등 어떠한 보정도 하지 않는다.
 */
.hero::before{
  content:"";
  position:absolute;
  inset:0;

  background:
    url("/assets/metaip-visual/home-hero.jpeg")
    center center / cover no-repeat;

  filter:none !important;
  opacity:1 !important;
  transform:none !important;

  z-index:0;
  pointer-events:none;
}

/*
 * 균일한 반투명 흰색 막.
 * 방향성 있는 gradient나 색조 보정 없음.
 */
.hero::after{
  content:"";
  position:absolute;
  inset:0;

  background:rgba(255,255,255,.68) !important;

  z-index:1;
  pointer-events:none;
}

/* 기존 glow 제거 */
.hero .hero-glow{
  opacity:0 !important;
}

/* 텍스트는 흰 veil 위에 표시 */
.hero .hero-grid{
  position:relative;
  z-index:3;
}

.hero .hero-copy,
.hero .hero-copy h1{
  color:#102c36;
}

.hero .hero-copy h1 em{
  color:#315e69;
}

.hero .hero-copy .eyebrow{
  color:#486a72;
}

.hero .hero-copy .hero-lead{
  color:rgba(16,44,54,.73);
}

.hero .hero-actions .button.primary{
  background:#102c36;
  border-color:#102c36;
  color:#fff;
}

.hero .hero-actions .button.ghost{
  background:rgba(255,255,255,.40);
  border-color:rgba(16,44,54,.32);
  color:#102c36;
}

/*
 * 모바일도 동일한 처리.
 * 사진에 별도 보정을 하지 않는다.
 */
@media(max-width:640px){
  .hero::before{
    background-position:center center;
    filter:none !important;
    opacity:1 !important;
  }

  .hero::after{
    background:rgba(255,255,255,.72) !important;
  }
}


/* ==========================================================
   METAIP v036
   Home hero / white background + highly transparent photo
   ========================================================== */

.hero{
  background:#ffffff !important;
}

/*
 * 원본 사진은 색/명암/대비를 전혀 보정하지 않는다.
 * 대신 사진 자체를 아주 옅게 표시한다.
 *
 * 결과:
 *   86% white background
 *   14% original photograph
 */
.hero::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;

  background-image:url("/assets/metaip-visual/home-hero.jpeg") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;

  filter:none !important;
  transform:none !important;

  opacity:.14 !important;

  z-index:0 !important;
  pointer-events:none !important;
}

/*
 * 이전 버전의 white veil / gradient를 완전히 제거.
 * 이제 흰색은 hero 자체의 실제 배경색이다.
 */
.hero::after{
  content:none !important;
  display:none !important;
  background:none !important;
}

/* META IP glow도 제거 */
.hero .hero-glow{
  display:none !important;
  opacity:0 !important;
}

/* 콘텐츠는 그대로 전면에 둔다 */
.hero .hero-grid{
  position:relative;
  z-index:2;
}

.hero .hero-copy{
  position:relative;
  z-index:3;
}

/* 밝은 배경에 맞는 기존 dark typography 유지 */
.hero .hero-copy,
.hero .hero-copy h1{
  color:#102c36;
}

.hero .hero-copy h1 em{
  color:#315e69;
}

.hero .hero-copy .eyebrow{
  color:#486a72;
}

.hero .hero-copy .hero-lead{
  color:rgba(16,44,54,.73);
}

/*
 * 모바일은 사진을 더 약하게.
 * 작은 화면에서는 배경 이미지의 존재감보다 가독성 우선.
 */
@media(max-width:640px){
  .hero::before{
    opacity:.10 !important;
    background-position:center center !important;
  }
}


/* ==========================================================
   METAIP v037
   About hero / visual asset #32
   ========================================================== */

.about-page-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#fff;
}

/*
 * 원본 사진 그대로.
 * 색상 / 명도 / 대비 보정 없음.
 */
.about-page-hero::before{
  content:"";
  position:absolute;
  inset:0;

  background-image:url("/assets/metaip-visual/about-hero.jpeg");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  opacity:.24;

  z-index:0;
  pointer-events:none;
}

/*
 * 왼쪽 텍스트 영역은 조금 더 깨끗하게 유지.
 * 사진 자체를 보정하는 것이 아니라 흰 배경과 자연스럽게 섞는다.
 */
.about-page-hero::after{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.78) 0%,
      rgba(255,255,255,.48) 48%,
      rgba(255,255,255,.12) 100%
    );

  z-index:1;
  pointer-events:none;
}

.about-page-hero > *{
  position:relative;
  z-index:2;
}

@media(max-width:720px){
  .about-page-hero::before{
    opacity:.17;
    background-position:center center;
  }

  .about-page-hero::after{
    background:rgba(255,255,255,.55);
  }
}


/* ==========================================================
   METAIP v038
   About hero visual: full-bleed background
   Content remains aligned to .wrap
   ========================================================== */

.about-page-hero{
  overflow:visible !important;
}

/*
 * 배경사진만 viewport 전체 폭으로 확장.
 * 텍스트/콘텐츠의 wrap 정렬은 그대로 유지한다.
 */
.about-page-hero::before{
  left:50% !important;
  right:auto !important;

  width:100vw !important;
  height:100% !important;

  transform:translateX(-50%) !important;

  background-size:cover !important;
  background-position:center center !important;
}

/*
 * 기존 흰색 veil도 사진과 동일한 전체 폭으로 확장.
 */
.about-page-hero::after{
  left:50% !important;
  right:auto !important;

  width:100vw !important;
  height:100% !important;

  transform:translateX(-50%) !important;
}


/* ==========================================================
   METAIP v039
   Practice hero / visual asset #35
   ========================================================== */

.practice-visual-hero{
  position:relative;
  isolation:isolate;

  /*
   * background image만 viewport 전체 폭으로 확장하므로
   * 기존 wrap의 텍스트 정렬은 그대로 유지
   */
  overflow:visible !important;
  background:#fff;
}


/* ----------------------------------------------------------
   Full-bleed photograph
   ---------------------------------------------------------- */

.practice-visual-hero::before{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;

  width:100vw;

  transform:translateX(-50%);

  background-image:
    url("/assets/metaip-visual/practice-hero.jpeg");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  /*
   * 원본 사진의 색상·명암·대비는 그대로.
   * 흰 배경 위에서 사진 자체만 옅게 보이게 한다.
   */
  opacity:.24;

  filter:none !important;

  z-index:0;
  pointer-events:none;
}


/*
 * 텍스트 쪽만 약간 더 깨끗하게 읽히도록 한다.
 * 사진 자체에는 어떠한 보정도 하지 않는다.
 */
.practice-visual-hero::after{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;

  width:100vw;

  transform:translateX(-50%);

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.76) 0%,
      rgba(255,255,255,.48) 48%,
      rgba(255,255,255,.10) 100%
    );

  z-index:1;
  pointer-events:none;
}


/* ----------------------------------------------------------
   Content
   ---------------------------------------------------------- */

.practice-visual-hero .practice-visual-copy{
  position:relative;
  z-index:2;

  max-width:780px;
}


/*
 * 기존 업무분야 상단 3-image collage 제거.
 * 새 #35 사진이 전체 hero visual 역할을 대신한다.
 */
.practice-visual-hero .practice-legacy-collage{
  display:none !important;
}


/*
 * 기존 2-column hero 구조가 남아 있어도
 * copy가 정상적인 full-width 흐름을 사용하게 한다.
 */
.practice-visual-hero{
  grid-template-columns:1fr !important;
}


/* ----------------------------------------------------------
   Responsive
   ---------------------------------------------------------- */

@media(max-width:720px){

  .practice-visual-hero::before{
    opacity:.17;
    background-position:center center;
  }

  .practice-visual-hero::after{
    background:rgba(255,255,255,.58);
  }

}


/* ==========================================================
   METAIP v040
   Contact hero / visual asset #33
   ========================================================== */

.contact-page-hero{
  position:relative;
  isolation:isolate;
  overflow:visible !important;
  background:#fff;
}

/*
 * 사진만 viewport 전체 폭으로 확장.
 * 텍스트의 wrap 위치는 그대로 유지.
 */
.contact-page-hero::before{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;

  width:100vw;

  transform:translateX(-50%);

  background-image:
    url("/assets/metaip-visual/contact-hero.jpeg");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  /* 원본 사진 자체에는 필터를 적용하지 않음 */
  opacity:.24;
  filter:none !important;

  z-index:0;
  pointer-events:none;
}

/*
 * 텍스트 가독성을 위한 흰색 veil.
 * 사진 자체의 색조를 변경하는 필터는 사용하지 않는다.
 */
.contact-page-hero::after{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;

  width:100vw;

  transform:translateX(-50%);

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.78) 0%,
      rgba(255,255,255,.49) 48%,
      rgba(255,255,255,.11) 100%
    );

  z-index:1;
  pointer-events:none;
}

.contact-page-hero > *{
  position:relative;
  z-index:2;
}

@media(max-width:720px){

  .contact-page-hero::before{
    opacity:.17;
    background-position:center center;
  }

  .contact-page-hero::after{
    background:rgba(255,255,255,.57);
  }

}


/* ==========================================================
   METAIP v041
   People hero / visual asset #18
   ========================================================== */

.people-page-hero{
  position:relative;
  isolation:isolate;
  overflow:visible !important;
  background:#fff;
}

/* 사진만 viewport 전체 폭으로 확장 */
.people-page-hero::before{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;

  width:100vw;

  transform:translateX(-50%);

  background-image:
    url("/assets/metaip-visual/people-hero.jpeg");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  opacity:.24;
  filter:none !important;

  z-index:0;
  pointer-events:none;
}

/* 텍스트 가독성 확보 */
.people-page-hero::after{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;

  width:100vw;

  transform:translateX(-50%);

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.78) 0%,
      rgba(255,255,255,.48) 48%,
      rgba(255,255,255,.10) 100%
    );

  z-index:1;
  pointer-events:none;
}

.people-page-hero > *{
  position:relative;
  z-index:2;
}

@media(max-width:720px){
  .people-page-hero::before{
    opacity:.17;
    background-position:center center;
  }

  .people-page-hero::after{
    background:rgba(255,255,255,.57);
  }
}


/* ==========================================================
   METAIP v042
   Meta News / visual asset #29
   ========================================================== */

.meta-news-page-hero{
  position:relative;
  isolation:isolate;
  overflow:visible !important;
  background:#fff;
}

/* 사진만 viewport 전체 폭 */
.meta-news-page-hero::before{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;
  width:100vw;

  transform:translateX(-50%);

  background-image:
    url("/assets/metaip-visual/meta-news-hero.jpeg");

  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;

  opacity:.24;
  filter:none !important;

  z-index:0;
  pointer-events:none;
}

/* 기존 페이지들과 동일한 가독성 처리 */
.meta-news-page-hero::after{
  content:"";
  position:absolute;

  top:0;
  bottom:0;
  left:50%;
  width:100vw;

  transform:translateX(-50%);

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.78) 0%,
      rgba(255,255,255,.48) 48%,
      rgba(255,255,255,.10) 100%
    );

  z-index:1;
  pointer-events:none;
}

.meta-news-page-hero > *{
  position:relative;
  z-index:2;
}

@media(max-width:720px){
  .meta-news-page-hero::before{
    opacity:.17;
    background-position:center center;
  }

  .meta-news-page-hero::after{
    background:rgba(255,255,255,.57);
  }
}

/* ==========================================================
   METAIP-V051-HOME-NATIVE-CARD-LINKS

   Homepage only:
   the card itself is the native navigation anchor.
   No pseudo-element overlay and no JavaScript navigation.
   ========================================================== */

.home-card-link{
  display:block;
}

/*
 * Preserve the exact visual location formerly occupied by
 * .practice-card > a, without making the arrow a second link.
 */
.home-card-link > .home-card-arrow{
  position:absolute;
  right:28px;
  bottom:25px;

  color:var(--lake-600);
  font-size:22px;
  font-weight:400;

  pointer-events:none;
}

/*
 * Preserve the existing industry-section arrow override.
 */
.industry-section .home-card-link > .home-card-arrow{
  right:31px;
  bottom:27px;

  color:#173d49;
  font-size:20px;
}

/*
 * Keyboard focus applies to the same whole-card target.
 */
.home-card-link:focus-visible{
  outline:2px solid var(--lake-600);
  outline-offset:3px;
}

