/* Self-hosted Google Fonts, SIL OFL licences in /assets/fonts/. Browser loads only matching unicode subsets. */
@font-face{font-family:'Archivo';font-style:normal;font-weight:500 900;font-display:swap;src:url('/assets/fonts/archivo-v25-latin-ext-variable.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500 900;font-display:swap;src:url('/assets/fonts/archivo-v25-latin-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/inter-v20-latin-ext-variable.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/inter-v20-latin-variable.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:300;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-300.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-400.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-500.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-600.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-700.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-800.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:300;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-ext-300.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-ext-400.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-ext-500.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-ext-600.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-ext-700.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/fonts/kanit-v17-latin-ext-800.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:300;font-display:swap;src:url('/assets/fonts/kanit-v17-thai-300.woff2') format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/kanit-v17-thai-400.woff2') format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/kanit-v17-thai-500.woff2') format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/kanit-v17-thai-600.woff2') format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/kanit-v17-thai-700.woff2') format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;}
@font-face{font-family:'Kanit';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/fonts/kanit-v17-thai-800.woff2') format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;}

:root{
  --paper:#FEFAF0;
  --paper-alt:#FEFAF0;
  --panel:#FEFAF0;
  --ink:#111111;
  --grey:#696965;
  --grey-light:#8D8D86;
  --line:#E4DDCE;
  --blue:#173B78;
  --blue-dark:#173B78;
  --blue-tint:color-mix(in srgb, #173B78 10%, #FEFAF0);
  --red:#E22831;
  --on-red:#000000;
  --red-tint:color-mix(in srgb, #E22831 10%, #FEFAF0);
  --yellow:#FFF0A8;
  --yellow-tint:#FFF0A8;
  --green:#0EA87D;
  --green-tint:color-mix(in srgb, #0EA87D 10%, #FEFAF0);
  --pink:#F7938A;
  --coral:#FC604F;
  --blue-soft:#658ECB;
  --radius:24px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:#FEFAF0;
  color:var(--ink);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.lang-th{font-family:'Kanit','Inter',sans-serif;}
body.lang-th :is(h1,.page-heading),body.lang-th h2,body.lang-th h3,body.lang-th .display,
body.lang-th .num,body.lang-th .value-item .num,body.lang-th .stat .num,
body.lang-th .pull-quote,body.lang-th .logo,body.lang-th .marquee-name{
  font-family:'Kanit','Archivo',sans-serif;
  text-transform:none;
}
:is(h1,.page-heading),h2,h3,.display{
  font-family:'Archivo',sans-serif;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:-0.01em;
  line-height:0.94;
}
body.lang-th :is(h1,.page-heading),body.lang-th h2,body.lang-th h3{line-height:1.25;letter-spacing:0;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}
img,svg{display:block;max-width:100%;}
.wrap{max-width:1240px;margin:0 auto;padding:0 40px;}
.eyebrow{
  font-family:'Inter',sans-serif;
  font-weight:600;
  font-size:13px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--blue);
  display:flex;align-items:center;gap:10px;
  margin-bottom:18px;
}
body.lang-th .eyebrow{font-family:'Kanit','Inter',sans-serif;letter-spacing:0.02em;}
.eyebrow::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--blue);
  flex-shrink:0;animation:dotpulse 2.6s ease-in-out infinite;
}
@keyframes dotpulse{
  0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(23,59,120,.45);}
  50%{transform:scale(1.35);box-shadow:0 0 0 6px rgba(23,59,120,0);}
}
@media(prefers-reduced-motion:reduce){.eyebrow::before{animation:none;}}
p.lede{font-size:19px;line-height:1.6;color:var(--grey);max-width:520px;}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 28px;border-radius:100px;
  font-weight:600;font-size:15px;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
}
.btn-primary{background:var(--blue);color:var(--panel);box-shadow:0 8px 0 var(--ink);}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 11px 0 var(--ink);}
.btn-outline{border:1.5px solid var(--ink);color:var(--ink);}
.btn-outline:hover{background:var(--ink);color:var(--paper);transform:translateY(-2px);}
.btn-arrow{transition:transform .25s ease;}
.btn:hover .btn-arrow{transform:translateX(4px);}

/* ---------- LANG SWITCH ---------- */
.lang-switch{position:relative;flex-shrink:0;}
.lang-current{
  display:flex;align-items:center;gap:8px;
  padding:9px 14px;border-radius:100px;border:1.5px solid var(--line);
  font-size:14px;font-weight:600;color:var(--ink);background:#FEFAF0;
  transition:border-color .2s ease;
}
.lang-current:hover{border-color:var(--ink);}
.lang-flag{width:20px;height:14px;border-radius:2px;overflow:hidden;flex-shrink:0;display:block;}
.lang-caret{transition:transform .2s ease;}
.lang-switch.open .lang-caret{transform:rotate(180deg);}
.lang-menu{
  position:absolute;top:calc(100% + 8px);right:0;background:#FEFAF0;border:1px solid var(--line);
  border-radius:14px;box-shadow:0 16px 32px -12px rgba(20,20,20,.18);
  min-width:150px;padding:6px;opacity:0;pointer-events:none;transform:translateY(-6px);
  transition:opacity .18s ease, transform .18s ease;z-index:200;
}
.lang-switch.open .lang-menu{opacity:1;pointer-events:auto;transform:translateY(0);}
.lang-option{
  display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:9px;
  font-size:14px;font-weight:500;color:var(--ink);transition:background .15s ease;
}
.lang-option:hover{background:var(--paper-alt);}
.lang-option.active{font-weight:700;}
.lang-option.active::after{content:"✓";margin-left:auto;color:var(--blue);}

/* ---------- NAV ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(254,250,240,.90);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 40px;max-width:1240px;margin:0 auto;
}
.logo{
  display:flex;align-items:center;gap:10px;
  font-family:'Archivo',sans-serif;font-weight:800;font-size:19px;
  text-transform:none;letter-spacing:-0.01em;cursor:pointer;
}
.logo-mark{width:30px;height:30px;flex-shrink:0;}
.brand-logo{display:block;width:100px;height:41px;background:url('/assets/end-logo.png') center 49% / 156% auto no-repeat;}
.footer-brand-logo{width:100px;height:41px;}
.navlinks{display:flex;gap:38px;}
.navlinks a{
  font-size:15px;font-weight:500;color:var(--grey);
  position:relative;padding:6px 0;transition:color .2s ease;
}
.navlinks a::after{
  content:"";position:absolute;bottom:0;left:0;right:0;height:2px;
  background:var(--blue);transform:scaleX(0);transform-origin:left;
  transition:transform .25s ease;
}
.navlinks a.active,.navlinks a:hover{color:var(--ink);}
.navlinks a.active::after{transform:scaleX(1);}
.nav-right{display:flex;align-items:center;gap:20px;}
.admin-link{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);color:var(--grey);background:#FEFAF0;flex-shrink:0;transition:border-color .2s,color .2s,background .2s;}
.admin-link.show{display:inline-flex;}
.admin-link:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-tint);}
.admin-link-m{display:none;}
.admin-link-m.show{display:block;margin-top:14px;text-align:center;padding:12px;border:1.5px solid var(--line);border-radius:100px;font-weight:600;font-size:15px;color:var(--ink);}
.burger{display:none;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:42px;height:42px;flex-shrink:0;}
.burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .28s ease, opacity .2s ease;}
header.menu-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
header.menu-open .burger span:nth-child(2){opacity:0;}
header.menu-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-menu{display:none;flex-direction:column;background:var(--paper);border-top:1px solid var(--line);padding:10px 40px 26px;}
.mobile-menu a:not(.btn){text-align:left;padding:14px 2px;font-size:17px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--line);}
.mobile-menu .btn{margin-top:18px;justify-content:center;}
header.menu-open .mobile-menu{display:flex;}

/* ---------- PAGES ---------- */
.page{display:none;padding-top:88px;}
.page.active{display:block;}
section{padding:120px 0;position:relative;}
section.tight{padding:90px 0;}
.divider{max-width:1240px;margin:0 auto;padding:0 40px;}
.wobble-rule{width:100%;height:26px;}

/* ---------- HERO ---------- */
.hero{padding-top:84px;padding-bottom:96px;min-height:690px;display:flex;align-items:center;}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:60px;align-items:center;}
.hero :is(h1,.page-heading){font-size:clamp(58px,7.2vw,104px);line-height:.84;letter-spacing:-.065em;margin:24px 0 30px;}
.hero :is(h1,.page-heading) .accent{color:var(--red);}
.hero-actions{display:flex;align-items:center;gap:22px;margin-top:38px;flex-wrap:wrap;}
.hero-illustration{position:relative;isolation:isolate;}
.hero-illustration::before,.hero-illustration::after{content:"";position:absolute;border:2px solid var(--ink);z-index:-1;}
.hero-illustration::before{width:92px;height:92px;border-radius:50%;background:var(--yellow);right:2%;top:3%;transform:rotate(8deg);}
.hero-illustration::after{width:70px;height:70px;border-radius:20px;background:var(--green);left:4%;bottom:8%;transform:rotate(-12deg);}
.hero-illustration>svg{position:relative;z-index:1;}

/* ---------- E N D HOMEPAGE HERO ---------- */
.home-hero{position:relative;overflow:hidden;padding:66px 0 82px;min-height:730px;background:var(--paper);}
.home-hero .hero-grid{grid-template-columns:1.02fr .98fr;gap:54px;align-items:center;}
.home-hero .hero-copy{display:flex;flex-direction:column;justify-content:center;}
.home-hero .hero-copy .eyebrow::before{background:var(--red);box-shadow:0 0 0 5px rgba(226,40,49,.10);}
.home-hero .hero-copy :is(h1,.page-heading){font-size:clamp(62px,6.7vw,98px);line-height:.82;letter-spacing:-.075em;margin:28px 0 30px;}
.home-hero .hero-copy :is(h1,.page-heading) .accent{color:var(--red);}
.home-hero .hero-copy :is(h1,.page-heading) .outline{color:transparent;-webkit-text-stroke:2px var(--blue);text-stroke:2px var(--blue);}
.home-hero .lead{max-width:620px;color:var(--grey);font-size:18px;line-height:1.7;}
.home-hero .actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:32px;}
.home-hero .hero-kicker{display:flex;align-items:center;flex-wrap:wrap;gap:11px;margin-top:32px;font-family:'Archivo';font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--grey);}
.home-hero .hero-kicker i{width:5px;height:5px;border-radius:50%;background:var(--red);}
.hero-showcase{position:relative;min-height:570px;display:flex;align-items:center;justify-content:center;padding:44px 34px;border:2px solid var(--ink);border-radius:38px;background:var(--blue);box-shadow:9px 9px 0 var(--ink);overflow:visible;isolation:isolate;}
.hero-showcase::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background-image:linear-gradient(rgba(254,250,240,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(254,250,240,.08) 1px,transparent 1px);background-size:42px 42px;}
.showcase-card{width:100%;max-width:500px;padding:22px 22px 28px;border:2px solid var(--ink);border-radius:28px;background:var(--panel);box-shadow:7px 7px 0 var(--ink);transform:rotate(-2deg);}
.showcase-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1.5px solid var(--ink);font-family:'Archivo';font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;}
.showcase-dots{display:flex;gap:5px;}
.showcase-dots i{width:9px;height:9px;border:1px solid var(--ink);border-radius:50%;}
.showcase-dots i:nth-child(1){background:var(--red);}.showcase-dots i:nth-child(2){background:var(--yellow);}.showcase-dots i:nth-child(3){background:var(--blue);}
.tile-stage{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:52px 4px 18px;}
.end-tile{position:relative;display:grid;place-items:center;aspect-ratio:1;border:2px solid var(--ink);border-radius:24%;box-shadow:4px 4px 0 var(--ink);font-family:'Archivo';font-size:clamp(58px,6vw,86px);font-weight:900;line-height:1;color:var(--paper);animation:tileEnergy 3.4s ease-in-out infinite;}
.end-tile::after{content:"";position:absolute;top:13%;right:13%;width:17%;aspect-ratio:1;}
.end-tile:nth-child(1){background:#173B78;transform:rotate(-5deg);}.end-tile:nth-child(1)::after{border-radius:50%;background:#FC604F;}
.end-tile:nth-child(2){background:#E22831;animation-delay:-1.1s;}.end-tile:nth-child(2)::after{background:#FFF0A8;transform:rotate(45deg);}
.end-tile:nth-child(3){background:#FFF0A8;color:var(--ink);transform:rotate(4deg);animation-delay:-2.2s;}.end-tile:nth-child(3)::after{border-radius:50%;background:#0EA87D;}
.tile-label{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;text-align:center;font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--grey);}
.showcase-stamp{position:absolute;left:18px;bottom:16px;z-index:2;display:grid;place-items:center;width:92px;height:92px;border:2px solid var(--ink);border-radius:50%;background:var(--red);color:var(--paper);box-shadow:4px 4px 0 var(--ink);font-family:'Archivo';font-size:15px;font-weight:900;line-height:.9;text-align:center;animation:stampMove 3.2s ease-in-out infinite;}
.showcase-note{position:absolute;right:-26px;top:-24px;z-index:3;padding:14px 20px;border:2px solid var(--ink);border-radius:100px;background:var(--yellow);box-shadow:4px 4px 0 var(--ink);font-family:'Archivo';font-size:14px;font-weight:900;letter-spacing:.045em;transform:rotate(3deg);}
@keyframes tileEnergy{0%,100%{translate:0 0;rotate:0deg;}50%{translate:0 -12px;rotate:2deg;}}
@keyframes stampMove{0%,100%{transform:translateY(0) rotate(9deg);}50%{transform:translateY(-13px) rotate(-5deg);}}

/* ---------- KINETIC TICKER ---------- */
.end-ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:var(--panel);}
.end-ticker-track{display:flex;width:max-content;animation:endTicker 26s linear infinite;}
.end-ticker span{padding:20px 30px;font-size:13px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap;}
.end-ticker span::after{content:"✦";color:var(--red);margin-left:58px;}
@keyframes endTicker{to{transform:translateX(-50%);}}

/* ---------- KINETIC TYPE ---------- */
.kinetic-section{padding:0;background:var(--ink);overflow:hidden;}
.kinetic-wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);min-height:650px;}
.kinetic-stage{position:relative;min-height:650px;overflow:hidden;isolation:isolate;background:var(--blue);}
.kinetic-stage::before{content:"";position:absolute;inset:-18%;z-index:-1;border-radius:50%;background:var(--red);transform:scale(0);animation:kineticWash 8s cubic-bezier(.75,0,.2,1) infinite;}
.kinetic-grid{position:absolute;inset:0;opacity:.14;background-image:linear-gradient(rgba(255,255,255,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.35) 1px,transparent 1px);background-size:52px 52px;}
.kinetic-word{position:absolute;inset:0;display:grid;place-items:center;padding:8%;color:var(--panel);font-family:'Archivo',sans-serif;font-size:clamp(72px,11vw,160px);font-weight:900;line-height:.78;letter-spacing:-.08em;text-align:center;text-transform:uppercase;opacity:0;}
.kinetic-word span{display:block;}
.kinetic-word.one{animation:kineticOne 8s cubic-bezier(.65,0,.35,1) infinite;}
.kinetic-word.two{color:var(--yellow);animation:kineticTwo 8s cubic-bezier(.65,0,.35,1) infinite;}
.kinetic-word.three{animation:kineticThree 8s cubic-bezier(.65,0,.35,1) infinite;}
.kinetic-word.four{color:var(--ink);font-size:clamp(58px,8.8vw,128px);animation:kineticFour 8s cubic-bezier(.65,0,.35,1) infinite;}
.kinetic-badge{position:absolute;z-index:3;left:28px;top:28px;width:74px;height:74px;display:grid;place-items:center;border:2px solid currentColor;border-radius:50%;color:var(--panel);font-size:12px;font-weight:900;letter-spacing:.08em;animation:kineticSpin 12s linear infinite;}
.kinetic-copy{display:flex;flex-direction:column;justify-content:space-between;padding:64px;background:var(--ink);color:var(--panel);}
.kinetic-copy .eyebrow{color:var(--yellow);}
.kinetic-copy h2{font-size:clamp(38px,3.6vw,54px);line-height:.94;letter-spacing:-.04em;margin-top:18px;overflow-wrap:anywhere;}
.kinetic-copy p{max-width:420px;margin:30px 0 0;color:#aaa9a4;font-size:17px;line-height:1.65;}
.kinetic-progress{display:flex;gap:8px;margin-top:55px;}
.kinetic-progress i{flex:1;height:3px;background:rgba(255,255,255,.2);overflow:hidden;}
.kinetic-progress i::after{content:"";display:block;width:100%;height:100%;background:var(--red);transform:translateX(-100%);animation:kineticProgress 8s linear infinite;}
.kinetic-progress i:nth-child(2)::after{animation-delay:2s;}
.kinetic-progress i:nth-child(3)::after{animation-delay:4s;}
.kinetic-progress i:nth-child(4)::after{animation-delay:6s;}
@keyframes kineticWash{0%,48%{transform:scale(0);}60%,88%{transform:scale(1);}100%{transform:scale(0);}}
@keyframes kineticOne{0%{opacity:0;transform:translateY(70%) scale(.8);}6%,19%{opacity:1;transform:none;}25%,100%{opacity:0;transform:translateY(-70%) scale(1.12);}}
@keyframes kineticTwo{0%,22%{opacity:0;transform:translateX(-75%) rotate(-8deg);}29%,43%{opacity:1;transform:none;}49%,100%{opacity:0;transform:translateX(75%) rotate(8deg);}}
@keyframes kineticThree{0%,46%{opacity:0;transform:scale(.15) rotate(-12deg);}54%,68%{opacity:1;transform:scale(1);}74%,100%{opacity:0;transform:scale(2.2) rotate(8deg);}}
@keyframes kineticFour{0%,71%{opacity:0;transform:translateY(55%);}79%,94%{opacity:1;transform:none;}100%{opacity:0;transform:translateY(-35%);}}
@keyframes kineticSpin{to{transform:rotate(360deg);}}
@keyframes kineticProgress{0%{transform:translateX(-100%);}25%,100%{transform:translateX(100%);}}

/* ---------- END METHOD ---------- */
.end-method{background:#ffffff;color:var(--ink);overflow:hidden;}
.end-method-head{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(50px,8vw,120px);align-items:end;margin-bottom:72px;}
.end-method .eyebrow{margin-bottom:18px;color:var(--blue);}
.end-method .eyebrow::before{background:var(--red);}
.end-method h2{max-width:680px;font-size:clamp(48px,5vw,64px);line-height:.9;letter-spacing:-.065em;}
.end-method h2 .accent{color:var(--red);}
.end-method-intro{max-width:500px;padding-bottom:7px;color:var(--grey);font-size:17px;line-height:1.7;}
.method-track{position:relative;margin:0 auto 18px;width:72%;height:18px;border-top:2px dashed rgba(105,105,101,.35);}
.method-track::after{content:"";position:absolute;width:14px;height:14px;left:73%;top:-8px;border:2px solid var(--ink);border-radius:50%;background:#FC604F;}
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.method-card{position:relative;display:flex;flex-direction:column;min-height:420px;padding:28px 28px 24px;border:2px solid var(--ink);border-radius:22px;box-shadow:7px 7px 0 var(--ink);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;}
.method-card:hover{transform:translate(-3px,-3px);box-shadow:10px 10px 0 var(--ink);}
.method-card.experience{background:var(--blue);color:var(--paper);}
.method-card.need{background:var(--red);color:var(--paper);}
.method-card.design{background:var(--yellow);color:var(--ink);}
.method-meta{display:flex;justify-content:space-between;gap:16px;font-size:9px;font-weight:900;letter-spacing:.15em;text-transform:uppercase;}
.method-letter{margin:28px 0 16px;font-family:'Archivo';font-size:clamp(82px,9vw,132px);font-weight:900;line-height:.72;letter-spacing:-.08em;}
.method-card h3{margin-bottom:12px;font-size:24px;font-weight:800;letter-spacing:-.025em;text-transform:none;}
.method-card p{max-width:360px;font-size:14px;line-height:1.6;opacity:.76;}
.method-symbol{position:absolute;display:grid;place-items:center;width:58px;height:58px;right:26px;top:77px;border:2px solid currentColor;border-radius:50%;font-family:'Archivo';font-size:22px;font-weight:900;}
.method-card.need .method-symbol{border-radius:16px;transform:rotate(9deg);}
.method-card.design .method-symbol{border-radius:50% 50% 12px 50%;}
.method-card-rule{margin-top:auto;padding-top:18px;border-top:1px solid currentColor;font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;opacity:.7;}
.method-card-rule::before{content:"";display:inline-block;width:6px;height:6px;margin-right:8px;border-radius:50%;background:currentColor;vertical-align:1px;}
.method-equation{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1.4fr;align-items:center;gap:22px;margin-top:70px;padding:20px 24px;border:2px solid var(--ink);border-radius:18px;font-family:'Archivo';font-size:12px;font-weight:900;letter-spacing:.08em;text-align:center;text-transform:uppercase;}
.method-equation .operator{color:var(--red);font-size:22px;}
.method-equation strong{padding:15px 24px;border-radius:10px;background:var(--ink);color:var(--paper);font-size:13px;letter-spacing:0;text-transform:none;}

/* ---------- HOMEPAGE SERVICES INTRO ---------- */
.home-services{background:#FEFAF0;}
.home-services .shell{max-width:1240px;margin:0 auto;padding:0 40px;}
.home-services .services{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px;align-items:start;}
.home-services .services-intro{position:sticky;top:126px;}
.home-services .services-intro h2{font-size:clamp(40px,4.8vw,64px);margin:18px 0 22px;}
.home-services .section-copy{max-width:480px;color:var(--grey);font-size:18px;line-height:1.75;}
.home-services .service-list{border-top:1px solid var(--line);}
.home-services .service{display:grid;grid-template-columns:66px 1fr auto;gap:20px;align-items:start;padding:30px 0;border-bottom:1px solid var(--line);}
.home-services .service-number{font-family:'Archivo';font-size:13px;font-weight:900;letter-spacing:.1em;color:var(--red);padding-top:5px;}
.home-services .service h3{font-size:22px;font-weight:800;text-transform:none;letter-spacing:-.02em;margin-bottom:9px;}
.home-services .service p{max-width:520px;color:var(--grey);font-size:15px;line-height:1.65;}
.home-services .service-arrow{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--ink);border-radius:50%;font-size:18px;transition:transform .2s ease,background .2s ease;}
.home-services .service:hover .service-arrow{transform:rotate(45deg);background:var(--yellow);}

/* ---------- SERVICES SHOWCASE ---------- */
.services-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:64px;flex-wrap:wrap;}
.services-head h2{font-size:clamp(34px,4.4vw,58px);max-width:520px;}
.services-showcase{position:relative;overflow:hidden;background:#111111;color:var(--paper);}
.services-showcase>.ring{display:none;}
.services-showcase .services-head{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;align-items:end;gap:clamp(48px,8vw,120px);margin-bottom:62px;}
.services-showcase .services-head h2{max-width:650px;font-size:clamp(46px,4.5vw,60px);line-height:.9;letter-spacing:-.06em;}
.services-showcase .eyebrow{color:var(--yellow);}
.services-showcase .eyebrow::before{background:var(--red);box-shadow:0 0 0 4px rgba(226,40,49,.2);}
.services-intro-copy{max-width:500px;color:rgba(254,250,240,.62);font-size:16px;line-height:1.7;}
.service-grid{counter-reset:service-card;display:grid;grid-template-columns:repeat(12,1fr);gap:18px;position:relative;z-index:1;}
.service-card{counter-increment:service-card;position:relative;display:flex;flex-direction:column;min-height:238px;padding:28px 30px 25px;border:0;border-radius:22px;background:var(--panel);color:var(--ink);box-shadow:none;overflow:hidden;transition:transform .24s ease,box-shadow .24s ease;}
.service-card-link,.svc-detail-link{position:absolute;inset:0;z-index:6;border-radius:inherit;}
.service-card-link:focus-visible,.svc-detail-link:focus-visible{outline:3px solid var(--blue);outline-offset:-4px;}
.service-card:nth-child(1){grid-column:span 7;background:var(--yellow);}
.service-card:nth-child(2){grid-column:span 5;background:var(--red);color:var(--paper);}
.service-card:nth-child(3){grid-column:span 4;background:var(--blue);color:var(--paper);}
.service-card:nth-child(4){grid-column:span 8;background:#0EA87D;}
.service-card:nth-child(5){grid-column:span 5;background:var(--panel);}
.service-card:nth-child(6){grid-column:span 7;background:#FC604F;}
.service-card::before{content:attr(data-kicker);position:relative;z-index:2;display:block;padding-right:60px;font-family:'Archivo';font-size:9px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;}
.service-card::after{content:attr(data-mark);position:absolute;right:-12px;bottom:-35px;font-family:'Archivo';font-size:clamp(105px,11vw,170px);font-weight:900;line-height:1;color:currentColor;opacity:.08;}
.service-card:hover{transform:translate(-5px,-5px);box-shadow:10px 10px 0 var(--yellow);}
.service-card .ico{position:absolute;z-index:2;right:22px;top:22px;width:42px;height:42px;margin:0;padding:9px;border:2px solid currentColor;border-radius:12px;transform:rotate(-4deg);transition:transform .24s ease;}
.service-card:hover .ico{transform:rotate(5deg) scale(1.05);}
.service-card .ico [stroke]{stroke:currentColor!important;}
.service-card .ico [fill="#173B78"]{fill:currentColor!important;}
.service-card h3{position:relative;z-index:2;max-width:520px;margin-top:auto;margin-bottom:10px;font-size:clamp(25px,2.5vw,34px);line-height:1;text-transform:none;font-weight:900;letter-spacing:-.045em;color:currentColor;}
.service-card p{position:relative;z-index:2;max-width:560px;font-size:13px;font-weight:500;color:currentColor;line-height:1.55;opacity:.72;}
.service-tags{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:6px;margin-top:13px;}
.service-tags span{padding:4px 8px;border:1px solid currentColor;border-radius:100px;font-size:8px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;opacity:.75;}

/* ---------- WORK PREVIEW ---------- */
.home-projects{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.project-index-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:70px;align-items:end;margin-bottom:54px;}
.project-index-head h2{max-width:700px;font-size:clamp(52px,6vw,86px);line-height:.86;letter-spacing:-.075em;}
.project-index-intro{max-width:360px;margin:0 0 7px auto;color:var(--grey);font-size:15px;line-height:1.65;}
.project-index-layout{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(380px,.96fr);gap:42px;align-items:stretch;}
.project-feature{--project-color:var(--green);position:relative;min-height:500px;overflow:hidden;border:2px solid var(--ink);border-radius:24px;background:var(--project-color);color:var(--ink);box-shadow:8px 8px 0 var(--ink);isolation:isolate;transition:background .28s ease,transform .28s ease;}
.project-feature:hover{transform:translate(-3px,-3px);}
.project-feature::before,.project-feature::after{content:"";position:absolute;z-index:-1;border:2px solid currentColor;border-radius:50%;opacity:.15;}
.project-feature::before{width:240px;height:240px;right:-50px;top:100px;}
.project-feature::after{width:100px;height:100px;right:72px;top:205px;}
.project-feature.has-image::before{z-index:1;inset:0;width:auto;height:auto;border:0;border-radius:0;background:linear-gradient(180deg,rgba(0,0,0,.26) 0%,rgba(0,0,0,.04) 44%,rgba(0,0,0,.68) 100%);opacity:1;}
.project-feature.has-image::after{display:none;}
.project-feature-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .55s ease;}
.project-feature:hover .project-feature-image{transform:scale(1.035);}
.project-feature-link{position:relative;z-index:2;display:flex;min-height:500px;height:100%;flex-direction:column;padding:24px;color:inherit;}
.project-feature-top,.project-feature-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:9px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;}
.project-feature-title{max-width:92%;margin:auto 0;font-size:clamp(58px,7.3vw,108px);font-weight:900;line-height:.78;letter-spacing:-.09em;text-transform:uppercase;overflow-wrap:anywhere;}
.project-feature.has-image .project-feature-title{max-width:80%;margin:auto 0 20px;font-size:clamp(34px,4.2vw,62px);line-height:.88;letter-spacing:-.06em;text-shadow:0 2px 20px rgba(0,0,0,.24);}
.project-feature-bottom{font-size:11px;letter-spacing:0;text-transform:none;}
.project-index-list{align-self:center;border-top:2px solid var(--ink);}
.project-index-item{width:100%;display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:16px;align-items:center;padding:22px 8px;border-bottom:1px solid var(--line);background:#fff;color:var(--ink);text-align:left;transition:background .2s ease,padding .2s ease;}
.project-index-item:hover,.project-index-item:focus-visible,.project-index-list:hover .project-index-item.active{padding-left:16px;background:#f1eee6;}
.project-index-number{color:var(--red);font-size:10px;font-weight:800;letter-spacing:.08em;}
.project-index-copy strong{display:block;font-size:clamp(21px,2vw,30px);line-height:1;font-weight:800;letter-spacing:-.045em;}
.project-index-copy span{display:block;margin-top:7px;color:var(--grey);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.project-index-year{font-size:9px;font-weight:700;}
.project-index-note{margin-top:18px;color:var(--grey-light);font-size:11px;line-height:1.5;}
.project-index-all{margin-top:22px;}

/* ---------- CTA BAND ---------- */
.cta-band{background:var(--blue);color:var(--panel);border:2px solid var(--ink);border-radius:40px;margin:0 40px;padding:90px 60px;text-align:center;position:relative;overflow:hidden;box-shadow:10px 10px 0 var(--ink);}
.cta-band h2{color:#FEFAF0;font-size:clamp(34px,5vw,64px);margin-bottom:30px;}
.cta-band h2 .accent{color:var(--yellow);}
.cta-band p{color:var(--panel);max-width:460px;margin:0 auto 36px;font-size:17px;}
.cta-band .btn-primary{background:var(--yellow);color:var(--ink);}
.work-cta{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(340px,.88fr);gap:34px;min-height:430px;padding:34px;text-align:left;}
.work-cta-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:34px 26px;}
.work-cta .eyebrow{margin-bottom:18px;color:var(--yellow);}
.work-cta .eyebrow::before{background:var(--red);}
.work-cta h2{max-width:650px;margin:0 0 24px;font-size:clamp(42px,5.4vw,72px)!important;line-height:.88;letter-spacing:-.06em;}
.work-cta p{max-width:540px;margin:0 0 34px;color:rgba(254,250,240,.75);font-size:17px;line-height:1.55;}
.work-cta-play{position:relative;display:grid;place-items:center;min-height:350px;overflow:hidden;border:2px solid var(--ink);border-radius:28px;background:var(--yellow);box-shadow:7px 7px 0 var(--ink);}
.work-cta-play-label{position:absolute;top:22px;left:24px;color:var(--ink);font-family:'Archivo';font-size:9px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;}
.work-cta-play::after{content:"YOUR IDEA / OUR PROCESS";position:absolute;right:24px;bottom:20px;color:var(--ink);font-family:'Archivo';font-size:8px;font-weight:900;letter-spacing:.12em;}
.work-cta-orbit{position:absolute;width:min(72%,360px);aspect-ratio:1;border:2px solid rgba(17,17,17,.16);border-radius:50%;animation:work-cta-orbit 14s linear infinite;}
.work-cta-orbit::before,.work-cta-orbit::after{content:"";position:absolute;border:2px solid rgba(17,17,17,.13);border-radius:50%;}
.work-cta-orbit::before{inset:18%;}.work-cta-orbit::after{inset:39%;background:rgba(254,250,240,.2);}
.work-cta-orbit i{position:absolute;z-index:1;width:24px;height:24px;border:2px solid var(--ink);border-radius:50%;background:var(--red);box-shadow:3px 3px 0 var(--ink);}
.work-cta-orbit i:nth-child(1){left:7%;top:18%;}.work-cta-orbit i:nth-child(2){right:4%;top:42%;background:#0EA87D;}.work-cta-orbit i:nth-child(3){left:35%;bottom:-10px;background:var(--blue);}
.work-cta-tiles{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;margin-top:4px;--tile-size:145px;--tile-active:245px;}
.work-cta-tile{position:relative;display:flex;align-items:center;width:var(--tile-size);height:var(--tile-size);padding:0 22px;overflow:hidden;border:2px solid var(--ink);border-radius:22px;color:var(--paper);font-family:'Archivo';font-weight:900;line-height:1;box-shadow:6px 6px 0 var(--ink);animation:work-cta-select 6s cubic-bezier(.2,.8,.2,1) infinite;}
.work-cta-tile b{flex:0 0 auto;font-size:80px;line-height:1;}
.work-cta-tile em{position:absolute;left:102px;opacity:0;font-size:12px;font-style:normal;letter-spacing:.08em;text-transform:uppercase;transform:translateX(-14px);animation:work-cta-label 6s cubic-bezier(.2,.8,.2,1) infinite;}
.work-cta-tile:nth-child(1){z-index:1;background:var(--blue);transform:rotate(-6deg);}
.work-cta-tile:nth-child(2){z-index:2;margin-left:-13px;background:var(--red);animation-delay:2s;}
.work-cta-tile:nth-child(3){z-index:3;margin-left:-13px;background:var(--panel);color:var(--ink);transform:rotate(6deg);animation-delay:4s;}
.work-cta-tile:nth-child(2) em{animation-delay:2s;}.work-cta-tile:nth-child(3) em{animation-delay:4s;}
.work-cta-tile i{position:absolute;right:12px;top:10px;width:11px;height:11px;border-radius:50%;background:var(--yellow);}
.work-cta-tile:nth-child(2) i{border-radius:2px;background:var(--yellow);transform:rotate(45deg);}
.work-cta-tile:nth-child(3) i{background:#0EA87D;}
@keyframes work-cta-select{0%,4%,32%,100%{width:var(--tile-size);translate:0 0}10%,26%{width:var(--tile-active);translate:0 -7px}}
@keyframes work-cta-label{0%,6%,30%,100%{opacity:0;transform:translateX(-14px)}12%,26%{opacity:1;transform:translateX(0)}}
@keyframes work-cta-orbit{to{transform:rotate(360deg)}}
@media(max-width:900px){.work-cta{grid-template-columns:1fr}.work-cta-play{min-height:320px}.work-cta-copy{padding:28px 16px 18px}}
@media(max-width:560px){.cta-band.work-cta{padding:18px;gap:20px}.work-cta-copy{padding:24px 6px}.work-cta h2{font-size:clamp(40px,13vw,56px)!important}.work-cta-play{min-height:280px}.work-cta-orbit{width:235px}.work-cta-orbit i{width:17px;height:17px}.work-cta-tiles{--tile-size:92px;--tile-active:152px}.work-cta-tile{padding:0 14px;border-radius:17px}.work-cta-tile:nth-child(1){transform:rotate(-3deg)}.work-cta-tile:nth-child(3){transform:rotate(3deg)}.work-cta-tile b{font-size:54px}.work-cta-tile em{left:64px;font-size:7px}.work-cta-play::after{display:none}}
@media(prefers-reduced-motion:reduce){.work-cta-tile,.work-cta-tile em,.work-cta-orbit{animation:none}.work-cta-tile{width:var(--tile-size)}}

/* ---------- FOOTER ---------- */
footer{padding:70px 0 40px;}
.footer-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;padding-bottom:50px;border-bottom:1px solid var(--line);margin-bottom:34px;}
.footer-cols{display:flex;gap:80px;flex-wrap:wrap;}
.footer-col .footer-heading{font-family:inherit;font-size:12px;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin-bottom:16px;font-weight:700;}
.footer-col a{display:block;font-size:14.5px;color:var(--grey);margin-bottom:10px;transition:color .2s ease;}
.footer-col a:hover{color:var(--blue);}
.footer-bottom{display:flex;justify-content:space-between;font-size:13px;color:var(--grey-light);flex-wrap:wrap;gap:10px;}

/* ---------- ABOUT PAGE ---------- */
.about-hero :is(h1,.page-heading){font-size:clamp(38px,6vw,78px);max-width:900px;}
.about-hero p.lede{max-width:640px;font-size:20px;margin-top:26px;}
.about-story{padding:86px 0 96px;background:var(--paper);overflow:hidden;}
.about-story-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(460px,1.1fr);gap:clamp(58px,7vw,110px);align-items:center;}
.about-story :is(h1,.page-heading){max-width:650px;margin-top:24px;font-size:clamp(58px,6vw,88px);line-height:.84;letter-spacing:-.075em;}
.about-story .lede{max-width:590px;margin-top:28px;color:var(--grey);font-size:18px;line-height:1.65;}
.about-stack-stage{position:relative;min-height:520px;display:grid;place-items:center;padding:28px;border:2px solid var(--ink);border-radius:34px;background:var(--yellow);box-shadow:8px 8px 0 var(--ink);overflow:hidden;}
.about-stack-stage::before{content:"";position:absolute;right:-34px;top:-34px;width:120px;aspect-ratio:1;border:2px solid var(--ink);border-radius:50%;background:var(--red);}
.about-stack-stage::after{content:"";position:absolute;left:-28px;bottom:-30px;width:92px;aspect-ratio:1;border:2px solid var(--ink);border-radius:22px;background:var(--blue);transform:rotate(-9deg);}
.about-stack-svg{position:relative;z-index:1;width:min(100%,480px);height:auto;overflow:visible;}
.about-stack-block{transform-box:fill-box;transform-origin:center;animation:aboutBlockDrop 6s cubic-bezier(.2,.9,.28,1.15) infinite backwards;}
.about-stack-block.stack-n{animation-delay:.48s;}.about-stack-block.stack-d{animation-delay:.96s;}
.about-stack-spark{transform-box:fill-box;transform-origin:center;animation:aboutSpark 2.4s ease-in-out infinite;}
.about-stack-spark.two{animation-delay:-1.1s;}
@keyframes aboutBlockDrop{0%,8%{opacity:0;transform:translateY(-360px) rotate(12deg) scale(.8)}20%{opacity:1;transform:translateY(14px) rotate(-2deg) scale(1.03)}26%,82%{opacity:1;transform:none}88%,100%{opacity:0;transform:translateY(24px) scale(.96)}}
@keyframes aboutSpark{0%,100%{opacity:.35;transform:scale(.75) rotate(0)}50%{opacity:1;transform:scale(1.2) rotate(45deg)}}
.philosophy{display:grid;grid-template-columns:0.8fr 1.2fr;gap:70px;}
.philosophy-copy p{font-size:17px;line-height:1.75;color:var(--grey);margin-bottom:22px;max-width:560px;}
.philosophy-copy p strong{color:var(--ink);font-weight:600;}
.pull-quote{
  font-family:'Archivo';font-weight:800;text-transform:none;
  font-size:clamp(26px,2.6vw,36px);line-height:1.28;color:var(--ink);
  border-left:4px solid var(--blue);padding-left:30px;margin:8px 0;letter-spacing:-0.01em;
}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:20px;}
.value-item{background:var(--panel);padding:34px 28px;}
.value-item:nth-child(4n+1){background:var(--yellow-tint);}
.value-item:nth-child(4n+2){background:var(--green-tint);}
.value-item:nth-child(4n+3){background:var(--red-tint);}
.value-item:nth-child(4n){background:var(--blue-tint);}
.value-item .num{font-family:'Archivo';font-weight:900;font-size:34px;color:var(--blue-tint);-webkit-text-stroke:1.5px var(--blue);color:transparent;margin-bottom:16px;}
.value-item h4{font-size:16px;font-weight:700;text-transform:none;margin-bottom:8px;}
.value-item p{font-size:13.5px;color:var(--grey);line-height:1.5;}

/* ---------- SERVICES PAGE DETAIL ---------- */
#page-services{background:#FEFAF0;padding-top:0;}
.services-hero{width:100%;margin:0;min-height:800px;padding-top:170px!important;padding-bottom:86px!important;overflow:hidden;border:0;border-radius:0;background-color:var(--yellow)!important;background-image:conic-gradient(from 90deg at 1px 1px,transparent 25%,rgba(23,59,120,.045) 0 50%,transparent 0 75%,rgba(23,59,120,.045) 0)!important;background-size:44px 44px!important;box-shadow:none;}
.services-hero::before{display:none!important;}
.services-heading{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(460px,.95fr);align-items:center;gap:clamp(52px,6vw,92px);width:100%;text-align:left;}
.services-heading>*{min-width:0;}
.services-heading>div:first-child{max-width:680px;}
.services-heading .eyebrow{color:var(--blue);}
.services-heading :is(h1,.page-heading){margin:18px 0 26px;font-size:clamp(56px,5.6vw,84px);line-height:.82;letter-spacing:-.078em;}
.services-heading :is(h1,.page-heading) .svc-blue{color:var(--blue);}.services-heading :is(h1,.page-heading) .svc-red{color:var(--red);}
.services-heading>div:first-child>p{max-width:580px;color:rgba(17,17,17,.68);font-size:18px;line-height:1.65;}
.service-slideshow{position:relative;width:100%;max-width:940px;min-height:430px;overflow:hidden;background:transparent;isolation:isolate;}
.service-slideshow::before{content:"";position:absolute;z-index:-1;width:310px;height:310px;left:50%;top:50%;border:2px dashed rgba(23,59,120,.25);border-radius:50%;transform:translate(-50%,-50%);}
.service-slideshow::after{content:"";position:absolute;z-index:0;width:22px;height:22px;right:7%;top:12%;border:2px solid var(--ink);border-radius:50%;background:var(--red);box-shadow:-365px 275px 0 -4px var(--blue),-285px -4px 0 -6px var(--blue);}
.service-stage-label{position:absolute;z-index:6;left:50%;top:0;color:var(--blue);font-family:'Archivo';font-size:9px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;transform:translateX(-50%);}
.service-slide{--bounce-distance:165px;position:absolute;z-index:2;top:30px;width:31%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:20px;border:2px solid var(--ink);border-radius:50%;box-shadow:7px 7px 0 var(--ink);text-align:center;opacity:1;animation:service-ball-bounce 2.8s cubic-bezier(.45,.05,.55,.95) infinite;transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s ease;}
.service-slide::after{content:"";position:absolute;inset:14%;border:2px solid currentColor;border-radius:50%;opacity:.13;}
.strategy-slide{left:1%;background:var(--panel);color:var(--blue);transform:rotate(-5deg);}
.identity-slide{left:34.5%;z-index:4;background:var(--red);color:var(--paper);transform:rotate(0);animation-delay:-1.05s;}
.digital-slide{left:68%;background:var(--blue);color:var(--paper);transform:rotate(5deg);animation-delay:-2.1s;}
.service-slideshow:hover .strategy-slide{transform:translateY(-8px) rotate(-7deg) scale(1.035)}.service-slideshow:hover .identity-slide{transform:translateY(-8px) scale(1.035)}.service-slideshow:hover .digital-slide{transform:translateY(-8px) rotate(7deg) scale(1.035)}
.slide-count{position:absolute;top:18%;left:50%;width:100%;font-family:'Archivo';font-size:7px;font-weight:900;letter-spacing:.11em;text-align:center;text-transform:uppercase;transform:translateX(-50%);}
.slide-symbol{display:none;}
.service-slide h3{position:relative;z-index:1;width:88%;margin:16px auto 0;font-size:clamp(17px,1.4vw,21px);line-height:.95;letter-spacing:-.045em;text-align:center;text-transform:none;transition:font-size .4s ease,line-height .4s ease;}
.slide-dots{position:absolute;z-index:5;left:50%;bottom:22px;display:flex;gap:7px;transform:translateX(-50%);}
.slide-dots i{width:8px;height:8px;border:1px solid var(--yellow);border-radius:50%;background:transparent;opacity:.7;}.slide-dots i:nth-child(2){background:var(--yellow)}
@keyframes service-ball-bounce{0%,100%{translate:0 0}44%{translate:0 var(--bounce-distance)}50%{translate:0 calc(var(--bounce-distance) + 8px)}58%{translate:0 calc(var(--bounce-distance) - 10px)}66%{translate:0 var(--bounce-distance)}}
@media(max-width:900px){.services-heading{display:flex;flex-direction:column;align-items:center;gap:40px;text-align:center}.services-heading>div:first-child>p{margin-inline:auto}.service-slideshow{min-height:350px;max-width:720px;width:100%;margin-inline:auto}.service-slide{--bounce-distance:110px}}
@media(max-width:560px){.services-hero{min-height:0;padding-top:130px!important;padding-bottom:48px!important;}#page-services .services-heading :is(h1,.page-heading){font-size:clamp(40px,11vw,52px)}.service-slideshow{min-height:220px}.service-stage-label{top:0;font-size:7px}.service-slide{--bounce-distance:72px;top:24px;width:31%;padding:10px;box-shadow:4px 5px 0 var(--ink)}.strategy-slide{left:1%;transform:rotate(-3deg)}.identity-slide{left:34.5%;transform:rotate(0)}.digital-slide{left:68%;transform:rotate(3deg)}.service-slideshow:hover .strategy-slide{transform:rotate(-4deg)}.service-slideshow:hover .identity-slide{transform:none}.service-slideshow:hover .digital-slide{transform:rotate(4deg)}.slide-symbol{display:none}.service-slide h3{margin:auto;text-align:center;font-size:clamp(10px,3.2vw,13px);line-height:.95}.slide-count{font-size:5px;text-align:center}.slide-dots{bottom:0}}
@media(prefers-reduced-motion:reduce){.service-slide{animation:none}}
.svc-detail{position:relative;border-top:1px solid var(--line);padding:70px 0;display:grid;grid-template-columns:0.55fr 1.45fr;gap:60px;align-items:start;}
.svc-detail:last-of-type{border-bottom:1px solid var(--line);}
.svc-label{display:flex;align-items:center;gap:16px;}
.svc-label .ico{width:52px;height:52px;flex-shrink:0;}
.svc-label h3{font-size:24px;text-transform:none;font-weight:800;letter-spacing:-.01em;}
.svc-body p.lede2{font-size:18px;color:var(--ink);font-weight:500;margin-bottom:24px;max-width:560px;line-height:1.55;}
.svc-includes{display:flex;flex-wrap:wrap;gap:10px;}
.svc-includes span{
  font-size:13.5px;padding:9px 16px;border:1px solid var(--line);border-radius:100px;color:var(--grey);
}

/* ---------- WORK PAGE ---------- */
.case-block{border-top:1px solid var(--line);padding:80px 0;}
.case-block:last-of-type{border-bottom:1px solid var(--line);}
.case-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:44px;gap:30px;flex-wrap:wrap;}
.case-head h3{font-size:clamp(28px,3.4vw,44px);text-transform:none;font-weight:800;letter-spacing:-0.01em;}
.case-meta{display:flex;gap:26px;flex-wrap:wrap;}
.case-meta div{font-size:13px;color:var(--grey-light);}
.case-meta strong{display:block;color:var(--ink);font-size:14.5px;font-weight:600;margin-top:3px;}
.pss-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.pss-item{background:#FEFAF0;padding:36px 32px;}
.pss-item .tag{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:14px;display:block;}
.pss-item p{font-size:15px;color:var(--grey);line-height:1.65;}
.case-visual{margin-top:36px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);height:260px;display:flex;align-items:center;justify-content:center;}

/* ---------- CONTACT PAGE ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start;}
.contact-head :is(h1,.page-heading){font-size:clamp(38px,5.6vw,68px);}
.contact-head p.lede{margin-top:22px;font-size:18px;}
.contact-info{margin-top:50px;display:flex;flex-direction:column;gap:26px;}
.contact-info a,.contact-info div{font-size:16px;}
.contact-info .lbl{font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:var(--grey-light);margin-bottom:5px;}
.contact-info .val{font-weight:600;font-size:17px;}
.form-card{background:#FEFAF0;border:1px solid var(--line);border-radius:var(--radius);padding:44px;}
.field{margin-bottom:22px;}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:9px;color:var(--ink);}
.field input,.field select,.field textarea,.field .sd-btn{
  width:100%;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;
  font-family:'Inter';font-size:15px;background:var(--paper);color:var(--ink);
  transition:border-color .2s ease, background .2s ease;
}
.field select,.field .sd-btn{appearance:none;-webkit-appearance:none;padding-right:52px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M2 2L7 7L12 2' stroke='%23111111' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center;background-size:14px 9px;}
.field input:focus,.field select:focus,.field textarea:focus,.field .sd-btn:focus-visible{outline:none;border-color:var(--blue);background-color:#FEFAF0;}
.field textarea{resize:vertical;min-height:110px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-submit{width:100%;justify-content:center;margin-top:6px;}
.form-note{font-size:13px;color:var(--grey-light);margin-top:16px;text-align:center;}

/* ---------- reveal animation ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1!important;transform:none!important;transition:none!important;}
}

/* ---------- hero seesaw animation ---------- */
.seesaw{transform-origin:290px 235px;animation:tip 5s ease-in-out infinite;}
@keyframes tip{
  0%,100%{transform:rotate(-3.5deg);}
  50%{transform:rotate(3.5deg);}
}
.float{animation:floaty 4.5s ease-in-out infinite;}
@keyframes floaty{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-8px);}
}
.wave-arm{transform-origin:top center;animation:wave 2.2s ease-in-out infinite;}
@keyframes wave{
  0%,100%{transform:rotate(0deg);}
  25%{transform:rotate(-14deg);}
  75%{transform:rotate(6deg);}
}
.contact-runner{position:absolute;left:var(--contact-pad-x);right:var(--contact-pad-x);bottom:var(--contact-pad-bottom);height:190px;margin:0;overflow:hidden;}
.contact-runner>svg{position:absolute;left:-220px;top:0;margin:0;animation:contact-run-across 9s linear infinite,contact-run-bob .34s ease-in-out infinite alternate;}
@keyframes contact-run-across{
  from{left:-220px;}
  to{left:100%;}
}
@keyframes contact-run-bob{
  from{transform:translateY(0) rotate(-1deg);}
  to{transform:translateY(-5px) rotate(1deg);}
}
.bob{animation:bob 3.4s ease-in-out infinite;}
@keyframes bob{
  0%,100%{transform:translateY(0) rotate(0deg);}
  50%{transform:translateY(-6px) rotate(-2deg);}
}
.spin-slow{transform-origin:center;animation:spin 14s linear infinite;}
@keyframes spin{
  from{transform:rotate(0deg);}
  to{transform:rotate(360deg);}
}
.twinkle{transform-origin:75px 55px;animation:twinkle 2.4s ease-in-out infinite;}
@keyframes twinkle{
  0%,100%{opacity:.35;transform:scale(.9);}
  50%{opacity:1;transform:scale(1.08);}
}
.think{transform-origin:120px 45px;animation:twinkle 2.8s ease-in-out infinite;}
@media(prefers-reduced-motion:reduce){.twinkle,.think{animation:none;opacity:.85;}}
.cta-illustration{position:absolute;bottom:0;right:30px;opacity:.95;}
.cta-runner{left:-170px;right:auto;animation:cta-run-across 7.5s linear infinite;will-change:transform;}
.runner-bob{transform-origin:center;animation:runner-bounce .34s ease-in-out infinite alternate;}
.runner-arm,.runner-leg{transform-box:view-box;transform-origin:78px 125px;animation:runner-limb .68s ease-in-out infinite alternate;}
.runner-arm.back{animation-direction:alternate-reverse;}
.runner-leg{transform-origin:78px 168px;animation-name:runner-leg;}
.runner-leg.back{animation-direction:alternate-reverse;}
@keyframes cta-run-across{to{transform:translateX(calc(100vw + 210px));}}
@keyframes runner-bounce{to{transform:translateY(-5px) rotate(-1deg);}}
@keyframes runner-limb{from{transform:rotate(-24deg);}to{transform:rotate(24deg);}}
@keyframes runner-leg{from{transform:rotate(-18deg);}to{transform:rotate(18deg);}}
@media(prefers-reduced-motion:reduce){
  .cta-runner{left:auto;right:30px;animation:none;transform:none;}
  .runner-bob,.runner-arm,.runner-leg{animation:none;}
}
@media(max-width:760px){.cta-illustration{display:none;}}

@media(max-width:980px){
  .hero-grid,.philosophy,.contact-grid{grid-template-columns:1fr;}
  .home-hero .hero-grid{grid-template-columns:1fr;gap:34px;}
  .hero-showcase{min-height:520px;}
  .home-services .services{grid-template-columns:1fr;gap:44px;}
  .home-services .services-intro{position:static;}
  .kinetic-wrap{grid-template-columns:1fr;}
  .kinetic-stage{min-height:560px;}
  .kinetic-copy{min-height:390px;padding:48px;}
  .services-showcase .services-head{grid-template-columns:1fr;gap:24px;}
  .services-intro-copy{max-width:650px;}
  .end-method-head{grid-template-columns:1fr;gap:26px;margin-bottom:54px;}
  .end-method-intro{max-width:650px;}
  .method-card{min-height:380px;padding:24px 22px 22px;}
  .method-equation{gap:14px;}
  .problem-grid,.service-grid,.values-grid,.pss-grid{grid-template-columns:1fr 1fr;}
  .project-index-head{grid-template-columns:1fr;gap:24px;}
  .project-index-intro{margin:0;}
  .project-index-layout{grid-template-columns:1fr;gap:38px;}
  .service-card:nth-child(n){grid-column:span 1;}
  .service-card{min-height:260px;}
  .stats .wrap{grid-template-columns:1fr 1fr;}
  .stat:nth-child(3){border-left:none;}
  .svc-detail{grid-template-columns:1fr;}
  .navlinks{display:none;}
  .burger{display:flex;}
  .nav-cta-btn{display:none;}
}
@media(max-width:640px){
  .wrap{padding:0 24px;}
  .home-services .shell{padding:0 24px;}
  .home-services .service{grid-template-columns:40px 1fr;gap:14px;}
  .home-services .service-arrow{display:none;}
  .nav{padding:16px 24px;}
  .logo{font-size:17px;}
  .mobile-menu{padding-left:24px;padding-right:24px;}
  .end-method h2{font-size:clamp(46px,14vw,62px);}
  .method-track{width:82%;margin-top:10px;}
  .method-grid{grid-template-columns:1fr;gap:18px;}
  .method-card{min-height:370px;}
  .method-letter{font-size:104px;}
  .method-equation{grid-template-columns:1fr auto;gap:12px;margin-top:48px;padding:18px;}
  .method-equation .operator{display:none;}
  .method-equation span{text-align:left;}
  .method-equation strong{grid-column:1/-1;margin-top:4px;}
  .problem-grid,.service-grid,.values-grid,.pss-grid,.field-row{grid-template-columns:1fr;}
  .project-index-head h2{font-size:clamp(46px,14vw,64px);}
  .project-feature,.project-feature-link{min-height:390px;}
  .project-feature{border-radius:20px;box-shadow:6px 6px 0 var(--ink);}
  .project-feature-link{padding:20px;}
  .project-feature-title{font-size:clamp(54px,19vw,78px);}
  .project-index-item{grid-template-columns:25px minmax(0,1fr) auto;padding:18px 6px;gap:10px;}
  .services-showcase .services-head{align-items:flex-start;margin-bottom:42px;}
  .services-showcase .services-head h2{font-size:clamp(48px,15vw,66px);}
  .service-grid{gap:14px;}
  .service-card{min-height:230px;padding:25px 22px;}
  .service-card:nth-child(n){grid-column:1;}
  .cta-band{margin:0 16px;padding:60px 30px;}
  section{padding:80px 0;}
  .footer-top{flex-direction:column;}
  .hero{min-height:auto;padding-top:58px;padding-bottom:62px;}
  .hero :is(h1,.page-heading){font-size:clamp(50px,15vw,66px);}
  .home-hero{padding-top:32px;padding-bottom:54px;}
  .home-hero .hero-copy :is(h1,.page-heading){font-size:clamp(52px,15vw,68px);letter-spacing:-.07em;}
  .home-hero .hero-copy :is(h1,.page-heading) .outline{-webkit-text-stroke-width:1.5px;}
  .home-hero .lead{font-size:16px;}
  .hero-showcase{min-height:390px;padding:50px 18px 32px;border-radius:28px;box-shadow:6px 6px 0 var(--ink);}
  .showcase-card{padding:18px 14px 22px;border-radius:22px;}
  .tile-stage{padding-top:46px;gap:7px;}
  .end-tile{font-size:clamp(45px,15vw,68px);border-radius:20%;}
  .tile-label{gap:7px;font-size:8px;}
  .showcase-stamp{width:72px;height:72px;font-size:12px;}
  .showcase-note{right:-10px;top:-14px;font-size:10px;padding:10px 13px;}
  .end-ticker span{padding:17px 22px;font-size:11px;}
  .end-ticker span::after{margin-left:42px;}
  .kinetic-stage{min-height:470px;}
  .kinetic-copy{min-height:350px;padding:38px 24px;}
  .kinetic-badge{width:60px;height:60px;left:18px;top:18px;}
}

@media(prefers-reduced-motion:reduce){
  .end-tile,.showcase-stamp{animation:none;}
  .showcase-stamp{transform:rotate(9deg);}
  .end-ticker-track{animation:none;}
  .kinetic-stage::before,.kinetic-word,.kinetic-badge,.kinetic-progress i::after{animation:none;}
  .kinetic-stage::before{transform:scale(1);}
  .kinetic-word{display:none;}
  .kinetic-word.four{display:grid;opacity:1;transform:none;}
  .contact-runner>svg{left:50%;transform:translateX(-50%);animation:none;}
}

/* ---------- DYNAMIC CASE STUDIES (admin-managed) ---------- */
.case-empty{padding:70px 24px;text-align:center;color:var(--grey);border:1px dashed var(--line);border-radius:var(--radius);}
.cs{border-top:1px solid var(--line);padding:80px 0;}
.cs:first-child{border-top:none;padding-top:20px;}
.cs:last-child{border-bottom:1px solid var(--line);}
.cs-head{margin-bottom:44px;}
.cs-head .client{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:10px;display:block;}
.cs-head h3{font-size:clamp(28px,3.4vw,44px);text-transform:none;font-weight:800;letter-spacing:-0.01em;}
.cs-flow{display:flex;flex-direction:column;align-items:stretch;gap:16px;}
.cs-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.cs-gallery-item{border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--paper-alt);aspect-ratio:4/3;display:block;}
.cs-gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.cs-gallery-item:hover img{transform:scale(1.04);}
@media(max-width:820px){.cs-gallery{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.cs-gallery{grid-template-columns:1fr;}}
.cs-step{background:#FEFAF0;border:1px solid var(--line);border-radius:var(--radius);padding:34px 36px;}
.cs-step .cs-label{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:14px;display:block;}
.cs-step h4{font-size:20px;text-transform:none;font-weight:800;letter-spacing:-.01em;margin-bottom:10px;}
.cs-step p{font-size:16px;line-height:1.65;color:var(--grey);}
.cs-arrow{display:flex;justify-content:center;padding:14px 0;color:var(--blue);}
.cs-arrow svg{width:26px;height:34px;}
.cs-shot{border-radius:14px;overflow:hidden;border:1px solid var(--line);margin-top:6px;background:var(--paper-alt);}
.cs-shot img{width:100%;height:auto;display:block;}
.cs-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}
.cs-tags span{font-size:14px;padding:9px 18px;border:1.5px solid var(--blue);color:var(--blue);border-radius:100px;font-weight:600;background:var(--blue-tint);}
.cs-results{list-style:none;display:flex;flex-direction:column;gap:12px;margin-top:6px;}
.cs-results li{display:flex;align-items:flex-start;gap:12px;font-size:16px;color:var(--ink);font-weight:500;}
.cs-results li svg{width:22px;height:22px;flex-shrink:0;margin-top:1px;}
@media(max-width:640px){.cs-step{padding:26px 22px;}}

/* Studio projects: image-first single page */
.studio-single{margin-top:38px;}
.studio-hero{border-radius:28px;overflow:hidden;background:#111111;aspect-ratio:16/9;border:1px solid var(--line);}
.studio-hero img{width:100%;height:100%;object-fit:cover;display:block;}
.studio-gallery{columns:3;column-gap:14px;margin-top:28px;padding:14px;background:#FEFAF0;border-radius:28px;}
.studio-gallery a{position:relative;break-inside:avoid;border-radius:16px;overflow:hidden;background:#111111;display:block;margin:0 0 14px;}
.studio-gallery .studio-image-label{position:absolute;top:14px;left:14px;z-index:1;padding:7px 11px;border-radius:7px;background:rgba(255,255,255,.22);color:#FEFAF0;backdrop-filter:blur(9px);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
.studio-gallery img{width:100%;height:auto;display:block;transition:transform .45s ease;}
.studio-gallery a:hover img{transform:scale(1.025);}
.studio-info{width:100%;max-width:none;margin:22px 0 0;}
.studio-info .cs-step{height:100%;}
@media(max-width:700px){
  .studio-hero{border-radius:18px;aspect-ratio:4/3;}
  .studio-gallery{columns:2;padding:10px;column-gap:10px;border-radius:18px;}
  .studio-gallery a{margin-bottom:10px;border-radius:12px;}
  .studio-info{margin-top:16px;}
}
@media(max-width:480px){.studio-gallery{columns:1;}}
.studio-lightbox{position:fixed;inset:0;z-index:500;display:none;align-items:center;justify-content:center;padding:28px;background:rgba(8,9,12,.92);backdrop-filter:blur(10px);}
.studio-lightbox.open{display:flex;}
.studio-lightbox img{display:block;max-width:min(96vw,1800px);max-height:92vh;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.5);}
.studio-lightbox-close{position:absolute;top:20px;right:22px;width:44px;height:44px;border-radius:50%;background:#FEFAF0;color:#111111;font-size:26px;line-height:1;display:flex;align-items:center;justify-content:center;}
body.lightbox-open{overflow:hidden;}

/* ---------- BLOG ---------- */
.blog-grid{display:grid;grid-template-columns:1fr;gap:34px;align-items:stretch;}
.blog-card{position:relative;display:grid;grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);min-height:370px;background:var(--panel);border:2px solid var(--ink);border-radius:28px;overflow:hidden;box-shadow:7px 7px 0 var(--ink);transition:transform .28s ease,box-shadow .28s ease;}
.blog-card:hover{transform:translate(-5px,-5px) rotate(-.35deg);box-shadow:12px 12px 0 var(--ink);}
.blog-cover{position:relative;min-height:100%;background:var(--yellow);overflow:hidden;display:flex;align-items:center;justify-content:center;color:var(--blue);font-family:'Archivo';font-weight:900;font-size:36px;border-right:2px solid var(--ink);}
.blog-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(17,17,17,.18));pointer-events:none;}
.blog-cover img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease;}
.blog-card:hover .blog-cover img{transform:scale(1.045);}
.blog-card-no{position:absolute;z-index:2;top:18px;right:18px;display:grid;place-items:center;width:48px;height:48px;border:2px solid var(--ink);border-radius:16px;background:var(--yellow);color:var(--ink);box-shadow:3px 3px 0 var(--ink);font-family:'Archivo';font-size:12px;font-weight:900;letter-spacing:.08em;transform:rotate(3deg);}
.blog-card-body{padding:40px 42px 34px;display:flex;flex-direction:column;min-width:0;}
.blog-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.075em;}
.blog-meta-category{padding:7px 10px;border:1.5px solid var(--red);border-radius:100px;background:var(--red);color:var(--paper);}
.blog-meta time{color:var(--grey);white-space:nowrap;}
.blog-card h2{max-width:660px;font-size:clamp(26px,2.6vw,36px);text-transform:none;line-height:1.04;letter-spacing:-.04em;margin-bottom:18px;}
.blog-card p{font-size:14.5px;line-height:1.65;color:var(--grey);margin-bottom:28px;}
.blog-card-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:auto;padding-top:18px;border-top:1px solid var(--line);}
.blog-read{font-family:'Archivo';font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);}
.blog-card-arrow{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border:1.5px solid var(--ink);border-radius:50%;background:var(--yellow);font-size:19px;transition:transform .25s ease,background .25s ease;}
.blog-card:hover .blog-card-arrow{transform:rotate(45deg);background:var(--red);color:var(--paper);}
.blog-article{max-width:1180px;margin:0 auto;}
#page-blog-single .hero{padding-top:130px!important;}
.blog-article-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);min-height:620px;margin-bottom:76px;border:2px solid var(--ink);border-radius:34px;background:var(--blue);box-shadow:9px 9px 0 var(--ink);overflow:hidden;isolation:isolate;}
.blog-article-hero::before{content:"";position:absolute;z-index:-1;width:190px;height:190px;left:-82px;bottom:-96px;border:2px solid var(--ink);border-radius:50%;background:var(--red);}
.blog-article-hero::after{content:"";position:absolute;z-index:-1;width:48px;height:48px;left:42%;top:36px;border:2px solid var(--ink);border-radius:14px;background:var(--yellow);transform:rotate(10deg);}
.blog-article-head{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:58px 54px;text-align:left;color:var(--paper);}
.blog-article-head .blog-meta{justify-content:flex-start;margin-bottom:30px;color:var(--paper);}
.blog-article-head .blog-meta-category{background:var(--red);color:var(--paper);border-color:var(--paper);}
.blog-article-head .blog-meta time{color:rgba(254,250,240,.7);}
.blog-article-head :is(h1,.page-heading){max-width:690px;margin:0 0 24px;color:var(--paper);font-size:clamp(40px,3.8vw,56px);line-height:.98;text-transform:none;letter-spacing:-.045em;}
.blog-article-head .excerpt{max-width:620px;margin:0;color:rgba(254,250,240,.78);font-size:18px;line-height:1.65;}
.blog-share{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:8px;margin-top:32px;}
.blog-share .label{font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--grey);margin-right:4px;}
.blog-share a,.blog-share button{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 14px;border:1px solid var(--line);border-radius:100px;background:#FEFAF0;color:var(--ink);font-size:13px;font-weight:600;transition:border-color .2s,color .2s,background .2s;}
.blog-share a:hover,.blog-share button:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-tint);}
.blog-article-head .blog-share .label{color:rgba(254,250,240,.7);}
.blog-article-head .blog-share a,.blog-article-head .blog-share button{border-color:var(--paper);box-shadow:2px 2px 0 var(--ink);}
.blog-article-head .blog-share a:hover,.blog-article-head .blog-share button:hover{border-color:var(--ink);background:var(--yellow);color:var(--ink);transform:translate(-1px,-1px);}
.blog-article-hero .blog-article-cover{position:relative;min-width:0;margin:22px 22px 22px 0;border:2px solid var(--ink);border-radius:24px;background:var(--yellow);box-shadow:5px 5px 0 var(--ink);overflow:hidden;transform:rotate(1.2deg);}
.blog-article-hero .blog-article-cover::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);pointer-events:none;}
.blog-article-hero .blog-article-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease;}
.blog-article-hero:hover .blog-article-cover img{transform:scale(1.025);}
.blog-article-hero.no-cover{grid-template-columns:1fr;background:var(--yellow);}
.blog-article-hero.no-cover .blog-article-head{max-width:900px;color:var(--ink);}
.blog-article-hero.no-cover .blog-article-head :is(h1,.page-heading){color:var(--ink);}
.blog-article-hero.no-cover .blog-article-head .excerpt{color:var(--grey);}
.blog-article-hero.no-cover .blog-article-head .blog-meta time,.blog-article-hero.no-cover .blog-share .label{color:var(--grey);}
.blog-prose{font-size:18px;line-height:1.8;color:#111111;}
.blog-prose p{margin-bottom:1.5em;white-space:pre-line;}
.blog-prose h2{font-size:clamp(26px,3vw,36px);line-height:1.18;text-transform:none;margin:2em 0 .65em;scroll-margin-top:120px;}
.blog-prose h3{font-size:clamp(21px,2.2vw,27px);line-height:1.25;text-transform:none;margin:1.7em 0 .55em;scroll-margin-top:120px;}
.blog-prose ul,.blog-prose ol{padding-left:1.4em;margin:0 0 1.5em;}.blog-prose li{margin-bottom:.55em;}
.blog-prose blockquote{font-size:21px;line-height:1.6;border-left:4px solid var(--blue);padding:10px 0 10px 24px;margin:2em 0;color:var(--ink);font-weight:500;}
.blog-prose a{color:var(--blue);text-decoration:underline;text-underline-offset:3px;}
.blog-faq{margin-top:70px;padding-top:44px;border-top:1px solid var(--line);}
.blog-faq h2{margin:0 0 24px;font-size:clamp(28px,3vw,38px);}
.blog-faq details{background:#FEFAF0;border:1px solid var(--line);border-radius:14px;margin-bottom:10px;padding:0 20px;}
.blog-faq summary{cursor:pointer;list-style:none;font-weight:700;font-size:17px;padding:19px 42px 19px 0;position:relative;color:var(--ink);}
.blog-faq summary::-webkit-details-marker{display:none;}
.blog-faq summary::after{content:'+';position:absolute;right:2px;top:14px;font-size:26px;color:var(--blue);font-weight:500;}
.blog-faq details[open] summary::after{content:'−';}
.blog-faq details p{font-size:16px;line-height:1.7;color:var(--grey);padding:0 0 19px;margin:0;white-space:pre-line;}
.blog-content-layout{display:grid;grid-template-columns:210px minmax(0,780px);gap:70px;align-items:start;justify-content:center;}
.blog-content-layout.no-toc{display:block;max-width:780px;width:100%;margin:0 auto;}
.blog-toc{position:sticky;top:120px;border:1px solid var(--line);border-radius:15px;background:#FEFAF0;padding:20px;}
.blog-toc strong{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:13px;}
.blog-toc button{display:block;width:100%;text-align:left;font-size:13.5px;line-height:1.4;color:var(--grey);padding:7px 0;border-bottom:1px solid var(--paper-alt);}
.blog-toc button:last-child{border-bottom:0}.blog-toc button.sub{padding-left:13px;font-size:13px;}.blog-toc button:hover{color:var(--blue);}
.blog-related{margin-top:100px;padding-top:46px;border-top:2px solid var(--ink);}
.blog-related-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:30px;}
.blog-related-head h2{margin:0;font-size:clamp(34px,4vw,54px);line-height:.95;text-transform:uppercase;}
.blog-related-actions{display:flex;flex-direction:column;align-items:flex-end;gap:14px;}
.blog-related-head p{max-width:360px;margin:0;color:var(--grey);font-size:15px;line-height:1.55;text-align:right;}
.blog-related-all{display:inline-flex;align-items:center;gap:12px;padding:12px 18px;border:1.5px solid var(--ink);border-radius:100px;background:var(--yellow);box-shadow:3px 3px 0 var(--ink);font-family:'Archivo';font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;transition:transform .2s ease,box-shadow .2s ease,background .2s ease;}
.blog-related-all:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink);background:var(--red);color:var(--paper);}
.blog-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
.blog-related-card{display:flex;flex-direction:column;min-width:0;border:2px solid var(--ink);border-radius:22px;background:var(--panel);box-shadow:5px 5px 0 var(--ink);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;}
.blog-related-card:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--ink);}
.blog-related-image{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--yellow);border-bottom:2px solid var(--ink);}
.blog-related-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.blog-related-card:hover .blog-related-image img{transform:scale(1.04);}
.blog-related-copy{display:flex;flex:1;flex-direction:column;padding:22px;}
.blog-related-copy .blog-meta{margin-bottom:15px;}
.blog-related-copy h3{margin:0 0 22px;font-size:clamp(21px,2vw,27px);line-height:1.08;text-transform:none;letter-spacing:-.03em;}
.blog-related-link{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-family:'Archivo';font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;}
.blog-related-link i{display:grid;place-items:center;width:34px;height:34px;border:1.5px solid var(--ink);border-radius:50%;background:var(--yellow);font-size:16px;font-style:normal;transition:transform .25s ease,background .25s ease;}
.blog-related-card:hover .blog-related-link i{transform:rotate(45deg);background:var(--red);color:var(--paper);}
@media(max-width:980px){.blog-grid{grid-template-columns:1fr;}.blog-card{grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr);}.blog-card-body{padding:34px;}}
@media(max-width:900px){.blog-content-layout{grid-template-columns:1fr;gap:28px;}.blog-toc{position:static;}.blog-article{max-width:780px;}.blog-article-hero{grid-template-columns:1fr;min-height:0;padding-top:22px;}.blog-article-head{padding:32px 38px 38px;}.blog-article-hero .blog-article-cover{order:-1;height:auto;aspect-ratio:16/10;margin:0 22px;transform:none;}.blog-related-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.blog-related-card:last-child{display:none;}}
@media(max-width:760px){.blog-card,.blog-card:nth-child(even){grid-template-columns:1fr;min-height:0;}.blog-card .blog-cover,.blog-card:nth-child(even) .blog-cover{order:1;min-height:240px;aspect-ratio:16/10;border:0;border-bottom:2px solid var(--ink);}.blog-card .blog-card-body,.blog-card:nth-child(even) .blog-card-body{order:2;padding:28px 24px 24px;}.blog-card h2{font-size:clamp(27px,8vw,36px);}}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr;}.blog-prose{font-size:16px;}#page-blog-single .hero{padding-top:105px!important;}.blog-article-hero{margin-bottom:52px;padding-top:14px;border-radius:24px;box-shadow:6px 6px 0 var(--ink);}.blog-article-hero::after{display:none;}.blog-article-head{padding:28px 24px 30px;}.blog-article-head :is(h1,.page-heading){font-size:clamp(36px,11vw,50px);line-height:1.04;}.blog-article-head .excerpt{font-size:16px;}.blog-article-head .blog-meta{margin-bottom:22px;}.blog-share{margin-top:26px;}.blog-article-hero .blog-article-cover{margin:0 14px;border-radius:17px;box-shadow:3px 3px 0 var(--ink);}.blog-related{margin-top:72px;padding-top:34px;}.blog-related-head{display:block;}.blog-related-actions{align-items:flex-start;margin-top:14px;}.blog-related-head p{text-align:left;}.blog-related-grid{grid-template-columns:1fr;}.blog-related-card:last-child{display:flex;}}

/* ---------- WORK ARCHIVE + SINGLE + SERVICE SINGLE ---------- */
.work-filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:44px;}
.work-filters button{padding:9px 18px;border:1.5px solid var(--line);border-radius:100px;font-size:14px;font-weight:600;color:var(--grey);background:#FEFAF0;transition:background .2s,color .2s,border-color .2s;}
.work-filters button:hover{border-color:var(--ink);color:var(--ink);}
.work-filters button.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.archive-card{cursor:pointer;border:1.5px solid var(--ink);border-radius:var(--radius);overflow:hidden;background:var(--panel);transition:transform .3s,box-shadow .3s;display:flex;flex-direction:column;text-align:left;font:inherit;color:inherit;}
.archive-card:nth-child(3n+1){box-shadow:6px 6px 0 var(--yellow);}
.archive-card:nth-child(3n+2){box-shadow:6px 6px 0 var(--green);}
.archive-card:nth-child(3n){box-shadow:6px 6px 0 var(--red);}
.archive-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px -22px rgba(20,20,20,.22);}
.archive-thumb{height:200px;background:var(--blue-tint);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.archive-thumb img{width:100%;height:100%;object-fit:cover;}
.archive-thumb .ph{color:var(--grey-light);font-size:13px;}
.archive-body{padding:24px 24px 28px;flex:1;display:flex;flex-direction:column;}
.archive-body .cat{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue);margin-bottom:9px;}
.archive-body h3{font-size:20px;text-transform:none;font-weight:800;letter-spacing:-.01em;margin-bottom:6px;}
.archive-body .cl{font-size:14px;color:var(--grey);}
.archive-body .go{margin-top:auto;padding-top:16px;font-size:14px;font-weight:600;color:var(--ink);display:inline-flex;gap:6px;align-items:center;}
.archive-card:hover .go{color:var(--blue);}
.work-rocket{position:absolute;right:30px;top:0;width:175px;height:auto;z-index:1;}
.work-figure{position:absolute;right:180px;top:60px;width:120px;height:auto;z-index:0;}
@media(max-width:1040px){.work-figure{display:none;}}
@media(max-width:900px){.work-rocket{display:none;}}
.back-link{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--grey);margin-bottom:26px;transition:color .2s;}
.back-link:hover{color:var(--blue);}
.single-head{margin-bottom:6px;}
.single-head .cat{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:12px;display:block;}
.single-head :is(h1,.page-heading){font-size:clamp(34px,5vw,60px);}
.single-head .client{font-size:18px;color:var(--grey);margin-top:14px;}
.single-head .project-link{margin-top:24px;}
#page-case-single>.hero{background:#FEFAF0;padding-top:42px!important;}
#page-case-single .wrap{max-width:1120px;}
#page-case-single .back-link{margin-bottom:34px;}
.case-editorial-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);gap:70px;align-items:end;padding-top:30px;border-top:1px solid var(--line);}
.case-editorial-title .cat{display:block;margin-bottom:16px;color:var(--ink);font-family:'Archivo';font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;}
.case-editorial-title .cat::before{content:"";display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--red);}
.case-editorial-title :is(h1,.page-heading){font-size:clamp(48px,6vw,82px);line-height:.88;letter-spacing:-.075em;text-transform:uppercase;}
.case-editorial-title :is(h1,.page-heading) span{color:var(--red);}
.case-editorial-summary{max-width:410px;padding-bottom:8px;color:var(--grey);font-size:16px;line-height:1.65;}
.case-browser{margin-top:38px;overflow:hidden;border:2px solid var(--ink);border-radius:26px;background:var(--panel);box-shadow:8px 8px 0 var(--ink);}
.case-browser-bar{display:flex;align-items:center;gap:8px;height:46px;padding:0 18px;border-bottom:2px solid var(--ink);font-size:10px;font-weight:700;letter-spacing:.06em;}
.case-browser-bar i{width:8px;height:8px;border-radius:50%;background:var(--red);}
.case-browser-bar i:nth-child(2){background:var(--yellow);}.case-browser-bar i:nth-child(3){background:var(--blue);}
.case-browser-url{margin-left:10px;color:var(--grey);}
.case-browser-media{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--red);}
.case-browser-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.case-browser-mark{color:var(--yellow);font-family:'Archivo';font-size:clamp(110px,22vw,290px);font-weight:900;letter-spacing:-.12em;}
.case-browser-label{position:absolute;right:18px;bottom:18px;padding:8px 12px;border:1.5px solid var(--ink);border-radius:100px;background:var(--yellow);color:var(--ink);font-family:'Archivo';font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;}
.case-project-brief{margin-top:72px;}
.case-section-label{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--ink);color:var(--blue);font-family:'Archivo';font-size:9px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;}
.case-brief-copy{max-width:830px;margin:34px 0 42px;font-size:18px;font-weight:450;line-height:1.2;}
.case-brief-copy span{color:var(--red);}
.case-meta{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.case-meta>div{padding:18px 18px 18px 0;}
.case-meta>div+div{padding-left:18px;border-left:1px solid var(--line);}
.case-meta small{display:block;margin-bottom:7px;color:var(--grey);font-family:'Archivo';font-size:8px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;}
.case-meta strong{font-size:13px;font-weight:750;}
.case-end-method{margin-top:14px;}
.case-end-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);}
.case-end-card{min-height:300px;padding:34px 28px 30px 0;}
.case-end-card+.case-end-card{padding-left:28px;border-left:1px solid var(--line);}
.case-end-letter{display:grid;place-items:center;width:54px;height:54px;margin-bottom:46px;color:var(--blue);font-family:'Archivo';font-size:44px;font-weight:900;line-height:1;}
.case-end-card:nth-child(2) .case-end-letter{color:var(--red);}
.case-end-card:nth-child(3) .case-end-letter{border-radius:50%;background:var(--yellow);color:var(--ink);font-size:34px;}
.case-end-card h3{margin-bottom:14px;font-size:24px;text-transform:none;letter-spacing:-.04em;}
.case-end-card p{color:var(--grey);font-size:14px;line-height:1.65;}
.case-study-body{margin-top:70px;}
#page-case-single .cs-gallery-block{margin-top:70px;}
#page-case-single .cs-gallery{gap:22px;}
#page-case-single .cs-gallery-item{border:2px solid var(--ink);border-radius:18px;box-shadow:5px 5px 0 var(--ink);}
#page-case-single .studio-single{margin-top:0;}
#page-case-single .studio-gallery{margin-top:0;border:1px solid var(--line);box-shadow:none;}
.case-related{margin-top:90px;padding-top:34px;border-top:1px solid var(--ink);}
.case-related-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:34px;}
.case-related-title span{display:block;margin-bottom:12px;color:var(--blue);font-family:'Archivo';font-size:9px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;}
.case-related-title h2{font-size:clamp(38px,5vw,62px);line-height:.92;letter-spacing:-.065em;}
.case-related .archive-card{background:#FEFAF0;}
@media(max-width:760px){
  .case-editorial-head{grid-template-columns:1fr;gap:20px;}
  .case-meta,.case-end-grid{grid-template-columns:1fr;}
  .case-meta>div+div{padding-left:0;border-left:0;border-top:1px solid var(--line);}
  .case-end-card{min-height:0;padding:28px 0;}
  .case-end-card+.case-end-card{padding-left:0;border-left:0;border-top:1px solid var(--line);}
  .case-end-letter{margin-bottom:24px;}
  .case-related{margin-top:64px;}
  .case-related-head{align-items:start;flex-direction:column;}
}
.svc-single-head{display:flex;align-items:center;gap:20px;margin-bottom:18px;}
.svc-single-head .ico{width:60px;height:60px;flex-shrink:0;}
.svc-single-head :is(h1,.page-heading){font-size:clamp(34px,5vw,58px);text-transform:none;letter-spacing:-.01em;}
.related-head{margin:74px 0 30px;font-size:clamp(24px,3vw,34px);text-transform:none;font-weight:800;letter-spacing:-.01em;}
.svc-includes.big span{font-size:15px;padding:11px 20px;}
@media(max-width:980px){.archive-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){
  .archive-grid{grid-template-columns:1fr;}
  .svc-single-head{flex-direction:column;align-items:flex-start;gap:14px;}
  .svc-single-head :is(h1,.page-heading){overflow-wrap:anywhere;}
}

/* ---------- DECORATIVE BLUE ORBS ---------- */
.wrap{position:relative;z-index:1;}
.orb{position:absolute;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle at 35% 35%, rgba(23,59,120,.30), rgba(23,59,120,0) 70%);}
.orb-float{animation:orbfloat 11s ease-in-out infinite;}
.orb-float.d2{animation-duration:14s;animation-delay:-4s;}
.orb-float.d3{animation-duration:17s;animation-delay:-8s;}
@keyframes orbfloat{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(22px,-28px) scale(1.12);}}
.solution,.clients-band,.stats{overflow:hidden;}
.cta-band .num,.hero :is(h1,.page-heading) .accent{position:relative;}
@media(prefers-reduced-motion:reduce){.orb-float{animation:none;}}
/* ring accents */
.ring{position:absolute;border-radius:50%;border:2px solid var(--blue);opacity:.16;pointer-events:none;z-index:0;}
.ring.spin{animation:spin 26s linear infinite;}

/* ---------- CLIENT LOGO MARQUEE ---------- */
.clients-band{background:#fff;border-bottom:1px solid var(--line);padding:46px 0;overflow:hidden;}
.clients-wrap{max-width:none;padding-left:0;padding-right:0;}
.clients-label{text-align:center;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);font-weight:600;margin-bottom:30px;}
body.lang-th .clients-label{letter-spacing:.02em;}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.marquee-track{display:flex;width:max-content;gap:70px;align-items:center;animation:marquee 34s linear infinite;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-track a{display:flex;align-items:center;}
.marquee-logo{height:88px;min-width:160px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.marquee-logo img{height:100%;max-width:220px;width:auto;object-fit:contain;filter:none;opacity:1;}
.marquee-name{font-family:'Archivo';font-weight:800;font-size:22px;color:var(--grey-light);flex-shrink:0;white-space:nowrap;transition:color .3s;}
.marquee-track a:hover .marquee-name,.marquee-name:hover{color:var(--ink);}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media(prefers-reduced-motion:reduce){.marquee-track{animation:none;flex-wrap:wrap;justify-content:center;}}
@media(max-width:640px){.marquee-logo{height:68px;min-width:124px;}.marquee-logo img{max-width:170px;}.marquee-track{gap:28px;}}

/* ---------- SITEWIDE E N D THEME ---------- */
main.page:not(#page-home)>.hero{position:relative;overflow:hidden;padding-top:72px;padding-bottom:78px;background:var(--paper);}
main.page:not(#page-home)>.hero::before{content:"";position:absolute;width:210px;height:210px;right:-95px;top:32px;border:2px solid var(--red);border-radius:50%;opacity:.16;}
main.page:not(#page-home)>.hero>.wrap{position:relative;z-index:1;}
main.page:not(#page-home)>.hero :is(h1,.page-heading){line-height:.9;letter-spacing:-.065em;}
main.page:not(#page-home)>.hero .eyebrow{color:var(--blue);}
main.page:not(#page-home)>.hero .eyebrow::before{background:var(--red);box-shadow:0 0 0 4px rgba(226,40,49,.12);}
main.page:not(#page-home) .hero-illustration{min-height:430px;display:flex;align-items:center;justify-content:center;padding:28px;border:2px solid var(--ink);border-radius:34px;background:var(--yellow);box-shadow:8px 8px 0 var(--ink);overflow:hidden;}
main.page:not(#page-home) .hero-illustration::before{width:110px;height:110px;right:-34px;top:-30px;background:var(--red);}
main.page:not(#page-home) .hero-illustration::after{width:82px;height:82px;left:-24px;bottom:-22px;background:var(--blue);}
main.page:not(#page-home) .hero-illustration>svg{max-height:400px;}

#page-about .about-philosophy{padding:96px 0 118px;background:#FEFAF0;}
#page-about .philosophy{position:relative;grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr);gap:clamp(58px,7vw,110px);padding:64px;border:2px solid var(--ink);border-radius:32px;background:var(--blue);color:var(--paper);box-shadow:8px 8px 0 var(--ink);overflow:hidden;}
#page-about .philosophy::after{content:"END";position:absolute;left:-18px;bottom:-45px;color:rgba(255,255,255,.055);font-family:'Archivo';font-size:clamp(150px,20vw,280px);font-weight:900;line-height:.8;letter-spacing:-.09em;pointer-events:none;}
#page-about .philosophy-lead{position:relative;z-index:1;display:flex;min-height:470px;flex-direction:column;}
#page-about .philosophy .eyebrow{color:var(--yellow);}
#page-about .philosophy h2{max-width:430px;margin-top:18px;color:var(--paper);font-size:clamp(42px,4vw,62px)!important;line-height:.9;letter-spacing:-.06em;}
#page-about .philosophy-copy{position:relative;z-index:1;padding-top:4px;}
#page-about .philosophy h2,#page-about .philosophy-copy p strong,#page-about .pull-quote{color:var(--paper);}
#page-about .philosophy-copy p{color:rgba(254,250,240,.76);}
#page-about .pull-quote{margin:30px 0;padding:0 0 0 24px;border-left-color:var(--yellow);font-size:clamp(24px,2.4vw,36px);line-height:1.08;}
.philosophy-intro{max-width:570px;margin-bottom:30px;color:rgba(254,250,240,.72)!important;font-size:16px!important;line-height:1.65!important;}
.philosophy-principles{display:grid;gap:0;border-top:1px solid rgba(254,250,240,.25);}
.philosophy-principle{display:grid;grid-template-columns:42px 1fr;gap:18px;padding:24px 0;border-bottom:1px solid rgba(254,250,240,.25);}
.philosophy-principle>span{color:var(--yellow);font-family:'Archivo';font-size:11px;font-weight:900;letter-spacing:.1em;}
.philosophy-principle h3{margin-bottom:7px;color:var(--paper);font-size:21px;letter-spacing:-.035em;text-transform:none;}
.philosophy-principle p{max-width:500px;margin:0!important;color:rgba(254,250,240,.68)!important;font-size:13px!important;line-height:1.55!important;}
.philosophy-formula{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:center;margin-top:auto;padding-top:34px;border-top:1px solid rgba(254,250,240,.24);}
.philosophy-token{display:grid;place-items:center;aspect-ratio:1;border:1.5px solid rgba(254,250,240,.6);border-radius:18px;color:var(--paper);font-family:'Archivo';font-size:clamp(32px,4vw,54px);font-weight:900;}
.philosophy-token:nth-of-type(2){background:var(--red);}.philosophy-token:nth-of-type(3){background:var(--yellow);color:var(--ink);}
.philosophy-plus{color:var(--yellow);font-family:'Archivo';font-size:22px;font-weight:900;}
.about-process{padding:110px 0;background:var(--paper);}
.about-section-head{display:grid;grid-template-columns:minmax(0,.9fr) minmax(320px,.7fr);gap:70px;align-items:end;margin-bottom:58px;}
.about-section-head h2{max-width:700px;margin-top:18px;font-size:clamp(52px,6vw,82px);line-height:.88;letter-spacing:-.07em;}
.about-section-head p{max-width:460px;color:var(--grey);font-size:16px;line-height:1.65;}
.about-steps{display:grid;grid-template-columns:repeat(4,1fr);border:2px solid var(--ink);border-radius:28px;background:var(--panel);box-shadow:7px 7px 0 var(--ink);overflow:hidden;}
.about-step{position:relative;min-height:280px;padding:28px 24px;border-right:1.5px solid var(--ink);}
.about-step:last-child{border-right:0}.about-step:nth-child(2){background:var(--yellow)}.about-step:nth-child(3){background:var(--red);color:var(--on-red)}.about-step:nth-child(4){background:var(--green);color:var(--ink)}
.about-step .step-num{font-family:'Archivo';font-size:10px;font-weight:900;letter-spacing:.1em;}
.about-step h3{margin-top:108px;font-size:25px;text-transform:none;letter-spacing:-.04em;}
.about-step p{margin-top:10px;color:inherit;font-size:13px;line-height:1.55;opacity:.72;}
.about-step:nth-child(3) p,.about-step:nth-child(4) p{opacity:1;}
.about-promise{padding:0 0 118px;background:var(--paper);}
.about-promise-panel{position:relative;padding:64px;border:2px solid var(--ink);border-radius:32px;background:var(--yellow);box-shadow:8px 8px 0 var(--ink);overflow:hidden;}
.about-promise-panel::after{content:"✦";position:absolute;right:42px;top:18px;color:var(--red);font-size:84px;transform:rotate(12deg);}
.about-promise-panel h2{max-width:850px;margin-top:18px;font-size:clamp(46px,5.5vw,76px);line-height:.9;letter-spacing:-.065em;}
.about-promises{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:56px;padding-top:34px;border-top:2px solid var(--ink);}
.about-promise-item span{color:var(--red);font-family:'Archivo';font-size:10px;font-weight:900;letter-spacing:.1em;}.about-promise-item h3{margin:10px 0 8px;font-size:21px;text-transform:none}.about-promise-item p{max-width:340px;color:rgba(17,17,17,.68);font-size:13px;line-height:1.55;}
@media(max-width:900px){.about-story-grid{grid-template-columns:1fr}.about-stack-stage{min-height:480px}.about-story :is(h1,.page-heading){max-width:760px}}
@media(max-width:900px){#page-about .philosophy{grid-template-columns:1fr}#page-about .philosophy-lead{min-height:0}.philosophy-formula{max-width:480px;margin-top:48px}}
@media(max-width:900px){.about-section-head{grid-template-columns:1fr;gap:20px}.about-steps{grid-template-columns:1fr 1fr}.about-step:nth-child(2){border-right:0}.about-step:nth-child(-n+2){border-bottom:1.5px solid var(--ink)}.about-promises{grid-template-columns:1fr}.about-promise-panel{padding:50px 42px}}
@media(max-width:620px){.about-story{padding:64px 0 72px}.about-story :is(h1,.page-heading){font-size:clamp(52px,16vw,72px)}.about-stack-stage{min-height:390px;padding:20px;border-radius:26px;box-shadow:5px 5px 0 var(--ink)}#page-about .about-philosophy{padding:72px 0 88px}#page-about .philosophy{padding:34px 24px}.philosophy-formula{gap:6px}.philosophy-token{border-radius:12px}.philosophy-principle{grid-template-columns:32px 1fr}.about-process{padding:80px 0}.about-section-head h2{font-size:clamp(46px,14vw,64px)}.about-steps{grid-template-columns:1fr}.about-step{min-height:220px;border-right:0;border-bottom:1.5px solid var(--ink)!important}.about-step:last-child{border-bottom:0!important}.about-step h3{margin-top:68px}.about-promise{padding-bottom:88px}.about-promise-panel{padding:42px 24px}.about-promise-panel::after{right:20px;font-size:58px}.about-promises{margin-top:42px}}
@media(prefers-reduced-motion:reduce){.about-stack-block,.about-stack-spark{animation:none}}
.values-grid{gap:16px;background:transparent;border:0;border-radius:0;overflow:visible;}
.value-item{min-height:230px;border:2px solid var(--ink);border-radius:22px;box-shadow:5px 5px 0 var(--ink);}
.value-item:nth-child(4n+1){background:var(--yellow);}
.value-item:nth-child(4n+1){--grey:#55524b;}
.value-item:nth-child(4n+2){background:var(--panel);}
.value-item:nth-child(4n+3){background:var(--red);color:var(--paper);}
.value-item:nth-child(4n){background:var(--blue);color:var(--paper);}
.value-item:nth-child(4n+3) p,.value-item:nth-child(4n) p{color:rgba(254,250,240,.76);}
.value-item:nth-child(4n+3) .num,.value-item:nth-child(4n) .num{-webkit-text-stroke-color:var(--paper);}

#page-services>.tight{padding-top:110px;background:#FEFAF0;}
#page-services>.tight>.capabilities-list{display:block;counter-reset:capability;}
.capabilities-head{display:grid;grid-template-columns:1fr minmax(320px,.75fr);gap:80px;align-items:end;margin-bottom:54px;}
.capabilities-head h2{margin-top:16px;font-size:clamp(52px,6vw,82px);line-height:.86;letter-spacing:-.07em;}
.capabilities-head p{max-width:450px;margin-left:auto;color:var(--grey);font-size:15px;line-height:1.65;}
#page-services .svc-detail{counter-increment:capability;display:grid;grid-template-columns:42px minmax(200px,.9fr) minmax(280px,1.15fr) minmax(220px,.8fr);gap:26px;align-items:center;min-height:0;padding:28px 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;}
#page-services .svc-detail:last-of-type{border-bottom:1px solid var(--line);}
#page-services .svc-detail::before{content:counter(capability,decimal-leading-zero);color:var(--red);font-family:'Archivo';font-size:9px;font-weight:900;letter-spacing:.1em;}
#page-services .svc-label{gap:0;}
#page-services .svc-label .ico{display:none;}
#page-services .svc-label h3{font-size:23px;line-height:1.05;letter-spacing:-.04em;transition:color .2s ease;}
#page-services .svc-body{display:contents;}
#page-services .svc-body p.lede2{max-width:none;margin:0;color:var(--grey);font-size:13px;font-weight:450;line-height:1.6;transition:color .2s ease;}
#page-services .svc-includes{justify-content:flex-end;gap:6px;}
#page-services .svc-includes span{padding:5px 8px;border:1px solid var(--line);background:transparent;color:var(--ink);font-family:'Archivo';font-size:7px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;transition:color .2s ease,border-color .2s ease,background .2s ease;}
@media(hover:hover){
  #page-services .svc-detail:hover{background:transparent;transform:none;box-shadow:none;}
  #page-services .svc-detail:hover .svc-label h3{color:var(--blue);}
  #page-services .svc-detail:hover .svc-body p.lede2{color:var(--ink);}
  #page-services .svc-detail:hover .svc-includes span{color:var(--blue);border-color:rgba(23,59,120,.38);background:var(--blue-tint);}
}
@media(max-width:900px){.capabilities-head{grid-template-columns:1fr;gap:22px}.capabilities-head p{margin-left:0}#page-services .svc-detail{grid-template-columns:34px minmax(180px,.8fr) 1.2fr}#page-services .svc-includes{grid-column:2/-1;justify-content:flex-start}}
@media(max-width:620px){#page-services>.tight{padding-top:80px}.capabilities-head h2{font-size:clamp(48px,14vw,64px)}#page-services .svc-detail{grid-template-columns:28px 1fr;gap:12px 14px;padding:24px 0}#page-services .svc-body p.lede2,#page-services .svc-includes{grid-column:2}.capabilities-head{margin-bottom:38px}}
.services-process{padding:110px 0;background:var(--blue);color:var(--paper);overflow:hidden;}
.services-process-grid{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(0,1.2fr);gap:86px;align-items:center;}
.services-process .eyebrow{color:var(--paper)!important;}
.services-process .eyebrow::before{background:var(--red)!important;box-shadow:0 0 0 4px rgba(226,40,49,.15)!important;}
.services-process h2{max-width:520px;margin-top:18px;color:var(--paper);font-size:clamp(52px,6vw,75px);line-height:.86;letter-spacing:-.07em;}
.process-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:36px 8px 12px;overflow:visible;}
.process-card{min-width:0;perspective:700px;}
.process-card-face{position:relative;display:flex;aspect-ratio:.82;min-height:300px;flex-direction:column;padding:24px 20px;border:2px solid var(--ink);border-radius:24px;background:var(--panel);box-shadow:7px 8px 0 var(--ink);color:var(--ink);overflow:hidden;transform-origin:50% 100%;transition:transform .25s ease,box-shadow .25s ease;}
.process-card:nth-child(1) .process-card-face{background:var(--blue);color:var(--paper);border-color:var(--paper);box-shadow:7px 8px 0 var(--yellow);}
.process-card:nth-child(2) .process-card-face{background:var(--red);color:var(--paper);}
.process-card:nth-child(3) .process-card-face{background:var(--yellow);}
.process-card-face::before{content:"";position:absolute;inset:0 43%;background:currentColor;opacity:.08;pointer-events:none;}
.process-card-face::after{content:"";position:absolute;top:18px;right:18px;width:22px;aspect-ratio:1;border:2px solid currentColor;border-radius:50%;background:var(--red);}
.process-card:nth-child(2) .process-card-face::after{border-radius:4px;background:var(--yellow);transform:rotate(45deg);}
.process-card:nth-child(3) .process-card-face::after{background:var(--green);}
.process-card-grid.in .process-card{animation:processTileParade 5.4s ease-in-out 1.1s infinite;}
.process-card-grid.in .process-card:nth-child(2){animation-delay:1.55s;}
.process-card-grid.in .process-card:nth-child(3){animation-delay:2s;}
.process-card-grid.in .process-card-face{animation:processTileSlide .82s cubic-bezier(.18,.9,.28,1.18) backwards;}
.process-card-grid.in .process-card:nth-child(2) .process-card-face{animation-delay:.2s;}
.process-card-grid.in .process-card:nth-child(3) .process-card-face{animation-delay:.4s;}
.process-card:hover{animation-play-state:paused;}
.process-card:hover .process-card-face{transform:translateY(-8px) rotate(-1deg);box-shadow:11px 13px 0 var(--ink);}
.process-card-letter{position:relative;z-index:1;font-family:'Archivo';font-size:clamp(68px,7vw,104px);font-weight:900;line-height:.85;}
.process-card-copy{position:relative;z-index:1;margin-top:auto;}
.process-card h3{margin-bottom:8px;color:inherit;font-size:19px;text-transform:none;letter-spacing:-.03em;}
.process-card p{color:inherit;font-size:11px;line-height:1.45;opacity:.78;}
@keyframes processTileSlide{0%{opacity:0;transform:translateX(-170px) rotate(-7deg) scale(.88)}68%{opacity:1;transform:translateX(12px) rotate(1.5deg) scale(1.02)}84%{transform:translateX(-5px) rotate(-.5deg)}100%{opacity:1;transform:none}}
@keyframes processTileParade{0%,100%{transform:none}5%{transform:translateX(-28px) rotate(-2deg)}12%{transform:translateX(9px) rotate(1deg)}18%,92%{transform:none}}
@media(max-width:900px){.services-process-grid{grid-template-columns:1fr;gap:48px}.services-process h2{max-width:680px}.process-card-face{min-height:280px}}
@media(max-width:620px){.services-process{padding:80px 0}.process-card-grid{gap:9px;padding-inline:0}.process-card-face{aspect-ratio:auto;min-height:190px;padding:18px 12px;border-radius:18px;box-shadow:4px 5px 0 var(--ink)}.process-card-letter{font-size:clamp(52px,18vw,76px)}.process-card h3{font-size:14px}.process-card p{display:none}.services-process h2{font-size:clamp(48px,14vw,64px)}}
@media(prefers-reduced-motion:reduce){.process-card-grid.in .process-card,.process-card-grid.in .process-card-face{animation:none}.process-card:hover .process-card-face{transform:none}}
.svc-label .ico{width:60px;height:60px;padding:10px;border:2px solid var(--blue);border-radius:18px;}
.svc-label h3{font-size:clamp(25px,2.5vw,34px);letter-spacing:-.04em;}
.svc-includes span{border:1.5px solid var(--blue);background:var(--blue-tint);color:var(--blue);font-weight:700;}

.work-card,.archive-card{border:2px solid var(--ink);border-radius:22px;box-shadow:6px 6px 0 var(--ink)!important;}
.work-card:hover,.archive-card:hover{transform:translate(-4px,-4px);box-shadow:10px 10px 0 var(--ink)!important;}
.work-thumb,.archive-thumb{border-bottom:2px solid var(--ink);background:var(--yellow);}
.work-body .tag,.archive-body .cat,.blog-meta{color:var(--red);}
.work-filters button{border:1.5px solid var(--ink);background:var(--panel);color:var(--ink);font-weight:700;}
.work-filters button:hover{background:var(--yellow);}
.work-filters button.active{background:var(--blue);color:var(--paper);border-color:var(--ink);box-shadow:3px 3px 0 var(--ink);}
.case-empty{border:2px dashed var(--blue);background:var(--blue-tint);}

/* ---------- WORK INTRO ---------- */
#page-work{padding-top:0;}
.work-intro{position:relative;min-height:800px;padding:170px 0 82px;background:var(--blue);color:var(--paper);overflow:hidden;isolation:isolate;}
.work-intro::after{content:"WORK";position:absolute;z-index:-1;left:-24px;bottom:-80px;color:rgba(255,255,255,.075);font-family:'Archivo';font-size:clamp(210px,30vw,470px);font-weight:900;line-height:.7;letter-spacing:-.09em;pointer-events:none;}
.work-intro-grid{display:grid;grid-template-columns:minmax(480px,1fr) minmax(0,.95fr);gap:clamp(60px,7vw,110px);align-items:center;}
.work-deck{position:relative;min-height:500px;isolation:isolate;}
.deck-card{position:absolute;width:min(65%,340px);aspect-ratio:4/5;border:2px solid var(--ink);border-radius:27px;box-shadow:9px 9px 0 rgba(17,17,17,.3);overflow:hidden;transition:transform .55s cubic-bezier(.2,.8,.2,1),left .55s cubic-bezier(.2,.8,.2,1),top .55s cubic-bezier(.2,.8,.2,1),width .55s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;}
.deck-card::before{content:attr(data-number);position:absolute;z-index:3;top:25px;left:26px;font-family:'Archivo';font-size:12px;font-weight:900;letter-spacing:.12em;color:var(--ink);transition:top .45s ease,left .45s ease,font-size .45s ease;}
.deck-card.back{left:4%;top:14%;z-index:1;background:#0EA87D;color:var(--ink);transform:rotate(-12deg);}
.deck-card.middle{left:29%;top:5%;z-index:2;background:var(--yellow);color:var(--ink);transform:rotate(2deg);}
.deck-card.front{left:48%;top:8%;z-index:3;background:var(--red);color:var(--paper);transform:rotate(11deg);}
.deck-card.back{transition-delay:0ms;}.deck-card.middle{transition-delay:70ms;}.deck-card.front{transition-delay:140ms;}
@media(hover:hover){
  .work-deck:hover .deck-card{width:31%;box-shadow:6px 7px 0 rgba(17,17,17,.28);}
  .work-deck:hover .deck-card.back{left:0;top:24%;transform:rotate(-4deg);}
  .work-deck:hover .deck-card.middle{left:34.5%;top:12%;transform:rotate(1deg);}
  .work-deck:hover .deck-card.front{left:69%;top:24%;transform:rotate(4deg);}
  .work-deck:hover .deck-card::before{top:17px;left:16px;font-size:8px;}
  .work-deck:hover .deck-card-copy{left:16px;right:12px;bottom:18px;font-size:clamp(14px,1.45vw,20px);line-height:.88;}
  .work-deck:hover .deck-card.back .deck-shape{width:70px;height:70px;left:18px;top:72px;}
  .work-deck:hover .deck-card.middle .deck-shape{width:76px;height:76px;left:28px;top:62px;border-radius:23px;}
  .work-deck:hover .deck-card.front .deck-shape{width:68px;height:68px;right:22px;top:70px;}
}
.deck-shape,.deck-shape::before,.deck-shape::after{position:absolute;display:block;content:"";}
.deck-shape{transition:width .45s ease,height .45s ease,left .45s ease,right .45s ease,top .45s ease,border-radius .45s ease;}
.deck-card.back .deck-shape{width:130px;height:130px;left:28px;top:112px;border-radius:50%;background:var(--blue);border:2px solid var(--ink);}
.deck-card.middle .deck-shape{width:150px;height:150px;left:48px;top:78px;border-radius:38px;background:var(--red);border:2px solid var(--ink);transform:rotate(18deg);}
.deck-card.front .deck-shape{width:132px;height:132px;right:40px;top:92px;border-radius:50% 50% 50% 12px;background:var(--yellow);border:2px solid var(--ink);transform:rotate(45deg);}
.deck-card-copy{position:absolute;z-index:4;left:27px;right:18px;bottom:28px;font-family:'Archivo';font-size:clamp(26px,2.2vw,35px);font-weight:900;line-height:.82;letter-spacing:-.055em;text-transform:uppercase;transition:left .45s ease,right .45s ease,bottom .45s ease,font-size .45s ease,line-height .45s ease;}
.deck-card.front .deck-card-copy{color:var(--paper);}
.work-intro-copy :is(h1,.page-heading){max-width:720px;margin:24px 0 26px;font-size:clamp(50px,6vw,84px);line-height:.9;letter-spacing:-.065em;}
.work-intro-copy .eyebrow{color:var(--yellow);}
.work-intro-copy .eyebrow::before{background:var(--red);box-shadow:0 0 0 5px rgba(226,40,49,.18);}
.work-intro-copy-text{max-width:620px;color:rgba(254,250,240,.72);font-size:18px;line-height:1.65;}
.work-counter{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.28);}
.work-counter>div{display:flex;flex-direction:column;gap:5px;padding:24px 18px 0 0;}
.work-counter>div+div{padding-left:22px;}
.work-counter strong{font-family:'Archivo';font-size:clamp(29px,3vw,38px);line-height:1;color:var(--yellow);letter-spacing:-.05em;}
.work-counter span{color:rgba(254,250,240,.55);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;}

.pss-grid{gap:16px;background:transparent;border:0;border-radius:0;overflow:visible;}
.pss-item,.cs-step{border:2px solid var(--ink);border-radius:22px;box-shadow:5px 5px 0 var(--ink);background:var(--panel);}
.pss-item:nth-child(1){background:var(--yellow);}
.pss-item:nth-child(3){background:var(--blue);color:var(--paper);}
.pss-item:nth-child(3) p,.pss-item:nth-child(3) .tag{color:var(--paper);}
.cs-gallery-item,.cs-shot,.blog-article-cover{border:2px solid var(--ink);border-radius:22px;box-shadow:6px 6px 0 var(--ink);}
.cs-tags span{border-color:var(--ink);background:var(--yellow);color:var(--ink);}

#page-blog>.blog-hero{padding:58px 40px 72px;background:var(--paper);}
#page-blog>.blog-hero::before{display:none;}
#page-blog>.blog-hero>.blog-hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:22px;padding:0;}
.blog-hero-copy{display:flex;flex-direction:column;justify-content:center;min-height:470px;padding:54px;border:2px solid var(--ink);border-radius:34px;background:var(--blue);box-shadow:8px 8px 0 var(--ink);color:var(--paper);}
#page-blog>.blog-hero .blog-hero-copy .eyebrow{color:var(--yellow);}
#page-blog>.blog-hero .blog-hero-copy .eyebrow::before{background:var(--red);}
.blog-hero-copy :is(h1,.page-heading){max-width:800px;margin:28px 0 24px;color:var(--paper);font-size:clamp(54px,7vw,96px)!important;line-height:.86!important;}
body.lang-th #page-blog .blog-hero-copy :is(h1,.page-heading){line-height:1.3!important;letter-spacing:0!important;}
.blog-hero-copy .lede{max-width:660px;margin-top:0!important;color:rgba(254,250,240,.75);line-height:1.7;}
.blog-hero-card{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:470px;padding:34px;border:2px solid var(--ink);border-radius:34px;background:var(--yellow);box-shadow:8px 8px 0 var(--ink);overflow:hidden;transform:rotate(1.5deg);}
.blog-hero-card::before{content:"";position:absolute;width:180px;height:180px;right:-62px;top:-54px;border-radius:50%;background:var(--red);border:2px solid var(--ink);}
.blog-hero-card::after{content:"";position:absolute;width:74px;height:74px;left:34px;bottom:108px;border-radius:20px;background:var(--blue);border:2px solid var(--ink);transform:rotate(-8deg);}
.blog-issue{position:relative;z-index:1;align-self:flex-start;padding:8px 12px;border:1.5px solid var(--ink);border-radius:100px;background:var(--panel);font-family:'Archivo';font-size:10px;font-weight:900;letter-spacing:.13em;}
.blog-hero-card strong{position:relative;z-index:1;font-family:'Archivo';font-size:clamp(32px,3vw,46px);line-height:.9;letter-spacing:-.055em;text-transform:uppercase;}
.blog-hero-card small{position:relative;z-index:1;font-family:'Archivo';font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;}
.blog-toc,.blog-faq details{border:1.5px solid var(--ink);background:var(--panel);}
.blog-prose blockquote{border-left-color:var(--red);background:var(--yellow);padding:22px 26px;border-radius:0 16px 16px 0;}

#page-contact .contact-grid{--contact-pad-x:48px;--contact-pad-bottom:48px;position:relative;padding:48px 48px 282px;border:2px solid var(--ink);border-radius:34px;background:var(--yellow);box-shadow:8px 8px 0 var(--ink);}
#page-contact .contact-head>svg{filter:drop-shadow(4px 4px 0 rgba(17,17,17,.12));}
.contact-info>div{padding-top:16px;border-top:1px solid rgba(17,17,17,.22);}
.form-card{border:2px solid var(--ink);border-radius:24px;box-shadow:6px 6px 0 var(--ink);}
.field input,.field select,.field textarea,.field .sd-btn{border:1.5px solid var(--ink);background-color:var(--paper);}
.field input:focus,.field select:focus,.field textarea:focus,.field .sd-btn:focus-visible{box-shadow:0 0 0 3px rgba(23,59,120,.14);}

#page-case-single>.hero::before,#page-service-single>.hero::before,#page-blog-single>.hero::before{display:none;}
.single-head,.svc-single-head{padding:34px;border:2px solid var(--ink);border-radius:24px;background:var(--yellow);box-shadow:6px 6px 0 var(--ink);}
.related-head{padding-top:24px;border-top:2px solid var(--ink);}

footer{margin-top:70px;padding:68px 0 38px;background:var(--blue);color:var(--paper);border-top:2px solid var(--ink);}
footer .footer-top{border-bottom-color:rgba(254,250,240,.24);}
footer .footer-col .footer-heading{color:var(--yellow);}
footer .footer-col a,footer .footer-bottom,footer [data-i18n="f-tagline"]{color:rgba(254,250,240,.72)!important;}
footer .footer-col a:hover{color:var(--yellow);}

@media(max-width:980px){
  .work-intro-grid{grid-template-columns:1fr;}
  .work-deck{min-height:510px;max-width:650px;width:100%;margin-inline:auto;}
  #page-services>.tight>.wrap{grid-template-columns:1fr;}
  #page-about .philosophy{padding:42px;}
  #page-contact .contact-grid{--contact-pad-x:38px;--contact-pad-bottom:38px;padding:38px 38px 272px;}
  #page-blog>.blog-hero>.blog-hero-grid{grid-template-columns:1fr;}
  .blog-hero-card{min-height:300px;}
}
@media(max-width:640px){
  .work-intro{padding:130px 0 62px;min-height:0;}
  .work-intro-grid{gap:30px;}
  .work-deck{min-height:245px;}
  .deck-card{width:31%;top:18%;border-radius:18px;box-shadow:4px 5px 0 rgba(17,17,17,.28);}
  .deck-card::before{top:13px;left:10px;font-size:6px;}
  .deck-card.back{left:0;transform:rotate(-3deg);}
  .deck-card.middle{left:34.5%;top:10%;transform:rotate(1deg);}
  .deck-card.front{left:69%;transform:rotate(3deg);}
  .deck-card.back .deck-shape{width:42px;height:42px;left:10px;top:48px;}
  .deck-card.middle .deck-shape{width:46px;height:46px;left:18px;top:42px;border-radius:14px;}
  .deck-card.front .deck-shape{width:40px;height:40px;right:12px;top:46px;}
  .deck-card-copy{left:10px;right:7px;bottom:12px;font-size:clamp(11px,3.4vw,15px);line-height:.9;}
  .work-intro-copy :is(h1,.page-heading){font-size:clamp(46px,14vw,64px);}
  .work-intro-copy-text{font-size:17px;}
  .work-counter>div{padding-right:8px;}
  .work-counter>div+div{padding-left:12px;}
  .work-counter span{font-size:9px;letter-spacing:.04em;}
  main.page:not(#page-home)>.hero{padding-top:42px;padding-bottom:54px;}
  main.page:not(#page-home) .hero-illustration{min-height:310px;padding:18px;border-radius:26px;box-shadow:5px 5px 0 var(--ink);}
  #page-about .philosophy{padding:28px 22px;border-radius:24px;box-shadow:5px 5px 0 var(--ink);}
  #page-contact .contact-grid{--contact-pad-x:22px;--contact-pad-bottom:28px;padding:28px 22px 262px;border-radius:24px;box-shadow:5px 5px 0 var(--ink);}
  .value-item,.svc-detail{min-height:auto;}
  #page-blog>.blog-hero{padding:34px 16px 52px;}
  .blog-hero-copy{min-height:430px;padding:34px 24px;border-radius:26px;box-shadow:5px 5px 0 var(--ink);}
  .blog-hero-copy :is(h1,.page-heading){font-size:clamp(48px,15vw,66px)!important;}
  .blog-hero-card{min-height:260px;padding:26px;border-radius:26px;box-shadow:5px 5px 0 var(--ink);}
  footer{margin-top:48px;}
}

/* Thai typography: one family and Thai-safe rhythm across every component. */
body.lang-th,
body.lang-th :where(*){
  font-family:'Kanit',sans-serif!important;
  letter-spacing:0!important;
}
body.lang-th :where(*)::before,
body.lang-th :where(*)::after{
  font-family:'Kanit',sans-serif!important;
  letter-spacing:0!important;
}
body.lang-th{line-height:1.65;}
body.lang-th :where(:is(h1,.page-heading),h2,h3,.display,.project-feature-title,.deck-card-copy,.kinetic-word,.blog-hero-card strong){
  line-height:1.15!important;
}
body.lang-th :where(h4,h5,h6){line-height:1.3!important;}
body.lang-th :where(p,li,blockquote,.lede,.lede2){line-height:1.7!important;}
body.lang-th :where(button,input,textarea,select,label){line-height:1.45;}

/* ---- money pages (content/landing/*.html, e.g. /web-design-phuket) ---- */
#page-landing .hero{min-height:auto;padding-bottom:30px;}
.lp-hero .page-heading,.lp-hero h1{font-size:clamp(44px,7vw,92px);line-height:.96;margin:16px 0 24px;max-width:1000px;}
.lp-hero .lede{font-size:20px;line-height:1.6;max-width:720px;color:var(--grey);}
.lp-head{display:grid;grid-template-columns:1fr minmax(300px,.8fr);gap:60px;align-items:end;margin-bottom:44px;}
.lp-head h2{font-size:clamp(34px,4.6vw,58px);line-height:1;margin:10px 0 0;}
.lp-head p{color:var(--grey);font-size:17px;line-height:1.65;margin:0;}
.lp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.lp-card{background:var(--panel);border:1.5px solid var(--ink);border-radius:24px;padding:28px 26px;}
.lp-card h3{font-size:21px;margin:0 0 10px;line-height:1.2;}
.lp-card p{margin:0;color:var(--grey);font-size:15.5px;line-height:1.65;}
.lp-tag{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--blue);margin-bottom:12px;}
a.lp-card{color:inherit;text-decoration:none;transition:transform .2s,box-shadow .2s;}
a.lp-card:hover{transform:translateY(-4px);box-shadow:6px 6px 0 var(--ink);}
.lp-more{display:inline-block;margin-top:16px;font-weight:700;color:var(--blue);}
.lp-pains{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 40px;margin:0;padding:0;list-style:none;}
.lp-pains li{position:relative;padding:0 0 14px 34px;border-bottom:1px solid var(--line);font-size:17px;line-height:1.55;}
.lp-pains li::before{content:'✕';position:absolute;left:0;top:0;color:var(--red);font-weight:800;}
.lp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:0;padding:0;list-style:none;counter-reset:step;}
.lp-steps li{counter-increment:step;border-top:2px solid var(--ink);padding-top:18px;}
.lp-steps li::before{content:'0' counter(step);display:block;font-weight:800;color:var(--blue);margin-bottom:10px;}
.lp-steps h3{font-size:20px;margin:0 0 8px;}
.lp-steps p{margin:0;color:var(--grey);font-size:15.5px;line-height:1.6;}
.lp-note{margin-top:24px;color:var(--grey);font-size:15.5px;line-height:1.6;max-width:760px;}
.lp-note a{color:var(--blue);font-weight:700;}
#page-landing .blog-faq{margin-top:0;border-top:0;padding-top:0;max-width:900px;}
@media(max-width:980px){.lp-grid,.lp-steps{grid-template-columns:1fr 1fr}.lp-head{grid-template-columns:1fr;gap:16px}}
@media(max-width:620px){.lp-grid,.lp-steps,.lp-pains{grid-template-columns:1fr}}
/* pricing (content/landing/pricing.*.html) */
.pricing-page{--pricing-line:rgba(17,17,17,.18);}
#page-landing:has(.pricing-page){padding-top:0;}
#page-landing .pricing-hero{min-height:800px;padding:170px 0 76px;background:var(--yellow);border:0;border-radius:0;}
.pricing-hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);align-items:center;gap:80px;}
.pricing-hero-copy .page-heading{max-width:750px;font-size:clamp(48px,5.8vw,82px);line-height:1;letter-spacing:-.055em;}
.pricing-hero-copy .lede{max-width:620px;font-size:18px;}
.pricing-hero-copy .hero-actions{flex-wrap:wrap;}
.pricing-animation{display:flex;flex-direction:column;justify-content:space-between;min-height:360px;padding:28px 24px;border:2px solid var(--ink);border-radius:28px;background:var(--panel);box-shadow:8px 8px 0 var(--ink);transform:rotate(2deg);}
.pricing-animation-label{color:var(--blue);font-size:10px;font-weight:800;letter-spacing:.1em;}
.pricing-animation img{display:block;width:100%;height:auto;margin:32px 0;}
.pricing-animation-caption{color:var(--blue);font-size:14px;font-weight:600;text-align:right;}
@media(max-width:680px){.pricing-animation{min-height:280px;transform:none;}}
.pricing-ticket{position:relative;padding:28px 32px;background:var(--panel);border:2px solid var(--ink);border-radius:18px;box-shadow:9px 9px 0 var(--ink);transform:rotate(3deg);}
.pricing-ticket-top,.pricing-ticket-detail,.pricing-ticket-bottom{display:flex;justify-content:space-between;align-items:center;gap:18px;}
.pricing-ticket-top{margin-bottom:28px;font-size:10px;font-weight:800;letter-spacing:.09em;color:var(--blue);}
.pricing-ticket-top>span:last-child{font-size:36px;color:var(--red);}
.pricing-stack-art{display:block;width:100%;height:150px;object-fit:contain;margin:-12px 0 20px;}
.pricing-packages .lp-card.reveal.in{animation:pricing-package-arrive .7s cubic-bezier(.2,.8,.2,1) both;}
.pricing-packages .lp-card:nth-child(2){animation-delay:.14s;}
.pricing-packages .lp-card:nth-child(3){animation-delay:.28s;}
@keyframes pricing-package-arrive{from{opacity:0;transform:translateY(38px) rotate(-2deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
@media(prefers-reduced-motion:reduce){.pricing-packages .lp-card.reveal.in{animation:none;}}
.pricing-ticket>p{font-size:15px;color:var(--grey);margin:0 0 6px;}
.pricing-ticket>strong{display:block;font-family:'Archivo',sans-serif;font-size:clamp(48px,5vw,70px);font-weight:900;letter-spacing:-.065em;line-height:1.15;white-space:nowrap;}
.pricing-ticket-line{border-top:2px dashed var(--pricing-line);margin:28px -32px 18px;}
.pricing-ticket-detail{font-size:14px;padding:10px 0;border-bottom:1px solid var(--line);}
.pricing-ticket-detail>span:last-child{font-size:10px;font-weight:800;color:var(--red);}
.pricing-ticket-bottom{margin-top:24px;font-size:9px;font-weight:800;letter-spacing:.08em;}
.pricing-ticket-bottom>span:last-child{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--blue);color:var(--paper);font-size:22px;}
.pricing-page .tight{padding-top:76px;padding-bottom:12px;}
.pricing-page .lp-head{margin-bottom:36px;gap:36px;}
.pricing-page .lp-head h2{font-size:clamp(32px,3.6vw,50px);letter-spacing:-.045em;}
.pricing-packages .lp-grid{gap:24px;align-items:stretch;}
.pricing-packages .lp-card{display:flex;flex-direction:column;border:2px solid var(--ink);border-radius:24px;box-shadow:5px 5px 0 var(--ink);padding:30px 26px;}
.pricing-packages .lp-card .lp-tag{font-weight:900;letter-spacing:.11em;}
.pricing-packages .lp-card h3{min-height:54px;font-size:22px;line-height:1.25;}
.pricing-packages .lp-card .lp-price{font-family:'Archivo',sans-serif;font-size:clamp(38px,3.5vw,50px);letter-spacing:-.055em;margin:18px 0;}
.pricing-packages .lp-card .lp-price small{font-family:inherit;letter-spacing:.04em;}
.pricing-packages .lp-card>p:not(.lp-price){min-height:76px;}
.pricing-packages .lp-card ul{margin:20px 0 28px;flex:1;}
.pricing-packages .lp-featured{background:var(--blue);color:var(--paper);}
.pricing-packages .lp-featured :is(h3,.lp-tag,.lp-price,.lp-price small){color:var(--paper);}
.pricing-packages .lp-featured>p:not(.lp-price){color:rgba(254,250,240,.8);}
.pricing-packages .lp-featured li{border-color:rgba(255,255,255,.22);}
.pricing-packages .lp-featured li::before{color:var(--yellow);}
.pricing-package-link{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:48px;padding:12px 18px;border:1.5px solid var(--ink);border-radius:100px;background:var(--yellow);color:var(--ink);font-size:14px;font-weight:700;transition:background .2s,color .2s;}
.pricing-page [data-price-thb]{white-space:nowrap;}
.pricing-page [data-pricing-note]{max-width:850px;}
.pricing-package-link:hover{background:var(--red);color:var(--paper);}
.pricing-package-link:focus-visible{outline:3px solid var(--red);outline-offset:4px;}
.pricing-extras .lp-grid{grid-template-columns:1fr;gap:0;border-top:2px solid var(--ink);}
.pricing-extras .lp-card{display:grid;grid-template-columns:.65fr 1.15fr .85fr 1.65fr;align-items:center;gap:24px;padding:26px 0;border:0;border-bottom:1px solid var(--pricing-line);border-radius:0;background:none;}
.pricing-extras .lp-card :is(.lp-tag,h3,.lp-price){margin:0;}
.pricing-extras .lp-card .lp-price{font-family:'Archivo',sans-serif;font-size:28px;letter-spacing:-.04em;}
.pricing-extras .lp-card .lp-price small{font-size:10px;letter-spacing:0;}
.pricing-page .pricing-monthly{margin-top:76px;padding:60px 0;background:var(--blue);color:var(--paper);}
.pricing-monthly .lp-head :is(.eyebrow,p){color:var(--paper);}
.pricing-monthly .lp-card{background:transparent;border:1px solid rgba(254,250,240,.38);border-radius:22px;}
.pricing-monthly .lp-card :is(.lp-tag,.lp-price,.lp-price small,li::before){color:var(--yellow);}
.pricing-monthly .lp-card>p:not(.lp-price),.pricing-monthly .lp-note{color:rgba(254,250,240,.8);}
.pricing-monthly .lp-card li{border-color:rgba(254,250,240,.2);}
.pricing-monthly .lp-card li::before{color:var(--yellow);}
.pricing-monthly .lp-note a{color:var(--yellow);}
.pricing-factors .lp-card{border:0;border-top:3px solid var(--red);border-radius:0;padding:24px 0;background:none;}
.pricing-factors .lp-card:nth-child(2){border-color:var(--blue);}
.pricing-factors .lp-card:nth-child(3){border-color:#FFF0A8;}
.pricing-faq .blog-faq{margin-top:0;padding-top:0;border:0;max-width:900px;margin-inline:auto;}
.pricing-faq .blog-faq h2{margin-bottom:30px;}
.pricing-page .pricing-cta{max-width:1160px;margin:36px auto 64px;background:var(--yellow);color:var(--ink);padding:52px 32px;}
.pricing-page .pricing-cta :is(h2,p){color:var(--ink);}
.pricing-page .pricing-cta .eyebrow{color:var(--blue)!important;}
.pricing-page .pricing-cta .accent{color:var(--red);}
.pricing-page .pricing-cta .btn-primary{background:var(--blue);color:var(--paper);}
.pricing-page .pricing-cta .btn-primary:hover{background:var(--red);color:var(--paper);}
body.lang-th .pricing-page :is(.page-heading,h2,h3){line-height:1.3!important;letter-spacing:0;}
@media(max-width:980px){.pricing-hero-grid{gap:36px;grid-template-columns:1.1fr .9fr;}.pricing-extras .lp-card{grid-template-columns:1fr 1.4fr 1fr;}.pricing-extras .lp-card>p:last-child{grid-column:2/4;}.pricing-packages .lp-grid{grid-template-columns:1fr;}.pricing-packages .lp-card h3,.pricing-packages .lp-card>p:not(.lp-price){min-height:0;}}
@media(max-width:680px){#page-landing .pricing-hero{padding:42px 0 52px;}.pricing-hero-grid{grid-template-columns:1fr;gap:42px;}.pricing-hero-copy .page-heading{font-size:clamp(42px,11vw,66px);}.pricing-ticket{max-width:420px;width:100%;margin:0 auto;transform:rotate(1deg);padding:24px;}.pricing-ticket-line{margin-inline:-24px;}.pricing-page .tight{padding-top:50px;}.pricing-page .lp-head{gap:14px;}.pricing-extras .lp-card{grid-template-columns:1fr auto;gap:12px;}.pricing-extras .lp-card .lp-tag{grid-column:1/-1;}.pricing-extras .lp-card>p:last-child{grid-column:1/-1;}.pricing-extras .lp-card .lp-price{font-size:26px;}.pricing-page .pricing-monthly{margin-top:50px;padding:42px 0;}.pricing-monthly .lp-grid{grid-template-columns:1fr;}.pricing-page .pricing-cta{margin:18px 16px 42px;padding:40px 22px;}.pricing-page .pricing-cta h2{font-size:38px;}}
.lp-card .lp-price{font-size:clamp(30px,3.4vw,42px);font-weight:800;line-height:1;margin:4px 0 14px;color:var(--ink);}
.lp-card .lp-price small{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--grey);margin-bottom:6px;}
.lp-card ul{margin:18px 0 0;padding:0;list-style:none;}
.lp-card li{position:relative;padding:8px 0 8px 26px;border-top:1px solid var(--line);font-size:15px;line-height:1.5;}
.lp-card li::before{content:'✓';position:absolute;left:0;color:var(--blue);font-weight:800;}
.lp-featured{box-shadow:8px 8px 0 var(--blue);}
.lp-grid-4{grid-template-columns:repeat(4,1fr);}
.lp-grid-2{grid-template-columns:repeat(2,1fr);}
@media(max-width:980px){.lp-grid-4{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.lp-grid-4,.lp-grid-2{grid-template-columns:1fr}}
/* longer copy under service pages (SERVICE_MORE) and the "next step" box under articles */
.svc-more{max-width:820px;margin-top:64px;}
.svc-more h2{font-size:clamp(28px,3.4vw,40px);line-height:1.05;margin:52px 0 16px;}
.svc-more p,.svc-more li{color:var(--grey);font-size:17px;line-height:1.7;}
.svc-more p{margin:0 0 14px;}
.svc-more ul{margin:0;padding-left:20px;}
.svc-more li{margin-bottom:8px;}
.svc-more li strong{color:var(--ink);}
.svc-more a,.blog-next a{color:var(--blue);font-weight:700;}
.svc-more .blog-faq{margin-top:52px;border-top:0;padding-top:0;}
.blog-next{margin-top:40px;padding:24px 26px;border:1.5px solid var(--ink);border-radius:20px;background:var(--panel);}
.blog-next h2{font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px;}
.blog-next a{display:block;padding:8px 0;font-size:18px;text-decoration:none;}
/* 7 nav links: tighter between the burger breakpoint and wide screens */
@media(max-width:1200px){.navlinks{gap:22px;}.nav-cta-btn{white-space:nowrap;}}
/* blog archive: search, topic filter, pages */
.blog-tools{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:30px;}
.blog-tools input,.blog-tools select,.blog-tools .sd-btn{font:inherit;font-size:15px;color:var(--ink);background:var(--panel);border:2px solid var(--ink);border-radius:999px;padding:12px 20px;}
.blog-tools input{flex:1 1 260px;}
.blog-tools select,.blog-tools .sd-btn{flex:0 1 220px;cursor:pointer;appearance:none;-webkit-appearance:none;padding-right:48px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M2 2L7 7L12 2' stroke='%23111111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center;background-size:14px 9px;}
.blog-card[hidden]{display:none;}
.blog-pages{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:44px;}
.blog-pages button{min-width:46px;height:46px;padding:0 14px;font:inherit;font-weight:700;color:var(--ink);background:var(--panel);border:2px solid var(--ink);border-radius:999px;cursor:pointer;}
.blog-pages button[aria-current="page"]{background:var(--ink);color:var(--paper);}
.blog-pages button:disabled{opacity:.3;cursor:default;}
/* dropdowns (enhanceSelect in site.js): button + list over the native select */
.sd{position:relative;}
/* animated (.reveal) blocks are separate layers: lift the open dropdown's block above its neighbours */
:has(> .sd > .sd-pop:not([hidden])){position:relative;z-index:50;}
.blog-tools .sd{flex:0 1 220px;}
.sd-native{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;}
.sd-btn{display:block;width:100%;text-align:left;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sd-btn.is-placeholder{color:var(--grey);}
.sd-btn.is-invalid{border-color:var(--red);}
.sd-btn[aria-expanded="true"]{border-color:var(--blue);}
.sd-pop{position:absolute;z-index:40;top:calc(100% + 8px);left:0;right:0;min-width:220px;padding:8px;background:var(--panel);border:2px solid var(--ink);border-radius:18px;box-shadow:6px 6px 0 var(--ink);}
.sd-search{display:block;width:100%;margin-bottom:6px;padding:10px 14px;font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:12px;}
.sd-search:focus{outline:none;border-color:var(--blue);}
.sd-pop.no-search .sd-search{position:absolute;width:1px;height:1px;margin:0;padding:0;border:0;opacity:0;}
.sd-list{position:relative;max-height:264px;margin:0;padding:0;overflow-y:auto;list-style:none;}
.sd-list li{padding:10px 14px;font-size:15px;line-height:1.35;border-radius:10px;cursor:pointer;}
.sd-list li.is-active{background:rgba(23,59,120,.09);}
.sd-list li[aria-selected="true"]{font-weight:700;color:var(--blue);}
.sd-list .sd-empty{color:var(--grey);cursor:default;}

/* ---------- Floating studio header + centered homepage ---------- */
.site-header{top:18px;left:24px;right:24px;max-width:1180px;margin-inline:auto;background:transparent;border:0;backdrop-filter:none;}
.site-header .nav{max-width:none;padding:11px 14px 11px 24px;border:1.5px solid var(--ink);border-radius:100px;background:rgba(254,250,240,.97);box-shadow:0 6px 0 rgba(17,17,17,.16);gap:24px;}
.site-header .navlinks{gap:22px;}
.site-header .navlinks a{font-size:13px;}
.site-header .nav-right{gap:12px;}
.site-header .brand-logo{width:88px;height:36px;}
.site-header .nav-cta-btn{padding:12px 18px!important;font-size:12px!important;box-shadow:none;min-height:44px;}
.site-header .nav-cta-btn:hover{background:var(--red);transform:none;}
.site-header .lang-current{font-size:12px;min-height:44px;padding:8px 12px;background:transparent;}
.site-header .mobile-menu{margin-top:10px;border:1.5px solid var(--ink);border-radius:24px;box-shadow:0 6px 0 rgba(17,17,17,.16);max-height:calc(100dvh - 110px);overflow-y:auto;}
.site-header .logo:focus-visible,.site-header a:focus-visible,.home-hero-v2 a:focus-visible{outline:3px solid var(--red);outline-offset:5px;border-radius:8px;}
#page-home{padding-top:0;}
.home-hero.home-hero-v2{display:block;isolation:isolate;min-height:800px;padding:170px 0 80px;background:var(--blue);color:var(--paper);border-radius:0;overflow:hidden;}
.hero-atmosphere{position:absolute;inset:0;z-index:-1;background:var(--blue);}
.hero-atmosphere::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(254,250,240,.14) .8px,transparent .8px);background-size:28px 28px;mask-image:linear-gradient(transparent,black 65%,transparent);}
.home-hero-v2 .hero-intro{position:relative;z-index:2;text-align:center;max-width:980px;}
.hero-pill{display:inline-flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border:1px solid rgba(254,250,240,.25);border-radius:100px;background:rgba(254,250,240,.06);font-size:11px;font-weight:500;letter-spacing:.025em;}
.hero-pill>span:first-child{display:grid;place-items:center;width:25px;height:25px;background:var(--red);color:var(--paper);border-radius:50%;font-size:17px;}
.home-hero-v2.hero :is(h1,.page-heading){font-size:clamp(60px,6.5vw,92px);letter-spacing:-.065em;line-height:.9;margin:28px 0 28px;text-transform:uppercase;font-weight:900;}
.hero-title-energy{color:#FFF0A8;-webkit-text-stroke:0px #ffffff00;}
.hero-title-outline{color:transparent;-webkit-text-stroke:1.5px var(--paper);}
.hero-intro-lead{max-width:600px;margin-inline:auto;font-size:16px;line-height:1.75;color:rgba(254,250,240,.8);text-wrap:pretty;}
.hero-brief-link{display:flex;align-items:center;gap:14px;max-width:560px;min-height:66px;padding:7px 7px 7px 20px;margin:30px auto 0;background:var(--paper);color:var(--blue);border:1.5px solid var(--ink);border-radius:100px;box-shadow:0 6px 0 rgba(0,0,0,.22);transition:transform .2s,box-shadow .2s;}
.hero-brief-link:hover{transform:translateY(-3px);box-shadow:0 9px 0 rgba(0,0,0,.22);}
.hero-brief-symbol{font-size:26px;color:var(--red);}
.hero-brief-prompt{font-size:12px;text-align:left;flex:1;}
.hero-brief-link strong{display:flex;align-items:center;justify-content:center;gap:14px;align-self:stretch;margin-left:auto;padding:7px 8px 7px 20px;border-radius:100px;background:var(--yellow);font-size:12px;font-weight:700;}
.hero-brief-arrow{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--blue);color:var(--paper);font-size:20px;transition:transform .2s;}
.hero-brief-link:hover .hero-brief-arrow{transform:rotate(45deg);}
.hero-capabilities{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:20px;}
.hero-capabilities a{padding:7px 12px;border:1px solid rgba(254,250,240,.25);border-radius:100px;font-size:10px;color:rgba(254,250,240,.85);transition:background .2s,color .2s;}
.hero-capabilities a:hover{background:var(--yellow);color:var(--blue);}
.hero-work-link{display:inline-flex;align-items:center;gap:12px;margin-top:30px;font-size:11px;color:rgba(254,250,240,.75);}
.hero-work-link:hover{color:var(--yellow);}
.hero-work-link>span:last-child{font-size:17px;}
.hero-side-note{position:absolute;top:212px;left:max(28px,calc(50% - 650px));width:166px;padding:17px 20px;border:1px solid rgba(254,250,240,.3);background:rgba(254,250,240,.07);border-radius:18px;transform:rotate(-7deg);}
.hero-side-note>span{font-size:8px;font-weight:700;letter-spacing:.12em;color:var(--yellow);}
.hero-side-note p{font-size:11px;line-height:1.6;margin-top:10px;color:rgba(254,250,240,.8);}
.hero-side-note i{position:absolute;right:15px;top:12px;font-style:normal;font-size:18px;}
.hero-side-note{border-color:var(--blue-soft);}
.hero-playground{position:absolute;top:300px;right:max(24px,calc(50% - 690px));width:270px;color:var(--paper);}
.hero-playful-badge{position:absolute;left:max(32px,calc(50% - 650px));top:590px;z-index:3;padding:11px 17px;border:1.5px solid var(--ink);border-radius:100px;background:var(--yellow);color:var(--ink);box-shadow:3px 4px 0 var(--ink);font-family:'Archivo',sans-serif;font-size:11px;font-weight:800;letter-spacing:.015em;transform:rotate(-7deg);white-space:nowrap;}
.hero-canvas{position:relative;min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.hero-orbit{position:absolute;inset:0;width:100%;height:100%;color:rgba(254,250,240,.28);pointer-events:none;}
.hero-canvas-caption{position:absolute;bottom:13px;font-size:9px;color:rgba(254,250,240,.75);}
.hero-brand-tiles{position:relative;display:flex;gap:10px;align-items:center;margin:26px 0;}
.hero-brand-unit{display:grid;justify-items:center;gap:16px;}
.hero-brand-unit>span{font-size:6px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(254,250,240,.8);}
.hero-brand-tile{position:relative;display:grid;place-items:center;width:74px;aspect-ratio:1;border:1.5px solid var(--ink);border-radius:18px;box-shadow:4px 5px 0 rgba(0,0,0,.65);font-family:'Archivo',sans-serif;font-size:52px;line-height:1;font-weight:900;animation:heroTileBob 5s ease-in-out infinite;}
.hero-brand-tile>span{position:absolute;right:7px;top:6px;font-size:11px;line-height:1;}
.hero-brand-tile.tile-e{background:var(--blue);color:var(--paper);rotate:-9deg;}.hero-brand-tile.tile-e>span{color:var(--yellow);}
.hero-brand-tile.tile-n{background:var(--red);color:var(--paper);animation-delay:-1.7s;}.hero-brand-tile.tile-n>span{color:var(--yellow);}
.hero-brand-tile.tile-d{background:#FDC126;color:var(--ink);rotate:9deg;animation-delay:-3.4s;}.hero-brand-tile.tile-d>span{width:11px;height:11px;border-radius:50%;font-size:0;background:var(--green);}
@keyframes heroTileBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
body.lang-th .home-hero-v2.hero :is(h1,.page-heading){font-size:clamp(50px,6.2vw,80px);line-height:1.3;letter-spacing:0;font-weight:700;}
body.lang-th .hero-intro-lead{font-size:17px;line-height:1.8;}
@media(max-width:1400px) and (min-width:1101px){.hero-playground{width:220px;right:20px;}.hero-brand-tile{width:60px;font-size:43px;border-radius:15px;}.hero-brand-tiles{gap:8px;}.hero-canvas-caption{font-size:8px;}}
@media(max-width:1200px){.hero-side-note{display:none;}.site-header .navlinks{gap:16px;}.site-header .nav{gap:16px;padding-left:20px;}}
@media(max-width:1100px){.hero-playground{position:relative;top:auto;right:auto;width:280px;margin:24px auto 0;}.hero-canvas{min-height:210px;}.home-hero.home-hero-v2{padding-bottom:32px;}}
@media(max-width:1100px){.hero-playful-badge{position:relative;top:auto;left:auto;display:table;margin:32px auto 0;transform:rotate(-4deg);}}
@media(max-width:1080px){.site-header .navlinks,.site-header .nav-cta-btn{display:none;}.site-header .burger{display:flex;}}
@media(max-width:680px){
  .site-header{top:12px;left:12px;right:12px;}.site-header .nav{padding:7px 10px 7px 18px;}.site-header .nav-right{gap:6px;}.site-header .brand-logo{width:78px;height:32px;}.site-header .lang-current{padding:8px 10px;}
  .home-hero.home-hero-v2{padding-top:130px;min-height:0;border-radius:0;}.home-hero-v2 .hero-intro{padding-inline:22px;}.hero-pill{font-size:9px;padding-right:12px;gap:8px;}.hero-pill>span:first-child{width:22px;height:22px;}
  .home-hero-v2.hero :is(h1,.page-heading){font-size:clamp(37px,10.5vw,66px);margin:24px 0 22px;letter-spacing:-.055em;line-height:1.02;}.hero-intro-lead{font-size:14px;line-height:1.8;max-width:430px;}
  .hero-brief-link{min-height:60px;padding-left:16px;margin-top:26px;gap:12px;}.hero-brief-prompt{font-size:10px;max-width:120px;}.hero-brief-link strong{font-size:11px;padding-left:12px;gap:8px;}.hero-brief-arrow{width:30px;height:30px;}.hero-brief-symbol{display:none;}
  .hero-capabilities{gap:6px;margin-top:18px;}.hero-capabilities a{font-size:9px;padding:7px 10px;}.hero-work-link{margin-top:26px;font-size:10px;}
  .hero-playground{width:260px;margin-top:20px;}.hero-canvas{min-height:200px;}.hero-brand-tiles{gap:12px;}.hero-brand-tile{width:68px;font-size:48px;border-radius:16px;}.hero-canvas-caption{font-size:8px;bottom:8px;}
  body.lang-th .home-hero-v2.hero :is(h1,.page-heading){font-size:clamp(32px,9vw,54px);line-height:1.4;}.hero-intro-lead,body.lang-th .hero-intro-lead{font-size:14px;line-height:1.85;}body.lang-th .hero-brief-prompt{font-size:11px;}body.lang-th .hero-brief-link strong{font-size:12px;}
}
@media(prefers-reduced-motion:reduce){.hero-brand-tile{animation:none;}.hero-brief-link,.hero-brief-arrow{transition:none;}}

/* Small text needs ink, rather than cream, on the brighter logo red/green. */
.method-card.need :is(.method-meta,p,.method-card-rule),
.service-card:nth-child(2) :is(p,.service-tags),.service-card:nth-child(2)::before,
.value-item:nth-child(4n+3) :is(p,h4),.identity-slide :is(.slide-count,h3){color:var(--on-red);opacity:1;}
.blog-meta-category,.blog-article-head .blog-meta-category{color:var(--on-red);}
.site-header .nav-cta-btn:hover,.pricing-page .pricing-cta .btn-primary:hover,
.pricing-package-link:hover,.blog-related-all:hover{color:var(--on-red);}
@media(max-width:680px){#page-landing .pricing-hero{padding:130px 0 52px;min-height:0;}}
/* demo websites: cards on /demos and the money pages (demoCard in site.js) */
.demo-card{cursor:default;}
.demo-desc{margin:4px 0 0;font-size:14.5px;line-height:1.6;color:var(--grey);}
.demo-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-top:auto;padding-top:20px;}
.demo-actions .btn{padding:11px 18px;font-size:14px;}
.demo-start{font-size:14px;font-weight:700;color:var(--ink);}
.demo-start:hover{color:var(--blue);}