:root{--ink:#211d1b;--paper:#f8f7f4;--deep:#efede8;--line:#aaa49d;--pad:clamp(22px,6.5vw,112px)}
*{box-sizing:border-box}
html{background:var(--paper)}
body{margin:0;color:var(--ink);background:var(--paper);font-family:"Helvetica Neue","Yu Gothic","Hiragino Kaku Gothic ProN",Arial,sans-serif}
main{overflow:hidden}
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr);align-items:center;gap:clamp(40px,7vw,120px);min-height:100svh;padding:clamp(85px,10vw,150px) var(--pad)}
.hero::before{content:"";position:absolute;top:clamp(35px,4vw,60px);left:var(--pad);width:clamp(75px,10vw,175px);height:1px;background:var(--ink)}
.hero-copy{text-align:left}
.hero h1{margin:0;font-family:"Yu Mincho","Hiragino Mincho ProN","Times New Roman",serif;font-size:clamp(3rem,6.8vw,7.8rem);font-weight:500;line-height:1.25;letter-spacing:-.07em;white-space:nowrap}
.hero-copy p{margin:clamp(30px,4vw,55px) 0 0;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(1.15rem,2.1vw,2rem);font-weight:500;letter-spacing:.08em}
.portrait-space{width:100%;min-height:clamp(430px,55vw,760px)}
.results{padding:clamp(100px,12vw,180px) 0;background:var(--deep)}
.results h2{display:flex;align-items:center;justify-content:center;gap:clamp(10px,2vw,26px);margin:0;padding:0 var(--pad);font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(1.9rem,3.8vw,4rem);font-weight:600;letter-spacing:.12em;text-align:center}
.results h2 span{font-family:"Helvetica Neue",Arial,sans-serif;font-size:.7em;font-weight:300}
.phones{margin-top:clamp(70px,9vw,130px);overflow:hidden}
.phones-track{display:flex;width:max-content;animation:phone-flow 38s linear infinite;will-change:transform}
.phones-group{display:flex;flex-shrink:0;gap:clamp(18px,2vw,34px);padding-right:clamp(18px,2vw,34px)}
.phone{position:relative;flex:0 0 clamp(230px,23vw,365px);aspect-ratio:9/18;padding:clamp(8px,1vw,13px);overflow:hidden;border:2px solid #393532;border-radius:clamp(28px,2.8vw,46px);background:#262321;box-shadow:0 18px 45px #332d2528}
.phone::before{content:"";position:absolute;z-index:2;top:clamp(14px,1.5vw,22px);left:50%;width:32%;height:clamp(17px,1.8vw,27px);border-radius:999px;background:#262321;transform:translateX(-50%)}
.phone::after{content:"";display:block;width:100%;height:100%;border-radius:clamp(21px,2.1vw,35px);background:linear-gradient(145deg,#faf9f6 0%,#e7e3dc 58%,#d7d1c8 100%);box-shadow:inset 0 0 0 1px #ffffff90}
.phone:nth-child(even){margin-top:clamp(35px,5vw,75px)}
@keyframes phone-flow{to{transform:translateX(-50%)}}
.strength{display:flex;min-height:100svh;flex-direction:column;align-items:center;justify-content:center;padding:clamp(110px,14vw,210px) var(--pad);text-align:center;background:var(--paper)}
.strength h2{margin:0;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(1.25rem,2vw,1.8rem);font-weight:500;letter-spacing:.14em}
.strength-copy{margin:clamp(55px,7vw,95px) 0 0;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(2rem,4.6vw,5.15rem);font-weight:500;line-height:1.65;letter-spacing:-.04em}
.strength-copy strong{font-weight:600}
.social-logos{display:flex;align-items:center;justify-content:center;gap:clamp(28px,5vw,70px);margin-top:clamp(65px,8vw,110px)}
.social-logo{display:grid;place-items:center;width:clamp(72px,8vw,108px);aspect-ratio:1;border:1px solid var(--line);border-radius:50%;background:var(--paper);transition:transform .3s ease,background .3s ease}
.social-logo img{display:block;width:43%;height:43%;object-fit:contain}
.social-logo:hover{background:var(--deep);transform:translateY(-5px)}
.capabilities{padding:clamp(110px,14vw,210px) var(--pad);background:var(--deep)}
.capabilities>h2{margin:0;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(1.25rem,2vw,1.8rem);font-weight:500;letter-spacing:.14em;text-align:center}
.capabilities-lead{margin:clamp(45px,6vw,80px) 0 clamp(75px,10vw,145px);font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(2.3rem,5.5vw,6.2rem);font-weight:600;letter-spacing:-.05em;text-align:center}
.capability-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.capability-item{display:flex;min-height:clamp(210px,22vw,340px);flex-direction:column;align-items:center;justify-content:center;gap:clamp(25px,3vw,42px);padding:30px 18px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center}
.capability-item span{display:grid;place-items:center;width:clamp(68px,7vw,100px);aspect-ratio:1;font-size:clamp(2.7rem,5vw,4.5rem);line-height:1;filter:grayscale(1);transition:transform .3s ease,filter .3s ease}
.capability-item p{margin:0;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(1.1rem,1.8vw,1.55rem);font-weight:600;letter-spacing:.08em}
.capability-item:hover span{filter:grayscale(.35);transform:translateY(-5px)}
.closing{position:relative;display:flex;min-height:100svh;flex-direction:column;align-items:center;justify-content:center;padding:clamp(120px,15vw,230px) var(--pad);text-align:center;background:var(--paper)}
.closing::before,.closing::after{content:"";position:absolute;left:50%;width:1px;height:clamp(55px,8vw,120px);background:var(--line)}
.closing::before{top:0}.closing::after{bottom:0}
.closing-quote{margin:0;font-family:"Yu Mincho","Hiragino Mincho ProN","Times New Roman",serif;font-size:clamp(2.25rem,5.5vw,6.3rem);font-weight:500;line-height:1.5;letter-spacing:-.055em}
.closing-message{margin:clamp(55px,8vw,110px) 0 0;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:clamp(1.1rem,1.9vw,1.65rem);font-weight:500;line-height:2.2;letter-spacing:.12em}
.interview-button{display:flex;align-items:center;justify-content:space-between;gap:60px;min-width:min(100%,330px);margin-top:clamp(55px,7vw,90px);padding:20px 25px;border:1px solid var(--ink);border-radius:0;color:var(--ink);background:transparent;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;font-size:1.05rem;letter-spacing:.12em;cursor:default;transition:color .3s ease,background .3s ease}
.interview-button span{font-family:Arial,sans-serif;font-size:1.3rem;transition:transform .3s ease}
.interview-button:hover{color:var(--paper);background:var(--ink)}
.interview-button:hover span{transform:translateX(5px)}
@media(max-width:760px){.hero{grid-template-columns:1fr;align-content:center;gap:50px;padding-top:110px}.hero h1{font-size:clamp(2.75rem,12vw,4.5rem);white-space:normal}.portrait-space{min-height:58svh}.results h2{letter-spacing:.08em}}
@media(max-width:760px){.capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.capability-item{min-height:210px}}
@media(max-width:480px){:root{--pad:20px}.hero-copy p{font-size:1.05rem}.portrait-space{min-height:52svh}.phones-group{gap:16px;padding-right:16px}.phone{flex-basis:220px}.strength-copy{font-size:clamp(1.65rem,8vw,2.25rem)}.social-logos{gap:20px}.social-logo{width:72px}.capabilities-lead{font-size:2.35rem}.capability-item{min-height:180px;padding-inline:10px}.capability-item p{font-size:1rem}}
@media(prefers-reduced-motion:reduce){.phones{overflow-x:auto}.phones-track{animation:none;padding-right:var(--pad)}}