:root{
  --ink:#24243d;
  --blue:#3154a0;
  --blue-dark:#263f83;
  --dark:#171b23;
  --paper:#f8f8f6;
  --mist:#e8e9e8;
  --line:#d8dadc;
  --body:#5a606b;
  --sans:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;
  --serif:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{max-width:100%;display:block}
::selection{background:#9fb6e4;color:#17274c}
:focus-visible{outline:2px solid var(--blue);outline-offset:5px}
.skip-link{position:absolute;top:-100px;left:12px;z-index:1000;padding:12px 18px;background:#fff;color:var(--ink)}
.skip-link:focus{top:12px}
.site-header{position:relative;z-index:50;background:#fff;box-shadow:0 1px 0 rgba(23,27,35,.08)}
.header-inner{width:min(100% - 76px,1440px);min-height:82px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:inline-flex;align-items:center;gap:12px;flex:none}
.brand img{width:48px;height:48px;object-fit:contain}
.desktop-nav{display:flex;align-items:center;gap:clamp(18px,2.5vw,40px);font-size:12px;font-weight:700;letter-spacing:.08em}
.desktop-nav>a:not(.nav-contact){padding:14px 0;transition:color .25s}
.desktop-nav>a:hover{color:var(--blue)}
.nav-contact{display:flex;align-items:center;gap:26px;min-height:44px;padding:0 19px;color:#fff;background:var(--blue);transition:background .25s}
.nav-contact:hover{background:var(--blue-dark)}
.nav-contact span{font-size:17px;font-weight:400}
.menu-toggle,.mobile-nav{display:none}
.hero{position:relative;min-height:min(740px,calc(100svh - 82px));min-height:max(610px,calc(100svh - 82px));overflow:hidden;background:var(--dark);color:#fff;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,#171b23 0%,rgba(23,27,35,.97) 27%,rgba(23,27,35,.65) 52%,rgba(23,27,35,.07) 88%),linear-gradient(0deg,rgba(10,14,24,.48),transparent 35%)}
.hero-grid{position:absolute;inset:0;z-index:3;opacity:.15;background-image:linear-gradient(90deg,transparent calc(25% - 1px),rgba(255,255,255,.18) 25%,transparent calc(25% + 1px),transparent calc(50% - 1px),rgba(255,255,255,.18) 50%,transparent calc(50% + 1px),transparent calc(75% - 1px),rgba(255,255,255,.18) 75%,transparent calc(75% + 1px))}
.hero-media{position:absolute;z-index:1;top:8%;right:5.5%;width:54%;height:78%;overflow:hidden;background:linear-gradient(135deg,#57595d,#20242c);filter:grayscale(1)}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,22,28,.14),transparent 45%),rgba(15,17,24,.1)}
.hero-poster,.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% center}
.hero-poster{transform:scale(1.015)}
.hero-video{opacity:0;transition:opacity 1s}
.hero-video.is-ready{opacity:1}
.media-edge{position:absolute;z-index:2;left:0;bottom:0;width:66px;height:3px;background:#fff}
.hero-paint{position:absolute;z-index:4;right:-3%;top:68%;width:58%;height:19px;background:var(--blue);opacity:.95;transform:rotate(-8deg);transform-origin:right center;clip-path:polygon(0 52%,7% 32%,18% 46%,30% 23%,47% 43%,63% 12%,80% 33%,100% 2%,98% 100%,80% 74%,64% 92%,48% 71%,28% 93%,11% 72%,0 86%)}
.hero-paint::after{content:"";position:absolute;inset:6px 0 4px;background:repeating-linear-gradient(90deg,transparent 0 8px,rgba(255,255,255,.17) 8px 10px)}
.hero-inner{position:relative;z-index:5;width:min(100% - 140px,1340px);min-height:inherit;margin:auto;display:flex;align-items:center}
.hero-content{position:relative;padding:34px 0 94px;max-width:850px}
.eyebrow{display:flex;align-items:center;gap:13px;margin:0;color:var(--blue);font-family:Arial,var(--sans);font-size:11px;font-weight:700;letter-spacing:.24em}
.eyebrow-light{color:#d7e2fb}
.eyebrow-line{display:block;width:25px;height:1px;background:var(--blue)}
.hero h1{margin:38px 0 25px;font-family:var(--serif);font-weight:600;letter-spacing:.06em;line-height:1.32;font-size:clamp(52px,6vw,92px);text-shadow:0 8px 34px rgba(0,0,0,.25)}
.hero h1 em{font-style:normal;white-space:nowrap}
.hero-lead{font-size:clamp(14px,1.2vw,17px);font-weight:500;letter-spacing:.14em;line-height:2.1;color:#e7e9ef}
.text-link{display:inline-flex;align-items:center;justify-content:space-between;gap:38px;min-width:218px;padding:0 0 12px;border-bottom:1px solid currentColor;font-size:13px;font-weight:700;letter-spacing:.12em;transition:gap .25s,color .25s}
.text-link:hover{gap:50px;color:#b8cdfa}
.text-link-light{margin-top:31px;color:#fff}
.link-arrow{font-size:18px;font-weight:400;line-height:1}
.hero-side-note{position:absolute;right:-2%;top:36%;margin:0;writing-mode:vertical-rl;font-family:Arial,sans-serif;font-size:10px;font-weight:700;letter-spacing:.25em;color:#e0e3e6}
.hero-side-note span{display:inline-block;margin:12px 0}
.hero-bottom{position:absolute;z-index:6;left:0;right:0;bottom:0;height:72px;border-top:1px solid rgba(255,255,255,.2);display:grid;grid-template-columns:1fr auto;align-items:center;gap:30px;padding:0 max(70px,calc((100vw - 1340px)/2))}
.hero-bottom__intro,.hero-scroll{font-family:Arial,sans-serif;font-size:10px;font-weight:700;letter-spacing:.19em;color:#bec4cf}
.hero-bottom__intro{display:flex;align-items:center;gap:13px;white-space:nowrap}
.fine-line{width:20px;height:1px;background:var(--blue)}
.hero-scroll{justify-self:end;display:flex;align-items:center;gap:17px;transition:color .25s}
.hero-scroll:hover{color:#fff}
.hero-scroll span{font-size:18px;line-height:1}
.section-shell{padding-left:max(70px,calc((100vw - 1340px)/2));padding-right:max(70px,calc((100vw - 1340px)/2))}
.intro{position:relative;padding-top:116px;padding-bottom:109px;background:var(--paper);overflow:hidden}
.intro-layout{display:grid;grid-template-columns:1fr .78fr;gap:8%;margin-top:42px}
.intro h2,.section-heading h2,.contact h2{font-family:var(--serif);font-weight:600;letter-spacing:.06em}
.intro h2{margin:20px 0 0;font-size:clamp(44px,4.4vw,70px);line-height:1.48}
.intro-copy{padding-top:20px;max-width:530px}
.intro-copy__lead{margin:0 0 23px!important;color:var(--ink)!important;font-family:var(--serif);font-size:clamp(17px,1.5vw,21px)!important;font-weight:600;line-height:1.85!important}
.intro-copy p{margin:0;color:var(--body);font-size:14px;line-height:2.35;letter-spacing:.045em}
.intro-band{display:flex;align-items:center;gap:24px;margin-top:95px;color:#bcc1c9;font-family:Arial,sans-serif;font-size:clamp(40px,7.6vw,114px);font-weight:800;line-height:.8;letter-spacing:-.08em;white-space:nowrap}
.intro-band i{flex:1;height:1px;background:#c7cbd1}
.factories{padding-top:123px;padding-bottom:105px;background:#edeef0}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:36px;margin-bottom:58px}
.section-heading h2{margin:20px 0 0;font-size:clamp(40px,4vw,64px);line-height:1.45}
.section-heading>p{margin:0 0 8px;color:var(--body);font-size:14px;line-height:2;letter-spacing:.07em}
.factory{display:grid;grid-template-columns:55% 45%;min-height:440px;background:#fff;box-shadow:0 22px 65px rgba(37,43,55,.06)}
.factory+.factory{margin-top:34px}
.factory-visual{position:relative;min-height:430px;overflow:hidden;background:#777b80}
.visual-mirasaka{background-image:linear-gradient(90deg,rgba(17,22,29,.16),rgba(17,22,29,.08)),url("./assets/coating-reference.jpg");background-size:cover;background-position:center;filter:grayscale(1)}
.visual-koda{background:linear-gradient(150deg,rgba(45,47,52,.2),rgba(22,25,30,.56)),repeating-linear-gradient(90deg,#999da1 0 22px,#8f9397 22px 24px,#b1b4b7 24px 54px,#73777d 54px 56px);filter:grayscale(1)}
.visual-koda::before{content:"";position:absolute;left:-12%;right:-8%;top:43%;height:27%;transform:skewY(-12deg);background:linear-gradient(90deg,#555a60,#a9adb0 48%,#41464d);box-shadow:0 17px 30px rgba(25,27,31,.38),inset 0 3px 0 rgba(255,255,255,.35)}
.visual-koda::after{content:"";position:absolute;left:0;right:0;bottom:0;height:28%;background:linear-gradient(0deg,rgba(34,37,42,.75),transparent)}
.visual-corner{position:absolute;z-index:2;width:32px;height:32px;border-color:#fff;border-style:solid;opacity:.75}
.visual-corner--top{top:24px;left:24px;border-width:1px 0 0 1px}
.visual-corner--bottom{right:24px;bottom:24px;border-width:0 1px 1px 0}
.visual-scale{position:absolute;z-index:2;right:30px;bottom:32px;display:flex;align-items:end;gap:15px}
.visual-scale i{display:block;width:1px;height:16px;background:#fff;opacity:.75}
.visual-scale i:nth-child(3){height:28px}
.factory-content{display:flex;flex-direction:column;padding:38px clamp(36px,4vw,64px) 37px}
.factory-topline{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:17px;border-bottom:1px solid var(--line);color:var(--blue);font-family:Arial,var(--sans);font-size:10px;font-weight:700;letter-spacing:.17em}
.factory-topline span:last-child{font-family:var(--sans);font-size:11px;letter-spacing:.08em}
.factory h3{margin:26px 0 17px;font-family:var(--serif);font-size:clamp(26px,2.7vw,38px);font-weight:700;letter-spacing:.09em}
.factory-lead{margin:0 0 16px!important;color:var(--ink)!important;font-family:var(--serif);font-size:clamp(18px,1.65vw,23px)!important;font-weight:600;line-height:1.65!important}
.factory-content p{margin:0;color:var(--body);font-size:13px;line-height:2.15;letter-spacing:.04em}
.factory-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:25px}
.factory-tags span{padding:8px 10px;border:1px solid #d8dce3;color:#51596b;font-size:10px;font-weight:700;letter-spacing:.06em}
.factory-koda{grid-template-columns:45% 55%}
.factory-koda .factory-visual{order:2}
.factory-koda .factory-content{order:1}
.factory-note{margin:28px 0 0;color:#717986;font-size:11px;line-height:1.8}
.contact{position:relative;min-height:590px;padding-top:118px;padding-bottom:110px;overflow:hidden;background:#293e7a;color:#fff;isolation:isolate}
.contact::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(140deg,#334f99 0%,#263c79 64%,#222b54 100%)}
.contact::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.14;background:repeating-linear-gradient(103deg,transparent 0 85px,rgba(255,255,255,.21) 85px 86px)}
.contact-mark{position:absolute;right:4%;top:-23%;font-family:Georgia,serif;font-size:850px;font-weight:700;line-height:1;color:rgba(255,255,255,.035);transform:rotate(-10deg);pointer-events:none}
.contact-content{position:relative;z-index:2;max-width:950px}
.contact h2{margin:23px 0 26px;font-size:clamp(42px,4.8vw,72px);line-height:1.5}
.contact-content>p:not(.eyebrow){margin:0;color:#e6ecf7;font-size:15px;line-height:2}
.contact-details{display:flex;align-items:start;gap:55px;margin-top:61px;padding-top:22px;border-top:1px solid rgba(255,255,255,.42)}
.contact-details>span{min-width:190px;color:#d5def2;font-size:12px;font-weight:700;letter-spacing:.07em}
.contact-details ul{display:flex;flex-wrap:wrap;gap:10px 18px;padding:0;margin:0;list-style:none}
.contact-details li{font-size:12px;letter-spacing:.06em}
.contact-details li::before{content:"/";margin-right:10px;color:#a9bee8}
.contact-outline{position:absolute;right:-2%;bottom:-.19em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.16);font-family:Arial,sans-serif;font-size:clamp(120px,19vw,300px);font-weight:800;letter-spacing:-.08em;line-height:1;pointer-events:none}
.site-footer{padding:45px max(70px,calc((100vw - 1340px)/2)) 22px;background:#fff}
.footer-top,.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px}
.footer-top{padding-bottom:45px}
.back-top{display:flex;align-items:center;gap:24px;font-family:Arial,sans-serif;font-size:11px;font-weight:700;letter-spacing:.15em}
.back-top span{display:grid;place-items:center;width:36px;height:36px;border:1px solid #a6abb5;border-radius:50%;font-size:18px;font-weight:400;transition:background .25s,color .25s}
.back-top:hover span{background:var(--ink);color:#fff}
.footer-bottom{padding-top:17px;border-top:1px solid var(--line);color:#787f8d;font-size:11px}
.footer-bottom small{font-family:Arial,sans-serif;font-size:10px;letter-spacing:.12em}
@media(max-width:1050px){
  .header-inner{width:calc(100% - 48px)}
  .desktop-nav{gap:18px;font-size:11px}
  .hero-inner{width:calc(100% - 90px)}
  .hero-bottom{padding-left:45px;padding-right:45px}
  .section-shell,.site-footer{padding-left:45px;padding-right:45px}
  .factory-content{padding:32px}
}
@media(max-width:800px){
  html{scroll-padding-top:70px}
  .site-header{position:sticky;top:0}
  .header-inner{min-height:70px;width:calc(100% - 36px)}
  .brand img{width:42px;height:42px}
  .desktop-nav{display:none}
  .menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:7px;width:44px;height:44px;padding:10px;border:0;background:transparent;cursor:pointer}
  .menu-toggle span{display:block;width:100%;height:1px;background:var(--ink);transition:transform .25s}
  .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
  .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
  .mobile-nav:not([hidden]){display:flex;position:absolute;top:70px;left:0;right:0;flex-direction:column;padding:17px 24px 27px;background:#fff;box-shadow:0 18px 25px rgba(20,30,45,.12)}
  .mobile-nav a{padding:15px 0;border-bottom:1px solid #e6e8eb;font-size:14px;font-weight:700}
  .hero{min-height:720px}
  .hero-inner{width:calc(100% - 70px);align-items:flex-end}
  .hero-content{padding-bottom:150px}
  .hero-media{right:0;top:0;width:83%;height:72%}
  .hero::before{background:linear-gradient(0deg,#171b23 3%,rgba(23,27,35,.94) 24%,rgba(23,27,35,.45) 67%,rgba(23,27,35,.2)),linear-gradient(90deg,#171b23,transparent 55%)}
  .hero h1{font-size:clamp(52px,8vw,70px);margin-top:24px}
  .hero-paint{width:82%;top:58%;height:13px}
  .hero-side-note{right:1%;top:26%}
  .hero-bottom{padding:0 35px;height:62px}
  .hero-bottom__intro{display:flex;font-size:8px}
  .hero-scroll{grid-column:2}
  .intro-layout{grid-template-columns:1fr;gap:10px}
  .intro-copy{padding-top:8px}
  .intro-band{margin-top:72px}
  .factory,.factory-koda{grid-template-columns:1fr}
  .factory-visual{min-height:400px}
  .factory-koda .factory-visual,.factory-koda .factory-content{order:initial}
  .factory-content{min-height:365px;padding:34px 42px}
}
@media(max-width:560px){
  .hero{min-height:690px}
  .hero-inner{width:calc(100% - 42px)}
  .hero-content{padding-bottom:126px}
  .hero-media{width:100%;height:63%;top:0}
  .hero h1{font-size:clamp(43px,11vw,60px);margin:18px 0}
  .hero-lead{font-size:13px;line-height:1.9}
  .hero-side-note{display:none}
  .hero-bottom{padding:0 21px}
  .hero-scroll{font-size:9px}
  .section-shell,.site-footer{padding-left:22px;padding-right:22px}
  .intro{padding-top:78px;padding-bottom:75px}
  .intro-layout{margin-top:29px}
  .intro h2{font-size:clamp(38px,9vw,52px)}
  .intro-copy__lead{font-size:17px!important}
  .intro-copy p{font-size:13px}
  .intro-band{margin-top:62px;gap:13px;font-size:54px}
  .factories{padding-top:82px;padding-bottom:80px}
  .section-heading{display:block;margin-bottom:35px}
  .section-heading h2{font-size:clamp(36px,8.5vw,49px)}
  .section-heading>p{margin:21px 0 0;font-size:13px}
  .factory+.factory{margin-top:24px}
  .factory-visual{min-height:260px}
  .factory-content{min-height:0;padding:26px 24px 30px}
  .factory h3{font-size:31px}
  .factory-lead{font-size:19px!important}
  .factory-tags{margin-top:8px}
  .contact{min-height:0;padding-top:84px;padding-bottom:91px}
  .contact h2{font-size:clamp(29px,7.4vw,39px)}
  .contact-content>p:not(.eyebrow){font-size:13px}
  .contact-details{display:block;margin-top:43px}
  .contact-details ul{margin-top:19px;gap:12px}
  .contact-details li{width:calc(50% - 10px);font-size:11px}
  .contact-outline{font-size:120px}
  .site-footer{padding-top:36px}
  .footer-top{padding-bottom:37px}
  .footer-bottom{align-items:start;flex-direction:column;gap:6px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}





/* Generated enamel composition */
.paint-scene{position:absolute;inset:0 0 0 auto;width:69%;perspective:1100px;pointer-events:none}
.paint-layer{position:absolute;left:51%;top:50%;transform:translate3d(-50%,-50%,0);transform-style:preserve-3d;mix-blend-mode:multiply;will-change:transform,opacity;backface-visibility:hidden}
.paint-layer img{display:block;width:100%;height:auto;user-select:none;pointer-events:none;filter:brightness(1.15) contrast(1.04)}
.has-motion .reveal{opacity:0;transform:translate3d(0,32px,0);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.75,.2,1)}
.has-motion .reveal.is-visible{opacity:1;transform:translate3d(0,0,0)}
.has-motion .work-card__visual{transition:filter .6s ease,transform .7s cubic-bezier(.2,.75,.2,1)}
.work-card:hover .work-card__visual{filter:grayscale(.65);transform:scale(1.015)}
/* Work examples remain clearly marked until real project material is approved. */
.works{padding-top:128px;padding-bottom:136px;background:#fff}
.works .section-heading{margin-bottom:54px}
.works-grid{display:grid;grid-template-columns:1fr 1fr;gap:27px}
.work-card{position:relative;overflow:hidden;background:#f4f5f6;transition:transform .35s ease,box-shadow .35s ease}
.work-card:hover{transform:translateY(-5px);box-shadow:0 18px 42px rgba(30,37,54,.1)}
.work-card__visual{position:relative;height:340px;overflow:hidden;filter:grayscale(1)}
.work-card__visual--baked{background:radial-gradient(ellipse at 42% 20%,rgba(241,242,242,.86),transparent 37%),linear-gradient(135deg,#777b80 0 23%,#a1a4a8 23.2% 34%,#53575d 34.2% 55%,#898c90 55.2% 80%,#42474d 80.2%)}
.work-card__visual--baked::before{content:"";position:absolute;left:20%;top:0;width:42%;height:130%;background:linear-gradient(90deg,rgba(255,255,255,.4),transparent 32%,rgba(18,23,31,.35) 90%);transform:skewX(-26deg)}
.work-card__visual--large{background:repeating-linear-gradient(90deg,#b8bbbd 0 44px,#6f7479 44px 49px,#8f9398 49px 134px,#4e535a 134px 139px)}
.work-card__visual--large::before{content:"";position:absolute;left:-8%;right:-7%;top:41%;height:28%;background:linear-gradient(90deg,#41464e,#a2a6a9 47%,#373c43);transform:skewY(-9deg);box-shadow:0 23px 35px rgba(22,25,30,.35)}
.work-card__visual::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(27,31,38,.39),transparent 55%)}
.work-card__line{position:absolute;z-index:2;left:26px;bottom:26px;width:48px;height:1px;background:#fff}
.work-card__body{position:relative;display:grid;grid-template-columns:1fr auto;gap:4px 18px;padding:27px 30px 31px}
.work-card__body>span{grid-column:1/-1;color:var(--blue);font-size:11px;font-weight:700;letter-spacing:.1em}
.work-card__body h3{grid-column:1;margin:14px 0 3px;font-family:var(--serif);font-size:clamp(23px,2.25vw,31px);font-weight:600;letter-spacing:.05em}
.work-card__body p{grid-column:1;margin:0;color:var(--body);font-size:12px;line-height:1.9}
.work-card__body small{grid-column:2;grid-row:2/4;align-self:center;padding:8px 11px;border:1px solid #cbd0d6;color:#6b7280;font-size:10px;white-space:nowrap}
.greeting{display:grid;grid-template-columns:.86fr 1.14fr;align-items:center;gap:9%;padding-top:126px;padding-bottom:126px;background:#e9ecf0}
.greeting-visual{position:relative;min-height:490px;overflow:hidden;background:linear-gradient(145deg,#d1d5db,#aeb4bd 42%,#f1f2f3 42.4%,#c8ccd2 100%)}
.greeting-visual::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(105deg,transparent 0 34px,rgba(255,255,255,.13) 34px 35px)}
.greeting-visual__plane{position:absolute;inset:20% -22% 13% 31%;transform:skewX(-19deg) rotate(-8deg);background:linear-gradient(110deg,#9da3ac,#d9dce0 39%,#9ca2ac 40%,#636b76);box-shadow:-21px 30px 42px rgba(38,46,59,.21)}
.greeting-visual img{position:absolute;left:8%;bottom:9%;width:38%;max-width:210px;mix-blend-mode:multiply;opacity:.35;filter:grayscale(1)}
.greeting-content .eyebrow{font-family:var(--sans);font-size:12px;letter-spacing:.14em}
.greeting h2{margin:23px 0 31px;font-family:var(--serif);font-size:clamp(37px,3.7vw,57px);font-weight:600;line-height:1.5;letter-spacing:.05em}
.greeting-content>p:not(.eyebrow){max-width:650px;margin:0 0 17px;color:#4b5361;font-size:14px;line-height:2.25;letter-spacing:.04em}
.greeting-sign{max-width:650px;margin-top:41px;padding-top:18px;border-top:1px solid #aeb5bf;font-family:var(--serif);font-size:16px;font-weight:600;letter-spacing:.12em}
@media(max-width:1050px){
  .greeting{gap:6%}
}
@media(max-width:800px){
  .paint-scene{top:24%;width:100%;height:76%}
  .works-grid{gap:18px}
  .work-card__visual{height:265px}
  .work-card__body{display:block;padding:22px}
  .work-card__body h3{font-size:25px}
  .work-card__body small{display:inline-block;margin-top:17px}
  .greeting{grid-template-columns:1fr;gap:35px}
  .greeting-visual{min-height:360px}
}
@media(max-width:560px){
  .paint-scene{top:25%;height:72%}
  .works{padding-top:84px;padding-bottom:90px}
  .works .section-heading{margin-bottom:32px}
  .works-grid{grid-template-columns:1fr;gap:22px}
  .work-card__visual{height:260px}
  .greeting{padding-top:86px;padding-bottom:90px}
  .greeting-visual{min-height:280px}
  .greeting h2{font-size:clamp(34px,8.2vw,45px)}
  .greeting-content>p:not(.eyebrow){font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1!important;transform:none!important}
}
@media(max-width:560px) and (prefers-reduced-motion:reduce){
}



/* V3: full-bleed monochrome media, cursor color, custom enamel artwork */
:root{--body:#444d5a}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.desktop-nav{font-size:14px;gap:clamp(16px,2vw,32px)}
.nav-contact{padding-inline:16px;gap:14px}
.eyebrow{font-size:13px}
.hero{height:calc(100svh - 82px);min-height:590px;max-height:none;background:#252b34}
.hero::before,.hero-grid,.hero-inner,.hero-paint{display:none}
.hero-media{position:absolute;inset:0;z-index:0;width:100%;height:100%;filter:none;background:#525960;--reveal-x:50%;--reveal-y:50%;--reveal-radius:0px}
.hero-media::after{display:none}
.hero-poster,.hero-video{object-fit:cover;object-position:center 48%;transform:none}
.hero-video{transition:opacity .6s ease}
.hero-monochrome{position:absolute;z-index:3;inset:0;pointer-events:none;background:rgba(6,10,16,.18);-webkit-backdrop-filter:grayscale(1) contrast(1.1);backdrop-filter:grayscale(1) contrast(1.1);-webkit-mask-image:radial-gradient(circle var(--reveal-radius) at var(--reveal-x) var(--reveal-y),transparent 0 48%,#000 100%);mask-image:radial-gradient(circle var(--reveal-radius) at var(--reveal-x) var(--reveal-y),transparent 0 48%,#000 100%)}
.hero-vignette{position:absolute;z-index:4;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(4,9,17,.58),transparent 26%),linear-gradient(180deg,rgba(4,9,17,.22),transparent 17%)}
.hero-topline{position:absolute;z-index:5;top:31px;left:max(42px,calc((100vw - 1340px)/2));right:max(42px,calc((100vw - 1340px)/2));display:flex;justify-content:space-between;gap:20px;font:700 13px/1.5 Arial,sans-serif;letter-spacing:.16em;color:#fff;text-shadow:0 1px 8px #161d27}
.hero-bottom{height:104px;padding-inline:max(42px,calc((100vw - 1340px)/2));background:linear-gradient(0deg,rgba(7,13,22,.22),transparent);border-top:1px solid rgba(255,255,255,.4)}
.hero-bottom p{margin:0;font-family:var(--serif);font-size:clamp(19px,2vw,29px);font-weight:600;letter-spacing:.12em;color:#fff}
.hero-scroll{font-size:13px;color:#fff}
.intro,.factories,.works,.greeting,.instagram,.contact{isolation:isolate}
.intro-layout,.intro-band,.section-heading,.factory,.factory-note,.works-grid,.greeting-visual,.greeting-content,.contact-content,.instagram-head,.instagram-feed,.instagram-note{position:relative;z-index:2}
.intro-copy p,.factory-content p,.greeting-content>p:not(.eyebrow){font-size:17px;line-height:2.05}
.section-heading>p{font-size:17px}
.factory-topline{font-size:12px}
.factory-topline span:last-child,.factory-tags span,.factory-note{font-size:13px}
.work-card__body>span{font-size:13px}
.work-card__body p{font-size:16px}
.work-card__body small{font-size:12px}
.contact-content>p:not(.eyebrow){font-size:18px}
.contact-details>span,.contact-details li{font-size:15px}
.back-top,.footer-bottom{font-size:13px}
.section-ink{position:absolute;z-index:1;max-width:none;pointer-events:none;user-select:none;transform:translate3d(0,var(--ink-shift,0px),0) rotate(var(--ink-rotate,0deg));will-change:transform}
.works-ink{left:-24%;bottom:-13%;width:min(75vw,1000px);opacity:.13;--ink-rotate:-26deg}
.greeting-ink{right:-22%;bottom:-70px;width:min(72vw,930px);opacity:.18;--ink-rotate:28deg}
.contact-ink{right:-20%;top:-12%;width:min(85vw,1200px);opacity:.22;mix-blend-mode:screen;--ink-rotate:15deg}
.instagram-ink{right:-13%;bottom:-120px;width:min(62vw,850px);opacity:.19;--ink-rotate:-16deg}
.paint-scene{z-index:2;width:75%}
.paint-layer{mix-blend-mode:normal}
.paint-layer img{filter:none}
.paint-layer--sculpture{z-index:3;width:min(72vw,1050px)}
.paint-layer--ribbon-back{z-index:1;width:min(73vw,1040px)}
.paint-layer--ribbon-front{z-index:4;width:min(48vw,680px)}
.instagram{position:relative;overflow:hidden;padding-top:115px;padding-bottom:135px;background:#202b3e;color:#fff}
.instagram::before{content:"";position:absolute;inset:0;opacity:.18;background:linear-gradient(90deg,transparent calc(33.33% - 1px),#8091ae 33.33%,transparent calc(33.33% + 1px),transparent calc(66.67% - 1px),#8091ae 66.67%,transparent calc(66.67% + 1px))}
.instagram-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:43px}
.instagram .eyebrow{color:#a9c2fb}
.instagram h2{margin:18px 0 0;font-family:var(--serif);font-size:clamp(48px,5vw,76px);font-weight:600;letter-spacing:.01em}
.instagram-head>p{margin:0 0 8px;font-size:18px;letter-spacing:.07em}
.instagram-feed{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;min-height:230px}
.instagram-placeholder{position:relative;aspect-ratio:1.16;overflow:hidden;background:linear-gradient(135deg,#525e6e,#77808b 48%,#434c59)}
.instagram-placeholder:nth-child(2){background:linear-gradient(145deg,#7a8089,#4c5561 52%,#9ba0a7)}
.instagram-placeholder:nth-child(3){background:linear-gradient(135deg,#5f6773,#9098a1 45%,#505a68)}
.instagram-placeholder::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 40%,rgba(255,255,255,.12) 40.2% 40.8%,transparent 41%)}
.instagram-placeholder span{position:absolute;left:17px;bottom:17px;width:35px;height:1px;background:#fff}
.instagram-note{margin:20px 0 0;color:#d1d8e6;font-size:14px}
.greeting-visual,.greeting-content{z-index:2}
@media(max-width:1050px){.desktop-nav{font-size:12px;gap:13px}.hero-topline{left:35px;right:35px}.hero-bottom{padding-inline:35px}}
@media(max-width:800px){
  .hero{height:calc(100svh - 70px);min-height:580px}
  .hero-poster,.hero-video{object-position:57% center}
  .hero-topline{top:24px;left:28px;right:28px}
  .hero-bottom{height:92px;padding-inline:28px}
  .paint-scene{top:20%;height:80%;width:100%}
  .paint-layer--sculpture{width:112vw}
  .paint-layer--ribbon-back{width:115vw}
  .paint-layer--ribbon-front{width:82vw}
  .works-ink{width:110vw}
  .greeting-ink{width:110vw}
  .instagram-ink{width:110vw}
  .contact-ink{width:130vw;right:-60%}
}
@media(max-width:560px){
  .hero{height:calc(100svh - 70px);min-height:560px}
  .hero-poster,.hero-video{object-position:58% center}
  .hero-topline{left:21px;right:21px;top:21px;font-size:11px}
  .hero-bottom{height:82px;padding-inline:21px}
  .hero-bottom p{font-size:18px;letter-spacing:.06em}
  .hero-scroll{font-size:12px}
  .eyebrow{font-size:12px}
  .intro-copy p,.factory-content p,.greeting-content>p:not(.eyebrow){font-size:16px}
  .intro-copy__lead{font-size:19px!important}
  .section-heading>p{font-size:16px}
  .factory-lead{font-size:21px!important}
  .factory-note,.factory-tags span{font-size:13px}
  .work-card__body p{font-size:15px}
  .paint-scene{top:30%;height:70%}
  .paint-layer--sculpture{width:145vw}
  .paint-layer--ribbon-back{width:138vw}
  .paint-layer--ribbon-front{width:100vw}
  .instagram{padding-top:83px;padding-bottom:95px}
  .instagram-head{display:block;margin-bottom:30px}
  .instagram h2{font-size:53px}
  .instagram-head>p{margin-top:14px;font-size:16px}
  .instagram-feed{gap:8px;min-height:0}
  .instagram-placeholder{aspect-ratio:.82}
  .instagram-note{font-size:13px;line-height:1.7}
  .contact-content>p:not(.eyebrow){font-size:16px}
  .contact-details>span,.contact-details li{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  .paint-layer--sculpture{transform:translate3d(-46%,-44%,0) rotate(-9deg) scale(1);opacity:1}
  .paint-layer--ribbon-back{transform:translate3d(-69%,-71%,0) rotate(16deg) scale(.82);opacity:.7}
  .paint-layer--ribbon-front{transform:translate3d(-16%,-10%,0) rotate(-22deg) scale(.7);opacity:.4}
  .section-ink{transform:rotate(var(--ink-rotate,0deg))}
}
.factories,.works,.greeting{position:relative}
.factories,.works,.greeting{overflow:hidden}
.greeting-ink{right:-31%;bottom:-190px;opacity:.12}@media(max-width:800px){.greeting-ink{right:-50%;bottom:-110px}}
/* V4: enamel motion belongs to the introduction */
.intro{height:190svh;min-height:1280px;padding:0;background:#f9fafb;overflow:clip}
.intro-sticky{position:sticky;top:0;display:flex;align-items:center;width:100%;height:100svh;min-height:650px;overflow:hidden;padding:80px max(70px,calc((100vw - 1340px)/2));isolation:isolate;background:radial-gradient(circle at 83% 56%,#edf3fd 0,#f9fafb 56%)}
.intro-sticky::after{content:"";position:absolute;z-index:4;inset:0;pointer-events:none;background:linear-gradient(90deg,#f9fafb 0%,rgba(249,250,251,.98) 30%,rgba(249,250,251,.7) 46%,transparent 72%)}
.intro-layout{display:block;position:relative;z-index:5;width:min(47%,570px);margin:0;padding:0}
.intro h2{margin:18px 0 0;font-size:clamp(43px,4.6vw,72px);line-height:1.42}
.intro-copy{max-width:520px;margin-top:45px;padding:0}
.intro-copy__lead{font-size:clamp(19px,1.55vw,23px)!important}
.intro-copy p{font-size:17px;line-height:2.05}
.intro-scene{z-index:2;inset:0 0 0 auto;width:74%;height:100%}
.intro-band{position:absolute;z-index:5;left:max(70px,calc((100vw - 1340px)/2));right:max(70px,calc((100vw - 1340px)/2));bottom:32px;margin:0;gap:20px;color:#bfc9d8;font-size:clamp(37px,5vw,72px);opacity:.68}
.intro-progress{position:absolute;z-index:6;right:max(70px,calc((100vw - 1340px)/2));bottom:20px;width:150px;height:2px;background:#cbd5e5}
.intro-progress span{display:block;width:100%;height:100%;background:var(--blue);transform:scaleX(0);transform-origin:left center}
@media(max-width:1050px){
  .intro-sticky{padding-inline:45px}
  .intro-band{left:45px;right:45px}
  .intro-progress{right:45px}
  .intro-layout{width:51%}
}
@media(max-width:800px){
  .intro{height:195svh;min-height:1250px}
  .intro-sticky{top:70px;display:block;height:calc(100svh - 70px);min-height:650px;padding:52px 45px 70px}
  .intro-sticky::after{background:linear-gradient(180deg,#f9fafb 0%,rgba(249,250,251,.99) 48%,rgba(249,250,251,.45) 65%,transparent 83%)}
  .intro-layout{width:100%;max-width:680px}
  .intro h2{font-size:clamp(39px,6vw,55px)}
  .intro-copy{max-width:650px;margin-top:27px}
  .intro-copy__lead{font-size:20px!important}
  .intro-scene{top:38%;width:100%;height:62%}
  .intro-band{left:45px;right:45px;bottom:26px;font-size:clamp(33px,6vw,56px)}
  .intro-progress{right:45px;bottom:17px}
}
@media(max-width:560px){
  .intro{height:205svh;min-height:1390px}
  .intro-sticky{top:70px;height:calc(100svh - 70px);min-height:650px;padding:43px 22px 70px}
  .intro h2{font-size:clamp(36px,9vw,48px);line-height:1.4}
  .intro-copy{margin-top:21px}
  .intro-copy__lead{font-size:18px!important;line-height:1.75!important;margin-bottom:14px!important}
  .intro-copy p{font-size:16px;line-height:1.8}
  .intro-scene{top:48%;height:52%}
  .intro-band{left:22px;right:22px;bottom:30px;gap:10px;font-size:42px}
  .intro-progress{right:22px;bottom:18px;width:110px}
}
@media(prefers-reduced-motion:reduce){
  .intro{height:auto;min-height:0}
  .intro-sticky{position:relative;top:auto;height:850px;min-height:0}
  .intro-progress{display:none}
}
@media(max-width:800px) and (prefers-reduced-motion:reduce){
  .intro-sticky{height:800px}
}
@media(max-width:560px) and (prefers-reduced-motion:reduce){
  .intro-sticky{height:760px}
}


.intro-sign{max-width:520px;margin-top:28px;padding-top:15px;border-top:1px solid #b6beca;font-family:var(--serif);font-size:17px;font-weight:600;letter-spacing:.12em}
@media(max-width:560px){.intro-sign{margin-top:20px;padding-top:12px;font-size:15px}}
/* V6: coating is a material transformation across the whole page */
.scroll-rail{position:fixed;z-index:80;top:50%;right:18px;width:2px;height:180px;transform:translateY(-50%);background:rgba(87,103,133,.2);pointer-events:none}
.scroll-rail span{display:block;width:100%;height:100%;background:linear-gradient(#8bb2ff,#244a9f);transform:scaleY(var(--page-progress,0));transform-origin:top}
.hero-poster,.hero-video{transform:translate3d(var(--hero-pan-x,0px),var(--hero-pan-y,0px),0) scale(1.075);transition:transform .38s ease,opacity .6s ease;will-change:transform}
.section-ink{transform:translate3d(var(--ink-x,0px),var(--ink-shift,0px),0) rotate(calc(var(--ink-rotate,0deg) + var(--ink-spin,0deg))) scale(var(--ink-scale,1));transition:opacity .45s ease}
.works{background:linear-gradient(180deg,#fff 0%,#f3f6fb 100%)}
.works-grid{perspective:1600px}
.work-card{background:#fff;box-shadow:0 28px 60px rgba(29,47,82,.07)}
.work-card__visual{height:420px;filter:none!important;isolation:isolate;perspective:1200px;background:radial-gradient(circle at 48% 28%,#e6edf6,#aeb9c7 49%,#4e6078 100%)}
.work-card__visual--large{background:radial-gradient(circle at 61% 21%,#edf2f7,#b0bbcb 46%,#4e6078 100%)}
.work-card__visual--baked::before,.work-card__visual--large::before{display:none}
.work-card__visual::after{z-index:0;opacity:.62;background:linear-gradient(0deg,rgba(19,34,59,.3),transparent 48%),repeating-linear-gradient(90deg,rgba(255,255,255,.1) 0 1px,transparent 1px 42px)}
.work-card__line{z-index:5}
.specimen{position:absolute;z-index:2;inset:0;transform-style:preserve-3d;--base-x:25deg;--base-y:-24deg;--base-z:-12deg;transform:rotateX(calc(var(--base-x) + var(--specimen-rx,0deg) + var(--specimen-scroll,0deg))) rotateY(calc(var(--base-y) + var(--specimen-ry,0deg))) rotateZ(var(--base-z));transition:transform .35s cubic-bezier(.18,.7,.22,1);will-change:transform}
.specimen--beam{--base-x:31deg;--base-y:19deg;--base-z:-8deg}
.specimen__face,.specimen__edge,.specimen__rim{position:absolute;left:17%;top:17%;width:66%;height:65%;border-radius:3px;transform-style:preserve-3d}
.specimen__edge{background:linear-gradient(135deg,#364251,#7d8999 44%,#26344b);transform:translate3d(27px,31px,-16px);box-shadow:28px 38px 45px rgba(17,30,53,.34)}
.specimen__face{overflow:hidden;transform:translateZ(28px);background:linear-gradient(133deg,#eef1f3 0%,#8593a3 20%,#d8e0e7 31%,#647181 47%,#eff2f4 50%,#536171 69%,#cbd5df 100%);box-shadow:inset 0 0 0 2px rgba(241,247,255,.8),inset 0 12px 30px rgba(255,255,255,.27),0 25px 42px rgba(18,33,59,.2)}
.specimen__face::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 24%,rgba(255,255,255,.57) 29%,transparent 38%);transform:translateX(var(--shine-x,-75%));opacity:.65}
.specimen__face::after{content:"";position:absolute;inset:0;background:linear-gradient(133deg,#6b94d7 0%,#1a459a 23%,#b8cef2 35%,#174487 47%,#0b286d 68%,#5f85c9 100%);clip-path:inset(0 calc(100% - var(--coat,0%)) 0 0);box-shadow:inset 0 0 20px rgba(255,255,255,.25)}
.specimen__rim{transform:translateZ(30px);border:1px solid rgba(235,246,255,.66);box-shadow:inset 0 0 0 1px rgba(10,28,65,.23);pointer-events:none}
.specimen--beam .specimen__face,.specimen--beam .specimen__edge,.specimen--beam .specimen__rim{left:8%;top:32%;width:84%;height:37%}
.specimen--beam .specimen__edge{transform:translate3d(25px,28px,-19px)}
.specimen--beam .specimen__face{transform:translateZ(31px)}
.specimen--beam .specimen__rim{transform:translateZ(33px)}
.work-card:hover .specimen{transition-duration:.12s}
.instagram-feed{perspective:1400px}
.instagram-placeholder{transform:translate3d(0,var(--feed-y,0px),var(--feed-z,0px)) rotateY(var(--feed-ry,0deg));transition:transform .24s ease,box-shadow .24s ease;will-change:transform}
.instagram-placeholder:hover{box-shadow:0 28px 48px rgba(0,0,0,.3)}
.contact{perspective:1400px;--contact-light-x:75%;--contact-light-y:45%}
.contact-light{position:absolute;z-index:0;inset:0;pointer-events:none;background:radial-gradient(560px circle at var(--contact-light-x) var(--contact-light-y),rgba(194,220,255,.34),rgba(91,131,225,.12) 42%,transparent 75%);mix-blend-mode:screen}
.contact-ink{transform:translate3d(calc(var(--ink-x,0px) + var(--contact-pan-x,0px)),calc(var(--ink-shift,0px) + var(--contact-pan-y,0px)),80px) rotateY(var(--contact-ry,0deg)) rotateZ(calc(var(--ink-rotate,15deg) + var(--ink-spin,0deg))) scale(var(--ink-scale,1))}
@media(max-width:1050px){.scroll-rail{right:8px}.work-card__visual{height:340px}}
@media(max-width:800px){
  .scroll-rail{display:none}
  .work-card__visual{height:300px}
}
@media(max-width:560px){
  .work-card__visual{height:285px}
  .specimen__face,.specimen__edge,.specimen__rim{left:13%;top:17%;width:73%;height:66%}
  .specimen--beam .specimen__face,.specimen--beam .specimen__edge,.specimen--beam .specimen__rim{left:7%;top:33%;width:84%;height:36%}
  .contact-light{background:radial-gradient(390px circle at var(--contact-light-x) var(--contact-light-y),rgba(194,220,255,.3),transparent 75%)}
}
@media(prefers-reduced-motion:reduce){
  .scroll-rail{display:none}
  .hero-poster,.hero-video{transform:none}
  .section-ink{transform:rotate(var(--ink-rotate,0deg))}
  .specimen{transform:rotateX(var(--base-x)) rotateY(var(--base-y)) rotateZ(var(--base-z))}
  .specimen__face::after{clip-path:inset(0 45% 0 0)}
  .instagram-placeholder{transform:none}
  .contact-ink{transform:rotate(var(--ink-rotate,15deg))}
}
.hero-transition{position:absolute;z-index:4;right:-7%;bottom:-13%;width:min(78vw,1100px);max-width:none;pointer-events:none;opacity:var(--hero-ink-opacity,0);transform:translate3d(0,var(--hero-ink-y,130px),0) rotate(-11deg);filter:drop-shadow(0 18px 32px rgba(1,13,44,.32));will-change:transform,opacity}
@media(max-width:560px){.hero-transition{width:125vw;right:-55%;bottom:-7%}}
@media(prefers-reduced-motion:reduce){
  .hero-transition{display:none}
}


.footer-brand img{width:80px;height:auto}
@media(max-width:560px){.footer-brand img{width:66px}}

/* Quiet Gothic wordmark based on the supplied lockup. */
.header-brand{position:relative;display:inline-flex;align-items:flex-end;gap:10px;padding-bottom:8px;color:#202443;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;white-space:nowrap;line-height:1}
.header-brand::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#3154a0}
.header-brand__company{padding-bottom:3px;font-size:12px;font-weight:800;letter-spacing:.12em}
.header-brand__name{font-size:35px;font-weight:900;letter-spacing:.1em}
@media(max-width:560px){.header-brand{gap:7px;padding-bottom:7px}.header-brand__company{font-size:10px;padding-bottom:3px}.header-brand__name{font-size:29px}}
/* V7: the opening frame is built around the future fullscreen film. */
.hero{background:#101b32}
.hero::after{content:"";position:absolute;z-index:5;inset:22px;border:1px solid rgba(235,243,255,.24);pointer-events:none}
.hero-pigment{position:absolute;z-index:2;inset:0;pointer-events:none;background:radial-gradient(circle var(--reveal-radius,0px) at var(--reveal-x,50%) var(--reveal-y,50%),rgba(23,70,156,.53) 0%,rgba(33,90,192,.34) 43%,transparent 100%)}
.hero-monochrome{background:rgba(3,10,24,.16);-webkit-backdrop-filter:grayscale(1) contrast(1.14) brightness(.98);backdrop-filter:grayscale(1) contrast(1.14) brightness(.98)}
.hero-vignette{background:linear-gradient(0deg,rgba(2,8,23,.54),transparent 35%),linear-gradient(180deg,rgba(3,9,23,.3),transparent 26%),linear-gradient(90deg,rgba(2,8,23,.18),transparent 52%)}
.hero-ink-form{position:absolute;z-index:4;right:-12%;bottom:-31%;width:min(80vw,1180px);max-width:none;opacity:.82;pointer-events:none;transform:translate3d(var(--hero-fluid-x,0px),var(--hero-fluid-y,0px),0) rotate(-9deg);filter:drop-shadow(0 28px 42px rgba(2,9,30,.45));animation:hero-fluid-breathe 8s ease-in-out infinite alternate;will-change:transform}
@keyframes hero-fluid-breathe{from{transform:translate3d(var(--hero-fluid-x,0px),calc(var(--hero-fluid-y,0px) + 10px),0) rotate(-10deg)}to{transform:translate3d(var(--hero-fluid-x,0px),calc(var(--hero-fluid-y,0px) - 10px),0) rotate(-7deg)}}
.hero-transition{right:2%;bottom:-20%;width:min(86vw,1280px);opacity:var(--hero-ink-opacity,0)}
.hero-topline{letter-spacing:.24em}
.hero-bottom{background:linear-gradient(0deg,rgba(4,11,27,.55),rgba(4,11,27,.04))}
@media(max-width:800px){.hero-ink-form{right:-45%;bottom:-11%;width:145vw;opacity:.76}.hero-transition{right:-43%;bottom:-9%;width:140vw}}
@media(max-width:560px){.hero::after{inset:11px}.hero-ink-form{right:-65%;bottom:-5%;width:177vw;opacity:.68}.hero-transition{right:-62%;bottom:-4%;width:170vw}}
@media(prefers-reduced-motion:reduce){.hero-ink-form{animation:none;transform:rotate(-8deg)}}

.factory-detail{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:23px;padding:18px 0 0;border:0;border-top:1px solid #c6cfde;background:none;color:#244a9a;text-align:left;font:700 15px/1.4 var(--sans);letter-spacing:.08em;cursor:pointer}
.factory-detail span{font-family:Arial,sans-serif;font-size:22px;font-weight:400;line-height:1;transition:transform .25s ease}
.factory-detail:hover span,.factory-detail:focus-visible span{transform:translate(3px,-3px)}
.factory-dialog{width:min(1060px,calc(100vw - 48px));max-width:none;max-height:min(760px,calc(100dvh - 48px));margin:auto;padding:0;border:0;background:#f7f9fc;color:var(--ink);box-shadow:0 45px 120px rgba(0,0,0,.37);overflow:auto}
.factory-dialog::backdrop{background:rgba(5,13,29,.76);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
body.dialog-open{overflow:hidden}
.factory-dialog__layout{display:grid;grid-template-columns:1.05fr .95fr;min-height:560px}
.factory-dialog__figure{position:relative;min-height:560px;margin:0;overflow:hidden;background:#737d8a}
.factory-dialog__figure img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:54% center;filter:grayscale(1) contrast(1.1)}
.factory-dialog__figure--koda img{object-position:79% center;filter:grayscale(1) contrast(1.1) brightness(.75)}
.factory-dialog__figure::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,12,29,.73),transparent 34%),linear-gradient(100deg,transparent 40%,rgba(37,84,169,.27))}
.factory-dialog__figure figcaption{position:absolute;z-index:1;left:34px;right:25px;bottom:28px;color:#fff;font:700 11px/1.5 Arial,var(--sans);letter-spacing:.13em}
.factory-dialog__copy{display:flex;flex-direction:column;justify-content:center;padding:72px clamp(34px,5vw,74px)}
.factory-dialog__eyebrow{margin:0;color:#3154a0;font:700 12px/1.5 Arial,sans-serif;letter-spacing:.18em}
.factory-dialog__copy h2{margin:18px 0 26px;font-family:var(--serif);font-size:clamp(38px,4vw,58px);line-height:1.35;letter-spacing:.08em}
.factory-dialog__lead{margin:0 0 22px!important;color:#242b45;font-family:var(--serif);font-size:22px!important;font-weight:600;line-height:1.6!important}
.factory-dialog__copy>p:not(.factory-dialog__eyebrow):not(.factory-dialog__lead):not(.factory-dialog__note){margin:0;color:#475366;font-size:16px;line-height:2}
.factory-dialog__note{margin:30px 0 0;padding-top:15px;border-top:1px solid #cbd4e2;color:#68758a;font-size:12px;line-height:1.7}
.factory-dialog__close{position:absolute;z-index:5;top:20px;right:20px;display:grid;place-items:center;width:44px;height:44px;border:1px solid #c3cbda;border-radius:50%;background:#fff;color:#203967;font:400 29px/1 Arial,sans-serif;cursor:pointer;transition:background .2s,color .2s}
.factory-dialog__close:hover{background:#244a9a;color:#fff}
@media(max-width:800px){.factory-dialog__layout{grid-template-columns:1fr}.factory-dialog__figure{min-height:0;height:290px}.factory-dialog__copy{padding:35px 42px 47px}.factory-dialog__copy h2{font-size:42px}}
@media(max-width:560px){.factory-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.factory-dialog__figure{height:240px}.factory-dialog__figure figcaption{left:19px;right:19px;bottom:19px;font-size:10px}.factory-dialog__copy{padding:30px 25px 37px}.factory-dialog__copy h2{margin:13px 0 19px;font-size:36px}.factory-dialog__lead{font-size:19px!important}.factory-dialog__copy>p:not(.factory-dialog__eyebrow):not(.factory-dialog__lead):not(.factory-dialog__note){font-size:15px}.factory-dialog__close{top:12px;right:12px}}
.hero-poster{object-position:50% center}
@media(max-width:800px){.hero-poster{object-position:28% center}}

/* V9: a quiet title sequence that resolves into the full-screen film. */
.opening{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse 52% 42% at 50% 45%,#27344c 0%,#172236 52%,#0b111d 100%);color:#f5f7fb;transform:translateY(0);transition:transform .78s cubic-bezier(.76,0,.18,1);isolation:isolate}
.opening::before{content:"";position:absolute;inset:-30%;z-index:-1;background:linear-gradient(110deg,transparent 36%,rgba(86,119,181,.13) 48%,rgba(211,226,255,.045) 50%,transparent 62%);transform:translateX(-27%) rotate(-6deg);animation:opening-light 2.8s ease-in-out forwards}
.opening__field{position:absolute;inset:22px;border:1px solid rgba(214,226,247,.13);pointer-events:none}
.opening__field::before,.opening__field::after{content:"";position:absolute;top:50%;width:clamp(20px,8vw,130px);height:1px;background:linear-gradient(90deg,transparent,rgba(206,220,244,.35))}
.opening__field::before{left:4%}
.opening__field::after{right:4%;transform:rotate(180deg)}
.opening__center{display:flex;flex-direction:column;align-items:center;padding:36px;text-align:center;transition:opacity .36s ease,transform .5s ease}
.opening__mark{display:block;width:clamp(112px,12vw,166px);height:auto;aspect-ratio:616/624;object-fit:cover;border-radius:50%;clip-path:circle(49% at 50% 50%);box-shadow:0 18px 65px rgba(0,0,0,.2);opacity:0;transform:translateY(26px) scale(.82);animation:opening-mark .78s cubic-bezier(.16,1,.3,1) .12s forwards}
.opening__rule{display:block;width:0;height:1px;margin:30px 0 20px;background:linear-gradient(90deg,transparent,#759be7 18%,#c1d4f6 50%,#759be7 82%,transparent);animation:opening-rule .65s ease .6s forwards}
.opening__word{padding-left:.34em;font:600 clamp(43px,5.8vw,78px)/1 Arial,Helvetica,sans-serif;letter-spacing:.34em;opacity:0;transform:translateY(12px);animation:opening-word .7s cubic-bezier(.2,.7,.2,1) .75s forwards}
.opening__company{margin-top:15px;color:#aebbd0;font:600 11px/1.5 "Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;letter-spacing:.34em;opacity:0;animation:opening-word .7s ease 1.08s forwards}
.opening__skip{position:absolute;right:clamp(30px,5vw,72px);bottom:clamp(33px,6vh,72px);display:flex;align-items:center;gap:17px;padding:9px 2px;border:0;border-bottom:1px solid rgba(207,223,248,.46);background:none;color:#e9f1ff;font:600 11px/1 Arial,sans-serif;letter-spacing:.2em;cursor:pointer;transition:color .2s,border-color .2s}
.opening__skip:hover,.opening__skip:focus-visible{color:#9dbdfd;border-color:#9dbdfd}
.opening__skip span{font-size:18px;font-weight:400;line-height:1}
.opening__edge{position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,#172f63,#6f9be2,#b6cbed,#294988);transform:scaleX(0);transform-origin:left;transition:transform .72s cubic-bezier(.76,0,.18,1)}
.opening.is-leaving{transform:translateY(-102%);pointer-events:none}
.opening.is-leaving .opening__center{opacity:0;transform:translateY(-35px)}
.opening.is-leaving .opening__edge{transform:scaleX(1)}
body.opening-lock{overflow:hidden}
@keyframes opening-mark{to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes opening-rule{to{width:176px}}
@keyframes opening-word{to{opacity:1;transform:translateY(0)}}
@keyframes opening-light{to{transform:translateX(23%) rotate(-6deg)}}
@media(max-width:560px){.opening__field{inset:12px}.opening__field::before,.opening__field::after{width:24px}.opening__mark{width:124px}.opening__rule{margin-top:28px}.opening__skip{right:30px;bottom:38px}}
@media(prefers-reduced-motion:reduce){.opening{display:none!important}.opening *{animation:none!important;transition:none!important}}

/* A darker, more restrained rhythm through the lower half of the page. */
.factories{background:#172130;color:#f2f5f9}
.factories::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 70% 38% at 92% 5%,rgba(75,107,160,.18),transparent 75%),repeating-linear-gradient(90deg,transparent 0 159px,rgba(255,255,255,.018) 159px 160px)}
.factories .eyebrow{color:#9eb8e6}
.factories .section-heading>p,.factories .factory-note{color:#c0cad9}
.factory{color:#242b3b;background:#f7f8fa;box-shadow:0 24px 70px rgba(0,0,0,.18)}
.contact{background:#17233c}
.contact::before{background:linear-gradient(140deg,#263d70 0%,#1a2a4b 60%,#101a2e 100%)}
/* V9 refinement: white opening, near-black reveal, blue light behind the mark. */
.opening{background:#f7f8fa;color:#f5f7fb;transition:background .72s ease,transform .78s cubic-bezier(.76,0,.18,1)}
.opening.is-dark{background:#080c13}
.opening::before{opacity:0;transition:opacity .85s ease;animation:none;background:radial-gradient(ellipse 55% 46% at 50% 42%,rgba(35,69,133,.23),transparent 75%)}
.opening.is-dark::before{opacity:1}
.opening__field{border-color:rgba(19,37,70,.14);transition:border-color .7s ease}
.opening.is-dark .opening__field{border-color:rgba(214,226,247,.13)}
.opening__center{position:relative;z-index:1;isolation:isolate}
.opening__center::before{content:"";position:absolute;z-index:-1;left:50%;top:5px;width:min(72vw,470px);height:290px;background:radial-gradient(ellipse at 50% 32%,rgba(119,162,242,.66) 0%,rgba(45,91,183,.35) 29%,rgba(29,64,143,.12) 57%,transparent 74%);filter:blur(28px);opacity:0;transform:translate(-50%,-4%) scale(.72);transition:opacity 1.1s ease .18s,transform 1.3s cubic-bezier(.16,1,.3,1) .18s;pointer-events:none}
.opening.is-dark .opening__center::before{opacity:1;transform:translate(-50%,-4%) scale(1.22)}
.opening__mark{box-shadow:0 18px 65px rgba(0,0,0,.08);transition:box-shadow .7s ease}
.opening.is-dark .opening__mark{box-shadow:0 18px 70px rgba(7,32,83,.46),0 0 54px rgba(95,145,241,.15)}
.opening__word,.opening__company{animation:none;opacity:0}
.opening.is-dark .opening__word{animation:opening-word .68s cubic-bezier(.2,.7,.2,1) .25s forwards}
.opening.is-dark .opening__company{animation:opening-word .7s ease .47s forwards}
.opening__skip{color:#293b59;border-color:rgba(29,55,99,.4)}
.opening.is-dark .opening__skip{color:#e9f1ff;border-color:rgba(207,223,248,.46)}
.opening__field::before,.opening__field::after{background:linear-gradient(90deg,transparent,rgba(58,81,122,.25))}
.opening.is-dark .opening__field::before,.opening.is-dark .opening__field::after{background:linear-gradient(90deg,transparent,rgba(206,220,244,.35))}
/* Keep the supplied mark visible from the first white frame. */
.opening__mark{opacity:1;animation:opening-mark-rise .78s cubic-bezier(.16,1,.3,1) .08s both}
@keyframes opening-mark-rise{from{transform:translateY(24px) scale(.82)}to{transform:translateY(0) scale(1)}}
/* The supplied dark mark changes to a pure white mark as the room goes dark. */
.opening__symbol{position:relative;display:block;width:clamp(112px,12vw,166px);aspect-ratio:616/624;flex:none}
.opening__symbol .opening__mark{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.opening__mark--base{transition:opacity .58s ease,box-shadow .7s ease}
.opening.is-dark .opening__mark--base{opacity:0}
.opening__symbol .opening__mark--light{opacity:0;animation:none;transform:none;filter:grayscale(1) invert(1) contrast(3);mix-blend-mode:screen;box-shadow:none;transition:opacity .58s ease .12s}
.opening.is-dark .opening__symbol .opening__mark--light{opacity:1;box-shadow:none}
@media(max-width:560px){.opening__symbol{width:124px}}
/* Keep the representative message on its two intentional lines at every width. */
.intro h2{font-size:clamp(36px,4.2vw,62px);white-space:nowrap}
@media(max-width:1050px){.intro h2{font-size:clamp(34px,4.1vw,45px)}}
@media(max-width:800px){.intro h2{font-size:clamp(36px,6vw,52px)}}
@media(max-width:560px){.intro h2{font-size:clamp(29px,8.7vw,44px);letter-spacing:.035em}}