@import 'tailwindcss';
:root{--ink:#27362f;--green:#466d5c;--deep:#315647;--cream:#f7f2e8;--paper:#fffdf7;--orange:#e88b52;--line:#d8d4c8}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.85}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin-top:0}header{height:86px;padding:0 clamp(22px,6vw,86px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dedbd1;background:rgba(255,253,247,.94);position:sticky;top:0;z-index:10;backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:12px;font-family:serif;font-weight:700;line-height:1.2}.brand>b{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--green);border-radius:50%}.brand small{display:block;font:500 9px sans-serif;letter-spacing:.12em;margin-top:4px;color:#718078}nav{display:flex;gap:34px;font-size:13px;font-weight:700}nav a:hover{color:var(--orange)}.headCta,.button{background:var(--green);color:white;padding:13px 21px;border-radius:3px;font-size:13px;font-weight:700}.hero{min-height:710px;padding:85px clamp(24px,7vw,110px);display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:6vw;background-color:var(--cream);background-image:linear-gradient(#466d5c0b 1px,transparent 1px),linear-gradient(90deg,#466d5c0b 1px,transparent 1px);background-size:34px 34px;overflow:hidden}.label{font-size:10px;letter-spacing:.19em;font-weight:800;color:var(--green)}.line:before{content:"";display:inline-block;width:30px;height:1px;background:var(--orange);vertical-align:middle;margin-right:10px}h1{font:700 clamp(44px,5vw,74px)/1.38 serif;letter-spacing:.04em;margin:25px 0}h1 em{font-style:normal;color:var(--green);background:linear-gradient(transparent 78%,#e88b5245 0)}.lead{font-size:14px;color:#58655f;line-height:2.15}.actions{display:flex;gap:30px;align-items:center;margin:38px 0}.actions>a:last-child{font-size:12px;font-weight:700;border-bottom:1px solid #8b9791}.button{padding:17px 24px;box-shadow:5px 5px 0 #c7d2c8}.checks{display:flex;gap:18px;padding-top:18px;border-top:1px solid #d5d1c7;font-size:10px;font-weight:700;color:#66736d}.visual{position:relative;max-width:550px}.paper{height:455px;background:#fff;border:1px solid #d5d2c8;box-shadow:16px 20px 0 #445b511c,0 20px 60px #31433b26;transform:rotate(1.5deg);padding:27px}.paperTitle{display:flex;justify-content:space-between;border-bottom:2px solid var(--ink);padding-bottom:9px;font-family:serif}.plan{height:310px;margin:22px 10px;position:relative;border:3px double #547064;background-image:linear-gradient(#476d5d20 1px,transparent 1px),linear-gradient(90deg,#476d5d20 1px,transparent 1px);background-size:38px 38px}.plan:before,.plan:after{content:"";position:absolute;background:#547064}.plan:before{width:2px;height:100%;left:52%}.plan:after{height:2px;width:100%;top:46%}.room{position:absolute;border:2px solid #547064;font-size:9px;padding:4px}.r1{inset:22px 51% 55% 20px}.r2{inset:50% 18px 20px 55%}.r3{left:20px;right:48%;bottom:20px;height:38%}.col{position:absolute;width:11px;height:11px;background:var(--ink)}.c1{left:-7px;top:-7px}.c2{right:-7px;top:-7px}.c3{left:-7px;bottom:-7px}.c4{right:-7px;bottom:-7px}.paper>p{text-align:right;font-size:9px}.paper strong{color:var(--green)}.badge{position:absolute;right:-28px;bottom:35px;transform:rotate(-3deg);background:var(--green);color:#fff;padding:17px 22px;box-shadow:6px 7px 0 #26342f2e}.badge small{display:block;font-size:8px}.badge b{display:block;font:bold 23px Arial}.tape{position:absolute;width:90px;height:25px;background:#dfca988f;z-index:2}.t1{left:-25px;top:7px;transform:rotate(-35deg)}.t2{right:-25px;top:4px;transform:rotate(32deg)}.about,.dra{padding:115px clamp(24px,10vw,150px);display:grid;grid-template-columns:1fr 1fr;gap:10vw}.about h2,.sectionHead h2,.dra h2,.contact h2{font:700 clamp(32px,3.5vw,50px)/1.55 serif;letter-spacing:.03em}.about>div:last-child{padding-top:28px;color:#59665f}.about p{margin-bottom:22px}.sign{border-top:1px solid var(--line);padding-top:20px;margin-top:34px}.sign small,.sign b{display:block}.sign small{font-size:8px;letter-spacing:.2em}.sign b{font-family:serif;color:var(--green)}.services,.flow{padding:105px clamp(24px,7vw,110px);background:#e9eee9}.sectionHead{display:flex;justify-content:space-between;align-items:end;margin-bottom:58px}.sectionHead>p{font-size:12px;color:#68756e}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.cards article{background:var(--paper);padding:32px;transition:.25s}.cards article:hover{transform:translateY(-5px);box-shadow:0 16px 35px #26342f16}.cards article>small{font:10px monospace;color:#84918b}.cards article>span{font-size:9px;font-weight:700;color:var(--green);background:#e7eee8;padding:5px 10px}.cards h3{font:700 24px serif;margin:13px 0}.cards article>p{font-size:12px;color:#68736e}.icon{height:130px;margin:19px 0 27px;background:#f2efe5;border:1px solid #e0dccf;position:relative}.icon:before,.icon:after,.icon i{content:"";position:absolute;border:1px solid var(--green)}.i01:before{inset:24px 35px}.i01:after{left:50%;top:24px;bottom:24px}.i01 i{top:50%;left:35px;right:35px}.i02:before{inset:26px 50px;transform:skew(-10deg)}.i02:after{width:55px;border-top:2px dashed var(--orange);left:42%;top:50%;transform:rotate(-18deg)}.i03:before{inset:20px 60px;background:#fff;box-shadow:7px 7px #d7dfd8}.i03:after{width:44px;height:30px;left:calc(50% - 22px);top:43px;background:#9bb0a6}.i03 i{width:44px;left:calc(50% - 22px);bottom:33px;border-top:4px double var(--green)}.dra{background:var(--deep);color:#fff;align-items:center;position:relative;overflow:hidden}.dra:after{content:"DRA-CAD";position:absolute;right:-20px;bottom:-90px;font:bold 140px Arial;color:#ffffff0a}.draTitle{display:flex;gap:22px;align-items:flex-start}.draTitle>b{display:grid;place-items:center;min-width:68px;height:68px;border:2px solid #f2b17f;border-radius:14px;color:#f2b17f;font:bold 40px Arial}.dra .label,.dra h2 strong{color:#f2b17f}.dra>div:last-child>p{font-size:13px;color:#d4ded8}.dra ul{list-style:none;padding:0;margin:28px 0}.dra li{padding:13px 0;border-top:1px solid #ffffff2c;font-size:12px}.dra li:last-child{border-bottom:1px solid #ffffff2c}.dra li span{font:9px monospace;color:#f2b17f;margin-right:18px}.dra .note{border-left:3px solid var(--orange);padding-left:17px;color:#fff!important;font-family:serif;font-weight:700}.flow{background:var(--paper)}.steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.steps article{padding:34px 28px;border-right:1px solid var(--line)}.steps article:last-child{border:0}.steps span{font:10px monospace;color:var(--orange)}.steps h3{font:700 19px serif;margin:17px 0 9px}.steps p{font-size:11px;color:#6b7771}.contact{padding:105px 24px;text-align:center;background:#f4eadc}.contact .label{color:var(--orange)}.contact>p:not(.label){font-size:12px;color:#68736e}.contact .button{display:inline-block;margin:22px 0 12px}.contact>small{display:block;color:#7e837f;font-size:10px}footer{padding:42px clamp(24px,7vw,110px);display:flex;align-items:center;justify-content:space-between;background:var(--ink);color:#fff}footer p,footer>a{margin:0;color:#b7c0bc;font-size:9px;letter-spacing:.1em}
@media(max-width:850px){nav{display:none}.hero{grid-template-columns:1fr}.visual{width:min(90%,520px);margin:30px auto 0}.about,.dra{grid-template-columns:1fr;gap:28px}.cards{grid-template-columns:1fr}.sectionHead{display:block}.steps{grid-template-columns:1fr 1fr}.steps article:nth-child(2){border-right:0}.steps article:nth-child(-n+2){border-bottom:1px solid var(--line)}}@media(max-width:520px){header{height:70px;padding:0 14px}.brand>b{width:36px;height:36px}.headCta{padding:9px 12px}.hero{min-height:auto;padding:55px 22px 72px}h1{font-size:41px}.lead br{display:none}.actions{align-items:flex-start;flex-direction:column;gap:18px}.checks{flex-wrap:wrap}.paper{height:350px;padding:18px}.plan{height:240px}.badge{right:-10px;bottom:15px}.about,.dra,.services,.flow{padding:72px 22px}.steps{grid-template-columns:1fr}.steps article{border-right:0!important;border-bottom:1px solid var(--line)}.contact{padding:78px 20px}footer{flex-direction:column;gap:25px;text-align:center}}

/* Editorial details */
.heroCopy{position:relative;z-index:1}.heroCopy:before{content:"ARCHITECTURAL DRAWING / 2026";position:absolute;left:-58px;top:50%;transform:translate(-50%,-50%) rotate(-90deg);font:8px monospace;letter-spacing:.2em;color:#829087}.visual{isolation:isolate}.visual:before{content:"";position:absolute;inset:-35px -45px 35px 45px;border:1px solid #e88b525c;border-radius:50%;z-index:-1;transform:rotate(-8deg)}.visualNo{position:absolute;right:-28px;top:-34px;font:9px monospace;letter-spacing:.18em;color:var(--green);writing-mode:vertical-rl}.paper{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}.visual:hover .paper{transform:rotate(-.7deg) translateY(-8px);box-shadow:22px 28px 0 #445b5120,0 28px 70px #31433b2d}.button{position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}.button:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 #c7d2c8}.ticker{overflow:hidden;background:var(--orange);color:#fff;border-block:1px solid #d97d46}.ticker>div{display:flex;width:max-content;align-items:center;gap:28px;padding:11px 0;animation:move 28s linear infinite;font:700 10px Arial;letter-spacing:.22em}.ticker i{font-style:normal;color:#ffe6d3}@keyframes move{to{transform:translateX(-42%)}}.about{position:relative}.about:after{content:"02";position:absolute;right:6vw;top:55px;font:700 120px Georgia;color:#466d5c0a}.about h2:after,.sectionHead h2:after{content:"";display:block;width:52px;height:4px;background:var(--orange);margin-top:22px}.services{background:linear-gradient(135deg,#e9eee9 0 68%,#dfe8e1 68%)}.cards{perspective:1000px}.cards article{border-radius:2px;box-shadow:0 10px 0 #d5dfd7;position:relative;overflow:hidden}.cards article:after{content:"";position:absolute;width:90px;height:90px;border:1px solid #e88b5245;border-radius:50%;right:-48px;top:-48px}.cards article:nth-child(2){transform:translateY(24px)}.cards article:nth-child(2):hover{transform:translateY(16px)}.cards article:nth-child(3){transform:translateY(-12px)}.cards article:nth-child(3):hover{transform:translateY(-20px)}.dra{background-image:radial-gradient(circle at 12% 18%,#ffffff0c 0 1px,transparent 2px),linear-gradient(125deg,transparent 0 62%,#ffffff05 62%);background-size:28px 28px,auto}.draStamp{position:absolute!important;right:7vw;top:55px;width:92px;height:92px;border:1px solid #f2b17f99;border-radius:50%;display:grid;place-items:center;text-align:center;font:8px monospace!important;letter-spacing:.15em;color:#f2b17f!important;transform:rotate(10deg)}.dra .note{font-size:17px!important;line-height:1.9}.steps article{transition:background .25s,transform .25s}.steps article:hover{background:#f6f1e6;transform:translateY(-5px)}.contact{background-image:radial-gradient(circle at center,#fff9 0 2px,transparent 3px),linear-gradient(115deg,transparent 0 49.8%,#466d5c12 50%,transparent 50.2%);background-size:34px 34px,100% 100%}.contact h2{position:relative;display:inline-block}.contact h2:before{content:"ご相談ください";position:absolute;white-space:nowrap;left:50%;top:50%;transform:translate(-50%,-50%);font:700 clamp(65px,10vw,150px) serif;color:#466d5c08;z-index:0}
@media(max-width:850px){.heroCopy:before,.visualNo{display:none}.cards article:nth-child(n){transform:none}.cards article:nth-child(n):hover{transform:translateY(-5px)}.draStamp{right:25px;top:30px}}@media(max-width:520px){.visual:before{inset:-18px -16px 22px 20px}.ticker>div{animation-duration:20s}.about:after{font-size:76px}.draStamp{width:68px;height:68px;font-size:6px!important}.contact h2:before{display:none}}
.brand img{display:block;width:170px;height:54px;object-fit:contain;object-position:left center}.contact{position:relative}.contactLogo{position:absolute;width:185px;height:185px;object-fit:contain;right:6vw;top:50%;transform:translateY(-50%);opacity:.075;mix-blend-mode:multiply}footer .brand img{filter:invert(1);opacity:.9;width:150px}footer .brand{min-width:170px}@media(max-width:850px){.contactLogo{width:140px;height:140px;right:-18px}}@media(max-width:520px){.brand img{width:128px;height:43px}.contactLogo{display:none}footer .brand img{width:145px}}
.ticker>div{animation:none!important;transform:none!important}.hero h1>strong{font-family:Arial,sans-serif;font-size:.82em;letter-spacing:.01em;color:var(--green)}.draLead span{display:block}.draLead span+span{margin-top:10px}@media(max-width:520px){.draLead br{display:none}}

/* Layered architectural backgrounds */
body{background-color:var(--paper);background-image:radial-gradient(circle at 20% 10%,#e88b5208 0 1px,transparent 1.5px);background-size:18px 18px}.hero{position:relative;background-color:#f4f0e6;background-image:linear-gradient(105deg,#fffdf77a 0 48%,transparent 48%),linear-gradient(#466d5c0b 1px,transparent 1px),linear-gradient(90deg,#466d5c0b 1px,transparent 1px),radial-gradient(circle at 82% 18%,#e88b521a,transparent 30%);background-size:auto,34px 34px,34px 34px,auto}.hero:before{content:"";position:absolute;width:420px;height:420px;border:1px solid #466d5c1f;border-radius:50%;left:-230px;bottom:-210px;box-shadow:0 0 0 34px #466d5c09,0 0 0 68px #466d5c06}.hero:after{content:"A — 01";position:absolute;right:4.5vw;bottom:28px;font:9px monospace;letter-spacing:.22em;color:#789087}.hero>*{position:relative;z-index:1}.about{overflow:hidden;background-color:#fffdf8;background-image:linear-gradient(90deg,transparent 0 9.8%,#466d5c0c 10%,transparent 10.2%),linear-gradient(0deg,transparent 0 49.8%,#e88b5210 50%,transparent 50.2%),radial-gradient(ellipse at 90% 14%,#dfe9e25c,transparent 38%)}.about:before{content:"";position:absolute;width:310px;height:310px;border:1px dashed #466d5c20;border-radius:50%;right:-120px;bottom:-150px}.about>div{position:relative;z-index:1}.services{position:relative;overflow:hidden;background-color:#e7ede8;background-image:radial-gradient(#466d5c18 1px,transparent 1px),linear-gradient(132deg,transparent 0 72%,#f4e8d955 72%);background-size:22px 22px,auto}.services:before{content:"SERVICES / 03";position:absolute;right:5vw;top:35px;font:9px monospace;letter-spacing:.22em;color:#466d5c70}.services:after{content:"";position:absolute;left:-110px;bottom:-150px;width:320px;height:320px;border:1px solid #e88b5233;transform:rotate(45deg)}.services>*{position:relative;z-index:1}.dra{background-color:var(--deep);background-image:linear-gradient(118deg,transparent 0 57%,#ffffff06 57%),radial-gradient(circle at 15% 20%,#ffffff10 0 1px,transparent 1.5px),linear-gradient(#ffffff06 1px,transparent 1px),linear-gradient(90deg,#ffffff06 1px,transparent 1px);background-size:auto,26px 26px,70px 70px,70px 70px}.dra:before{content:"";position:absolute;width:500px;height:500px;border:1px solid #f2b17f24;border-radius:50%;left:-290px;top:-250px;box-shadow:0 0 0 42px #f2b17f08}.flow{position:relative;overflow:hidden;background-color:#fffdf8;background-image:repeating-linear-gradient(0deg,transparent 0 39px,#466d5c0a 40px),linear-gradient(120deg,#f2e8da4d,transparent 38%)}.flow:before{content:"PROCESS";position:absolute;right:-20px;top:20px;font:700 120px Georgia;color:#466d5c08;letter-spacing:.02em}.flow:after{content:"";position:absolute;right:7vw;bottom:42px;width:70px;height:70px;border:1px solid #e88b5240;border-radius:50%;box-shadow:0 0 0 10px #fffdf8,0 0 0 11px #e88b5225}.flow>*{position:relative;z-index:1}.contact{overflow:hidden;background-color:#f3e8da;background-image:radial-gradient(circle at 50% 45%,#fffdf7d9 0 2px,transparent 3px),linear-gradient(125deg,transparent 0 34%,#ffffff40 34% 64%,transparent 64%),linear-gradient(#466d5c0b 1px,transparent 1px),linear-gradient(90deg,#466d5c0b 1px,transparent 1px);background-size:34px 34px,auto,68px 68px,68px 68px}.contact:before,.contact:after{content:"";position:absolute;width:260px;height:260px;border:1px solid #466d5c1f;transform:rotate(45deg)}.contact:before{left:-165px;top:-150px}.contact:after{right:-165px;bottom:-150px}.contact>*{position:relative;z-index:1}footer{background-color:var(--ink);background-image:linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:80px 100%}
@media(max-width:520px){.hero:before{width:260px;height:260px;left:-180px;bottom:-130px}.about:before,.flow:after{display:none}.services:before{top:18px}.flow:before{font-size:72px;top:36px}.contact:before,.contact:after{width:170px;height:170px}}

/* Refined contact and footer */
.contact{min-height:560px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;background-color:#345d4d;background-image:linear-gradient(118deg,transparent 0 58%,#ffffff07 58%),linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px),radial-gradient(circle at 15% 20%,#e88b5227,transparent 28%);background-size:auto,70px 70px,70px 70px,auto}.contact:before{width:420px;height:420px;left:-250px;top:-230px;border:1px solid #f4b28645;border-radius:50%;transform:none;box-shadow:0 0 0 36px #f4b2860b,0 0 0 72px #f4b28608}.contact:after{width:140px;height:140px;right:7vw;bottom:60px;border:1px solid #f4b28665;border-radius:50%;transform:none;box-shadow:0 0 0 12px #345d4d,0 0 0 13px #f4b28630}.contact .label{color:#f5b181}.contact h2{color:#fff}.contact h2:before{color:#ffffff07}.contact>p:not(.label){color:#dce7e1}.contact .button{color:var(--ink);background:#f6efe2;box-shadow:6px 6px 0 #e88b52}.contact .button:hover{box-shadow:9px 9px 0 #e88b52}.contact>small{color:#bfcfc7}.contactIndex{position:absolute!important;left:6vw;top:55px;font:9px monospace;letter-spacing:.22em;color:#bcd0c6}.footerWordmark{display:flex;flex-direction:column;line-height:1}.footerWordmark b{font:700 22px Arial;letter-spacing:.28em}.footerWordmark small{font:7px Arial;letter-spacing:.42em;margin-top:8px;color:#9fb0a8}footer{padding-block:38px;border-top:1px solid #ffffff17;background:#233a31}footer>*{min-width:0}footer p{opacity:.72}@media(max-width:520px){.contact{min-height:520px}.contact:before{width:280px;height:280px;left:-200px;top:-160px}.contact:after{width:80px;height:80px;right:-30px;bottom:35px}.contactIndex{top:28px}.footerWordmark b{font-size:18px}footer{gap:24px}}
