/* thenet.monster reusable editorial mascot cards.
   Namespaced to avoid conflicts with existing .monster-section/.monster-callout. */
.tm-feature-area {
  padding: clamp(64px, 8vw, 108px) 0;
  background: #0e1611;
  border-block: 1px solid #283d2d;
}
.tm-feature-area--shaded { background: #121c15; }
.tm-feature-heading { display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:20px; margin-bottom:28px; }
.tm-feature-heading > div { max-width:710px; }
.tm-feature-heading .tm-feature-kicker { color:var(--lime,#bef24a); font-size:10px; font-weight:850; letter-spacing:.17em; margin:0 0 18px; }
.tm-feature-heading h2 { color:#f5f7f0; font-size:clamp(35px,4.7vw,65px); line-height:1.06; letter-spacing:-.06em; margin:0 0 15px; }
.tm-feature-heading h2 span { color:var(--lime,#bef24a); }
.tm-feature-heading p { color:#b5c2b1; line-height:1.7; max-width:610px; margin:0; font-size:14px; }
.tm-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.tm-feature-grid--four { grid-template-columns:repeat(2,minmax(0,1fr)); }
.tm-feature-card {
  position:relative; isolation:isolate; overflow:hidden;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(110px,.43fr);
  gap:15px; align-items:center; min-height:265px;
  padding:clamp(22px,3vw,34px);
  background:radial-gradient(circle at 84% 58%,rgba(181,246,56,.15),transparent 42%),linear-gradient(135deg,#17241a,#111a14);
  border:1px solid rgba(182,244,64,.43); border-radius:13px;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 13px 32px rgba(0,0,0,.15);
}
.tm-feature-card::after {
  content:"";position:absolute;left:0;right:0;bottom:0;height:5px;
  background:linear-gradient(90deg,transparent,rgba(185,255,59,.65),transparent);
  pointer-events:none; opacity:.68;
}
.tm-feature-card--cta { background:radial-gradient(circle at 88% 55%,rgba(185,255,59,.22),transparent 41%),linear-gradient(130deg,#1d2c1b,#111c14); }
.tm-feature-card--support { border-color:rgba(199,245,89,.32);background:radial-gradient(circle at 84% 58%,rgba(168,237,85,.13),transparent 40%),linear-gradient(130deg,#1a261c,#101914); }
.tm-feature-copy { position:relative;z-index:2;min-width:0; }
.tm-feature-label { margin:0 0 19px; color:var(--lime,#bef24a); font-size:10px; font-weight:900; letter-spacing:.15em; }
.tm-feature-card h3 { margin:0 0 14px; font-size:clamp(25px,2.7vw,38px); line-height:1.05; letter-spacing:-.055em;color:#f8fcf2; }
.tm-feature-card h3 span { color:var(--lime,#bef24a); }
.tm-feature-card p:not(.tm-feature-label) { margin:0 0 18px;color:#c1cbbd;line-height:1.63;font-size:13px;max-width:42ch; }
.tm-feature-action { display:inline-flex;align-items:center;gap:12px;color:var(--lime,#bef24a);font-size:11px;font-weight:900;letter-spacing:.035em;text-transform:uppercase;padding:9px 0;text-decoration:none; }
.tm-feature-action:hover,.tm-feature-action:focus-visible { color:white; text-decoration:underline; text-underline-offset:5px; }
.tm-feature-action:focus-visible { outline:2px solid var(--lime,#bef24a);outline-offset:4px; }
.tm-feature-art { position:relative;z-index:1;display:flex;align-items:end;justify-content:center;min-width:0;align-self:end; }
.tm-feature-art img { display:block; width:min(100%,180px); height:auto; max-height:220px; object-fit:contain;filter:drop-shadow(0 13px 14px rgba(0,0,0,.48)); }
.tm-feature-card--compact { min-height:235px; }
@media(max-width: 1120px) {
  .tm-feature-card { grid-template-columns:minmax(0,1fr) 110px; padding:22px; }
  .tm-feature-card h3 { font-size:clamp(23px,3vw,30px); }
}
@media(max-width: 850px) {
  .tm-feature-grid,.tm-feature-grid--four { grid-template-columns:1fr; }
  .tm-feature-card { min-height:205px; grid-template-columns:minmax(0,1fr) minmax(95px,.25fr); }
  .tm-feature-art img { max-height:190px; }
}
@media(max-width: 520px) {
  .tm-feature-card { padding:20px;grid-template-columns:minmax(0,1fr) 100px; gap:6px; }
  .tm-feature-card h3 { font-size:clamp(22px,5.6vw,29px); }
  .tm-feature-card p:not(.tm-feature-label){font-size:12px}
  .tm-feature-art img { max-height:152px; }
}
@media(prefers-reduced-motion:reduce){ .tm-feature-action { transition:none; } }


/* === Studio infobox evolution | approved mascot pose collection ===
   Both Home's first four service tiles and interior service overview share
   this visual language; real HTML text and links stay independently editable. */
:root{--tm-card-lime:#c1fa48;--tm-card-ink:#0d140e}
.service-card.tm-service-card,
.services-overview-card.tm-overview-illustrated{
 position:relative;isolation:isolate;overflow:hidden;
 border:1px solid #a8e448ae;border-radius:15px;
 background:radial-gradient(ellipse at 92% 80%,#395824 0%,#1b2b1e 38%,#101915 76%);
 box-shadow:inset 0 1px #edff9b18,0 9px 30px #050a0660,0 0 20px #b2fb3216;
 transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.tm-service-card:hover,.tm-overview-illustrated:hover{
 border-color:#d0ff60;box-shadow:inset 0 1px #d6fb6b1e,0 16px 36px #0008,0 0 25px #aaf52c34;
}
.tm-service-card:focus-within,.tm-overview-illustrated:focus-within{outline:2px solid var(--tm-card-lime);outline-offset:3px}
.service-card.tm-service-card{min-height:350px;padding:21px 18px 78px;justify-content:flex-start;gap:0}
.tm-service-card .service-top{z-index:2;position:relative;color:var(--tm-card-lime);font-size:9px;line-height:1.3}
.tm-service-card .service-icon{width:35px;height:35px;flex:none;color:var(--tm-card-lime)}
.tm-service-card > div:nth-child(2){z-index:2;position:relative;min-width:0}
.tm-service-card h3{font-size:clamp(21px,1.85vw,27px);max-width:62%;margin:29px 0 12px;letter-spacing:-.045em;line-height:1.04}
.tm-service-card p{max-width:60%;font-size:11px;line-height:1.55;color:#d5e2cb;margin-bottom:0}
.tm-service-art{position:absolute;z-index:1;bottom:65px;right:2px;width:45%;max-width:185px;pointer-events:none;display:flex;align-items:end;justify-content:center}
.tm-service-art img{display:block;width:100%;max-height:208px;height:auto;object-fit:contain;mix-blend-mode:lighten;filter:drop-shadow(0 12px 15px #0008)}
.tm-service-card .service-bottom{
 z-index:3;position:absolute;left:16px;right:16px;bottom:17px;min-height:39px;
 display:flex;align-items:center;justify-content:space-between;gap:12px;
 padding:10px 14px;border:0;border-radius:999px;
 background:var(--tm-card-lime);color:var(--tm-card-ink);font-size:10px;line-height:1.3;letter-spacing:.035em
}
.tm-service-card .service-bottom:hover,.tm-service-card .service-bottom:focus-visible{background:#e0ff78;color:#071006}
.tm-service-card .service-bottom:focus-visible{outline:2px solid white;outline-offset:3px}
.tm-service-card .card-arrow{font-size:15px}
/* Services directory: same artwork family, roomier two-column service cards. */
.services-overview-card.tm-overview-illustrated{min-height:350px;padding:26px 26px 77px}
.tm-overview-illustrated .interior-number{z-index:2;margin-bottom:28px;color:var(--tm-card-lime)}
.tm-overview-illustrated h3{z-index:2;position:relative;max-width:62%;font-size:clamp(26px,3vw,43px);line-height:1.02;margin:0 0 14px}
.tm-overview-illustrated p:not(.interior-number){z-index:2;position:relative;max-width:56%;font-size:12px;line-height:1.58;color:#d0ddc9}
.tm-overview-art{position:absolute;z-index:1;right:10px;bottom:65px;width:39%;max-width:210px;pointer-events:none}
.tm-overview-art img{display:block;width:100%;max-height:240px;height:auto;object-fit:contain;mix-blend-mode:lighten;filter:drop-shadow(0 12px 15px #0008)}
.tm-overview-illustrated a{position:absolute;z-index:3;bottom:19px;left:24px;right:24px;width:auto;display:flex;gap:14px;align-items:center;min-height:43px;padding:9px 15px;border:0;border-radius:999px;background:var(--tm-card-lime);color:#0a1209;font-size:10px}
.tm-overview-illustrated a:hover,.tm-overview-illustrated a:focus-visible{background:#e1ff75;color:#080f05}
/* Secondary reusable editorial cards retain the same design system,
   but show different 3D mascot poses selected in the private source manifest. */
.tm-feature-card{
 border-color:#b3f047ad;
 background:radial-gradient(ellipse at 92% 85%,#324b22 0%,#17261a 38%,#101914 75%);
 box-shadow:inset 0 1px #edff9b18,0 13px 32px #0005,0 0 16px #adf6351a;
 transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.tm-feature-card:hover{transform:translateY(-3px);border-color:#d0ff67;box-shadow:0 16px 38px #0008,0 0 25px #b3ff3940}
.tm-feature-card:focus-within{outline:2px solid var(--tm-card-lime);outline-offset:3px}
.tm-feature-art img{width:min(100%,200px);max-height:225px;mix-blend-mode:lighten;filter:drop-shadow(0 12px 16px #0008)}
.tm-feature-action{
 background:var(--tm-card-lime);border-radius:999px;color:var(--tm-card-ink);
 padding:11px 17px;min-height:41px;justify-content:center;max-width:100%;
}
.tm-feature-action:hover,.tm-feature-action:focus-visible{background:#e2ff82;color:#080f06;text-decoration:none}
.tm-feature-action:focus-visible{outline:2px solid white;outline-offset:3px}
@media(max-width:1200px){
 .tm-service-card h3{max-width:61%;font-size:23px}
 .tm-service-card p{max-width:57%}
}
@media(max-width:850px){
 .tm-service-card h3{max-width:62%;font-size:clamp(22px,4vw,28px)}
 .tm-service-card p{max-width:59%;font-size:12px}
 .tm-service-art{width:40%;right:10px;max-width:190px}
 .tm-feature-art img{max-height:185px}
}
@media(max-width:520px){
 .service-card.tm-service-card{min-height:320px;padding:18px 15px 75px}
 .tm-service-card h3{max-width:63%;margin:20px 0 12px;font-size:clamp(20px,5.5vw,25px)}
 .tm-service-card p{max-width:62%;font-size:11px;line-height:1.5}
 .tm-service-art{width:41%;right:2px;bottom:65px}
 .services-overview-card.tm-overview-illustrated{min-height:320px;padding:20px 17px 72px}
 .tm-overview-illustrated h3{max-width:66%;font-size:clamp(25px,6.5vw,34px)}
 .tm-overview-illustrated p:not(.interior-number){max-width:61%;font-size:12px}
 .tm-overview-art{right:2px;width:39%;bottom:65px}
 .tm-overview-illustrated a{left:16px;right:16px;bottom:16px}
 .tm-feature-action{font-size:10px;padding:10px 12px}
}
@media(prefers-reduced-motion:reduce){
 .tm-service-card,.tm-overview-illustrated,.tm-feature-card{transition:none}
 .tm-service-card:hover,.tm-overview-illustrated:hover,.tm-feature-card:hover{transform:none}
}


/* === Premium homepage restraint / 2026-11-08 === */
/* Home-only: recover space, readable service cards and an editorial treatment.
   Interior service pages retain their independent component layout. */
.solutions .service-card.tm-service-card--clean {
  min-height: 334px;
  padding: clamp(22px, 2.2vw, 30px);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: visible;
  gap: 0;
  background: #171e1b;
  border: 1px solid #33433a;
  border-radius: 5px;
  box-shadow: none;
}
.solutions .service-card.tm-service-card--clean:hover {
  background: #1b2520;
  border-color: #78994e;
  box-shadow: 0 14px 28px rgba(0,0,0,.13);
  transform: translateY(-2px);
}
.solutions .tm-service-card--clean .service-top {
  font-size: 10px;
  color: #adc49c;
}
.solutions .tm-service-card--clean .service-icon {
  height: 32px;
  width: 32px;
  color: var(--lime, #bef24a);
}
.solutions .tm-service-card--clean > div:nth-child(2) {
  min-width: 0;
  width: 100%;
}
.solutions .tm-service-card--clean h3 {
  max-width: none;
  margin: clamp(28px, 3vw, 43px) 0 14px;
  font-size: clamp(22px, 2.05vw, 31px);
  line-height: 1.11;
  letter-spacing: -.045em;
}
.solutions .tm-service-card--clean p {
  max-width: 34ch;
  font-size: 12px;
  line-height: 1.72;
  margin: 0 0 27px;
  color: #b0bdb1;
}
.solutions .tm-service-card--clean .service-bottom {
  position: static;
  margin-top: auto;
  width: 100%;
  min-height: 43px;
  padding: 14px 0 0;
  display: flex;
  justify-content: space-between;
  background: none;
  border: 0;
  border-top: 1px solid #39483d;
  border-radius: 0;
  color: #dfead8;
  font-size: 10px;
  letter-spacing: .045em;
}
.solutions .tm-service-card--clean .service-bottom:hover {
  background: none;
  color: var(--lime, #bef24a);
}
.solutions .tm-service-card--clean .card-arrow {
  color: var(--lime, #bef24a);
  font-size: 19px;
}
/* No fake transparency: opaque mascot card artwork was removed, not blended. */
.tm-editorial {
  position: relative;
  overflow: hidden;
  padding: clamp(72px, 8.6vw, 124px) 0;
  background: #111915;
  border-top: 1px solid #26392c;
  border-bottom: 1px solid #26392c;
}
.tm-editorial-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(260px, .82fr);
  gap: clamp(34px, 7vw, 100px);
  align-items: center;
}
.tm-editorial-copy { position: relative; z-index: 2; }
.tm-editorial-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #c6d4be;
  font-weight: 800;
  font-size: 10px;
  letter-spacing: .14em;
  margin: 0 0 35px;
}
.tm-editorial-index {
  width: 28px; height: 28px;
  display: inline-grid; place-items: center;
  border-radius: 50%;
  background: var(--lime, #bef24a);
  color: #111811;
  font-size: 10px;
  letter-spacing: 0;
}
.tm-editorial h2 {
  margin: 0 0 28px;
  color: #f5f8f0;
  font-weight: 950;
  font-size: clamp(45px, 5.4vw, 85px);
  letter-spacing: -.07em;
  line-height: .97;
}
.tm-editorial h2 span { color: var(--lime, #bef24a); }
.tm-editorial-lede {
  max-width: 55ch;
  margin: 0 0 32px;
  color: #b4c0b5;
  font-size: clamp(14px, 1.15vw, 17px);
  line-height: 1.75;
}
.tm-editorial-link {
  display: inline-flex;
  align-items: center;
  gap: 22px;
  border-bottom: 1px solid #7b9f60;
  padding: 13px 0;
  color: #f2f6ed;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .06em;
  transition: color .2s ease, border-color .2s ease;
}
.tm-editorial-link span { font-size: 20px; color: var(--lime,#bef24a); }
.tm-editorial-link:hover { color: var(--lime,#bef24a); border-color: var(--lime,#bef24a); }
.tm-editorial-link:focus-visible { outline: 2px solid var(--lime,#bef24a); outline-offset: 5px; }
.tm-editorial-visual {
  position: relative;
  min-height: clamp(260px, 30vw, 420px);
  display: grid;
  place-items: center;
  isolation: isolate;
  background: radial-gradient(circle at center, rgba(179,236,78,.075), transparent 62%);
}
.tm-editorial-orbit {
  position: absolute;
  width: min(88%, 355px);
  aspect-ratio: 1;
  border: 1px solid rgba(189,242,74,.26);
  border-radius: 50%;
}
.tm-editorial-orbit--outer {
  transform: rotate(-24deg) scaleX(.91);
  border-style: dashed;
  border-color: rgba(189,242,74,.23);
}
.tm-editorial-orbit--inner {
  width: min(66%, 255px);
  transform: rotate(25deg) scaleX(.85);
  border-color: rgba(189,242,74,.38);
}
.tm-editorial-core {
  width: clamp(115px, 14vw, 190px);
  aspect-ratio: 1;
  display: grid; place-items: center;
  border-radius: 50%;
  border: 1px solid rgba(189,242,74,.55);
  box-shadow: inset 0 0 55px rgba(189,242,74,.08), 0 0 40px rgba(189,242,74,.055);
}
.tm-editorial-core span { color: var(--lime,#bef24a); font-size: clamp(70px, 9vw, 130px); font-weight: 200; line-height: 1; }
.tm-editorial-coordinate {
  position: absolute;
  color: #8da38a;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .17em;
}
.tm-editorial-coordinate--top { top: 12px; left: 8px; }
.tm-editorial-coordinate--bottom { bottom: 12px; right: 8px; }
@media (max-width: 1150px) {
  .solutions .service-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
  .solutions .tm-service-card--clean h3 { font-size: clamp(24px, 3vw, 30px); }
}
@media (max-width: 850px) {
  .tm-editorial-layout { grid-template-columns: 1fr; gap: 12px; }
  .tm-editorial-visual { min-height: 280px; }
}
@media (max-width: 540px) {
  .solutions .service-grid { grid-template-columns: 1fr; }
  .solutions .service-card.tm-service-card--clean { min-height: 282px; padding: 24px; }
  .solutions .tm-service-card--clean h3 { margin: 28px 0 14px; font-size: 28px; }
  .solutions .tm-service-card--clean p { max-width: none; font-size: 13px; }
  .tm-editorial h2 { font-size: clamp(37px, 9vw, 53px); overflow-wrap: break-word; }
  .tm-editorial-visual { min-height: 235px; }
  .tm-editorial-coordinate { font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .solutions .service-card.tm-service-card--clean,
  .tm-editorial-link { transition: none; }
  .solutions .service-card.tm-service-card--clean:hover { transform: none; }
}

/* Homepage rail: omit an empty collapsed mascot slot after artwork removal. */
.site-body-grid:not(.sidebar-is-expanded) .tm-sidebar-bottom--quiet { display: none; }
@media (max-width: 850px) { .site-body-grid:not(.sidebar-is-expanded) .tm-sidebar-bottom--quiet { display:flex; } }