@charset "UTF-8";

/* Owner-led workflow, styled as an editorial spread rather than a system diagram. */
#studio.studio-story{
  position:relative;overflow:hidden;padding:74px 0 82px;
  color:#38271e;background:#f3e9db url('../img/paper/paper-grain.svg') repeat;
  background-size:180px 180px;
}
#studio.studio-story:before,#studio.studio-story:after{
  content:"";position:absolute;width:155px;height:245px;pointer-events:none;
  background:url('../img/paper/botanical-sprig.svg') center/contain no-repeat;opacity:.22;
}
#studio.studio-story:before{left:-70px;top:148px;transform:rotate(-27deg)}
#studio.studio-story:after{right:-76px;bottom:130px;transform:rotate(148deg)}
.studio-story>.container{position:relative;z-index:1;max-width:1380px}
.studio-story__topline{display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid #b98562;padding:0 0 11px;color:#785b46;font:11px/1.5 Georgia,serif;letter-spacing:.18em}
.studio-story__topline span:last-child{font-family:"Noto Sans Thai","IBM Plex Sans Thai",sans-serif;letter-spacing:0}
.studio-story__heading{display:grid;grid-template-columns:minmax(0,1fr) 330px;align-items:end;gap:50px;margin:31px 0 35px}
.studio-story__eyebrow{display:block;color:#b16e47;font:700 12px/1.4 "IBM Plex Mono",monospace;letter-spacing:.16em;margin-bottom:11px}
.studio-story__heading h2{position:relative;margin:0;color:#39271e;font-family:"Noto Sans Thai","IBM Plex Sans Thai",sans-serif;font-size:clamp(39px,4.3vw,64px);line-height:1.2;letter-spacing:-.055em}
.studio-story__heading h2 em{position:relative;color:#40523b;font-style:normal}
.studio-story__heading h2 em:after{content:"";position:absolute;bottom:-5px;left:4%;width:77%;height:6px;border-radius:50%;background:#c87b50;transform:rotate(-1.5deg)}
.studio-story__heading>p{margin:0 0 7px;padding-left:24px;border-left:1px solid #cdb49a;color:#765d4a;font-size:17px;line-height:1.8}
.studio-story__grid{display:grid;grid-template-columns:minmax(0,.89fr) minmax(0,1.11fr);gap:22px;align-items:stretch}
.studio-story__editorial{position:relative;display:flex;flex-direction:column;min-height:540px;padding:43px 45px 40px;overflow:hidden;background:#40513b;color:#fff8e8;box-shadow:0 14px 27px #55432f25;clip-path:polygon(0 1%,11% 0,25% .7%,39% 0,54% .5%,70% 0,88% .6%,100% 0,99.5% 22%,100% 48%,99.5% 73%,100% 99%,86% 100%,70% 99%,51% 100%,32% 99.5%,14% 100%,0 99%,.5% 78%,0 53%)}
.studio-story__editorial:before{content:"";position:absolute;inset:0;background:url('../img/paper/paper-grain.svg') repeat;opacity:.19;pointer-events:none}
.studio-story__editorial:after{content:"";position:absolute;right:-58px;top:0;width:300px;height:360px;border:1px solid #fff7dd38;border-radius:50%;box-shadow:0 0 0 55px #fff7dd0a,0 0 0 110px #fff7dd08;pointer-events:none}
.studio-story__editorial>*{position:relative;z-index:1}
.studio-story__editorial>.studio-story__editorial-mark{position:absolute;z-index:0;right:18px;top:-33px;color:#f4e7c31d;font:400 290px/.95 Georgia,serif;transform:rotate(-10deg);user-select:none}
.studio-story__editorial-mark span{font-size:70px;vertical-align:top;margin-left:-35px;color:#dca87550}
.studio-story__mini{display:block;color:#e9cda6;font:600 11px/1.4 "IBM Plex Mono",monospace;letter-spacing:.17em}
.studio-story__editorial h3{font-size:clamp(32px,3vw,43px);letter-spacing:-.045em;line-height:1.3;color:#fff9ed;margin:31px 0 20px}
.studio-story__editorial p{max-width:490px;margin:0;color:#eee5d5;font-size:16px;line-height:1.92}
.studio-story__signature{display:flex;align-items:center;gap:13px;margin:24px 0 0;color:#e8d0ad;font:italic 14px/1.6 "Noto Sans Thai","IBM Plex Sans Thai",sans-serif}
.studio-story__signature-line{width:32px;height:1px;background:#d9aa77;flex:none}
.studio-story__actions{display:flex;flex-wrap:wrap;align-items:center;gap:25px;margin-top:auto;padding-top:27px}
.studio-story__primary{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:52px;padding:12px 19px;background:#f6e8cf;color:#3d4e38;border:1px solid #f9f1e1;border-radius:6px;box-shadow:3px 4px 0 #263824;font-size:15px;font-weight:700;transition:transform .2s,box-shadow .2s}
.studio-story__primary:hover{color:#3d4e38;transform:translateY(-4px);box-shadow:3px 8px 0 #263824}
.studio-story__primary span:last-child{font:25px/1 Georgia,serif}
.studio-story__textlink{display:inline-flex;align-items:center;gap:9px;border-bottom:1px solid #ddc09b;padding-bottom:4px;color:#f1e2ca;font-size:14px}
.studio-story__textlink:hover{color:#fff}.studio-story__textlink span:last-child{font-size:21px}
.studio-story__process{position:relative;padding:32px 35px 22px;background:#fffaf0;border:1px solid #d8bfa4;border-radius:3px;box-shadow:0 7px 0 #dfc9ac,0 17px 26px #59412b20}
.studio-story__process:before{content:"";position:absolute;top:-12px;right:70px;width:82px;height:24px;background:#d9bb9199;transform:rotate(7deg);clip-path:polygon(3% 0,100% 8%,96% 100%,0 87%);pointer-events:none}
.studio-story__process-head{display:flex;justify-content:space-between;gap:15px;align-items:center;padding-bottom:18px;border-bottom:1px solid #d9c5af;color:#8c674e;font:600 11px/1.5 "IBM Plex Mono",monospace;letter-spacing:.13em}
.studio-story__process-head span:first-child{font-family:"Noto Sans Thai","IBM Plex Sans Thai",sans-serif}
.studio-story__steps{position:relative;list-style:none;padding:0;margin:0}
.studio-story__steps:before{content:"";position:absolute;left:22px;top:45px;bottom:46px;width:1px;background:repeating-linear-gradient(to bottom,#bc9a77 0 5px,transparent 5px 10px)}
.studio-story__steps li{position:relative;display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:17px;align-items:start;padding:18px 0 17px;border-bottom:1px solid #e9dac8}
.studio-story__step-no{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#f1e4d1;border:1px solid #d7bea2;color:#a76d47;font:600 14px/1 "IBM Plex Mono",monospace;z-index:1}
.studio-story__steps h4{margin:1px 0 4px;color:#3b2a21;font-size:18px;line-height:1.4}
.studio-story__steps p{margin:0;color:#796656;font-size:13px;line-height:1.65}
.studio-story__step-tag{padding-top:7px;color:#a48b72;font:10px/1.5 "IBM Plex Mono",monospace;letter-spacing:.1em}
.studio-story__step-specialists{padding-bottom:20px!important}
.studio-story__specialists{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.studio-story__specialists>span{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid #ddc8af;border-radius:4px;background:#f8efe0;color:#5d4c3d;font-size:12px;line-height:1.35}
.studio-story__specialists i{color:#b67751;font:16px/1 Georgia,serif;font-style:normal}
.studio-story__step-final{border-bottom:0!important}
.studio-story__step-final .studio-story__step-no{background:#40513b;color:#fff9ed;border-color:#40513b}
.studio-story__step-final h4{color:#3e5039}
.studio-story__process-foot{display:flex;align-items:center;gap:10px;padding:12px 0 0;border-top:1px solid #d9c5af;color:#6e6655;font-size:12px;line-height:1.5}
.studio-story__pulse{width:7px;height:7px;flex:none;border-radius:50%;background:#607f57;box-shadow:0 0 0 4px #607f571c}
.studio-story__status.command-center__status{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:32px;border:1px solid #cbb69e;border-radius:3px;background:#f5ecdf;overflow:hidden}
.studio-story__status.command-center__status>div{position:relative;display:flex;flex-direction:column;gap:4px;min-height:104px;padding:19px 24px;background:transparent}
.studio-story__status.command-center__status>div+div{border-left:1px solid #d6c1aa}
.studio-story__status.command-center__status strong{color:#3f5039;font:700 clamp(22px,2vw,31px)/1.2 "Noto Sans Thai","IBM Plex Sans Thai",sans-serif;letter-spacing:-.03em}
.studio-story__status.command-center__status small{color:#796655;font:12px/1.5 "Noto Sans Thai","IBM Plex Sans Thai",sans-serif;letter-spacing:0}
.studio-story__status.command-center__status>div:last-child strong{font-size:clamp(18px,1.75vw,26px)}
@media(max-width:1050px){.studio-story__heading{grid-template-columns:1fr;gap:18px}.studio-story__heading>p{max-width:580px}.studio-story__grid{grid-template-columns:1fr}.studio-story__editorial{min-height:400px}.studio-story__status.command-center__status{grid-template-columns:repeat(2,minmax(0,1fr))}.studio-story__status.command-center__status>div:nth-child(3){border-left:0;border-top:1px solid #d6c1aa}.studio-story__status.command-center__status>div:nth-child(4){border-top:1px solid #d6c1aa}}
@media(max-width:640px){#studio.studio-story{padding:47px 0 56px}.studio-story__topline{font-size:9px}.studio-story__heading{margin:24px 0 27px}.studio-story__heading h2{font-size:clamp(33px,8.4vw,48px)}.studio-story__heading>p{padding-left:16px;font-size:14px}.studio-story__grid{gap:19px}.studio-story__editorial{min-height:0;padding:32px 26px 31px}.studio-story__editorial-mark{font-size:200px}.studio-story__editorial h3{font-size:31px;margin:24px 0 13px}.studio-story__editorial p{font-size:14px;line-height:1.8}.studio-story__signature{font-size:12px}.studio-story__actions{gap:17px;margin-top:24px;padding-top:0}.studio-story__primary{min-height:45px;font-size:13px}.studio-story__textlink{font-size:12px}.studio-story__process{padding:24px 20px 18px}.studio-story__steps li{grid-template-columns:38px minmax(0,1fr);gap:12px;padding:15px 0}.studio-story__steps:before{left:18px}.studio-story__step-no{width:36px;height:36px;font-size:12px}.studio-story__steps h4{font-size:16px}.studio-story__steps p{font-size:12px}.studio-story__step-tag{display:none}.studio-story__specialists>span{font-size:11px}.studio-story__status.command-center__status{margin-top:27px}.studio-story__status.command-center__status>div{min-height:94px;padding:16px 14px}.studio-story__status.command-center__status strong{font-size:22px}.studio-story__status.command-center__status>div:last-child strong{font-size:17px}.studio-story__status.command-center__status small{font-size:10px}}
@media(prefers-reduced-motion:reduce){.studio-story__primary{transition:none}}