/* ===== assets/css/styles.css ===== */
:root {
  --ink: #171717;
  --ink-2: #232323;
  --paper: #f6f5f1;
  --white: #ffffff;
  --muted: #66645f;
  --line: #d6d3cc;
  --orange: #ff5a1f;
  --orange-dark: #d83d09;
  --success: #17633c;
  --danger: #8d241c;
  --container: min(1240px, calc(100% - 40px));
  --text: clamp(1rem, .96rem + .16vw, 1.1rem);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--paper); font-family: Inter, "Helvetica Neue", Arial, sans-serif; font-size: var(--text); line-height: 1.65; }
body.nav-open { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { margin-bottom: .6em; font-weight: 680; letter-spacing: -.045em; line-height: 1.02; }
h1 { max-width: 16ch; font-size: clamp(3rem, 6.2vw, 6.6rem); }
h2 { max-width: 18ch; font-size: clamp(2.25rem, 4.5vw, 4.7rem); }
h3 { font-size: clamp(1.35rem, 2.1vw, 2rem); }
p { color: var(--muted); }
ul { padding-left: 1.1em; }
::selection { color: var(--white); background: var(--orange); }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 4px; }

.container { width: var(--container); margin-inline: auto; }
.skip-link { position: fixed; z-index: 999; top: 12px; left: 12px; padding: 9px 14px; color: var(--white); background: var(--ink); transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.eyebrow { margin-bottom: 18px; color: var(--orange-dark); font-size: .74rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.lead { max-width: 680px; color: #494843; font-size: clamp(1.12rem, 1rem + .5vw, 1.45rem); }
.micro { font-size: .78rem; }
.section { padding: clamp(76px, 10vw, 140px) 0; }
.section-compact { padding: 52px 0; }
.section-dark { color: var(--paper); background: var(--ink); }
.section-dark p { color: #bdbbb5; }
.section-white { background: var(--white); }
.section-head { margin-bottom: clamp(36px, 6vw, 76px); }
.section-head p:last-child { max-width: 620px; margin-bottom: 0; }
.rule { border-top: 1px solid var(--line); }
.accent { color: var(--orange); }
.status { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.status::before { width: 8px; height: 8px; border-radius: 50%; background: var(--orange); content: ""; }
.status.done::before { background: #2c8555; }

.site-header { position: sticky; z-index: 100; top: 0; border-bottom: 1px solid transparent; background: rgba(246,245,241,.92); backdrop-filter: blur(14px); }
.site-header.is-scrolled { border-color: var(--line); }
.header-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { font-size: 1rem; font-weight: 900; letter-spacing: .14em; }
.brand span { color: var(--orange); }
.nav-wrap { display: flex; align-items: center; gap: 12px; }
.site-nav { display: flex; flex-wrap: wrap; gap: 7px 14px; }
.site-nav a { padding: 5px 0; font-size: .72rem; font-weight: 650; }
html.js .site-nav { position: fixed; inset: 76px 0 0; display: none; flex-direction: column; flex-wrap: nowrap; gap: 12px; padding: 38px 20px; color: var(--paper); background: var(--ink); }
html.js .site-nav.is-open { display: flex; }
html.js .site-nav a { padding: 8px 0; font-size: clamp(1.5rem, 7vw, 2.4rem); }
.site-nav a[aria-current="page"] { color: var(--orange); }
.language { min-width: 42px; padding: 8px 10px; border: 1px solid var(--line); font-size: .76rem; font-weight: 800; text-align: center; }
.menu-toggle { width: 44px; height: 44px; display: none; place-content: center; gap: 5px; border: 0; color: var(--white); background: var(--ink); }
html.js .menu-toggle { display: grid; }
.menu-toggle span { width: 19px; height: 2px; background: currentColor; transition: transform .2s ease; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }

.button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 18px; border: 1px solid var(--ink); font-size: .86rem; font-weight: 800; transition: color .2s, background .2s, transform .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: var(--white); background: var(--ink); }
.button-primary:hover { border-color: var(--orange); background: var(--orange); }
.button-secondary { background: transparent; }
.button-light { color: var(--ink); border-color: var(--paper); background: var(--paper); }
.button-orange { color: var(--white); border-color: var(--orange); background: var(--orange); }
.button-orange:hover { border-color: var(--white); background: transparent; }
.text-link { display: inline-flex; gap: 8px; padding-bottom: 2px; border-bottom: 1px solid; font-size: .85rem; font-weight: 800; }

.hero { position: relative; min-height: calc(100svh - 76px); display: grid; align-items: center; padding: 72px 0; overflow: hidden; }
.hero-grid { display: grid; gap: 48px; align-items: center; }
.hero-copy h1 { margin-bottom: 26px; }
.hero-actions, .cta-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero-proof { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px; margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--line); }
.hero-proof strong { display: block; font-size: .9rem; }
.hero-proof span { display: block; color: var(--muted); font-size: .74rem; }
.showcase { position: relative; min-height: 430px; }
.showcase::before { position: absolute; inset: 8% 5% 0 16%; border: 1px solid var(--line); content: ""; }
.showcase-card { position: absolute; width: 78%; overflow: hidden; border: 1px solid var(--line); background: var(--white); box-shadow: 0 24px 70px rgba(20,20,20,.1); animation: float 8s ease-in-out infinite; }
.showcase-card:nth-child(1) { z-index: 3; top: 0; left: 0; }
.showcase-card:nth-child(2) { z-index: 2; top: 24%; right: 0; animation-delay: -2.5s; }
.showcase-card:nth-child(3) { z-index: 1; bottom: 0; left: 8%; animation-delay: -5s; }
.showcase-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.showcase-label { display: flex; justify-content: space-between; gap: 12px; padding: 9px 12px; font-size: .67rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
@keyframes float { 0%,100% { transform: translateY(0) rotate(-.3deg); } 50% { transform: translateY(-10px) rotate(.3deg); } }

.service-grid { display: grid; border-top: 1px solid var(--line); }
.service { min-height: 310px; display: flex; flex-direction: column; justify-content: space-between; padding: 28px 0; border-bottom: 1px solid var(--line); }
.service-index { color: var(--orange-dark); font-size: .72rem; font-weight: 900; }
.service ul { margin-bottom: 0; color: var(--muted); font-size: .9rem; }
.service p { margin-bottom: 0; }

.project-grid { display: grid; gap: 48px 24px; }
.project-card { display: block; }
.project-media { position: relative; overflow: hidden; border: 1px solid var(--line); background: #e8e5df; }
.project-media img { width: 100%; aspect-ratio: 16/10; object-fit: cover; transition: transform .65s cubic-bezier(.2,.8,.2,1); }
.project-card:hover .project-media img { transform: scale(1.025); }
.project-index { position: absolute; top: 12px; left: 12px; padding: 5px 8px; color: var(--white); background: var(--ink); font-size: .67rem; font-weight: 800; }
.project-body { display: grid; gap: 10px; padding: 20px 0 0; }
.project-body h3 { margin-bottom: 0; }
.project-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.tag { padding: 4px 8px; border: 1px solid var(--line); color: var(--muted); font-size: .67rem; }
.project-body p { margin-bottom: 0; }
.abstract-project { min-height: 340px; display: grid; place-items: center; color: var(--paper); background: var(--ink); }
.abstract-project span { display: grid; place-items: center; width: 42%; aspect-ratio: 1; border: 1px solid var(--orange); transform: rotate(16deg); animation: orbit 10s linear infinite; }
.abstract-project span::after { width: 45%; aspect-ratio: 1; background: var(--orange); content: ""; }
@keyframes orbit { to { transform: rotate(376deg); } }

.proof-grid, .value-grid { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); }
.proof, .value { padding: 28px; background: var(--paper); }
.section-dark .proof { background: var(--ink-2); }
.proof strong { display: block; margin-bottom: 7px; color: inherit; font-size: clamp(1.35rem, 2.3vw, 2rem); }
.proof p, .value p { margin-bottom: 0; }
.metric { color: var(--orange); font-size: clamp(2.7rem, 5vw, 5rem); font-weight: 700; letter-spacing: -.06em; line-height: 1; }

.process { counter-reset: process; border-top: 1px solid var(--line); }
.process-step { position: relative; padding: 30px 0 30px 54px; border-bottom: 1px solid var(--line); counter-increment: process; }
.process-step::before { position: absolute; left: 0; top: 33px; color: var(--orange-dark); content: "0" counter(process); font-size: .72rem; font-weight: 900; }
.process-step p { margin-bottom: 0; }

.statement { display: grid; gap: 44px; align-items: start; }
.statement-quote { max-width: 24ch; color: var(--paper); font-size: clamp(1.7rem, 3.2vw, 3.3rem); line-height: 1.22; letter-spacing: -.035em; }
.statement-list { border-top: 1px solid #444; }
.statement-item { padding: 19px 0; border-bottom: 1px solid #444; }
.statement-item strong { display: block; margin-bottom: 4px; }
.statement-item p { margin-bottom: 0; }

.cta { padding: clamp(42px, 6vw, 78px); color: var(--paper); background: var(--ink); }
.cta h2 { max-width: 16ch; }
.cta p { max-width: 620px; color: #bdbbb5; }

.page-hero { padding: clamp(82px, 10vw, 140px) 0 70px; border-bottom: 1px solid var(--line); }
.page-hero h1 { max-width: 17ch; }
.page-intro-grid { display: grid; gap: 28px; align-items: end; }
.offer { display: grid; gap: 20px; padding: 44px 0; border-bottom: 1px solid var(--line); }
.offer h2 { margin-bottom: 8px; font-size: clamp(1.8rem, 3vw, 3.1rem); }
.offer-index { color: var(--orange-dark); font-size: .75rem; font-weight: 900; }
.offer-copy { max-width: 740px; }
.offer-copy ul { columns: 1; color: var(--muted); }
.case-hero { display: grid; gap: 28px; padding: 70px 0; }
.case-visual { border: 1px solid var(--line); }
.case-visual img { width: 100%; }
.case-facts { display: grid; grid-template-columns: repeat(2,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.case-fact { padding: 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.case-fact strong, .case-fact span { display: block; }
.case-fact strong { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.case-fact span { color: var(--muted); font-size: .83rem; }
.case-content { display: grid; gap: 42px; }
.case-content h2 { font-size: clamp(1.8rem, 3vw, 3.2rem); }
.case-content section { padding-top: 28px; border-top: 1px solid var(--line); }

.contact-layout { display: grid; gap: 34px; align-items: start; }
.contact-direct { padding: 30px; color: var(--paper); background: var(--ink); }
.contact-direct p { color: #bdbbb5; }
.contact-direct a:not(.button) { display: block; margin: 10px 0; font-weight: 750; }
.contact-form { padding: clamp(22px, 4vw, 42px); border: 1px solid var(--line); background: var(--white); }
.form-progress { display: flex; gap: 6px; margin-bottom: 30px; }
.form-progress span { height: 3px; flex: 1; background: var(--line); }
.form-progress span.active { background: var(--orange); }
.form-step { padding: 0; border: 0; }
html.js .form-step[hidden] { display: none; }
.form-step legend { margin-bottom: 25px; font-size: clamp(1.4rem, 2vw, 2rem); font-weight: 700; letter-spacing: -.03em; }
.field { display: grid; gap: 7px; margin-bottom: 16px; }
.field label { font-size: .78rem; font-weight: 800; }
.field input, .field textarea, .field select { width: 100%; padding: 13px 12px; border: 1px solid var(--line); border-radius: 0; color: var(--ink); background: var(--white); }
.field textarea { min-height: 150px; resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--orange); outline: 2px solid rgba(255,90,31,.18); }
.form-nav { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; margin-top: 24px; }
.honeypot { position: absolute; left: -9999px; }
.form-status { padding: 12px 14px; margin-bottom: 18px; font-size: .85rem; }
.form-status.success { color: var(--success); background: #e8f5ed; }
.form-status.error { color: var(--danger); background: #fcecea; }

.legal-layout { display: grid; gap: 36px; }
.legal-nav { border-top: 1px solid var(--line); }
.legal-nav a { display: block; padding: 10px 0; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .82rem; }
.legal-copy { max-width: 820px; }
.legal-copy h2 { max-width: none; margin-top: 46px; font-size: 1.65rem; letter-spacing: -.025em; }
.legal-copy h3 { margin-top: 28px; font-size: 1.12rem; letter-spacing: -.01em; }
.legal-copy a { text-decoration: underline; }
.notice { padding: 16px; border-left: 3px solid var(--orange); background: var(--white); }

.site-footer { padding: 70px 0 26px; color: var(--paper); background: var(--ink); }
.footer-grid { display: grid; gap: 44px; }
.footer-intro p { max-width: 510px; color: #bdbbb5; }
.footer-links { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px 22px; }
.footer-links a { color: #d2d0ca; font-size: .82rem; }
.footer-bottom { display: flex; flex-direction: column; gap: 8px; margin-top: 48px; padding-top: 20px; border-top: 1px solid #3b3b3b; color: #97958f; font-size: .72rem; }

.reveal { opacity: 1; transform: none; }
html.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
html.js .reveal.is-visible { opacity: 1; transform: none; }

@media (min-width: 650px) {
  :root { --container: min(1240px, calc(100% - 64px)); }
  .hero-proof { grid-template-columns: repeat(4,1fr); }
  .service-grid { grid-template-columns: repeat(2,1fr); border-left: 1px solid var(--line); }
  .service { padding: 30px; border-right: 1px solid var(--line); }
  .project-grid, .proof-grid, .value-grid { grid-template-columns: repeat(2,1fr); }
  .project-card:nth-child(even) { margin-top: 76px; }
  .form-row { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
  .offer-copy ul { columns: 2; column-gap: 40px; }
  .footer-bottom { flex-direction: row; justify-content: space-between; }
}

@media (min-width: 960px) {
  .menu-toggle { display: none; }
  html.js .menu-toggle { display: none; }
  .site-nav, html.js .site-nav { position: static; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 24px; padding: 0; color: var(--ink); background: transparent; }
  .site-nav a, html.js .site-nav a { padding: 7px 0; font-size: .77rem; letter-spacing: 0; }
  .site-nav .nav-cta { padding: 9px 13px; color: var(--white); background: var(--ink); }
  .hero-grid { grid-template-columns: 1.08fr .92fr; }
  .showcase { min-height: 510px; }
  .section-head, .page-intro-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; }
  .service-grid { grid-template-columns: repeat(4,1fr); }
  .service { min-height: 360px; }
  .statement { grid-template-columns: 1.15fr .85fr; gap: 90px; }
  .proof-grid { grid-template-columns: repeat(3,1fr); }
  .process { display: grid; grid-template-columns: repeat(4,1fr); border-left: 1px solid var(--line); }
  .process-step { min-height: 260px; padding: 72px 26px 28px; border-right: 1px solid var(--line); }
  .process-step::before { top: 25px; left: 26px; }
  .offer { grid-template-columns: .35fr 1fr; gap: 60px; }
  .case-hero { grid-template-columns: .82fr 1.18fr; gap: 65px; align-items: start; }
  .case-content { grid-template-columns: repeat(3,1fr); }
  .contact-layout { grid-template-columns: .72fr 1.28fr; gap: 70px; }
  .contact-direct { position: sticky; top: 104px; }
  .legal-layout { grid-template-columns: 230px 1fr; }
  .legal-nav { position: sticky; top: 110px; }
  .footer-grid { grid-template-columns: 1.2fr .8fr; }
}

@media (max-width: 649px) {
  h1 { font-size: clamp(2.75rem, 14vw, 4.4rem); }
  .hero { min-height: auto; padding-top: 58px; }
  .showcase { min-height: 350px; }
  .button { width: 100%; }
  .case-facts { grid-template-columns: 1fr; }
}

/* Interaction, motion and responsive refinement */
.scroll-progress {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  pointer-events: none;
  background: var(--orange);
  transform: scaleX(0);
  transform-origin: left center;
  will-change: transform;
}

.back-to-top {
  position: fixed;
  z-index: 90;
  right: max(18px, calc((100vw - 1240px) / 2));
  bottom: 22px;
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 2px solid var(--white);
  border-radius: 50%;
  color: var(--white);
  background: var(--ink);
  box-shadow: 0 12px 32px rgba(0,0,0,.24);
  opacity: 0;
  visibility: hidden;
  transform: translateY(18px) scale(.88);
  transition: opacity .25s ease, visibility .25s ease, transform .35s cubic-bezier(.2,.8,.2,1), background .2s ease;
}
.back-to-top span { font-size: 1.35rem; line-height: 1; transform: translateY(-1px); }
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.back-to-top:hover { background: var(--orange); transform: translateY(-3px); }

.site-header { transition: border-color .25s ease, box-shadow .25s ease, transform .65s cubic-bezier(.2,.8,.2,1); }
.site-header.is-scrolled { box-shadow: 0 9px 28px rgba(20,20,20,.06); }
.site-nav a:not(.nav-cta) { position: relative; }
.site-nav a:not(.nav-cta)::after {
  position: absolute;
  right: 0;
  bottom: 2px;
  left: 0;
  height: 1px;
  background: var(--orange);
  content: "";
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .3s cubic-bezier(.2,.8,.2,1);
}
.site-nav a:not(.nav-cta):hover::after,
.site-nav a:not(.nav-cta)[aria-current="page"]::after { transform: scaleX(1); transform-origin: left center; }
.language, .menu-toggle { transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }
.language:hover { color: var(--white); border-color: var(--ink); background: var(--ink); transform: translateY(-2px); }
.menu-toggle:hover { background: var(--orange); transform: rotate(3deg); }

.button { position: relative; overflow: hidden; isolation: isolate; transition: color .25s ease, border-color .25s ease, background .25s ease, transform .25s ease, box-shadow .25s ease; }
.button::after {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 10px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--orange);
  content: "";
  opacity: 0;
  transform: translate(-50%,-50%) scale(0);
  transition: opacity .25s ease, transform .55s cubic-bezier(.2,.8,.2,1);
}
.button:hover { box-shadow: 0 10px 24px rgba(20,20,20,.12); transform: translateY(-3px); }
.button-primary:hover { border-color: var(--orange); background: var(--ink); }
.button-primary:hover::after { opacity: 1; transform: translate(-50%,-50%) scale(26); }
.button-secondary:hover { color: var(--white); border-color: var(--ink); background: var(--ink); }
.button-light:hover { color: var(--white); border-color: var(--orange); background: var(--orange); }
.button:active { box-shadow: none; transform: translateY(0) scale(.98); }
.button:disabled { cursor: wait; opacity: .72; }
.text-link { transition: color .2s ease, border-color .2s ease, transform .2s ease; }
.text-link:hover { color: var(--orange-dark); transform: translateX(3px); }

.hero::after, .page-hero::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: clamp(86px, 18vw, 300px);
  height: 3px;
  background: var(--orange);
  content: "";
  transform: scaleX(0);
  transform-origin: left center;
}
.page-hero { position: relative; overflow: hidden; }
.page-ready .hero::after, .page-ready .page-hero::after { animation: draw-line .9s .25s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes draw-line { to { transform: scaleX(1); } }

html.js .hero-copy > *,
html.js .page-hero .eyebrow,
html.js .page-hero h1,
html.js .page-hero .lead,
html.js .showcase {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .75s cubic-bezier(.2,.8,.2,1), transform .75s cubic-bezier(.2,.8,.2,1);
}
html.js .page-ready .hero-copy > *,
html.js .page-ready .page-hero .eyebrow,
html.js .page-ready .page-hero h1,
html.js .page-ready .page-hero .lead,
html.js .page-ready .showcase { opacity: 1; transform: none; }
html.js .page-ready .hero-copy > :nth-child(1), html.js .page-ready .page-hero .eyebrow { transition-delay: .06s; }
html.js .page-ready .hero-copy > :nth-child(2), html.js .page-ready .page-hero h1 { transition-delay: .14s; }
html.js .page-ready .hero-copy > :nth-child(3), html.js .page-ready .page-hero .lead { transition-delay: .22s; }
html.js .page-ready .hero-copy > :nth-child(4) { transition-delay: .3s; }
html.js .page-ready .hero-copy > :nth-child(5), html.js .page-ready .showcase { transition-delay: .38s; }

.showcase-card { transition: box-shadow .4s ease, filter .4s ease; }
.showcase-card:hover { z-index: 6; box-shadow: 0 32px 80px rgba(20,20,20,.18); filter: saturate(1.08); }
.showcase-card img { transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.showcase-card:hover img { transform: scale(1.045); }
.service, .proof, .value, .process-step { position: relative; overflow: hidden; transition: color .35s ease, background .35s ease, transform .35s ease; }
.service::before, .proof::before, .value::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background: var(--orange);
  content: "";
  transform: scaleY(0);
  transform-origin: bottom center;
  transition: transform .4s cubic-bezier(.2,.8,.2,1);
}
.service:hover, .proof:hover, .value:hover { transform: translateY(-4px); }
.service:hover::before, .proof:hover::before, .value:hover::before { transform: scaleY(1); transform-origin: top center; }
.project-card { transition: transform .4s cubic-bezier(.2,.8,.2,1); }
.project-card:hover { transform: translateY(-7px); }
.project-card:hover .project-index { color: var(--white); background: var(--orange); }
.project-index { transition: color .25s ease, background .25s ease; }
.tag { transition: color .2s ease, border-color .2s ease, background .2s ease; }
.project-card:hover .tag { color: var(--ink); border-color: #bbb7ae; background: var(--white); }

html.js .reveal {
  opacity: 0;
  transform: translateY(26px) scale(.992);
  transition: opacity .75s var(--reveal-delay, 0ms) cubic-bezier(.2,.8,.2,1), transform .75s var(--reveal-delay, 0ms) cubic-bezier(.2,.8,.2,1);
}
html.js .reveal.is-visible { opacity: 1; transform: none; }

.contact-direct { border-radius: 18px; box-shadow: 0 20px 55px rgba(20,20,20,.12); }
.contact-direct h2 { max-width: 11ch; font-size: clamp(2rem, 4.1vw, 4rem); }
.contact-direct .button { margin-top: 8px; }
.contact-form { border-radius: 18px; box-shadow: 0 20px 55px rgba(20,20,20,.07); }
.form-progress {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin: 0 0 36px;
  padding: 0;
  list-style: none;
}
.form-progress li { position: relative; display: grid; justify-items: center; gap: 7px; color: #8a877f; text-align: center; }
.form-progress li::after { position: absolute; z-index: 0; top: 15px; left: 50%; width: 100%; height: 2px; background: var(--line); content: ""; transition: background .3s ease; }
.form-progress li:last-child::after { display: none; }
.form-progress li span {
  position: relative;
  z-index: 1;
  width: 32px;
  height: 32px;
  display: grid;
  flex: none;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--muted);
  background: var(--white);
  font-size: .76rem;
  font-weight: 850;
  transition: color .3s ease, border-color .3s ease, background .3s ease, transform .3s ease;
}
.form-progress li em { font-size: .71rem; font-style: normal; font-weight: 750; }
.form-progress li.active::after { background: var(--orange); }
.form-progress li.active span { color: var(--white); border-color: var(--orange); background: var(--orange); }
.form-progress li.current span { transform: scale(1.12); box-shadow: 0 0 0 5px rgba(255,90,31,.12); }
.form-progress li.current em { color: var(--ink); }
.form-step { min-inline-size: 0; }
.contact-form.is-enhanced .form-step[hidden] { display: none; }
.contact-form.is-enhanced .form-step.is-active { animation: form-step-in .42s cubic-bezier(.2,.8,.2,1); }
@keyframes form-step-in { from { opacity: 0; transform: translateX(16px); } to { opacity: 1; transform: none; } }
.form-step legend { width: 100%; margin-bottom: 28px; }
.field { gap: 8px; margin-bottom: 19px; }
.field label { color: #35332f; font-size: .84rem; line-height: 1.35; }
.field input, .field textarea, .field select {
  min-height: 52px;
  padding: 13px 14px;
  border-radius: 11px;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.field textarea { min-height: 150px; }
.field input:hover, .field textarea:hover, .field select:hover { border-color: #aaa69d; }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--orange); outline: 0; box-shadow: 0 0 0 4px rgba(255,90,31,.12); }
.field input.is-invalid, .field textarea.is-invalid, .field select.is-invalid { border-color: var(--danger); background: #fff8f7; box-shadow: 0 0 0 3px rgba(141,36,28,.09); }
.field-error { color: var(--danger); font-size: .78rem; font-weight: 700; line-height: 1.4; }
.field-error[hidden] { display: none; }
.form-feedback { padding: 12px 14px; margin: 0 0 22px; border-left: 3px solid var(--danger); border-radius: 7px; color: var(--danger); background: #fff3f1; font-size: .84rem; font-weight: 700; }
.form-feedback[hidden] { display: none; }
.form-status { border-radius: 8px; }

@media (max-width: 959px) {
  .header-inner { min-height: 68px; }
  html.js .site-nav {
    z-index: 95;
    inset: 68px 0 0;
    min-height: calc(100svh - 68px);
    display: flex;
    justify-content: center;
    gap: 2px;
    padding: 28px max(24px, calc((100vw - 720px) / 2));
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-12px);
    transition: opacity .28s ease, visibility .28s ease, transform .38s cubic-bezier(.2,.8,.2,1);
  }
  html.js .site-nav.is-open { visibility: visible; opacity: 1; pointer-events: auto; transform: none; }
  html.js .site-nav a { padding: 12px 0; border-bottom: 1px solid #373737; font-size: clamp(1.5rem, 6vw, 2.4rem); opacity: 0; transform: translateY(12px); transition: opacity .3s ease, transform .3s ease, color .2s ease; }
  html.js .site-nav.is-open a { opacity: 1; transform: none; }
  html.js .site-nav.is-open a:nth-child(2) { transition-delay: .04s; }
  html.js .site-nav.is-open a:nth-child(3) { transition-delay: .08s; }
  html.js .site-nav.is-open a:nth-child(4) { transition-delay: .12s; }
  html.js .site-nav.is-open a:nth-child(5) { transition-delay: .16s; }
  html.js .site-nav .nav-cta { margin-top: 12px; padding: 14px 16px; border: 1px solid var(--orange); color: var(--white); background: var(--orange); text-align: center; }
  .menu-toggle { border-radius: 50%; }
}

@media (max-width: 649px) {
  :root { --container: min(100% - 32px, 560px); --text: 1rem; }
  h1 { max-width: 18ch; font-size: clamp(2.4rem, 11vw, 3.45rem); line-height: 1.02; }
  h2 { font-size: clamp(2rem, 9vw, 2.8rem); }
  h3 { font-size: clamp(1.35rem, 7vw, 1.8rem); }
  .eyebrow { margin-bottom: 13px; font-size: .71rem; }
  .lead { font-size: 1.08rem; line-height: 1.55; }
  .micro { font-size: .82rem; line-height: 1.55; }
  .section { padding: 64px 0; }
  .section-compact { padding: 38px 0; }
  .site-header .brand { font-size: .82rem; letter-spacing: .12em; }
  .nav-wrap { gap: 8px; }
  .language { min-width: 40px; padding: 7px 8px; }
  .hero { min-height: auto; padding: 54px 0 66px; }
  .hero-grid { gap: 42px; }
  .hero-copy h1 { margin-bottom: 20px; }
  .hero-actions, .cta-actions { gap: 9px; margin-top: 25px; }
  .hero-actions .button, .cta-actions .button { width: 100%; }
  .hero-proof { gap: 15px 12px; margin-top: 34px; padding-top: 18px; }
  .hero-proof strong { font-size: .82rem; }
  .hero-proof span { font-size: .7rem; line-height: 1.45; }
  .showcase { min-height: 315px; }
  .showcase-card { width: 84%; }
  .section-head { margin-bottom: 34px; }
  .service { min-height: 270px; }
  .project-grid { gap: 54px; }
  .project-body { padding-top: 17px; }
  .project-card:hover { transform: none; }
  .cta { padding: 34px 24px; border-radius: 16px; }
  .page-hero { padding: 58px 0 46px; }
  .page-intro-grid { gap: 18px; }
  .case-hero { padding: 48px 0; }
  .case-facts { grid-template-columns: 1fr; }
  .contact-layout { gap: 22px; }
  .contact-direct { padding: 26px 22px; border-radius: 16px; }
  .contact-direct h2 { max-width: 12ch; margin-bottom: 20px; font-size: 2.25rem; }
  .contact-direct .button { width: 100%; }
  .contact-form { padding: 24px 18px 22px; border-radius: 16px; }
  .form-progress { margin-bottom: 30px; }
  .form-progress li em { max-width: 72px; font-size: .65rem; line-height: 1.2; }
  .form-step legend { margin-bottom: 22px; font-size: 1.45rem; line-height: 1.15; }
  .field { margin-bottom: 17px; }
  .field label { font-size: .83rem; }
  .field input, .field textarea, .field select { min-height: 50px; font-size: 16px; }
  .field textarea { min-height: 132px; }
  #message { min-height: 145px; }
  .form-nav { flex-wrap: nowrap; align-items: stretch; margin-top: 22px; }
  .form-nav > span:empty { display: none; }
  .form-nav .button { width: auto; min-width: 0; flex: 1 1 auto; padding-inline: 12px; font-size: .78rem; }
  .form-nav [data-next]:only-child { margin-left: auto; }
  .footer-grid { gap: 36px; }
  .footer-links { grid-template-columns: 1fr 1fr; gap: 12px 16px; }
  .back-to-top { right: 16px; bottom: 18px; width: 48px; height: 48px; color: var(--white); background: var(--orange); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html.js .reveal { opacity: 1; transform: none; }
}

/* ===== assets/css/redesign.css ===== */
/* CALYNEVO / September 2026. Shared tokens also map directly to a WP theme.json. */
:root{--paper:#f4f3ef;--white:#fff;--ink:#191a1b;--ink-2:#252627;--muted:#5c5d5b;--line:#d0d0ca;--orange:#f05229;--orange-dark:#b83a19;--container:min(1320px,calc(100% - 80px));color-scheme:light}
html[data-theme=dark]{--paper:#151617;--white:#202123;--ink:#f3f2ed;--ink-2:#dddcd6;--muted:#b5b5ae;--line:#454647;--orange:#ff754d;--orange-dark:#ff916e;--danger:#ffb4a8;color-scheme:dark}
body{overflow-x:clip;font-family:Arial,Helvetica,sans-serif;font-size:1rem;line-height:1.65}
main{overflow:clip}h1,h2,h3{font-weight:500;letter-spacing:-.055em;text-wrap:balance}h1,h2,h3,p,a{overflow-wrap:break-word}h2{line-height:1.08}em{font-style:normal;color:var(--orange)}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}img{max-width:100%}[hidden]{display:none!important}section[id]{scroll-margin-top:100px}
.container>*{min-width:0}.eyebrow{font-size:.78rem;letter-spacing:.1em;line-height:1.5}.lead{color:var(--muted)}.micro{font-size:.875rem}.text-link{font-size:.9rem}
.site-header{background:var(--paper);backdrop-filter:none;border-bottom:1px solid var(--line)}.header-inner{min-height:88px}.brand{font-size:1.18rem;letter-spacing:-.045em;font-weight:800}.brand span{font-size:1.5em}.nav-wrap{gap:14px}.language{border:0;min-height:44px;display:grid;place-items:center;font-size:.875rem}.theme-toggle{width:44px;height:44px;display:none;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);font-size:1.35rem}.js .theme-toggle{display:grid}
.button{border-radius:2px;padding:15px 23px;font-size:.9rem;font-weight:600;min-height:54px}.button-primary{background:var(--ink);color:var(--paper)}.button-primary:hover{background:var(--orange);border-color:var(--orange);color:#171717}.button-orange{color:#171717}.button-secondary{color:var(--ink)}.text-link:hover{color:var(--orange-dark)}
.brand-hero{padding:48px 0 54px}.brand-hero>.container>.eyebrow{margin-bottom:30px;color:var(--muted)}.brand-hero-grid{display:grid;grid-template-columns:1.07fr 1fr;gap:24px;align-items:center}.brand-title{position:relative;z-index:1}.brand-title h1{font-size:clamp(4rem,8.7vw,8.1rem);line-height:.99;letter-spacing:-.07em;margin:0;max-width:11ch}.hero-art{position:relative;overflow:hidden;background:#171717;aspect-ratio:1.1}.hero-art img{height:100%;width:100%;object-fit:cover;transform:scale(1.055);transition:transform .6s ease-out}.art-caption{position:absolute;bottom:22px;left:24px;color:#f4f3ef;letter-spacing:.12em;font-size:.75rem}.hero-bottom{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:50px;padding-top:35px}.hero-bottom>p{font-size:1.1rem;max-width:520px;margin:0}.hero-bottom .hero-actions{margin:0;justify-content:flex-end;align-items:center;gap:22px}.hero-actions .text-link{white-space:nowrap}
.discipline-strip{padding:25px 0;background:var(--ink);color:var(--paper)}.discipline-strip .container{display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:clamp(.875rem,1.8vw,1.5rem);font-weight:500;letter-spacing:.06em}.discipline-strip span:nth-child(even){color:var(--orange)}
.section{padding:100px 0}.section-head{align-items:end;gap:70px;margin-bottom:48px}.section-head h2{margin-bottom:0;font-size:clamp(2.4rem,4.6vw,4.6rem)}.section-head>p{max-width:430px;font-size:1.05rem;padding-bottom:4px}.section-head .eyebrow{margin-bottom:20px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:58px 32px}.project-card,.project-card:hover{transform:none}.project-card a{display:block}.project-media{border:0;background:#dddcd5;padding:30px;aspect-ratio:1.45;display:flex;align-items:center}.project-media img{aspect-ratio:1.6;object-fit:contain;height:auto;box-shadow:0 16px 28px #0002;border-radius:3px}.project-media picture{width:100%}.project-index{background:var(--paper);color:var(--ink);font-size:.8rem;z-index:1;top:12px;left:12px}.project-card:nth-child(2) .project-media{background:#cdd8dd}.project-card:nth-child(3) .project-media{background:#dacbbc}.project-card:nth-child(4) .project-media{background:#cbc8da}.project-body{padding-top:22px;gap:12px}.project-body h3{display:flex;justify-content:space-between;align-items:center;font-size:clamp(1.8rem,3vw,2.5rem)}.project-body h3 span{font-size:1.8rem;font-weight:400}.project-body p{max-width:560px}.role-label{display:block;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--orange-dark);margin-bottom:4px}.project-tags{font-size:.8rem;color:var(--muted)}.tag{font-size:.8rem}.project-body .text-link{justify-self:start}.featured-projects .project-card:first-child{grid-column:1/-1}.featured-projects .project-card:first-child>a{display:grid;grid-template-columns:1.45fr 1fr;gap:55px;align-items:center}.featured-projects .project-card:first-child .project-body{padding:0}.all-work{margin-top:44px}.project-card:hover .project-media img{transform:translateY(-5px)}
.service-lines{border-top:1px solid var(--line)}.service-line{display:grid;grid-template-columns:45px 1fr 1fr 35px;gap:25px;padding:34px 0;border-bottom:1px solid var(--line);align-items:start;transition:background .2s}.service-line h3{font-size:clamp(1.5rem,2.5vw,2.4rem);margin:0;max-width:14ch}.service-line strong{font-weight:600}.service-line p{margin:6px 0 0;max-width:430px}.row-number{color:var(--orange-dark);font-size:.85rem}.row-arrow{font-size:1.8rem;line-height:1}.service-line:hover h3{color:var(--orange-dark)}.service{padding:30px 24px;min-height:290px}.service-index,.offer-index{font-size:.85rem}.service-grid{gap:0}
.studio-band{background:#202122;color:#f4f3ef}.studio-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:90px;align-items:end}.studio-grid h2{font-size:clamp(2.6rem,4.8vw,4.9rem);line-height:1.08;margin:0;max-width:20ch}.studio-band .eyebrow{color:#ff916e}.studio-band p{color:#c7c7bf}.studio-aside{max-width:440px}.studio-monogram{font-size:5rem;letter-spacing:-.1em;font-weight:700;display:block;line-height:1;margin-bottom:35px;color:#fa6338}.studio-aside .text-link{color:#f4f3ef}.studio-aside p{font-size:1.1rem}.process-step{min-height:220px}.process-step h3{font-size:1.55rem;letter-spacing:-.035em}.process-step::before{font-size:.85rem}
.closing{background:#f05229;color:#181818}.closing .eyebrow{color:#181818}.closing-grid{display:grid;grid-template-columns:1.2fr 1fr;align-items:end;gap:50px}.closing h2{font-size:clamp(3.2rem,6.6vw,6.6rem);max-width:none;margin:0;line-height:1.03}.closing h2 em{color:#fff9ed}.closing p{color:#242424;font-size:1.05rem;max-width:420px}.closing .button{background:#191a1b;color:#fff;border-color:#191a1b}.closing .button:hover{background:#fff;color:#191a1b;border-color:#fff}
.site-footer{padding:65px 0 20px}.footer-grid{grid-template-columns:1.2fr 1fr;gap:60px}.footer-intro .brand{font-size:clamp(2.5rem,5vw,5rem);letter-spacing:-.055em}.footer-intro p{max-width:430px;font-size:1rem}.footer-links a{font-size:.9rem;min-height:30px}.footer-bottom{font-size:.8rem;gap:16px;flex-wrap:wrap}.footer-intro .text-link{overflow-wrap:anywhere}
.page-hero{padding:78px 0 64px}.page-hero h1{font-size:clamp(3rem,6.6vw,6.4rem);max-width:18ch;line-height:1.05}.page-hero .role-label{margin-bottom:20px}.case-hero{padding-top:0;grid-template-columns:.85fr 1.15fr;gap:45px}.case-visual{padding:22px;background:#deded6;border:0}.case-fact strong{font-size:.8rem}.case-fact span{font-size:.95rem}.case-content h2{font-size:2rem}.case-content section{min-width:0}.case-content p{font-size:1rem}.abstract-project{animation:none;min-height:250px}.abstract-project span{animation:none}.case-facts{grid-template-columns:1fr}.section-dark{background:#202122;color:#f4f3ef}.section-dark .proof{background:#27282a}.section-dark .eyebrow{color:#ff916e}
.project-filters{display:none;gap:8px;flex-wrap:wrap;margin-bottom:38px}.js .project-filters{display:flex}.project-filters button{min-height:44px;padding:9px 20px;border:1px solid var(--line);border-radius:30px;background:transparent;color:var(--ink);font-size:.9rem}.project-filters button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.contact-direct{background:#202122;color:#f4f3ef;border-radius:3px;box-shadow:none}.contact-direct .eyebrow{color:#ff916e}.contact-form{border-radius:3px;box-shadow:none;scroll-margin-top:105px}.contact-direct a{overflow-wrap:anywhere}.field label{color:var(--ink);font-size:.9rem}.field input,.field select,.field textarea{border-radius:2px;font-size:1rem}.form-progress li em{font-size:.85rem}.field-error{font-size:.875rem}.field input.is-invalid,.field textarea.is-invalid{background:var(--white)}.form-status{font-size:1rem}.form-nav button:disabled{opacity:.6;cursor:wait}.form-row>*{min-width:0}.legal-copy a{overflow-wrap:anywhere}.legal-nav a{font-size:.95rem}
.journal-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}.journal-card{padding:38px;border:1px solid var(--line)}.journal-card h2{font-size:2.6rem}.article-copy{max-width:760px;margin:auto}.article-copy h2{font-size:2.4rem;max-width:100%}.article-copy section{margin-bottom:45px}.article-copy p{font-size:1.15rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.js .reveal{opacity:1;transform:none}.js .reveal.is-visible{animation:arrive .55s ease-out both}@keyframes arrive{from{opacity:.55;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(min-width:1050px){.site-nav a,.js .site-nav a{font-size:.875rem}.site-nav,.js .site-nav{gap:22px}.site-nav .nav-cta,.js .site-nav .nav-cta{color:var(--paper);background:var(--ink);padding:12px 16px}}
@media(min-width:960px) and (max-width:1049px){.site-nav,.js .site-nav{gap:12px}.site-nav a,.js .site-nav a{font-size:.8rem}.header-inner{gap:12px}.nav-wrap{gap:5px}.brand{font-size:1rem}}
@media(max-width:959px){:root{--container:calc(100% - 48px)}.header-inner{min-height:76px}.brand-hero{padding-top:34px}.brand-title h1{font-size:clamp(3.7rem,9vw,6rem)}.brand-hero-grid{gap:15px}.hero-bottom{gap:28px}.hero-bottom .hero-actions{justify-content:flex-start}.studio-grid{gap:40px}.section{padding:76px 0}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:30px}.featured-projects .project-card:first-child>a{gap:30px}.closing-grid{gap:35px}.js .site-nav{inset:76px 0 0;min-height:calc(100svh - 76px);height:calc(100svh - 76px);overflow-y:auto;background:#202122;color:#f4f3ef;justify-content:flex-start;padding-top:35px}.js .site-nav a{font-size:1.65rem}.js .site-nav .nav-cta{background:#f05229;color:#181818;border-color:#f05229}.case-hero{grid-template-columns:1fr}.case-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.case-content{grid-template-columns:1fr}.process{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.service-line{grid-template-columns:30px 1fr 1.1fr 25px;gap:15px}.footer-grid{gap:35px}}
@media(max-width:700px){:root{--container:calc(100% - 36px)}.header-inner{min-height:70px;gap:6px}.site-header .brand{font-size:1.1rem;letter-spacing:-.045em}.nav-wrap{gap:4px}.language{padding:6px;min-width:35px}.theme-toggle{width:38px;height:38px}.menu-toggle{width:42px;height:42px}.js .site-nav{inset:70px 0 0;height:calc(100svh - 70px);min-height:calc(100svh - 70px)}.brand-hero{padding:30px 0 38px}.brand-hero>.container>.eyebrow{font-size:.75rem;margin-bottom:25px;letter-spacing:.055em}.brand-hero-grid{grid-template-columns:1fr;gap:28px}.brand-title h1{font-size:clamp(3.5rem,14.7vw,6.4rem);max-width:none;line-height:1.01}.hero-art{aspect-ratio:1.65}.art-caption{bottom:14px;left:16px;font-size:.7rem}.hero-bottom{grid-template-columns:1fr;gap:22px;padding-top:25px}.hero-bottom>p{font-size:1rem}.hero-bottom .hero-actions{display:flex;gap:18px;align-items:center}.hero-actions .button{width:auto;flex:1 1 230px}.hero-actions .text-link{margin:0}.discipline-strip{padding:18px 0}.discipline-strip .container{gap:8px;font-size:clamp(.68rem,2.5vw,.875rem);letter-spacing:0}.section{padding:60px 0}.section-head{grid-template-columns:1fr;gap:20px;margin-bottom:30px}.section-head h2{font-size:clamp(2.4rem,9vw,3.7rem)}.section-head>p{font-size:1rem}.project-grid{grid-template-columns:1fr;gap:40px}.featured-projects .project-card:first-child>a{display:block}.featured-projects .project-card:first-child .project-body{padding-top:20px}.project-media{padding:23px;aspect-ratio:1.4}.project-body h3{font-size:2rem}.all-work{margin-top:32px}.service-line{grid-template-columns:28px 1fr 24px;gap:10px;padding:25px 0}.service-line h3{font-size:1.8rem;max-width:none}.service-line>div{grid-column:2;grid-row:2}.service-line .row-arrow{grid-column:3;grid-row:1}.service-line strong{font-size:.95rem}.service-line p{font-size:.95rem}.studio-grid{grid-template-columns:1fr;gap:40px}.studio-grid h2{font-size:clamp(2.4rem,9vw,3.8rem)}.studio-monogram{display:none}.studio-aside p{font-size:1rem}.process{grid-template-columns:1fr 1fr;gap:0}.process-step{padding:55px 14px 22px 0;min-height:0}.process-step::before{top:22px;left:0}.process-step h3{font-size:1.35rem;letter-spacing:-.025em}.process-step p{font-size:.95rem}.closing-grid{grid-template-columns:1fr;gap:24px}.closing h2{font-size:clamp(3rem,12vw,5rem)}.closing .button{width:auto}.footer-grid{grid-template-columns:1fr;gap:30px}.footer-intro .brand{font-size:3rem}.footer-links{gap:8px 20px}.footer-bottom{font-size:.8rem}.page-hero{padding:45px 0 35px}.page-hero h1{font-size:clamp(2.5rem,10.5vw,4.6rem);line-height:1.07}.case-hero{gap:25px;padding-bottom:35px}.case-facts{grid-template-columns:1fr}.case-visual{padding:12px}.case-content h2{font-size:2rem}.offer-copy ul{columns:1}.journal-list{grid-template-columns:1fr;gap:25px}.journal-card{padding:25px}.journal-card h2{font-size:2rem}.article-copy h2{font-size:2rem}.contact-layout{gap:25px}.contact-form{padding:24px 18px}.form-progress li em{font-size:.8rem}.form-nav .button{font-size:.85rem}.field label{font-size:.9rem}.lead{font-size:1.1rem}.back-to-top{background:var(--ink);color:var(--paper)}}
@media(max-width:359px){:root{--container:calc(100% - 28px)}.brand-title h1{font-size:14.2vw}.site-header .brand{font-size:1rem}.nav-wrap{gap:0}.theme-toggle{width:35px;height:35px}.process{grid-template-columns:1fr}.discipline-strip .container{gap:5px}.form-progress li em{font-size:.73rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.hero-art img{transform:none!important}.js .reveal{opacity:1;transform:none}}
@media print{.site-header,.site-footer,.closing,.back-to-top,.scroll-progress,.theme-toggle{display:none!important}body{background:white;color:black}.section{padding:24px 0}a{text-decoration:underline}.container{width:100%}}
.site-footer{background:#191a1b;color:#f3f2ed}.site-footer .eyebrow{color:#ff916e}.site-footer .text-link{color:#f3f2ed}.site-footer .brand span{color:#ff754d}.site-footer .footer-links a{color:#d2d0ca}.site-footer .footer-intro p{color:#bdbbb5}
.button-secondary:hover,.language:hover{color:var(--paper);background:var(--ink)}.form-progress li.active span{color:#171717}.skip-link{color:var(--paper)}.menu-toggle{color:var(--paper)}
html:not(.js) .header-inner{flex-wrap:wrap;padding-block:16px}html:not(.js) .nav-wrap{flex-wrap:wrap}html:not(.js) .site-nav{flex-wrap:wrap}html:not(.js) .site-nav a{font-size:.9rem}

/* Real-project case studies · 2026-09-11 */
.case-page-hero .lead{max-width:850px}
.case-introduction{padding-top:28px}
.case-introduction .case-hero{align-items:center}
.case-introduction .case-visual{overflow:hidden}
.case-introduction .case-visual img{display:block;height:auto;box-shadow:0 18px 40px rgba(20,20,20,.16)}
.case-story{margin-top:46px}
.case-story section{padding-right:28px}
.case-story p:not(.eyebrow){font-size:1rem;line-height:1.75;color:var(--muted)}
.case-gallery-section{background:#202122;color:#f4f3ef}
.case-gallery-section .section-head>p{color:#c8c7c2}
.case-gallery-section .eyebrow{color:#ff916e}
.case-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 24px;align-items:start}
.case-shot{margin:0;min-width:0}
.case-shot--wide{grid-column:1/-1}
.case-shot a{display:flex;align-items:center;justify-content:center;min-height:280px;padding:24px;background:#ecebe6;overflow:hidden}
.case-shot img{display:block;width:100%;height:auto;max-height:720px;object-fit:contain;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.case-shot--portrait a{min-height:500px}
.case-shot--portrait img{width:auto;max-width:100%;max-height:620px}
.case-shot a:hover img{transform:scale(1.012)}
.case-shot figcaption{display:flex;justify-content:space-between;gap:20px;padding-top:12px;color:#d8d7d2;font-size:.9rem;line-height:1.5}
.case-shot figcaption span{color:#ff6b43}
.project-navigation{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.project-navigation-inner{display:flex;align-items:center;justify-content:space-between;gap:35px;padding-top:30px;padding-bottom:30px}
.next-project{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right}
.next-project span{font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.next-project strong{font-size:1.25rem}

@media(max-width:700px){
  .case-introduction{padding-top:18px}
  .case-story{margin-top:28px}
  .case-story section{padding-right:0}
  .case-gallery{grid-template-columns:1fr;gap:30px}
  .case-shot--wide{grid-column:auto}
  .case-shot a,.case-shot--portrait a{min-height:0;padding:14px}
  .case-shot--portrait img{max-height:520px}
  .project-navigation-inner{align-items:flex-start;flex-direction:column}
  .next-project{align-items:flex-start;text-align:left}
}

/* Targeted interface refinement · 2026-09-11.3
   Scope: hero project deck, theme/language controls, motion, back-to-top. */

/* Header utility controls */
.nav-wrap{align-items:center}
.theme-toggle{
  position:relative;
  width:76px;
  height:40px;
  padding:3px;
  display:none;
  grid-template-columns:1fr 1fr;
  align-items:center;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--ink);
  color:var(--paper);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
  overflow:hidden;
  isolation:isolate;
  cursor:pointer;
  transition:border-color .25s ease, box-shadow .25s ease, transform .25s ease, background .35s ease;
}
.js .theme-toggle{display:grid}
.theme-toggle:hover{transform:translateY(-2px);border-color:var(--orange);box-shadow:0 8px 22px rgba(20,20,20,.12)}
.theme-toggle:focus-visible{outline:3px solid color-mix(in srgb,var(--orange) 42%,transparent);outline-offset:3px}
.theme-icon{
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  font-size:1rem;
  line-height:1;
  transition:color .32s ease, transform .35s cubic-bezier(.2,.8,.2,1),opacity .25s ease;
}
.theme-icon-sun{justify-self:start;color:#191a1b}
.theme-icon-moon{justify-self:end;color:#c9c8c2}
.theme-thumb{
  position:absolute;
  z-index:1;
  top:3px;
  left:3px;
  width:32px;
  height:32px;
  border-radius:50%;
  background:var(--orange);
  box-shadow:0 2px 10px rgba(0,0,0,.2);
  transform:translateX(0);
  transition:transform .42s cubic-bezier(.2,.85,.25,1.15),background .3s ease,box-shadow .3s ease;
}
html[data-theme=dark] .theme-thumb{transform:translateX(36px)}
html[data-theme=dark] .theme-icon-sun{color:#a9a8a2;transform:rotate(-18deg) scale(.88)}
html[data-theme=dark] .theme-icon-moon{color:#191a1b;transform:rotate(10deg)}
html:not([data-theme=dark]) .theme-icon-sun{transform:rotate(10deg)}
html:not([data-theme=dark]) .theme-icon-moon{transform:rotate(18deg) scale(.88)}

.language-switch{
  display:flex;
  align-items:center;
  gap:2px;
  padding:3px;
  min-height:40px;
  border:1px solid var(--line);
  border-radius:999px;
  background:color-mix(in srgb,var(--paper) 86%,var(--ink) 14%);
}
.language-option{
  min-width:36px;
  height:32px;
  padding:0 8px;
  display:grid;
  place-items:center;
  border-radius:999px;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.035em;
  color:var(--muted);
  transition:background .25s ease,color .25s ease,transform .2s ease,box-shadow .25s ease;
}
a.language-option:hover{color:var(--ink);background:var(--paper);transform:translateY(-1px)}
.language-option.is-active{
  color:var(--paper);
  background:var(--ink);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.language-switch:focus-within{outline:3px solid color-mix(in srgb,var(--orange) 35%,transparent);outline-offset:2px}

/* Hero: real project work instead of decorative artwork */
.hero-project-deck{
  --deck-depth:0px;
  position:relative;
  min-height:clamp(430px,36vw,590px);
  isolation:isolate;
  perspective:1100px;
}
.hero-project-deck::before{
  content:"";
  position:absolute;
  inset:9% 7% 10% 9%;
  border:1px solid var(--line);
  background:linear-gradient(135deg,color-mix(in srgb,var(--orange) 11%,var(--paper)),var(--paper) 62%);
  transform:rotate(2deg);
  z-index:-1;
}
.hero-project-card{
  --pointer-x:0px;
  --pointer-y:0px;
  position:absolute;
  display:block;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--line) 78%,var(--ink) 22%);
  background:var(--paper);
  box-shadow:0 22px 55px rgba(15,15,15,.18);
  transform-origin:center;
  transition:transform .42s cubic-bezier(.2,.8,.2,1),translate .42s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .3s ease;
  will-change:transform,translate;
}
.hero-project-card figure{margin:0;position:relative;background:#ecebe6}
.hero-project-card img{display:block;width:100%;height:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .35s ease}
.hero-project-card figcaption{
  position:absolute;
  left:10px;
  right:10px;
  bottom:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  color:#f5f4ef;
  background:rgba(20,20,20,.88);
  backdrop-filter:blur(8px);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.03em;
  transform:translateY(4px);
  transition:transform .3s ease,background .3s ease;
}
.hero-project-card--main{width:79%;left:0;top:13%;z-index:2;transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(-2.4deg)}
.hero-project-card--secondary{width:48%;right:0;top:0;z-index:4;transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(3.4deg)}
.hero-project-card--tertiary{width:49%;right:3%;bottom:0;z-index:5;transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(-3.2deg)}
.hero-project-card--main img{aspect-ratio:16/9.4}
.hero-project-card--tertiary img{object-position:center 48%}
.hero-project-card:hover,.hero-project-card:focus-visible{
  z-index:8;
  translate:0 -10px;
  transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(0deg) scale(1.025);
  border-color:var(--orange);
  box-shadow:0 30px 70px rgba(15,15,15,.25);
  outline:none;
}
.hero-project-card:hover img,.hero-project-card:focus-visible img{transform:scale(1.025)}
.hero-project-card:hover figcaption,.hero-project-card:focus-visible figcaption{transform:none;background:rgba(20,20,20,.94)}
.hero-deck-mark{
  position:absolute;
  left:4%;
  bottom:1%;
  z-index:7;
  padding:7px 9px;
  background:var(--orange);
  color:#171717;
  font-size:.63rem;
  font-weight:800;
  letter-spacing:.1em;
  transform:rotate(1.5deg);
}

/* Controlled hero entrance + subtle living motion */
.page-ready .brand-hero>.container>.eyebrow{animation:heroEnter .5s .04s ease-out both}
.page-ready .brand-title .hero-line{display:inline-block;animation:heroEnter .65s cubic-bezier(.2,.8,.2,1) both}
.page-ready .brand-title .hero-line:nth-of-type(1){animation-delay:.08s}
.page-ready .brand-title .hero-line:nth-of-type(2){animation-delay:.16s}
.page-ready .brand-title .hero-line:nth-of-type(3){animation-delay:.24s}
.page-ready .hero-project-deck{animation:heroDeckEnter .75s .18s cubic-bezier(.2,.8,.2,1) both}
.page-ready .hero-bottom>p{animation:heroEnter .55s .33s ease-out both}
.page-ready .hero-actions{animation:heroEnter .55s .4s ease-out both}
.page-ready .hero-project-card--secondary{animation:deckFloatA 7s 1.1s ease-in-out infinite}
.page-ready .hero-project-card--tertiary{animation:deckFloatB 8.5s 1.45s ease-in-out infinite}
.hero-project-card:hover,.hero-project-card:focus-visible{animation-play-state:paused}
@keyframes heroEnter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes heroDeckEnter{from{opacity:0;transform:translateY(22px) scale(.975)}to{opacity:1;transform:none}}
@keyframes deckFloatA{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes deckFloatB{0%,100%{translate:0 0}50%{translate:0 8px}}

/* More movement, without changing content */
.js .reveal.is-visible{animation:arrive .6s var(--reveal-delay,0ms) cubic-bezier(.2,.8,.2,1) both}
.service-line .row-arrow{transition:transform .28s cubic-bezier(.2,.8,.2,1),color .2s ease}
.service-line:hover .row-arrow{transform:translate(5px,-5px);color:var(--orange)}
.project-card .project-media{transition:background .3s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.project-card:hover .project-media{transform:translateY(-3px)}
.text-link{transition:color .2s ease,transform .2s ease}
.text-link:hover{transform:translateX(3px)}

/* Back-to-top stays attached to the viewport edge, not the content container */
.back-to-top{
  right:max(16px,env(safe-area-inset-right));
  bottom:max(16px,env(safe-area-inset-bottom));
  width:48px;
  height:48px;
  border:1px solid color-mix(in srgb,var(--paper) 68%,transparent);
  box-shadow:0 12px 30px rgba(0,0,0,.2);
}
.back-to-top::before{
  content:"";
  position:absolute;
  inset:-5px;
  border:1px solid color-mix(in srgb,var(--orange) 55%,transparent);
  border-radius:50%;
  opacity:0;
  transform:scale(.78);
  transition:opacity .25s ease,transform .35s cubic-bezier(.2,.8,.2,1);
}
.back-to-top:hover::before,.back-to-top:focus-visible::before{opacity:1;transform:scale(1)}
.back-to-top:focus-visible{outline:3px solid color-mix(in srgb,var(--orange) 40%,transparent);outline-offset:4px}

@media(max-width:1050px){
  .theme-toggle{width:70px}
  html[data-theme=dark] .theme-thumb{transform:translateX(30px)}
  .language-option{min-width:34px;padding:0 6px}
}

@media(max-width:700px){
  .nav-wrap{gap:5px}
  .theme-toggle{width:62px;height:34px;padding:2px}
  .theme-icon{width:28px;height:28px;font-size:.88rem}
  .theme-thumb{top:2px;left:2px;width:28px;height:28px}
  html[data-theme=dark] .theme-thumb{transform:translateX(30px)}
  .language-switch{min-height:34px;padding:2px}
  .language-option{min-width:31px;height:28px;padding:0 5px;font-size:.67rem}
  .hero-project-deck{min-height:clamp(330px,87vw,470px);margin-top:2px;contain:layout}
  .hero-project-card--main{width:81%;left:0;top:13%;transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(-2deg)}
  .hero-project-card--secondary{width:49%;right:0;top:0;transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(3deg)}
  .hero-project-card--tertiary{width:50%;right:2%;bottom:0;transform:translate3d(var(--pointer-x),var(--pointer-y),0) rotate(-3deg)}
  .hero-project-card figcaption{left:7px;right:7px;bottom:7px;padding:6px 7px;font-size:.68rem}
  .hero-deck-mark{left:2%;bottom:0;font-size:.62rem}
  .back-to-top{right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));width:46px;height:46px}
}

@media(max-width:359px){
  .site-header .brand{font-size:.94rem}
  .nav-wrap{gap:3px}
  .theme-toggle{width:58px}
  .language-option{min-width:29px;padding:0 4px}
  .language-switch{padding:1px}
  .menu-toggle{width:38px;height:38px}
}

@media(prefers-reduced-motion:reduce){
  .js .brand-hero>.container>.eyebrow,
  .js .brand-title .hero-line,
  .js .hero-project-deck,
  .js .hero-bottom>p,
  .js .hero-actions{opacity:1!important}
  .hero-project-card{translate:none!important;transform:none!important}
}
@media(max-width:359px){html[data-theme=dark] .theme-thumb{transform:translateX(26px)}}

/* === 2026-09-11 refinement pass: stronger business structure in the CALYNEVO visual language === */

/* Focus the hero deck on the card being explored without changing the composition. */
.hero-project-deck:has(.hero-project-card:hover) .hero-project-card:not(:hover),
.hero-project-deck:has(.hero-project-card:focus-visible) .hero-project-card:not(:focus-visible){
  opacity:.72;
  filter:saturate(.82) contrast(.96);
}
.hero-project-card{transition:opacity .28s ease,filter .28s ease,transform .42s cubic-bezier(.2,.8,.2,1),translate .42s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .3s ease}

/* Homepage: concise proof/results layer between portfolio and services. */
.proof-results{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--paper) 93%,var(--ink) 7%)}
.proof-results-grid{display:grid;grid-template-columns:1fr;border:1px solid var(--line);border-bottom:0}
.proof-result{min-height:170px;padding:26px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;gap:32px;transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s ease,color .3s ease}
.proof-result strong{display:block;font-size:clamp(2.2rem,5vw,4.8rem);line-height:.9;letter-spacing:-.055em;font-weight:800}
.proof-result span{max-width:24ch;color:var(--muted);font-size:.88rem;line-height:1.45}
.proof-result:hover{transform:translateY(-4px);background:var(--ink);color:var(--paper)}
.proof-result:hover span{color:color-mix(in srgb,var(--paper) 72%,transparent)}

/* Services: fast in-page navigation and a visible proof link for every offer. */
.service-jump{position:sticky;top:var(--header-height,72px);z-index:20;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.service-jump .container{display:flex;gap:6px;overflow-x:auto;padding-top:10px;padding-bottom:10px;scrollbar-width:none}
.service-jump .container::-webkit-scrollbar{display:none}
.service-jump a{flex:0 0 auto;padding:9px 13px;border:1px solid transparent;border-radius:999px;color:var(--muted);font-size:.76rem;font-weight:800;letter-spacing:.025em;transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease}
.service-jump a:hover,.service-jump a[aria-current="true"]{color:var(--ink);background:var(--paper);border-color:var(--line);transform:translateY(-1px)}
.offer{scroll-margin-top:150px}
.service-related{margin-top:22px;margin-bottom:0;padding-top:18px;border-top:1px solid var(--line);font-size:.8rem;color:var(--muted)}
.service-related .text-link{margin-left:4px;color:var(--ink);font-weight:750}

/* Studio: a compact editorial timeline that explains the founder's progression. */
.studio-journey{border-top:1px solid var(--line)}
.journey-list{position:relative;border-top:1px solid var(--line)}
.journey-list::before{content:"";position:absolute;left:54px;top:0;bottom:0;width:1px;background:var(--line)}
.journey-item{position:relative;display:grid;grid-template-columns:80px 1fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.journey-item>span{position:relative;color:var(--orange-dark);font-size:.72rem;font-weight:900;letter-spacing:.06em}
.journey-item>span::after{content:"";position:absolute;right:20px;top:.38em;width:9px;height:9px;border:2px solid var(--orange);border-radius:50%;background:var(--paper);box-shadow:0 0 0 5px var(--paper)}
.journey-item strong{display:block;margin-bottom:6px;font-size:clamp(1.05rem,2vw,1.45rem);letter-spacing:-.02em}
.journey-item p{max-width:70ch;margin:0;color:var(--muted)}

/* Projects: make filters feel like a compact portfolio tool, including live counts. */
.project-filters{position:sticky;top:calc(var(--header-height,72px) + 10px);z-index:18;display:flex;flex-wrap:wrap;gap:7px;padding:8px;width:max-content;max-width:100%;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.project-filters button{display:flex;align-items:center;gap:7px}
.project-filters button::after{content:attr(data-count);min-width:19px;height:19px;padding:0 5px;display:grid;place-items:center;border-radius:999px;background:color-mix(in srgb,var(--ink) 9%,transparent);font-size:.65rem;line-height:1;color:var(--muted)}
.project-filters button[aria-pressed="true"]::after{background:color-mix(in srgb,var(--paper) 20%,transparent);color:inherit}
.project-card.is-filter-enter{animation:filterEnter .38s cubic-bezier(.2,.8,.2,1) both}
@keyframes filterEnter{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}

/* Case studies: clearer hierarchy, sticky project facts and a richer gallery interaction. */
.case-introduction .case-facts{align-self:start}
.case-fact{transition:background .25s ease,transform .25s ease}
.case-fact:hover{background:color-mix(in srgb,var(--orange) 7%,var(--paper));transform:translateX(3px)}
.case-shot{position:relative;overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.case-shot a{display:block;overflow:hidden}
.case-shot img{transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .35s ease}
.case-shot:hover img{transform:scale(1.018)}
.case-shot figcaption{transition:color .25s ease}
.case-shot:hover figcaption{color:var(--orange-dark)}
.case-lightbox{width:min(94vw,1400px);max-width:none;max-height:92vh;padding:0;border:0;background:transparent;color:#fff;overflow:visible}
.case-lightbox::backdrop{background:rgba(10,10,10,.88);backdrop-filter:blur(8px)}
.case-lightbox-inner{position:relative;display:grid;gap:10px;justify-items:center}
.case-lightbox img{display:block;max-width:92vw;max-height:82vh;width:auto;height:auto;object-fit:contain;background:#111;box-shadow:0 30px 90px rgba(0,0,0,.45)}
.case-lightbox p{margin:0;color:#fff;font-size:.78rem;text-align:center}
.case-lightbox-close{position:absolute;top:-48px;right:0;width:40px;height:40px;border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(15,15,15,.7);color:#fff;font-size:1.35rem;cursor:pointer;transition:transform .2s ease,background .2s ease}
.case-lightbox-close:hover,.case-lightbox-close:focus-visible{transform:rotate(4deg) scale(1.05);background:var(--orange);color:#111;outline:none}

/* Process: more legible motion and hierarchy, still restrained. */
.process-step::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.process-step:hover::after{transform:scaleX(1)}
.process-step:hover h3{color:var(--orange-dark)}

@media(min-width:760px){
  .proof-results-grid{grid-template-columns:repeat(2,1fr)}
  .proof-result:nth-child(odd){border-right:1px solid var(--line)}
  .journey-item{grid-template-columns:110px 1fr;gap:34px;padding:32px 0}
  .journey-list::before{left:76px}
  .journey-item>span::after{right:28px}
}
@media(min-width:1050px){
  .proof-results-grid{grid-template-columns:repeat(4,1fr);border-right:0}
  .proof-result{min-height:220px;border-right:1px solid var(--line)}
  .proof-result:nth-child(odd){border-right:1px solid var(--line)}
  .case-introduction .case-facts{position:sticky;top:120px}
}
@media(max-width:700px){
  .service-jump{top:64px}
  .service-jump .container{padding-left:14px;padding-right:14px}
  .project-filters{position:static;width:100%;border-radius:18px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .project-filters::-webkit-scrollbar{display:none}
  .journey-list::before{left:47px}
  .journey-item{grid-template-columns:70px 1fr;gap:16px;padding:24px 0}
  .journey-item>span::after{right:15px}
  .case-lightbox-close{top:-44px;right:4px}
}
@media(prefers-reduced-motion:reduce){
  .proof-result,.service-jump a,.journey-item,.case-fact,.case-shot img,.process-step::after{transition:none!important}
  .project-card.is-filter-enter{animation:none!important}
}


/* =========================================================
   CALYNEVO PREMIUM LIGHT/DARK SYSTEM · 2026-09-12
   Light mode is intentionally airy and warm. Dark mode avoids
   pure black/white to reduce eye strain and preserve hierarchy.
   ========================================================= */
:root{
  --paper:#fbfaf7;
  --white:#ffffff;
  --ink:#1d211f;
  --ink-2:#2b302d;
  --muted:#666a65;
  --line:#dedad1;
  --orange:#ef5b35;
  --orange-dark:#c84724;
  --soft:#f3f0e9;
  --soft-2:#ece8df;
  --surface-elevated:#ffffff;
  --shadow-soft:0 18px 55px rgba(36,34,29,.07);
  --shadow-card:0 10px 30px rgba(36,34,29,.055);
  color-scheme:light;
}
html[data-theme=dark]{
  --paper:#121514;
  --white:#1a1f1c;
  --ink:#eceae4;
  --ink-2:#d8d5ce;
  --muted:#aaa9a2;
  --line:#333936;
  --orange:#ff7954;
  --orange-dark:#ff9a7d;
  --soft:#181c1a;
  --soft-2:#202522;
  --surface-elevated:#1b201d;
  --shadow-soft:0 18px 55px rgba(0,0,0,.24);
  --shadow-card:0 10px 30px rgba(0,0,0,.18);
  color-scheme:dark;
}
html,body{background:var(--paper);color:var(--ink)}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.site-header{background:color-mix(in srgb,var(--paper) 91%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.section-white{background:var(--white)}
.proof-results,.collaborations{background:var(--soft)}
.proof-result,.client-logo-card,.value,.capability-matrix article,.deliverable-card{background:var(--surface-elevated)}
.proof-result:hover{background:var(--ink);color:var(--paper)}

/* Reduce large dark blocks in light mode while keeping clear visual rhythm. */
.studio-band,.founder-band,.section-dark{background:var(--soft-2);color:var(--ink);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.studio-band p,.founder-band p,.section-dark p{color:var(--muted)}
.studio-band .eyebrow,.founder-band .eyebrow,.section-dark .eyebrow{color:var(--orange-dark)}
.studio-aside .text-link,.statement-quote{color:var(--ink)}
.credential-card{background:var(--surface-elevated);border-color:var(--line);box-shadow:var(--shadow-card)}
.credential-kicker{color:var(--orange-dark)}
.credential-card .credential-tags span{border-color:var(--line);background:var(--soft)}
.testimonial-business-card{background:var(--surface-elevated);border-color:var(--line);box-shadow:var(--shadow-card)}
.testimonial-business-card blockquote{color:var(--ink)}
.testimonial-person span{color:var(--muted)}

/* Homepage clarity. */
.brand-hero{background:linear-gradient(180deg,var(--paper) 0%,color-mix(in srgb,var(--paper) 90%,var(--soft) 10%) 100%)}
.hero-bottom>p{max-width:680px}
.discipline-strip{background:var(--ink);color:var(--paper)}
.discipline-strip .container{gap:clamp(8px,1.8vw,24px);justify-content:space-between}
.discipline-strip .container>span:not([aria-hidden]){white-space:nowrap}
.project-media{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--line) 75%,transparent)}
.client-logo-card{box-shadow:var(--shadow-card)}
.client-logo-card:hover{background:var(--white)}
html[data-theme=dark] .client-logo-card:hover{background:#212622}

/* Studio page, direct and readable. */
.studio-hero .page-intro-grid{align-items:end}
.studio-meta{margin-top:18px;color:var(--muted);font-size:.92rem}
.studio-hero-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:28px}
.value-grid--process .value{min-height:230px}
.value-grid--process .value>span{display:block;margin-bottom:54px;color:var(--orange-dark);font-size:.72rem;font-weight:900;letter-spacing:.08em}
.value-grid--process h3{font-size:clamp(1.35rem,2vw,1.8rem)}
.founder-grid{align-items:stretch}
.credential-card{display:flex;flex-direction:column;justify-content:center}

/* Timeline: dates get their own column; markers never overlap text. */
.journey-list{position:relative;border-top:1px solid var(--line)}
.journey-list::before{content:"";position:absolute;left:156px;top:0;bottom:0;width:1px;background:var(--line)}
.journey-item{position:relative;display:grid;grid-template-columns:132px minmax(0,1fr);gap:52px;padding:34px 0;border-bottom:1px solid var(--line)}
.journey-item::before{content:"";position:absolute;left:151px;top:39px;width:9px;height:9px;border:2px solid var(--orange);border-radius:50%;background:var(--paper);box-shadow:0 0 0 7px var(--paper);z-index:2}
.journey-date{display:flex;flex-direction:column;gap:3px;padding-right:12px;color:var(--orange-dark);line-height:1.25}
.journey-date strong{margin:0;font-size:.76rem;letter-spacing:.045em;text-transform:uppercase}
.journey-date span{color:var(--muted);font-size:.72rem;font-weight:700;letter-spacing:.025em}
.journey-item>div:last-child>strong{display:block;margin-bottom:7px;font-size:clamp(1.1rem,2vw,1.45rem);letter-spacing:-.02em}
.journey-item p{max-width:72ch;margin:0;color:var(--muted)}

/* Cards use more breathing room and softer elevation in light mode. */
.capability-matrix{background:var(--line)}
.capability-matrix article{min-height:235px}
.capability-matrix h3{margin-top:42px;line-height:1.15}
.collaboration-model .statement-item{border-color:var(--line)}
.closing{background:var(--paper)}

/* Professional footer: one controlled dark anchor instead of multiple black sections. */
.site-footer{padding:0;background:#242925;color:#f1efe9;border-top:1px solid #313732}
html[data-theme=dark] .site-footer{background:#0e1110;color:#e9e7e1;border-color:#272d29}
.site-footer p{color:#bbbdb7}
.site-footer .eyebrow{color:#ff8a67}
.footer-shell{padding-top:0}
.footer-cta{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);gap:60px;align-items:end;padding:58px 0 50px;border-bottom:1px solid rgba(255,255,255,.14)}
.footer-cta h2{max-width:18ch;margin:0 0 14px;color:#f6f4ee;font-size:clamp(2.2rem,4.4vw,4.4rem);line-height:1.04;letter-spacing:-.055em}
.footer-cta p:not(.eyebrow){max-width:62ch;margin:0}
.footer-cta-actions{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.footer-button-primary{border-color:#f6f4ee;background:#f6f4ee;color:#202420}
.footer-button-primary:hover{border-color:var(--orange);background:var(--orange);color:#191b19}
.footer-text-link{color:#f3f1eb}
.footer-main{display:grid;grid-template-columns:minmax(280px,1.35fr) repeat(3,minmax(150px,.65fr));gap:48px;padding:52px 0}
.footer-brand-block{max-width:430px}
.footer-brand{display:inline-block;margin-bottom:22px;color:#f5f3ed;font-size:clamp(2.6rem,4.2vw,4.5rem);letter-spacing:-.065em}
.footer-brand-block p{margin:0 0 14px}
.footer-location{font-size:.82rem}
.footer-email{display:inline-block;margin-top:8px;color:#f6f4ee;font-weight:760;border-bottom:1px solid rgba(255,255,255,.35)}
.footer-heading{margin:0 0 16px;color:#ff8a67!important;font-size:.72rem!important;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.footer-column{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.footer-column a{color:#e4e2dc;font-size:.86rem;transition:color .2s ease,transform .2s ease}
.footer-column a:hover{color:#ff8a67;transform:translateX(2px)}
.footer-bottom{display:flex;justify-content:space-between;gap:30px;padding:22px 0 28px;border-top:1px solid rgba(255,255,255,.14);color:#9fa39d;font-size:.76rem}

/* Forms and legal pages stay light and calm. */
.contact-form,.notice{background:var(--surface-elevated);box-shadow:var(--shadow-card)}
.field input,.field textarea,.field select{background:var(--surface-elevated)}
.legal-layout{background:var(--paper)}

/* Tablet and mobile-first refinements. */
@media(max-width:959px){
  .footer-cta{grid-template-columns:1fr;gap:28px}
  .footer-main{grid-template-columns:1.35fr 1fr 1fr;gap:36px}
  .footer-brand-block{grid-column:1/-1;max-width:620px}
  .journey-list::before{left:136px}
  .journey-item{grid-template-columns:114px minmax(0,1fr);gap:44px}
  .journey-item::before{left:131px}
}
@media(max-width:700px){
  :root{--container:calc(100% - 32px)}
  .section{padding:56px 0}
  .brand-hero{padding-top:24px}
  .brand-title h1{font-size:clamp(3.2rem,14vw,5.5rem)}
  .hero-bottom .hero-actions{align-items:stretch;flex-direction:column;gap:14px}
  .hero-actions .button{width:100%;flex:auto}
  .discipline-strip{overflow:hidden}
  .discipline-strip .container{justify-content:flex-start;overflow-x:auto;gap:12px;padding-top:2px;padding-bottom:2px;scrollbar-width:none}
  .discipline-strip .container::-webkit-scrollbar{display:none}
  .discipline-strip .container>span{flex:0 0 auto}
  .page-hero{padding:40px 0 34px}
  .page-hero h1{font-size:clamp(2.65rem,10.8vw,4.4rem)}
  .studio-hero-actions{align-items:stretch;flex-direction:column;gap:14px}
  .studio-hero-actions .button{width:100%}
  .value-grid--process .value{min-height:0;padding:24px}
  .value-grid--process .value>span{margin-bottom:28px}
  .founder-grid{grid-template-columns:1fr!important}
  .credential-card{padding:24px}
  .journey-list::before{left:9px}
  .journey-item{grid-template-columns:1fr;gap:12px;padding:25px 0 25px 30px}
  .journey-item::before{left:4px;top:30px;width:8px;height:8px;box-shadow:0 0 0 5px var(--paper)}
  .journey-date{padding:0;display:flex;flex-direction:row;align-items:baseline;gap:9px}
  .journey-date strong{font-size:.72rem}
  .journey-date span{font-size:.7rem}
  .journey-item>div:last-child>strong{font-size:1.14rem;line-height:1.3}
  .journey-item p{font-size:.94rem}
  .capability-matrix article{min-height:0;padding:24px}
  .capability-matrix h3{margin-top:30px;font-size:1.45rem}
  .footer-cta{padding:44px 0 38px}
  .footer-cta h2{font-size:clamp(2.15rem,10vw,3.4rem)}
  .footer-main{grid-template-columns:1fr 1fr;gap:34px 24px;padding:40px 0}
  .footer-brand-block{grid-column:1/-1}
  .footer-column{gap:11px}
  .footer-bottom{flex-direction:column;gap:7px;padding-bottom:max(24px,env(safe-area-inset-bottom))}
}
@media(max-width:430px){
  .footer-main{grid-template-columns:1fr}
  .footer-brand-block{grid-column:auto}
  .footer-column{padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
  .client-logo-grid,.testimonial-business-grid{gap:12px}
}
@media(prefers-reduced-motion:reduce){
  .footer-column a,.journey-item,.client-logo-card,.testimonial-business-card{transition:none!important}
}

/* ===== assets/css/business.css ===== */
/* CALYNEVO business architecture layer · 2026-09-12
   Purpose: service detail pages, collaborations, testimonials, founder credentials,
   quote/contact forms and future WordPress/ACF migration-friendly components. */

.service-lines--six .service-line{grid-template-columns:52px minmax(190px,.75fr) minmax(280px,1.25fr) 34px}
.collaborations{background:color-mix(in srgb,var(--paper) 88%,var(--orange) 12%)}
.client-logo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.client-logo-card{min-height:210px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:24px;padding:34px;background:var(--paper);text-align:center;transition:background .25s ease,transform .25s ease}
.client-logo-card:hover{background:var(--white);transform:translateY(-4px)}
.client-logo-card img{max-width:190px;max-height:90px;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.82;transition:filter .3s ease,opacity .3s ease,transform .3s ease}
.client-logo-card:hover img{filter:none;opacity:1;transform:scale(1.035)}
.client-logo-card span{color:var(--muted);font-size:.76rem;font-weight:750;letter-spacing:.04em;text-transform:uppercase}
.testimonial-business-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.testimonial-business-card{display:flex;flex-direction:column;gap:28px;padding:32px;border:1px solid #444;background:#202122}
.testimonial-person{display:flex;align-items:center;gap:14px}.testimonial-person img{width:58px;height:58px;border-radius:50%;object-fit:cover;filter:grayscale(.25)}
.testimonial-person strong,.testimonial-person h3,.testimonial-person span{display:block}.testimonial-person h3{margin:0;font-size:1rem;line-height:1.2;letter-spacing:-.015em}.testimonial-person span{color:#aaa8a3;font-size:.8rem}
.testimonial-business-card blockquote{margin:0;color:#f4f3ef;font-size:clamp(1.12rem,1rem + .35vw,1.35rem);line-height:1.6;letter-spacing:-.015em}
.testimonial-tags,.credential-tags{display:flex;flex-wrap:wrap;gap:7px}.testimonial-tags span,.credential-tags span{padding:5px 8px;border:1px solid #555;color:#cbc9c3;font-size:.68rem}
.offer-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:20px}.service-related{color:var(--muted);font-size:.82rem;font-weight:700}
.service-detail-hero .lead{max-width:650px}.deliverable-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}
.deliverable-card{min-height:180px;padding:24px;background:var(--paper)}.deliverable-card span{display:block;margin-bottom:42px;color:var(--orange-dark);font-size:.72rem;font-weight:900}.deliverable-card strong{font-size:1rem;line-height:1.35}
.service-proof{background:#202122;color:#f4f3ef}.service-proof p{color:#bbb9b3}.service-proof-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(360px,1.15fr);gap:60px;align-items:center}.service-proof-media{display:block;overflow:hidden;border:1px solid #3f3f3f;background:#ecebe6}.service-proof-media img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .5s ease}.service-proof-media:hover img{transform:scale(1.025)}
.faq-list{max-width:900px;border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{position:relative;padding:22px 46px 22px 0;font-weight:800;cursor:pointer;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:'+';position:absolute;right:0;top:17px;font-size:1.5rem;font-weight:400}.faq-list details[open] summary::after{content:'−'}.faq-list details p{max-width:760px;padding:0 0 24px;margin:0}
.founder-band{background:var(--ink);color:var(--paper)}.founder-band p{color:#bbb9b3}.founder-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}.credential-card{padding:34px;border:1px solid #444;background:#202122}.credential-kicker{display:block;margin-bottom:20px;color:#ff916e;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.credential-card>strong{display:block;margin-bottom:10px;font-size:clamp(1.55rem,3vw,2.7rem);line-height:1.1;letter-spacing:-.035em}.credential-card .credential-tags span{border-color:#555}.capability-matrix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}.capability-matrix article{min-height:240px;padding:28px;background:var(--paper)}.capability-matrix article>span{color:var(--orange-dark);font-size:.72rem;font-weight:900}.capability-matrix h3{margin-top:46px}.capability-matrix p{margin-bottom:0}
.case-capability-section{background:var(--white)}.case-capability-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;border:1px solid var(--line);background:var(--line)}.case-capability{min-height:220px;padding:26px;background:var(--paper)}.case-capability strong{display:block;margin-bottom:18px;font-size:1rem}.case-capability p{margin:0;font-size:.88rem}
.contact-layout--simple{align-items:start}.simple-form{display:block}.simple-form .button,.quote-form .button{margin-top:22px}.consent-check{display:flex;align-items:flex-start;gap:10px;margin-top:18px;color:var(--muted);font-size:.82rem}.consent-check input{margin-top:5px}.consent-check a{text-decoration:underline}.quote-layout{display:grid;grid-template-columns:minmax(250px,.65fr) minmax(0,1.35fr);gap:70px;align-items:start}.quote-aside{position:sticky;top:110px}.quote-aside h2{font-size:clamp(2rem,3.6vw,3.8rem)}.quote-points{margin:32px 0}.quote-points p{padding:15px 0;border-top:1px solid var(--line);margin:0}.quote-points p:last-child{border-bottom:1px solid var(--line)}.service-checks{margin:24px 0;padding:0;border:0}.service-checks legend{margin-bottom:12px;font-weight:800}.service-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.service-checks legend{grid-column:1/-1}.service-checks label{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);cursor:pointer;background:var(--paper)}.service-checks label:has(input:checked){border-color:var(--orange);box-shadow:inset 0 0 0 1px var(--orange)}.service-checks input{accent-color:var(--orange)}
.form-feedback.is-success,.form-feedback.is-error{display:block!important;padding:12px 14px;margin-bottom:18px;border:1px solid}.form-feedback.is-success{border-color:#2c8555;color:#17633c;background:#edf7f1}.form-feedback.is-error{border-color:#b7594b;color:#8d241c;background:#fff0ed}

@media(max-width:1000px){.deliverable-grid,.case-capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.capability-matrix{grid-template-columns:repeat(2,minmax(0,1fr))}.service-lines--six .service-line{grid-template-columns:44px 1fr 28px}.service-lines--six .service-line>div{grid-column:2/3}.founder-grid,.service-proof-grid,.quote-layout{grid-template-columns:1fr}.quote-aside{position:static}.client-logo-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.testimonial-business-grid,.client-logo-grid,.deliverable-grid,.case-capability-grid,.capability-matrix,.service-checks{grid-template-columns:1fr}.client-logo-card{min-height:160px}.testimonial-business-card{padding:24px}.founder-grid{gap:30px}.credential-card{padding:24px}.service-proof-grid{gap:30px}.quote-layout{gap:38px}}
@media(prefers-reduced-motion:reduce){.client-logo-card,.client-logo-card img,.service-proof-media img{transition:none!important}.client-logo-card:hover{transform:none}.client-logo-card:hover img{transform:none}}


/* Contact + quote forms · v20260912.2 */
.contact-business-section,.quote-business-section{border-top:1px solid var(--line)}
.business-form-heading{margin-bottom:28px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.business-form-heading h2{max-width:16ch;margin:.15em 0 .35em;font-size:clamp(1.8rem,3vw,3rem);line-height:1.05;letter-spacing:-.035em}
.business-form-heading p:last-child{margin-bottom:0;color:var(--muted)}
.simple-form .form-row,.quote-form .form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.form-helper{margin:14px 0 0;color:var(--muted);font-size:.76rem;line-height:1.55}
.quote-points strong{display:inline-block;min-width:34px;color:var(--orange-dark);font-size:.72rem;letter-spacing:.06em}
.contact-direct .button-light{display:inline-flex;margin-top:18px;color:var(--ink)!important;background:var(--paper);border-color:var(--paper)}
.contact-direct .button-light:hover{color:var(--paper)!important;background:transparent}
.contact-form button[type="submit"]{min-width:190px}
.contact-form button[type="submit"][aria-busy="true"]{opacity:.7;cursor:wait}
@media(max-width:700px){.simple-form .form-row,.quote-form .form-row{grid-template-columns:1fr}.business-form-heading{margin-bottom:22px}.contact-form button[type="submit"]{width:100%}}


/* Final premium-system compatibility. */
.founder-band{background:var(--soft-2);color:var(--ink);border-color:var(--line)}
.founder-band p{color:var(--muted)}
.credential-card{background:var(--surface-elevated);border-color:var(--line);box-shadow:var(--shadow-card)}
.credential-kicker{color:var(--orange-dark)}
.credential-card .credential-tags span{border-color:var(--line);background:var(--soft)}
.testimonial-business-card{background:var(--surface-elevated);border-color:var(--line);box-shadow:var(--shadow-card)}
.testimonial-business-card blockquote{color:var(--ink)}
.testimonial-person span{color:var(--muted)}
/* Light-first compatibility for remaining legacy dark blocks. */
.service-proof{background:var(--soft-2);color:var(--ink);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.service-proof p{color:var(--muted)}
.service-proof-media{border-color:var(--line);background:var(--surface-elevated);box-shadow:var(--shadow-card)}
.contact-direct{background:var(--soft-2);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-card)}
.contact-direct .eyebrow{color:var(--orange-dark)}
.contact-direct p{color:var(--muted)}
.contact-direct a{color:var(--ink)}
.contact-direct .button-light{color:var(--paper)!important;background:var(--ink);border-color:var(--ink)}
.contact-direct .button-light:hover{color:#171917!important;background:var(--orange);border-color:var(--orange)}
.testimonial-tags span,.credential-tags span{border-color:var(--line);color:var(--muted);background:var(--soft)}


/* CALYNEVO 2026-09-14 commercial clarity refinement */
.related-service-links{padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface)}
.related-service-links-inner{display:grid;grid-template-columns:minmax(140px,.32fr) 1fr;gap:28px;align-items:center}
.related-service-links .eyebrow{margin:0}
.related-service-links nav{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.related-service-chip{display:inline-flex;align-items:center;min-height:42px;padding:9px 13px;border:1px solid var(--line);background:var(--surface-elevated);color:var(--ink);font-size:.88rem;font-weight:700;transition:transform .25s ease,border-color .25s ease,background .25s ease,color .25s ease}
.related-service-chip:hover,.related-service-chip:focus-visible{transform:translateY(-2px);border-color:var(--orange);background:color-mix(in srgb,var(--surface-elevated) 92%,var(--orange) 8%);color:var(--ink)}
.studio-language-note{margin:16px 0 0!important;font-size:.9rem!important;color:var(--muted)!important}
@media(max-width:700px){.related-service-links-inner{grid-template-columns:1fr;gap:16px}.related-service-links nav{justify-content:flex-start}.related-service-chip{width:100%;justify-content:space-between}}
@media(prefers-reduced-motion:reduce){.related-service-chip{transition:none!important}.related-service-chip:hover,.related-service-chip:focus-visible{transform:none}}

/* ===== assets/css/theme-system.css ===== */
/* CALYNEVO THEME SYSTEM v20260912.8
   Rebuilt from zero as the single colour/contrast authority.
   Layout remains in styles.css/redesign.css/business.css.
   This file is loaded last and owns every light/dark colour decision. */

/* ---------- 1. Semantic tokens ---------- */
:root {
  color-scheme: light;
  --bg: #f7f4ee;
  --bg-soft: #efeae2;
  --surface: #fffdf9;
  --surface-2: #f3efe8;
  --surface-3: #e8e2d9;
  --text: #181b1a;
  --text-2: #3f4541;
  --muted: #5d635f;
  --border: #d5cfc5;
  --border-strong: #b9b2a7;
  --accent: #f05a35;
  --accent-2: #bd3e1c;
  --accent-soft: #fff0ea;
  --on-accent: #151817;
  --inverse-bg: #171b19;
  --inverse-surface: #202522;
  --inverse-text: #f5f1e9;
  --inverse-muted: #b9beb9;
  --inverse-border: #38403b;
  --control-bg: #1a1e1c;
  --control-text: #faf7f0;
  --focus: #f05a35;
  --success-bg: #eaf5ee;
  --success-text: #1e633e;
  --success-border: #78aa8d;
  --error-bg: #fff0ed;
  --error-text: #8a3025;
  --error-border: #c77d72;
  --logo-plate: #fffdf9;
  --logo-plate-border: #ded7cc;
  --shadow-1: 0 12px 34px rgba(29, 27, 23, .07);
  --shadow-2: 0 20px 55px rgba(29, 27, 23, .11);
  --overlay: rgba(23, 27, 25, .72);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #141816;
  --bg-soft: #1a1f1c;
  --surface: #1d231f;
  --surface-2: #232a26;
  --surface-3: #2c342f;
  --text: #f1eee7;
  --text-2: #d5d7d2;
  --muted: #aeb4af;
  --border: #38413c;
  --border-strong: #56615a;
  --accent: #ff7857;
  --accent-2: #ff9a80;
  --accent-soft: #34231f;
  --on-accent: #151817;
  --inverse-bg: #0c100e;
  --inverse-surface: #121714;
  --inverse-text: #f6f2eb;
  --inverse-muted: #b8beb9;
  --inverse-border: #2a322d;
  --control-bg: #f0ede6;
  --control-text: #151917;
  --focus: #ff8667;
  --success-bg: #173024;
  --success-text: #bde5cc;
  --success-border: #397352;
  --error-bg: #34201d;
  --error-text: #ffd0c7;
  --error-border: #8f5148;
  --logo-plate: #f7f2e9;
  --logo-plate-border: #d3cabe;
  --shadow-1: 0 14px 36px rgba(0, 0, 0, .22);
  --shadow-2: 0 22px 64px rgba(0, 0, 0, .32);
  --overlay: rgba(5, 8, 6, .78);
}

/* Legacy variable bridge. No legacy component gets to invent theme colours. */
:root, html[data-theme="dark"] {
  --paper: var(--bg);
  --white: var(--surface);
  --ink: var(--text);
  --ink-2: var(--surface-3);
  --line: var(--border);
  --orange: var(--accent);
  --orange-dark: var(--accent-2);
  --soft: var(--surface-2);
  --soft-2: var(--bg-soft);
  --surface-elevated: var(--surface);
  --shadow-card: var(--shadow-1);
}

/* ---------- 2. Document and typography ---------- */
html, body { background: var(--bg) !important; color: var(--text) !important; }
body { color: var(--text) !important; }
main { background: var(--bg); color: var(--text); }
h1, h2, h3, h4, h5, h6, strong, b { color: inherit; }
p, .lead, .micro { color: var(--muted); }
a { color: inherit; }
::selection { background: var(--accent); color: var(--on-accent); }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--focus) 72%, transparent); outline-offset: 3px; }
.eyebrow, .role-label, .row-number, .service-index, .offer-index, .credential-kicker,
.capability-matrix article > span, .journey-date, .footer-kicker, .footer-heading { color: var(--accent-2) !important; }
.text-link { color: var(--text); }
.text-link:hover { color: var(--accent-2); }

/* ---------- 3. Header, navigation and controls ---------- */
.site-header {
  background: color-mix(in srgb, var(--bg) 94%, transparent) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  box-shadow: none !important;
}
.site-header.is-scrolled { box-shadow: 0 8px 26px color-mix(in srgb, var(--text) 8%, transparent) !important; }
.brand, .site-nav a:not(.nav-cta) { color: var(--text) !important; }
.site-nav a[aria-current="page"] { color: var(--accent-2) !important; }
.site-nav .nav-cta[aria-current="page"] { background: var(--control-bg) !important; border-color: var(--control-bg) !important; color: var(--control-text) !important; }
.site-nav .nav-cta, .button-primary {
  background: var(--control-bg) !important;
  border-color: var(--control-bg) !important;
  color: var(--control-text) !important;
}
.site-nav .nav-cta:hover, .button-primary:hover {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: var(--on-accent) !important;
}
.menu-toggle, .skip-link {
  background: var(--control-bg) !important;
  color: var(--control-text) !important;
}
html.js .site-nav {
  background: var(--inverse-bg) !important;
  color: var(--inverse-text) !important;
}
html.js .site-nav a:not(.nav-cta) { color: var(--inverse-text) !important; }
html.js .site-nav a { border-color: var(--inverse-border) !important; }
html.js .site-nav .nav-cta {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: var(--on-accent) !important;
}
.theme-toggle, .language-switch {
  background: var(--surface-3) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}
.theme-toggle:hover, .language-switch:hover { border-color: var(--accent) !important; }
.theme-thumb { background: var(--accent) !important; box-shadow: 0 2px 8px color-mix(in srgb, var(--text) 20%, transparent) !important; }
.theme-icon-sun, .theme-icon-moon { color: var(--text-2) !important; }
.language-option { color: var(--text-2) !important; }
.language-option.is-active { background: var(--control-bg) !important; color: var(--control-text) !important; }

/* ---------- 4. Surface rules ---------- */
.section, .page-hero, .brand-hero, .legal-layout { background: var(--bg) !important; color: var(--text) !important; }
.section-white, .case-capability-section { background: var(--surface) !important; color: var(--text) !important; }
.section-head > p, .project-body p, .service-line p, .value p, .capability-matrix p,
.case-content p, .article-copy p, .legal-copy p, .legal-layout p { color: var(--muted) !important; }

/* Explicit inverse sections. Nothing inside can inherit dark text accidentally. */
.section-dark, .cta, .discipline-strip, .abstract-project, .case-gallery-section {
  background: var(--inverse-bg) !important;
  color: var(--inverse-text) !important;
}
.section-dark h1, .section-dark h2, .section-dark h3, .section-dark h4, .section-dark strong,
.cta h1, .cta h2, .cta h3, .cta h4, .cta strong,
.case-gallery-section h1, .case-gallery-section h2, .case-gallery-section h3, .case-gallery-section strong,
.discipline-strip, .abstract-project { color: var(--inverse-text) !important; }
.section-dark p, .cta p, .case-gallery-section p, .case-gallery-section .section-head > p { color: var(--inverse-muted) !important; }
.section-dark .eyebrow, .cta .eyebrow, .case-gallery-section .eyebrow { color: var(--accent) !important; }
.statement-quote { color: var(--inverse-text) !important; }
.statement-list, .statement-item { border-color: var(--inverse-border) !important; }

/* Legacy bands are normal theme surfaces, not forced black blocks. */
.studio-band, .founder-band, .service-proof, .contact-direct, .closing {
  background: var(--bg-soft) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.studio-band h1, .studio-band h2, .studio-band h3,
.founder-band h1, .founder-band h2, .founder-band h3,
.service-proof h1, .service-proof h2, .service-proof h3,
.contact-direct h1, .contact-direct h2, .contact-direct h3,
.closing h1, .closing h2, .closing h3 { color: var(--text) !important; }
.studio-band p, .founder-band p, .service-proof p, .contact-direct p, .closing p { color: var(--muted) !important; }
.studio-band .text-link, .founder-band .text-link, .contact-direct a { color: var(--text) !important; }
.studio-monogram { color: var(--accent) !important; }
.closing h2 em { color: var(--accent-2) !important; }

/* ---------- 5. Cards, grids and project surfaces ---------- */
.proof-results, .collaborations { background: var(--bg-soft) !important; color: var(--text) !important; }
.proof, .value, .proof-result, .service, .service-line, .offer, .deliverable-card,
.capability-matrix article, .case-capability, .credential-card, .testimonial-business-card,
.journal-card, .contact-form, .notice, .project-body, .case-fact {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.proof p, .value p, .proof-result p, .service p, .offer p, .deliverable-card p,
.capability-matrix article p, .case-capability p, .testimonial-business-card p,
.journal-card p, .case-fact p { color: var(--muted) !important; }
.credential-card, .testimonial-business-card, .contact-form, .notice { box-shadow: var(--shadow-1); }
.testimonial-business-card blockquote, .testimonial-person strong, .testimonial-person h3, .credential-card > strong { color: var(--text) !important; }
.testimonial-person span { color: var(--muted) !important; }
.testimonial-tags span, .credential-tags span, .tag {
  background: var(--surface-2) !important;
  border-color: var(--border) !important;
  color: var(--text-2) !important;
}
.proof-result:hover {
  background: var(--inverse-bg) !important;
  color: var(--inverse-text) !important;
}
.proof-result:hover h3, .proof-result:hover strong, .proof-result:hover p { color: inherit !important; }
.project-media, .service-proof-media { border-color: var(--border) !important; box-shadow: var(--shadow-1); }
.project-index { background: var(--inverse-bg) !important; color: var(--inverse-text) !important; }
.project-card:hover .project-index { background: var(--accent) !important; color: var(--on-accent) !important; }
.project-card:hover .tag { background: var(--surface) !important; border-color: var(--border-strong) !important; color: var(--text) !important; }
.case-shot a { background: var(--surface-2) !important; }
.case-shot figcaption { color: var(--inverse-muted) !important; }
.case-shot figcaption span { color: var(--accent) !important; }

/* Collaboration logos always use a light neutral plate, including dark mode. */
.client-logo-grid { background: var(--border) !important; border-color: var(--border) !important; }
.client-logo-card {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  box-shadow: none !important;
}
.client-logo-card:hover { background: var(--surface-2) !important; }
.client-logo-card img {
  box-sizing: content-box;
  width: auto;
  max-width: min(190px, 72%);
  max-height: 86px;
  padding: 13px 17px;
  border: 1px solid var(--logo-plate-border) !important;
  border-radius: 8px;
  background: var(--logo-plate) !important;
  filter: none !important;
  opacity: 1 !important;
}
.client-logo-card span { color: var(--muted) !important; }

/* ---------- 6. Forms, feedback and filters ---------- */
.field label, .service-checks legend { color: var(--text) !important; }
.field input, .field textarea, .field select, .service-checks label {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.field input::placeholder, .field textarea::placeholder { color: color-mix(in srgb, var(--muted) 80%, transparent) !important; }
.field input:hover, .field textarea:hover, .field select:hover, .service-checks label:hover { border-color: var(--border-strong) !important; }
.field input:focus, .field textarea:focus, .field select:focus {
  border-color: var(--focus) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--focus) 16%, transparent) !important;
}
.field input.is-invalid, .field textarea.is-invalid, .field select.is-invalid {
  background: var(--error-bg) !important;
  color: var(--error-text) !important;
  border-color: var(--error-border) !important;
}
.form-feedback, .form-status.error, .form-feedback.is-error {
  background: var(--error-bg) !important;
  color: var(--error-text) !important;
  border-color: var(--error-border) !important;
}
.form-status.success, .form-feedback.is-success {
  background: var(--success-bg) !important;
  color: var(--success-text) !important;
  border-color: var(--success-border) !important;
}
.form-progress li { color: var(--muted) !important; }
.form-progress li span { background: var(--surface) !important; color: var(--text) !important; border-color: var(--border) !important; }
.form-progress li.active span, .form-progress li.current span { background: var(--accent) !important; color: var(--on-accent) !important; border-color: var(--accent) !important; }
.service-checks label:has(input:checked) { background: var(--accent-soft) !important; border-color: var(--accent) !important; }
.project-filters button { background: var(--surface) !important; color: var(--text) !important; border-color: var(--border) !important; }
.project-filters button:hover { border-color: var(--accent) !important; color: var(--accent-2) !important; }
.project-filters button[aria-pressed="true"] { background: var(--control-bg) !important; color: var(--control-text) !important; border-color: var(--control-bg) !important; }

/* ---------- 7. Buttons ---------- */
.button { color: var(--text); border-color: var(--text); box-shadow: none; }
.button-secondary { background: transparent !important; color: var(--text) !important; border-color: var(--text) !important; }
.button-secondary:hover { background: var(--control-bg) !important; color: var(--control-text) !important; border-color: var(--control-bg) !important; }
.button-orange { background: var(--accent) !important; color: var(--on-accent) !important; border-color: var(--accent) !important; }
.button-orange:hover { background: transparent !important; color: var(--text) !important; border-color: var(--accent) !important; }
.button-light, .contact-direct .button-light { background: var(--control-bg) !important; color: var(--control-text) !important; border-color: var(--control-bg) !important; }
.button-light:hover, .contact-direct .button-light:hover { background: var(--accent) !important; color: var(--on-accent) !important; border-color: var(--accent) !important; }

/* ---------- 8. Timeline, legal and editorial ---------- */
.journey-list::before { background: var(--border) !important; }
.journey-item { border-color: var(--border) !important; }
.journey-item::before { background: var(--bg) !important; border-color: var(--accent) !important; box-shadow: 0 0 0 7px var(--bg) !important; }
.journey-date { color: var(--accent-2) !important; }
.journey-date span, .journey-item p { color: var(--muted) !important; }
.legal-nav a { color: var(--muted) !important; border-color: var(--border) !important; }
.legal-nav a:hover, .legal-nav a[aria-current="page"] { color: var(--text) !important; }
.legal-copy, .article-copy { color: var(--text) !important; }
.legal-copy a, .article-copy a { color: var(--text) !important; text-decoration-color: var(--accent); }

/* ---------- 9. Back to top ---------- */
.back-to-top {
  width: 48px !important;
  height: 48px !important;
  background: var(--accent) !important;
  color: var(--on-accent) !important;
  border: 2px solid var(--surface) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.32), 0 0 0 1px color-mix(in srgb, var(--text) 18%, transparent) !important;
}
.back-to-top:hover { background: var(--accent-2) !important; color: var(--on-accent) !important; transform: translateY(-3px); }

/* ---------- 10. Footer is intentionally inverse in both modes ---------- */
.site-footer {
  padding: 0 !important;
  background: var(--inverse-bg) !important;
  color: var(--inverse-text) !important;
  border-top: 1px solid var(--inverse-border) !important;
}
.site-footer h1, .site-footer h2, .site-footer h3, .site-footer h4,
.site-footer strong, .site-footer .footer-brand, .site-footer .footer-prompt { color: var(--inverse-text) !important; }
.site-footer p, .site-footer span { color: var(--inverse-muted) !important; }
.site-footer a { color: var(--inverse-text) !important; }
.site-footer .footer-heading, .site-footer .footer-kicker { color: var(--accent) !important; }
.site-footer .footer-topline, .site-footer .footer-bottom { border-color: var(--inverse-border) !important; }
.site-footer .footer-button-primary {
  background: var(--inverse-text) !important;
  color: var(--inverse-bg) !important;
  border-color: var(--inverse-text) !important;
}
.site-footer .footer-button-primary:hover { background: var(--accent) !important; color: var(--on-accent) !important; border-color: var(--accent) !important; }
.footer-text-link, .footer-email { color: var(--inverse-text) !important; }
.footer-column a:hover { color: var(--accent) !important; }
.footer-bottom { color: var(--inverse-muted) !important; }

/* ---------- 11. Lightbox is always inverse ---------- */
.case-lightbox { color: #fff !important; }
.case-lightbox p { color: #fff !important; }
.case-lightbox img { background: #111 !important; }
.case-lightbox-close { background: rgba(15,15,15,.78) !important; color: #fff !important; border-color: rgba(255,255,255,.55) !important; }
.case-lightbox-close:hover { background: var(--accent) !important; color: #111 !important; }

/* ---------- 12. Responsive ---------- */
@media (max-width: 959px) {
  .site-header { background: var(--bg) !important; }
}
@media (max-width: 700px) {
  .client-logo-card { min-height: 150px !important; padding: 24px !important; }
  .client-logo-card img { max-width: min(175px,78%); max-height: 74px; padding: 10px 14px; }
  .back-to-top { width: 44px !important; height: 44px !important; right: 14px !important; bottom: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .back-to-top, .client-logo-card, .client-logo-card img { transition: none !important; }
}

/* Case-study gallery lives on an inverse section. The figure shell must not
   re-introduce the page background underneath inverse captions. */
.case-gallery-section .case-shot {
  background: transparent !important;
  border-color: var(--inverse-border) !important;
}
.case-gallery-section .case-shot figcaption { color: var(--inverse-muted) !important; }
.case-gallery-section .case-shot figcaption span { color: var(--accent) !important; }

/* ===== CALYNEVO v5 hover/footer contract =====
   Final-state rules loaded last. Hover never inverts text blindly; every state
   uses semantic theme tokens so light and dark modes remain readable. */

/* Hover-safe cards */
.proof-result,
.service,
.proof,
.value,
.case-fact,
.capability-matrix article,
.deliverable-card,
.offer,
.testimonial-business-card,
.client-logo-card {
  transition: background-color .22s ease, color .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease !important;
}
.proof-result:hover {
  background: var(--surface-3) !important;
  color: var(--text) !important;
  border-color: var(--border-strong) !important;
  transform: translateY(-2px) !important;
}
.proof-result:hover strong { color: var(--text) !important; }
.proof-result:hover span,
.proof-result:hover p { color: var(--muted) !important; }
.service:hover,
.proof:hover,
.value:hover,
.case-fact:hover,
.capability-matrix article:hover,
.deliverable-card:hover,
.offer:hover,
.testimonial-business-card:hover {
  background: var(--surface-2) !important;
  color: var(--text) !important;
  border-color: var(--border-strong) !important;
}
.service:hover h1,.service:hover h2,.service:hover h3,.service:hover h4,
.proof:hover h1,.proof:hover h2,.proof:hover h3,.proof:hover h4,
.value:hover h1,.value:hover h2,.value:hover h3,.value:hover h4,
.case-fact:hover strong,.capability-matrix article:hover h3,
.deliverable-card:hover h3,.offer:hover h3,.testimonial-business-card:hover strong {
  color: var(--text) !important;
}
.service:hover p,.proof:hover p,.value:hover p,.case-fact:hover p,
.capability-matrix article:hover p,.deliverable-card:hover p,.offer:hover p,
.testimonial-business-card:hover p { color: var(--muted) !important; }

/* Keep legacy orange edge animation, but never use a full overlay to create contrast. */
.service::before,.proof::before,.value::before { background: var(--accent) !important; }

/* Links, filters and controls */
.text-link:hover { color: var(--accent-2) !important; }
.service-line:hover { background: var(--surface-2) !important; color: var(--text) !important; }
.service-line:hover h3,.service-line:hover strong { color: var(--text) !important; }
.service-line:hover p { color: var(--muted) !important; }
.service-line:hover .row-arrow { color: var(--accent) !important; }
.service-jump a:hover,.service-jump a[aria-current="true"] {
  background: var(--surface-2) !important;
  color: var(--text) !important;
  border-color: var(--border-strong) !important;
}
.project-filters button:hover { background: var(--surface-2) !important; color: var(--text) !important; border-color: var(--accent) !important; }
.client-logo-card:hover { background: var(--surface-2) !important; color: var(--text) !important; }
.client-logo-card:hover span { color: var(--muted) !important; }

/* Buttons: explicit text/background pairs for every state */
.button-primary:hover,.site-nav .nav-cta:hover {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: var(--on-accent) !important;
}
.button-secondary:hover {
  background: var(--surface-3) !important;
  border-color: var(--border-strong) !important;
  color: var(--text) !important;
}
.button-light:hover,.contact-direct .button-light:hover {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: var(--on-accent) !important;
}
.button-orange:hover {
  background: var(--surface) !important;
  border-color: var(--accent) !important;
  color: var(--text) !important;
}

/* Compact, separate pre-footer CTA */
.prefooter-cta {
  background: var(--bg-soft) !important;
  color: var(--text) !important;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 42px 0 !important;
}
.prefooter-grid {
  display: grid;
  grid-template-columns: minmax(260px,.85fr) minmax(360px,1.15fr);
  gap: clamp(36px,6vw,90px);
  align-items: center;
}
.prefooter-cta .eyebrow { margin: 0 0 10px; color: var(--accent-2) !important; }
.prefooter-cta h2 {
  margin: 0;
  max-width: 15ch;
  color: var(--text) !important;
  font-size: clamp(1.85rem,3.2vw,3.15rem);
  line-height: 1.03;
  letter-spacing: -.045em;
}
.prefooter-copy { display: grid; gap: 18px; }
.prefooter-copy > p { margin: 0; max-width: 62ch; color: var(--muted) !important; }
.prefooter-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.prefooter-actions .button { min-height: 48px; padding: 12px 18px; }

/* Compact professional footer */
.site-footer { padding: 0 !important; background: var(--inverse-bg) !important; color: var(--inverse-text) !important; }
.footer-shell-v5 { padding-top: 0; }
.footer-main-v5 {
  display: grid;
  grid-template-columns: minmax(280px,1.4fr) repeat(3,minmax(130px,.62fr));
  gap: clamp(28px,4vw,54px);
  padding: 38px 0 32px;
  align-items: start;
}
.footer-brand-v5 { max-width: 410px; }
.footer-brand-v5 .footer-brand-v5,
.footer-brand-v5.brand { color: var(--inverse-text) !important; }
a.footer-brand-v5 {
  display: inline-block;
  margin: 0 0 14px;
  font-size: clamp(2rem,3.1vw,3rem);
  font-weight: 850;
  letter-spacing: -.055em;
  line-height: 1;
}
.footer-brand-v5 > p { margin: 0 0 16px; max-width: 42ch; color: var(--inverse-muted) !important; font-size: .91rem; line-height: 1.55; }
.footer-contact-v5 { display: flex; flex-wrap: wrap; gap: 7px 16px; font-size: .82rem; line-height: 1.45; }
.footer-contact-v5 a,.footer-contact-v5 span { color: var(--inverse-muted) !important; }
.footer-contact-v5 a:hover { color: var(--accent) !important; }
.footer-column-v5 { display: flex; flex-direction: column; align-items: flex-start; gap: 9px; }
.footer-column-v5 .footer-heading { margin: 0 0 5px; color: var(--accent) !important; font-size: .69rem !important; letter-spacing: .12em; text-transform: uppercase; font-weight: 850; }
.footer-column-v5 a { color: var(--inverse-text) !important; font-size: .82rem; line-height: 1.35; }
.footer-column-v5 a:hover { color: var(--accent) !important; }
.footer-bottom-v5 {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 17px 0 21px;
  border-top: 1px solid var(--inverse-border);
  color: var(--inverse-muted) !important;
  font-size: .72rem;
}
.footer-bottom-v5 span { color: inherit !important; }

/* Back-to-top remains visible over both the pre-footer and footer. */
.back-to-top {
  background: var(--accent) !important;
  color: var(--on-accent) !important;
  border: 2px solid var(--surface) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.28) !important;
}
.back-to-top:hover,.back-to-top:focus-visible { background: var(--accent-2) !important; color: var(--on-accent) !important; }

@media (max-width: 959px) {
  .prefooter-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .footer-main-v5 { grid-template-columns: 1.25fr 1fr; gap: 30px 42px; }
  .footer-brand-v5 { grid-column: 1 / -1; max-width: 620px; }
}
@media (max-width: 700px) {
  .prefooter-cta { padding: 34px 0 !important; }
  .prefooter-grid { grid-template-columns: 1fr; gap: 20px; }
  .prefooter-cta h2 { font-size: clamp(1.8rem,9vw,2.6rem); }
  .prefooter-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .prefooter-actions .button { width: 100%; text-align: center; }
  .footer-main-v5 { grid-template-columns: 1fr 1fr; gap: 28px 22px; padding: 32px 0 26px; }
  .footer-brand-v5 { grid-column: 1 / -1; }
  .footer-contact-v5 { display: grid; gap: 6px; }
  .footer-bottom-v5 { flex-direction: column; gap: 6px; padding: 15px 0 19px; }
}
@media (max-width: 420px) {
  .footer-main-v5 { grid-template-columns: 1fr; }
  .footer-brand-v5 { grid-column: auto; }
}
@media (hover:none) {
  .proof-result:hover,.service:hover,.proof:hover,.value:hover,.case-fact:hover,
  .capability-matrix article:hover,.deliverable-card:hover,.offer:hover,.testimonial-business-card:hover {
    transform: none !important;
  }
}



/* ===== CALYNEVO v6 natural text flow =====
   Prevents words/compound terms from breaking mid-word.
   Paragraphs use browser "pretty" wrapping; headings remain balanced. */
:where(h1,h2,h3,h4,p,li,dt,dd,figcaption) {
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
:where(p,li,dt,dd,figcaption) { text-wrap: pretty; }
:where(h1,h2,h3,h4) { text-wrap: balance; }
/* Long technical strings keep their existing dedicated wrapping rules. */


/* ===== CALYNEVO v7 clean project index + visual-first case studies ===== */
.work-clean-hero h1{max-width:13ch}.work-clean-section{padding-top:54px}.portfolio-grid-clean{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 24px}.portfolio-card-clean{min-width:0}.portfolio-card-clean>a{display:block;color:inherit}.portfolio-card-media{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:1.22;padding:24px;background:var(--surface-2);overflow:hidden;border:1px solid var(--border)}.portfolio-card-clean:nth-child(2) .portfolio-card-media{background:color-mix(in srgb,var(--surface-2) 74%,#d8d0c7)}.portfolio-card-clean:nth-child(3) .portfolio-card-media{background:color-mix(in srgb,var(--surface-2) 80%,#c7d8d7)}.portfolio-card-media picture{display:block;width:100%}.portfolio-card-media img{display:block;width:100%;height:auto;aspect-ratio:1.6;object-fit:contain;box-shadow:0 14px 28px rgba(0,0,0,.16);transition:transform .4s cubic-bezier(.2,.8,.2,1)}.portfolio-number{position:absolute;z-index:1;top:12px;left:12px;padding:6px 8px;background:var(--surface);border:1px solid var(--border);font-size:.72rem;font-weight:800;line-height:1}.portfolio-card-caption{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-top:18px;border-top:1px solid transparent}.portfolio-card-caption h2{margin:.25rem 0 .15rem;font-size:clamp(1.65rem,2.6vw,2.25rem);line-height:1}.portfolio-card-caption p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.5}.portfolio-arrow{font-size:1.4rem;color:var(--accent);transition:transform .25s ease}.portfolio-card-clean:hover .portfolio-card-media img,.portfolio-card-clean:focus-within .portfolio-card-media img{transform:translateY(-4px) scale(1.008)}.portfolio-card-clean:hover .portfolio-arrow,.portfolio-card-clean:focus-within .portfolio-arrow{transform:translate(3px,-3px)}
.case-clean-intro{padding:72px 0 78px}.case-clean-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);gap:54px;align-items:center}.case-clean-visual{grid-column:1;grid-row:1;padding:28px;background:var(--surface-2);border:1px solid var(--border);min-width:0}.case-clean-visual img{display:block;width:100%;height:auto;box-shadow:0 18px 42px rgba(0,0,0,.16)}.case-clean-copy{grid-column:2;grid-row:1;min-width:0}.case-clean-copy h1{font-size:clamp(3rem,5.4vw,5.8rem);line-height:.98;letter-spacing:-.055em;margin:.45rem 0 1.2rem}.case-clean-copy .lead{font-size:1.08rem;line-height:1.65;margin-bottom:28px}.case-meta-clean{margin:0 0 28px;border-top:1px solid var(--border)}.case-meta-clean>div{display:grid;grid-template-columns:126px minmax(0,1fr);gap:14px;padding:11px 0;border-bottom:1px solid var(--border)}.case-meta-clean>div>*{min-width:0}.case-meta-clean dt{font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;font-weight:800;color:var(--text)}.case-meta-clean dd{margin:0;color:var(--muted);font-size:.9rem;line-height:1.45}.case-gallery-clean{padding-top:82px;padding-bottom:88px}.case-gallery-clean .section-head{margin-bottom:48px}.case-gallery-label{display:flex;align-items:center;gap:14px;margin:54px 0 18px;padding-top:26px;border-top:1px solid color-mix(in srgb,var(--inverse-text) 20%,transparent)}.case-gallery-label:first-of-type{margin-top:0}.case-gallery-label span{font-size:.7rem;font-weight:800;color:var(--accent);letter-spacing:.1em}.case-gallery-label h3{margin:0;color:var(--inverse-text);font-size:clamp(1.35rem,2vw,1.8rem)}.case-clean-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 22px;align-items:start}.case-clean-shot{margin:0;min-width:0}.case-clean-shot--wide{grid-column:1/-1}.case-clean-shot>a{position:relative;display:flex;align-items:center;justify-content:center;min-height:300px;padding:22px;background:#f1f0ec;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.case-clean-shot img{display:block;width:100%;height:auto;max-height:760px;object-fit:contain;transition:transform .45s cubic-bezier(.2,.8,.2,1)}.case-clean-shot--portrait>a{min-height:560px}.case-clean-shot--portrait img{width:auto;max-width:100%;max-height:690px}.case-clean-shot figcaption{display:flex;justify-content:space-between;gap:16px;padding-top:10px;color:var(--inverse-muted);font-size:.86rem;line-height:1.45}.case-clean-shot figcaption span{color:var(--accent)}.case-clean-shot:hover img{transform:scale(1.01)}.case-shot-badge{position:absolute;z-index:1;left:12px;top:12px;padding:6px 9px;background:#1d1e1f;color:#fff;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em}.case-compare-grid .case-clean-shot:nth-child(2) .case-shot-badge{background:var(--accent);color:var(--on-accent)}.case-clean-story{padding-top:86px}.case-story-grid-clean{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--border);border-left:1px solid var(--border)}.case-story-grid-clean section{padding:28px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}.case-story-grid-clean section>span{display:block;margin-bottom:34px;color:var(--accent);font-size:.74rem;font-weight:800}.case-story-grid-clean h3{font-size:1.35rem;line-height:1.15;margin:0 0 14px}.case-story-grid-clean p{margin:0;color:var(--muted);font-size:.96rem;line-height:1.7}.case-proof-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:28px;border-top:1px solid var(--border);border-left:1px solid var(--border)}.case-proof-strip>div{padding:18px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}.case-proof-strip strong,.case-proof-strip span{display:block}.case-proof-strip strong{font-size:.86rem}.case-proof-strip span{margin-top:5px;color:var(--muted);font-size:.8rem;line-height:1.45}.project-navigation--clean>.container{padding-top:30px;padding-bottom:30px}.project-back-link{display:inline-block;margin-bottom:24px;color:var(--muted);font-size:.9rem}.project-pager{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.project-pager>a{padding:24px 0;color:inherit}.project-pager>a+ a{text-align:right;border-left:1px solid var(--border);padding-left:24px}.project-pager>a:first-child{padding-right:24px}.project-pager span,.project-pager strong{display:block}.project-pager span{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em}.project-pager strong{margin-top:5px;font-size:1.15rem}.project-pager a:hover strong{color:var(--accent)}
@media(max-width:1050px){.portfolio-grid-clean{grid-template-columns:repeat(2,minmax(0,1fr))}.case-clean-grid{grid-template-columns:1fr;gap:30px}.case-clean-copy{grid-column:1;grid-row:1}.case-clean-visual{grid-column:1;grid-row:2}.case-clean-copy h1{max-width:12ch}.case-story-grid-clean{grid-template-columns:1fr}.case-proof-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.work-clean-section{padding-top:34px}.portfolio-grid-clean{grid-template-columns:1fr;gap:34px}.portfolio-card-media{padding:18px;aspect-ratio:1.25}.portfolio-card-caption{align-items:flex-start}.portfolio-card-caption h2{font-size:1.8rem}.case-clean-intro{padding:42px 0 54px}.case-clean-grid{gap:26px}.case-clean-copy h1{font-size:clamp(2.8rem,13vw,4.4rem);max-width:none}.case-clean-copy .lead{font-size:1rem}.case-clean-visual{padding:12px}.case-meta-clean>div{grid-template-columns:116px minmax(0,1fr);gap:10px}.case-gallery-clean{padding-top:58px;padding-bottom:62px}.case-gallery-clean .section-head{margin-bottom:34px}.case-gallery-label{margin-top:38px;padding-top:20px}.case-clean-gallery{grid-template-columns:1fr;gap:26px}.case-clean-shot--wide{grid-column:auto}.case-clean-shot>a,.case-clean-shot--portrait>a{min-height:0;padding:12px}.case-clean-shot--portrait img{max-height:none;width:100%}.case-clean-shot figcaption{font-size:.82rem}.case-clean-story{padding-top:60px}.case-story-grid-clean section{padding:22px}.case-story-grid-clean section>span{margin-bottom:22px}.case-proof-strip{grid-template-columns:1fr 1fr}.case-proof-strip>div{padding:14px}.project-pager{grid-template-columns:1fr}.project-pager>a+ a{border-left:0;border-top:1px solid var(--border);padding-left:0}.project-pager>a:first-child{padding-right:0}.project-pager>a+ a{text-align:left}}
@media(max-width:480px){.case-meta-clean>div{grid-template-columns:1fr;gap:4px;padding:12px 0}.case-meta-clean dt{font-size:.7rem}.case-meta-clean dd{font-size:.9rem;line-height:1.5}.case-clean-shot figcaption{display:block}.case-clean-shot figcaption span{display:block;margin-top:3px}}
@media(prefers-reduced-motion:reduce){.portfolio-card-media img,.portfolio-arrow,.case-clean-shot img{transition:none!important}}

/* Case-study live-site CTAs  -  2026-09-14 */
.case-clean-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.case-live-cta{padding-top:22px;padding-bottom:22px}
.case-live-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;padding-top:28px;padding-bottom:28px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.case-live-cta .eyebrow{margin:0 0 8px;color:var(--muted)}
.case-live-cta h2{margin:0;font-size:clamp(1.45rem,2.5vw,2.2rem);line-height:1.12;letter-spacing:-.035em}
.case-live-cta .button{flex:0 0 auto}
@media(max-width:700px){.case-clean-actions{display:grid;grid-template-columns:1fr;gap:10px}.case-clean-actions .button{width:100%;text-align:center}.case-live-cta{padding-top:12px;padding-bottom:12px}.case-live-cta-inner{align-items:stretch;flex-direction:column;gap:18px;padding-top:22px;padding-bottom:22px}.case-live-cta .button{width:100%;text-align:center}}


/* Afghan Community full visual showcase 2026-09-14 */
.case-showcase-group{margin-top:54px;content-visibility:auto;contain-intrinsic-size:900px}
.case-showcase-group:first-of-type{margin-top:0}
.case-showcase-intro{max-width:760px;margin:-6px 0 22px;color:var(--inverse-muted)!important;font-size:.94rem;line-height:1.65}
.case-showcase-grid{display:grid;gap:22px;margin-top:22px;align-items:stretch}
.case-showcase-grid--feature{grid-template-columns:1fr}
.case-showcase-grid--pair{grid-template-columns:repeat(2,minmax(0,1fr))}
.case-showcase-grid--trio{grid-template-columns:repeat(3,minmax(0,1fr))}
.case-showcase-grid--social{grid-template-columns:repeat(4,minmax(0,1fr))}
.case-showcase-grid--compact{max-width:900px}
.case-showcase-card{margin:0;min-width:0;display:flex;flex-direction:column}
.case-showcase-card>a{position:relative;display:flex;align-items:center;justify-content:center;height:100%;min-height:300px;padding:18px;background:#f2f1ed;border:1px solid rgba(255,255,255,.12);overflow:hidden}
.case-showcase-card img{display:block;width:100%;height:auto;max-height:660px;object-fit:contain;transition:transform .35s ease}
.case-showcase-card--feature>a{min-height:360px;padding:22px}.case-showcase-card--feature img{max-height:760px}
.case-showcase-card--document>a{min-height:430px}.case-showcase-card--document img{max-height:620px;width:auto;max-width:100%}
.case-showcase-card--portrait>a{min-height:520px}.case-showcase-card--portrait img{max-height:680px;width:auto;max-width:100%}
.case-showcase-card--social>a{min-height:400px}.case-showcase-card--social img{max-height:560px;width:auto;max-width:100%}
.case-showcase-card figcaption{display:flex;justify-content:space-between;gap:14px;padding-top:10px;color:var(--inverse-muted);font-size:.82rem;line-height:1.45}
.case-showcase-card figcaption span{color:var(--accent)}
.case-showcase-card:hover img{transform:scale(1.012)}
@media(max-width:1050px){.case-showcase-grid--social{grid-template-columns:repeat(2,minmax(0,1fr))}.case-showcase-grid--trio{grid-template-columns:repeat(2,minmax(0,1fr))}.case-showcase-grid--trio .case-showcase-card:last-child{grid-column:1/-1}}
@media(max-width:700px){.case-showcase-group{margin-top:42px;contain-intrinsic-size:1200px}.case-showcase-intro{font-size:.9rem;margin-bottom:18px}.case-showcase-grid,.case-showcase-grid--pair,.case-showcase-grid--trio,.case-showcase-grid--social{grid-template-columns:1fr;gap:24px;margin-top:18px}.case-showcase-grid--trio .case-showcase-card:last-child{grid-column:auto}.case-showcase-card>a,.case-showcase-card--feature>a,.case-showcase-card--document>a,.case-showcase-card--portrait>a,.case-showcase-card--social>a{min-height:0;padding:12px}.case-showcase-card img,.case-showcase-card--feature img,.case-showcase-card--document img,.case-showcase-card--portrait img,.case-showcase-card--social img{width:100%;height:auto;max-height:680px}.case-showcase-card figcaption{font-size:.8rem}}
@media(max-width:480px){.case-showcase-card figcaption{display:block}.case-showcase-card figcaption span{display:block;margin-top:3px}}
@media(prefers-reduced-motion:reduce){.case-showcase-card img{transition:none!important}}


/* ===== Case-study in-page lightbox + gallery zoom affordance · 2026-09-14 ===== */
html.case-lightbox-open{overflow:hidden}
.case-clean-shot>a,.case-showcase-card>a,.case-shot>a{position:relative;cursor:zoom-in}
.case-clean-shot>a::after,.case-showcase-card>a::after,.case-shot>a::after{
  content:"+";position:absolute;right:14px;bottom:14px;z-index:2;display:grid;place-items:center;
  width:38px;height:38px;border-radius:50%;background:rgba(20,22,21,.82);color:#fff;
  font-size:1.15rem;font-weight:500;line-height:1;opacity:0;transform:translateY(6px) scale(.94);
  transition:opacity .22s ease,transform .22s ease,background .22s ease;pointer-events:none
}
.case-clean-shot>a:focus-visible::after,.case-showcase-card>a:focus-visible::after,.case-shot>a:focus-visible::after{opacity:1;transform:none}
@media(hover:hover){
  .case-clean-shot>a:hover::after,.case-showcase-card>a:hover::after,.case-shot>a:hover::after{opacity:1;transform:none;background:var(--accent)}
}
.case-lightbox{width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:transparent;color:#fff;overflow:hidden}
.case-lightbox::backdrop{background:rgba(8,10,9,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.case-lightbox-inner{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) 64px;grid-template-rows:minmax(0,1fr) auto;align-items:center;width:100%;height:100%;padding:54px 28px 22px;box-sizing:border-box}
.case-lightbox-media{grid-column:2;grid-row:1;display:grid;place-items:center;min-width:0;min-height:0;width:100%;height:100%;overflow:hidden}
.case-lightbox img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 132px);object-fit:contain;background:transparent;box-shadow:0 28px 90px rgba(0,0,0,.45);transition:opacity .18s ease}
.case-lightbox img.is-loading{opacity:.28}
.case-lightbox-close{position:absolute;z-index:4;top:16px;right:20px;width:42px;height:42px;border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(20,22,21,.78);color:#fff;font:inherit;font-size:1.4rem;line-height:1;cursor:pointer;transition:transform .2s ease,background .2s ease}
.case-lightbox-close:hover,.case-lightbox-close:focus-visible{transform:scale(1.06);background:var(--accent);color:#111;outline:none}
.case-lightbox-nav{display:grid;place-items:center;width:46px;height:58px;margin:auto;border:1px solid rgba(255,255,255,.26);border-radius:999px;background:rgba(20,22,21,.58);color:#fff;font:inherit;font-size:2rem;line-height:1;cursor:pointer;transition:background .2s ease,transform .2s ease}
.case-lightbox-prev{grid-column:1;grid-row:1}.case-lightbox-next{grid-column:3;grid-row:1}
.case-lightbox-nav:hover,.case-lightbox-nav:focus-visible{background:var(--accent);color:#111;transform:scale(1.04);outline:none}
.case-lightbox-meta{grid-column:1/-1;grid-row:2;display:flex;align-items:center;justify-content:center;gap:16px;min-height:34px;padding-top:10px;color:#fff}
.case-lightbox-caption{max-width:min(820px,75vw);margin:0!important;color:#fff!important;font-size:.82rem!important;line-height:1.45;text-align:center}
.case-lightbox-count{flex:0 0 auto;color:rgba(255,255,255,.64);font-size:.72rem;font-variant-numeric:tabular-nums}
@media(max-width:700px){
  .case-lightbox-inner{grid-template-columns:42px minmax(0,1fr) 42px;padding:58px 8px 16px}
  .case-lightbox-close{top:12px;right:12px;width:40px;height:40px}
  .case-lightbox-nav{width:36px;height:48px;font-size:1.6rem;background:rgba(20,22,21,.72)}
  .case-lightbox img{max-height:calc(100dvh - 142px)}
  .case-lightbox-meta{gap:10px;padding:8px 8px 0}
  .case-lightbox-caption{max-width:78vw;font-size:.75rem!important}
}
@media(prefers-reduced-motion:reduce){
  .case-clean-shot>a::after,.case-showcase-card>a::after,.case-shot>a::after,.case-lightbox img,.case-lightbox-close,.case-lightbox-nav{transition:none!important}
}


/* Studio founder and experience refinement - 2026-09-14 */
.founder-grid--refined{grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:clamp(36px,6vw,88px);align-items:center}
.founder-profile{min-width:0}
.founder-profile h2{margin:.35rem 0 1.1rem;font-size:clamp(3rem,5.5vw,5.6rem);line-height:.98;letter-spacing:-.055em}
.founder-profile .lead{max-width:620px;margin-bottom:24px;font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.7}
.founder-proof-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.founder-proof-list span{display:inline-flex;align-items:center;min-height:38px;padding:8px 12px;border:1px solid var(--border);background:var(--surface);color:var(--text-2);font-size:.78rem;font-weight:700;line-height:1.25}
.credential-card--compact{min-height:0;padding:clamp(26px,4vw,42px);border:1px solid var(--border);box-shadow:var(--shadow-1)}
.credential-card--compact .credential-kicker{margin-bottom:14px;color:var(--accent);font-size:.7rem;letter-spacing:.1em}
.credential-card--compact>strong{margin:0 0 10px;font-size:clamp(1.75rem,3.2vw,3rem);line-height:1.05;letter-spacing:-.04em}
.credential-card--compact .credential-level{margin:0;color:var(--text)!important;font-size:1rem;font-weight:750;line-height:1.5}
.credential-card--compact .credential-note{max-width:52ch;margin:14px 0 0;font-size:.9rem;line-height:1.6}
.studio-journey--refined{border-top:1px solid var(--border)}
.studio-experience-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;border:1px solid var(--border);background:var(--border)}
.studio-experience-card{display:flex;flex-direction:column;min-height:285px;padding:clamp(24px,3vw,34px);background:var(--surface);color:var(--text)}
.studio-experience-card--studio{background:var(--bg-soft)}
.studio-experience-type{display:block;margin-bottom:auto;color:var(--accent);font-size:.7rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.studio-experience-card h3{margin:48px 0 10px;font-size:clamp(1.55rem,2.5vw,2.3rem);line-height:1.05;letter-spacing:-.035em}
.studio-experience-card p{max-width:58ch;margin:0 0 22px;color:var(--muted);font-size:.94rem;line-height:1.65}
.studio-experience-card .text-link{margin-top:auto;align-self:flex-start}
@media(max-width:1000px){.founder-grid--refined{grid-template-columns:1fr;gap:30px}.founder-profile h2{font-size:clamp(2.8rem,8vw,4.7rem)}.credential-card--compact{max-width:none}}
@media(max-width:700px){.founder-band--refined{padding-top:54px;padding-bottom:54px}.founder-profile h2{font-size:clamp(2.7rem,13vw,4.2rem)}.founder-proof-list{display:grid;grid-template-columns:1fr;gap:7px}.founder-proof-list span{width:100%;min-height:42px}.credential-card--compact{padding:22px}.credential-card--compact>strong{font-size:clamp(1.7rem,8vw,2.45rem)}.studio-experience-grid{grid-template-columns:1fr}.studio-experience-card{min-height:0;padding:24px}.studio-experience-card h3{margin-top:34px}}


/* ===== CALYNEVO SOCIAL CONTACTS 2026-09-15 ===== */
.footer-contact-v5 { align-items: center; }
.footer-social-v5,
.contact-social-v5 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.footer-social-v5 { flex-basis: 100%; margin-top: 7px; }
.social-icon-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin: 0 !important;
  border: 1px solid var(--inverse-border);
  border-radius: 50%;
  color: var(--inverse-text) !important;
  background: transparent;
  transition: transform .18s ease, border-color .18s ease, background-color .18s ease, color .18s ease;
}
.social-icon-link svg { width: 15px; height: 15px; fill: currentColor; flex: 0 0 auto; }
.social-icon-link:hover,
.social-icon-link:focus-visible {
  transform: translateY(-2px);
  color: var(--on-accent) !important;
  background: var(--accent);
  border-color: var(--accent);
  outline: none;
}
.social-icon-link:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 34%, transparent); }
.contact-social-v5 { margin-top: 18px; }
.contact-direct .contact-social-v5 .social-icon-link {
  color: var(--text) !important;
  border-color: var(--line);
  background: var(--surface);
}
.contact-direct .contact-social-v5 .social-icon-link:hover,
.contact-direct .contact-social-v5 .social-icon-link:focus-visible {
  color: var(--on-accent) !important;
  border-color: var(--accent);
  background: var(--accent);
}
.contact-whatsapp-v5 { font-weight: 800; }
@media (max-width:700px) {
  .footer-social-v5 { margin-top: 8px; }
  .social-icon-link { width: 38px; height: 38px; }
  .social-icon-link svg { width: 16px; height: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .social-icon-link { transition: none; }
  .social-icon-link:hover,.social-icon-link:focus-visible { transform: none; }
}

/* ===== CALYNEVO social icon hover visibility fix 2026-09-15 =====
   The generic footer-link hover rule uses the accent color. Because the social
   buttons also use the accent as their hover background, currentColor SVGs could
   become invisible. Keep the hover icon on the dedicated on-accent color. */
.footer-contact-v5 .social-icon-link:hover,
.footer-contact-v5 .social-icon-link:focus-visible {
  color: var(--on-accent) !important;
}
.footer-contact-v5 .social-icon-link:hover svg,
.footer-contact-v5 .social-icon-link:focus-visible svg {
  color: var(--on-accent) !important;
  fill: currentColor;
}

/* ===== CALYNEVO 2026-09 LuxeVisa-inspired UX refinement ===== */
.service-lines--four .service-line{grid-template-columns:72px minmax(210px,.75fr) minmax(280px,1.4fr) 28px}
.needs-discovery{border-top:1px solid var(--line);background:var(--paper)}
.needs-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.need-card{min-height:280px;display:flex;flex-direction:column;padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transition:transform .2s ease,background .2s ease}
.need-card:hover{background:var(--white);transform:translateY(-3px)}
.need-card>span{margin-bottom:44px;color:var(--orange-dark);font-size:.75rem;font-weight:800;letter-spacing:.12em}
.need-card h3{font-size:clamp(1.25rem,1.7vw,1.75rem)}
.need-card p{font-size:.95rem}
.need-card strong{margin-top:auto;font-size:.82rem}
.solved-challenges .section-head p:last-child{color:#bdbbb5}
.challenge-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.18);border-left:1px solid rgba(255,255,255,.18)}
.challenge-card{min-height:360px;display:flex;flex-direction:column;padding:32px;border-right:1px solid rgba(255,255,255,.18);border-bottom:1px solid rgba(255,255,255,.18);transition:background .2s ease,transform .2s ease}
.challenge-card:hover{background:rgba(255,255,255,.05);transform:translateY(-3px)}
.challenge-kicker{margin-bottom:54px;color:var(--orange);font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.challenge-card h3{max-width:15ch;font-size:clamp(1.45rem,2.2vw,2.25rem)}
.challenge-card p{color:#bdbbb5}
.challenge-card strong{margin-top:auto;color:var(--paper);font-size:.84rem}
.process--six{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.process--six .process-step{min-height:250px;padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.process-number{display:block;margin-bottom:42px;color:var(--orange-dark);font-size:.74rem;font-weight:800;letter-spacing:.12em}
.home-resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.home-resource-card{display:flex;flex-direction:column;min-height:100%;border:1px solid var(--line);background:var(--white);overflow:hidden;transition:transform .2s ease}
.home-resource-card:hover{transform:translateY(-4px)}
.home-resource-visual{aspect-ratio:16/10;overflow:hidden;background:var(--ink)}
.home-resource-visual img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.home-resource-card:hover .home-resource-visual img{transform:scale(1.025)}
.home-resource-card>span,.home-resource-card>h3,.home-resource-card>p,.home-resource-card>strong{margin-left:24px;margin-right:24px}
.home-resource-card>span{margin-top:22px;color:var(--orange-dark);font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.home-resource-card>h3{margin-top:12px;font-size:clamp(1.35rem,1.8vw,1.9rem)}
.home-resource-card>p{font-size:.94rem}
.home-resource-card>strong{margin-top:auto;margin-bottom:24px;font-size:.82rem}
.home-resources .all-work{margin-top:28px}

/* Resources: premium editorial imagery + long-form navigation */
.resource-card-visual{position:relative;overflow:hidden;background-size:cover;background-position:center}
.resource-card-visual::after{position:absolute;inset:0;background:linear-gradient(135deg,rgba(23,23,23,.14),rgba(23,23,23,.72));content:""}
.resource-card-visual>*{position:relative;z-index:1;color:#fff}
.resource-card[href*="catalogue-ecommerce"] .resource-card-visual,
.resource-card[href*="wordpress-wix"] .resource-card-visual,
.resource-card[href*="site-multilingue"] .resource-card-visual{background-image:url('../images/project-pamir-lux-720.webp')}
.resource-card[href*="mobile-first"] .resource-card-visual,
.resource-card[href*="seo-accessibilite-performance"] .resource-card-visual,
.resource-card[href*="preparer-projet-web"] .resource-card-visual{background-image:url('../images/project-afghan-community-720.webp')}
.resource-card[href*="ameliorer-site-existant"] .resource-card-visual,
.resource-card[href*="identite-visuelle"] .resource-card-visual,
.resource-card[href*="maintenance-support"] .resource-card-visual{background-image:url('../images/project-dressyourbody-720.webp')}
.resource-card:not([href*="catalogue-ecommerce"]):not([href*="wordpress-wix"]):not([href*="site-multilingue"]):not([href*="mobile-first"]):not([href*="seo-accessibilite-performance"]):not([href*="preparer-projet-web"]):not([href*="ameliorer-site-existant"]):not([href*="identite-visuelle"]):not([href*="maintenance-support"]) .resource-card-visual{background-image:url('../images/calynevo-sculpture-768.webp')}
.resource-editorial-visual{margin:0 0 clamp(34px,5vw,68px);border:1px solid var(--line);background:var(--ink);overflow:hidden}
.resource-editorial-visual img{width:100%;aspect-ratio:16/8;object-fit:cover}
.resource-editorial-visual figcaption{display:flex;justify-content:space-between;gap:24px;padding:14px 18px;color:#c9c7c0;background:var(--ink);font-size:.78rem}
.resource-toc{margin:0 0 34px;padding:22px 24px;border:1px solid var(--line);background:color-mix(in srgb,var(--paper) 80%,var(--white) 20%)}
.resource-toc strong{display:block;margin-bottom:12px;font-size:.8rem;text-transform:uppercase;letter-spacing:.1em}
.resource-toc ol{margin:0;padding-left:1.2rem}
.resource-toc a{display:inline-block;padding:4px 0;color:var(--muted);font-size:.9rem;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px}
.resource-toc a:hover{color:var(--ink);text-decoration-color:var(--orange)}
.resource-content-section{scroll-margin-top:110px}

@media (max-width:1020px){
  .needs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .challenge-grid,.home-resource-grid{grid-template-columns:1fr 1fr}
  .process--six{grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-lines--four .service-line{grid-template-columns:56px 1fr 28px}
  .service-lines--four .service-line>div{grid-column:2/3}
}
@media (max-width:700px){
  .needs-grid,.challenge-grid,.home-resource-grid,.process--six{grid-template-columns:1fr}
  .need-card{min-height:230px}
  .challenge-card{min-height:300px}
  .resource-editorial-visual figcaption{display:block}
  .resource-editorial-visual figcaption span:last-child{display:block;margin-top:4px}
}


/* CALYNEVO FINAL STATIC FREEZE · 2026-09-18
   Site-wide editorial polish: fewer decorative numbers, calmer spacing, wider desktop navigation. */
@media (min-width:1200px){
  .header-inner{gap:30px}
  .nav-wrap{gap:18px}
  .site-nav,.js .site-nav{gap:30px}
  .site-nav a,.js .site-nav a{padding:10px 2px}
  .site-nav .nav-cta,.js .site-nav .nav-cta{padding:13px 18px}
}
/* Homepage service rows no longer reserve a column for decorative numbering. */
.service-line{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) 35px;gap:32px}
/* Keep one clear number for the genuinely sequential six-step process. */
.process--six .process-step::before{display:none}
.process--six .process-number{margin-bottom:34px;font-size:.78rem;line-height:1;letter-spacing:.08em}
/* Cards whose decorative number was removed get a calmer top rhythm. */
.need-card h3,.value-grid--process .value h3,.deliverable-card strong,.case-story-grid-clean h3{margin-top:0}
.case-gallery-label{gap:0}
/* Studio proof list reads as natural statements, not a numbered checklist. */
.studio-proof-list{display:grid;gap:10px;margin:24px 0}
.studio-proof-item{padding:10px 0;border-bottom:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.studio-proof-item:last-child{border-bottom:0}
.studio-proof-item strong{display:block;line-height:1.35}
@media(max-width:959px){.service-line{grid-template-columns:minmax(0,1fr) 24px;gap:14px}.service-line>div{grid-column:1;grid-row:2}.service-line .row-arrow{grid-column:2;grid-row:1}}
@media(max-width:700px){.service-line{grid-template-columns:minmax(0,1fr) 24px;gap:10px}}

/* CALYNEVO FINAL REGRESSION FIX · 2026-09-18
   Restores clean grid relationships after numbering cleanup and standardizes
   header/footer spacing without adding assets or runtime work. */

/* Desktop navigation: retain the dark navigation bar but give each label room. */
@media (min-width:960px){
  .header-inner{column-gap:clamp(22px,2.2vw,36px)}
  .nav-wrap{gap:clamp(12px,1.2vw,18px)}
  html.js .site-nav,.site-nav{
    gap:0 !important;
    padding:0 6px !important;
    align-items:stretch;
    border-radius:0;
  }
  html.js .site-nav a:not(.nav-cta),.site-nav a:not(.nav-cta){
    display:flex;
    align-items:center;
    min-height:48px;
    padding:10px 12px !important;
    line-height:1.2;
    white-space:nowrap;
  }
  html.js .site-nav .nav-cta,.site-nav .nav-cta{
    display:flex;
    align-items:center;
    min-height:48px;
    margin-left:6px;
    padding:10px 18px !important;
    white-space:nowrap;
  }
}
@media (min-width:1200px){
  html.js .site-nav a:not(.nav-cta),.site-nav a:not(.nav-cta){padding-left:15px !important;padding-right:15px !important}
  html.js .site-nav .nav-cta,.site-nav .nav-cta{padding-left:21px !important;padding-right:21px !important}
}

/* Homepage service rows: no phantom number column; title and copy have their own space. */
.service-lines--four .service-line,
.service-line{
  grid-template-columns:minmax(220px,.78fr) minmax(0,1.22fr) 30px !important;
  gap:clamp(28px,3vw,48px) !important;
  padding:38px 0 !important;
  align-items:start;
}
.service-line h3{
  grid-column:1;
  min-width:0;
  max-width:16ch;
  margin:0;
  line-height:1.04;
  overflow-wrap:normal;
  word-break:normal;
}
.service-line>div{
  grid-column:2;
  min-width:0;
  max-width:58ch;
}
.service-line .row-arrow{grid-column:3;grid-row:1;justify-self:end}
.service-line p{max-width:52ch}

/* Services index: give each service title/copy deliberate inset from divider edges. */
.offer{
  padding:48px clamp(18px,2vw,28px) !important;
  column-gap:clamp(44px,5vw,72px) !important;
}
.offer>div:first-child,.offer-copy{min-width:0}
.offer h2{margin-top:0;line-height:1.03;overflow-wrap:normal;word-break:normal}
.offer-copy>p:first-child{margin-top:0}

/* Footer is now canonical on every page; reinforce the intended four-column layout. */
.footer-main-v5{
  grid-template-columns:minmax(300px,1.45fr) repeat(3,minmax(140px,.62fr)) !important;
  gap:clamp(30px,4vw,58px) !important;
  align-items:start !important;
}
.footer-main-v5>.footer-brand-v5{grid-column:auto !important;max-width:430px}
.footer-main-v5>.footer-column-v5{min-width:0}
.footer-contact-v5{align-items:center}

@media(max-width:1050px) and (min-width:701px){
  .footer-main-v5{grid-template-columns:1.25fr 1fr !important;gap:32px 46px !important}
  .footer-main-v5>.footer-brand-v5{grid-column:1/-1 !important;max-width:620px}
}
@media(max-width:959px){
  .service-lines--four .service-line,.service-line{
    grid-template-columns:minmax(0,1fr) 26px !important;
    gap:14px 20px !important;
    padding:32px 0 !important;
  }
  .service-line h3{grid-column:1;grid-row:1;max-width:none}
  .service-line>div{grid-column:1;grid-row:2;max-width:62ch}
  .service-line .row-arrow{grid-column:2;grid-row:1}
}
@media(max-width:700px){
  .offer{padding:34px 12px !important}
  .footer-main-v5{grid-template-columns:1fr 1fr !important;gap:28px 24px !important;padding:34px 0 28px !important}
  .footer-main-v5>.footer-brand-v5{grid-column:1/-1 !important;max-width:none}
}
@media(max-width:430px){
  .footer-main-v5{grid-template-columns:1fr !important}
  .footer-main-v5>.footer-brand-v5{grid-column:auto !important}
}


/* ==============================================================
   CALYNEVO Motion System · 2026-09-18
   Mobile-first, lightweight, transform/opacity based.
   ============================================================== */
:root{
  --motion-fast:160ms;
  --motion-ui:240ms;
  --motion-reveal:440ms;
  --motion-media:500ms;
  --motion-ease:cubic-bezier(.22,1,.36,1);
  --motion-ease-soft:cubic-bezier(.2,.8,.2,1);
}

/* Editorial heading and media reveals are one-shot and intentionally restrained. */
.motion-heading.is-motion-visible{animation:calynevoHeadingIn var(--motion-reveal) var(--motion-ease) both}
.motion-media.is-motion-visible{animation:calynevoMediaIn var(--motion-media) var(--motion-ease) both}
@keyframes calynevoHeadingIn{from{opacity:.56;transform:translate3d(0,9px,0)}to{opacity:1;transform:none}}
@keyframes calynevoMediaIn{from{opacity:.72;transform:translate3d(0,8px,0) scale(.994)}to{opacity:1;transform:none}}

/* Theme switching: animate only visible UI surfaces, never the whole DOM. */
html.theme-transitioning body,
html.theme-transitioning .site-header,
html.theme-transitioning .site-footer,
html.theme-transitioning .section,
html.theme-transitioning .resource-card,
html.theme-transitioning .checklist-card,
html.theme-transitioning .contact-form,
html.theme-transitioning .contact-direct,
html.theme-transitioning .service-index-row,
html.theme-transitioning .service-jump,
html.theme-transitioning .project-card,
html.theme-transitioning .portfolio-card-clean,
html.theme-transitioning .case-fact,
html.theme-transitioning .button,
html.theme-transitioning input,
html.theme-transitioning textarea,
html.theme-transitioning select{
  transition:background-color var(--motion-ui) ease,color var(--motion-ui) ease,border-color var(--motion-ui) ease,box-shadow var(--motion-ui) ease!important;
}
html.theme-transitioning .theme-toggle{transform:rotate(10deg) scale(.96)}

/* Language switch gets a short, quiet hand-off instead of a hard visual cut. */
body.language-transitioning main,
body.language-transitioning .site-footer{
  opacity:.965;
  transform:translate3d(0,2px,0);
  transition:opacity 90ms ease,transform 90ms ease;
}

/* Desktop-only magnetic feedback for important CTAs. Movement is deliberately tiny. */
@media (min-width:960px) and (hover:hover) and (pointer:fine){
  .motion-magnetic.is-magnetic-active{will-change:transform}
  .button.motion-magnetic.is-magnetic-active,
  .site-nav .nav-cta.motion-magnetic.is-magnetic-active{
    transform:translate3d(var(--mag-x,0px),var(--mag-y,0px),0);
  }
  .button.motion-magnetic.is-magnetic-active:hover{
    transform:translate3d(var(--mag-x,0px),calc(var(--mag-y,0px) - 2px),0);
  }
}

/* Mobile/touch: tactile feedback replaces hover-only motion. */
@media (hover:none), (pointer:coarse){
  .button:active,
  .resource-card:active,
  .checklist-card:active,
  .resource-start a:active,
  .related-service-chip:active,
  .project-card>a:active,
  .portfolio-card-clean>a:active,
  .service-jump a:active{
    transform:scale(.985);
    transition:transform var(--motion-fast) var(--motion-ease);
  }
  .motion-heading.is-motion-visible{animation-duration:380ms}
  .motion-media.is-motion-visible{animation-duration:430ms}
}

/* Desktop can carry slightly richer motion while keeping the same language. */
@media (min-width:1050px) and (hover:hover) and (pointer:fine){
  :root{--motion-reveal:500ms;--motion-media:560ms}
  @keyframes calynevoHeadingIn{from{opacity:.5;transform:translate3d(0,12px,0)}to{opacity:1;transform:none}}
  @keyframes calynevoMediaIn{from{opacity:.68;transform:translate3d(0,12px,0) scale(.992)}to{opacity:1;transform:none}}
}

@media (prefers-reduced-motion:reduce){
  .motion-heading,.motion-media{animation:none!important;opacity:1!important;transform:none!important}
  .motion-magnetic{transform:none!important}
  body.language-transitioning main,body.language-transitioning .site-footer{opacity:1!important;transform:none!important;transition:none!important}
  html.theme-transitioning body,html.theme-transitioning .site-header,html.theme-transitioning .site-footer,html.theme-transitioning .section,html.theme-transitioning .resource-card,html.theme-transitioning .checklist-card,html.theme-transitioning .contact-form,html.theme-transitioning .contact-direct,html.theme-transitioning .service-index-row,html.theme-transitioning .service-jump,html.theme-transitioning .project-card,html.theme-transitioning .portfolio-card-clean,html.theme-transitioning .case-fact,html.theme-transitioning .button,html.theme-transitioning input,html.theme-transitioning textarea,html.theme-transitioning select{transition:none!important}
}

/* CALYNEVO MOBILE COMFORT REFINEMENT · 2026-09-18
   Mobile-only density and layout corrections. Desktop remains unchanged. */
@media (max-width:700px){
  /* Homepage service families: force the copy under the title, never into the arrow column. */
  .service-lines--four .service-line,
  .service-line{
    grid-template-columns:minmax(0,1fr) 24px !important;
    gap:9px 14px !important;
    padding:27px 0 !important;
    align-items:start;
  }
  .service-lines--four .service-line h3,
  .service-line h3{
    grid-column:1 !important;
    grid-row:1 !important;
    max-width:none !important;
    min-width:0;
    margin:0;
    font-size:clamp(1.45rem,6.7vw,1.78rem);
    line-height:1.06;
  }
  .service-lines--four .service-line>div,
  .service-line>div{
    grid-column:1 !important;
    grid-row:2 !important;
    width:auto !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  .service-lines--four .service-line .row-arrow,
  .service-line .row-arrow{
    grid-column:2 !important;
    grid-row:1 !important;
    justify-self:end;
    align-self:start;
    font-size:1.35rem;
  }
  .service-line strong{display:block;font-size:.92rem;line-height:1.4}
  .service-line p{max-width:100%;margin-top:6px;font-size:.9rem;line-height:1.55}

  /* Work filters: compact single-line chips with horizontal scrolling. */
  .project-filters{
    width:100%;
    max-width:100%;
    min-height:0;
    padding:6px;
    gap:6px;
    border-radius:16px;
    overflow-x:auto;
    overflow-y:hidden;
    flex-wrap:nowrap;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  .project-filters button{
    flex:0 0 auto;
    min-height:38px;
    padding:7px 11px;
    gap:6px;
    border-radius:999px;
    font-size:.75rem;
    line-height:1;
    white-space:nowrap;
    scroll-snap-align:start;
  }
  .project-filters button::after{
    min-width:17px;
    height:17px;
    padding:0 4px;
    font-size:.6rem;
  }

  /* Services quick navigation: lighter, shorter tabs; long labels may wrap to two lines. */
  .service-jump{top:64px}
  .service-jump .container{
    gap:5px;
    padding:7px 14px;
    align-items:center;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  .service-jump a{
    flex:0 0 auto;
    max-width:168px;
    min-height:34px;
    padding:7px 10px;
    border-radius:14px;
    font-size:.68rem;
    line-height:1.18;
    letter-spacing:.01em;
    white-space:normal;
    text-align:center;
    scroll-snap-align:start;
  }

  /* Service detail scope: compact cards instead of desktop-height tiles. */
  .service-detail-page>.page-hero+.section{padding:48px 0}
  .service-detail-page>.page-hero+.section .section-head{
    gap:14px;
    margin-bottom:22px;
  }
  .service-detail-page>.page-hero+.section .section-head h2{
    max-width:13ch;
    font-size:clamp(2rem,8.2vw,2.55rem);
    line-height:1.04;
  }
  .service-detail-page>.page-hero+.section .section-head>p{
    max-width:34ch;
    font-size:.95rem;
    line-height:1.55;
  }
  .deliverable-grid{grid-template-columns:1fr !important}
  .deliverable-card{
    min-height:0 !important;
    padding:18px 18px !important;
    display:flex;
    align-items:center;
  }
  .deliverable-card span{margin:0 12px 0 0}
  .deliverable-card strong{font-size:.92rem;line-height:1.4}

  /* Homepage proof: compact editorial metric rows instead of four tall cards. */
  .proof-results .section-head{gap:14px;margin-bottom:24px}
  .proof-results .section-head h2{
    font-size:clamp(2.15rem,9vw,2.85rem);
    line-height:1.02;
  }
  .proof-results-grid{grid-template-columns:1fr !important}
  .proof-result{
    min-height:0 !important;
    padding:18px !important;
    display:grid;
    grid-template-columns:minmax(92px,.38fr) minmax(0,1fr);
    align-items:center;
    gap:14px 18px;
  }
  .proof-result strong{
    font-size:clamp(1.8rem,8.2vw,2.4rem);
    line-height:.95;
    letter-spacing:-.045em;
  }
  .proof-result span{
    max-width:none;
    font-size:.8rem;
    line-height:1.45;
  }
}

/* Service and case-study reference links, 2026-09-18 */
.service-expertise-compact{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}
.service-expertise-inner{display:grid;grid-template-columns:minmax(220px,.62fr) minmax(0,1.38fr);gap:48px;align-items:start}
.service-expertise-inner h2{margin:0;font-size:clamp(1.65rem,2.8vw,2.65rem);line-height:1.08;letter-spacing:-.035em}
.service-expertise-inner>div:last-child>p{margin:0;color:var(--muted);line-height:1.65}
.service-expertise-inner .founder-proof-list{margin-top:18px}
.case-decision{padding-top:22px;padding-bottom:22px}
.case-decision-inner{display:grid;grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr);gap:48px;align-items:start;padding-top:28px;padding-bottom:28px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.case-decision .eyebrow{margin:0 0 9px;color:var(--muted)}
.case-decision h2{margin:0;font-size:clamp(1.5rem,2.6vw,2.35rem);line-height:1.1;letter-spacing:-.035em}
.case-decision-copy{margin:0;color:var(--muted);font-size:1rem;line-height:1.7;max-width:760px}
@media(max-width:700px){.service-expertise-inner,.case-decision-inner{grid-template-columns:1fr;gap:18px}.service-expertise-inner h2,.case-decision h2{font-size:clamp(1.55rem,7vw,2rem)}.service-expertise-inner .founder-proof-list{grid-template-columns:1fr 1fr}.service-expertise-inner .founder-proof-list span{min-height:40px}.case-decision{padding-top:10px;padding-bottom:10px}.case-decision-inner{padding-top:22px;padding-bottom:22px}.case-decision-copy{font-size:.95rem;line-height:1.62}}
@media(max-width:430px){.service-expertise-inner .founder-proof-list{grid-template-columns:1fr}}


/* Studio 911 reference refinement, 2026-09-18 */
.service-handover{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface-elevated)}
.service-handover-inner{display:grid;grid-template-columns:minmax(150px,.28fr) minmax(0,1.72fr);gap:36px;align-items:start}
.service-handover-intro .eyebrow{margin:5px 0 0}
.service-handover-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-left:1px solid var(--border)}
.service-handover-item{min-width:0;padding:4px 26px 4px;border-right:1px solid var(--border)}
.service-handover-item strong{display:block;margin-bottom:9px;font-size:.9rem;line-height:1.3}
.service-handover-item p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.58}
@media(max-width:900px){.service-handover-inner{grid-template-columns:1fr;gap:16px}.service-handover-grid{border-left:0;border-top:1px solid var(--border)}.service-handover-item{padding:18px 0;border-right:0;border-bottom:1px solid var(--border)}.service-handover-item:last-child{border-bottom:0}}
@media(max-width:700px){.service-handover{padding-top:30px;padding-bottom:30px}.service-handover-inner{gap:12px}.service-handover-grid{grid-template-columns:1fr}.service-handover-item{padding:15px 0}.service-handover-item strong{margin-bottom:5px;font-size:.88rem}.service-handover-item p{font-size:.79rem;line-height:1.5}}


/* Krealabs reference refinement, 2026-09-18 */
.service-tech-clarity{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}
.service-tech-inner{display:grid;grid-template-columns:minmax(210px,.48fr) minmax(0,1.52fr);gap:42px;align-items:start}
.service-tech-intro .eyebrow{margin:0 0 10px}
.service-tech-intro>p:last-child{margin:0;color:var(--muted);font-size:.9rem;line-height:1.6;max-width:360px}
.service-tech-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-left:1px solid var(--border)}
.service-tech-item{min-width:0;padding:3px 24px;border-right:1px solid var(--border)}
.service-tech-item strong{display:block;margin-bottom:8px;font-size:.9rem;line-height:1.32}
.service-tech-item p{margin:0;color:var(--muted);font-size:.81rem;line-height:1.55}
@media(max-width:900px){.service-tech-inner{grid-template-columns:1fr;gap:18px}.service-tech-intro>p:last-child{max-width:680px}.service-tech-grid{border-left:0;border-top:1px solid var(--border)}.service-tech-item{padding:18px 18px 18px 0}}
@media(max-width:700px){.service-tech-clarity{padding-top:30px;padding-bottom:30px}.service-tech-inner{gap:14px}.service-tech-grid{grid-template-columns:1fr}.service-tech-item{padding:15px 0;border-right:0;border-bottom:1px solid var(--border)}.service-tech-item:last-child{border-bottom:0}.service-tech-item strong{margin-bottom:5px;font-size:.88rem}.service-tech-item p{font-size:.79rem;line-height:1.5}}

/* Compact desktop navigation with Pricing added, 2026-09-18 */
@media (min-width:960px) and (max-width:1120px){
  .site-nav,html.js .site-nav{gap:14px}
  .site-nav a,html.js .site-nav a{font-size:.70rem}
  .site-nav .nav-cta{padding:8px 10px}
  .nav-wrap{gap:8px}
}

/* W3C validation badge in the compact footer strip. */
.footer-validation-v5 {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  line-height: 0;
}
.footer-validation-v5 img {
  display: block;
  width: 88px;
  height: 31px;
  border: 0;
}
@media (max-width: 700px) {
  .footer-validation-v5 { align-self: flex-start; margin-top: 4px; }
}

/* CALYNEVO wordmark logo — header/footer only */
.brand-logo-link{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  line-height:0;
}
.site-header .brand-logo{
  display:block;
  width:150px;
  height:auto;
  max-width:none;
}
.site-header .brand-logo--dark{display:none;}
html[data-theme="dark"] .site-header .brand-logo--light{display:none;}
html[data-theme="dark"] .site-header .brand-logo--dark{display:block;}
.site-footer .brand-logo-link--footer{
  display:inline-flex;
  margin:0 0 14px;
  line-height:0;
}
.site-footer .footer-logo{
  display:block;
  width:230px;
  height:auto;
  max-width:100%;
}
@media(max-width:700px){
  .site-header .brand-logo{width:128px;}
  .site-footer .footer-logo{width:210px;}
}
@media(max-width:359px){
  .site-header .brand-logo{width:118px;}
}

/* Hero supporting copy readability refinement, 2026-09-24.
   Scope: only the supporting paragraph on image-backed page heroes. */
.cal-hero-media.page-hero .page-intro-grid > .lead,
.cal-hero-media.page-hero .page-intro-grid > :last-child > .lead {
  color: #242825 !important;
  font-size: clamp(1.22rem, 1.06rem + .48vw, 1.55rem);
  line-height: 1.55;
  font-weight: 500;
}
html[data-theme="dark"] .cal-hero-media.page-hero .page-intro-grid > .lead,
html[data-theme="dark"] .cal-hero-media.page-hero .page-intro-grid > :last-child > .lead {
  color: #f5f1e9 !important;
}
@media (max-width: 700px) {
  .cal-hero-media.page-hero .page-intro-grid > .lead,
  .cal-hero-media.page-hero .page-intro-grid > :last-child > .lead {
    font-size: 1.125rem;
    line-height: 1.55;
  }
}


/* CALYNEVO v0.7.14: verified testimonials and clearer enquiry guidance. */
.cal-testimonials{background:var(--soft)}
.cal-testimonial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.cal-testimonial-card{display:flex;flex-direction:column;gap:22px;padding:clamp(24px,3vw,38px);border:1px solid var(--line);background:var(--surface-elevated);box-shadow:var(--shadow-1)}
.cal-testimonial-person{display:flex;align-items:center;gap:15px}.cal-testimonial-person img{width:64px;height:64px;border-radius:50%;object-fit:cover}.cal-testimonial-person h2,.cal-testimonial-person h3{margin:0}.cal-testimonial-person p{margin:4px 0 0;color:var(--muted);font-size:.86rem}
.cal-testimonial-card blockquote{margin:0;color:var(--ink);font-size:clamp(1.06rem,1rem + .35vw,1.3rem);line-height:1.65;letter-spacing:-.015em}
.cal-testimonial-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto}.cal-testimonial-tags span{padding:6px 9px;border:1px solid var(--line);background:var(--soft);color:var(--muted);font-size:.72rem;font-weight:750}
.cal-testimonial-card .text-link{align-self:flex-start}.cal-case-testimonial{padding-top:0}.cal-testimonial-card--single{max-width:920px;margin-inline:auto}
.plan-choice-standalone{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.plan-choice-standalone .plan-choice{width:100%;height:100%}.plan-choice--guidance{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--surface-elevated))}
.response-time-note{margin:2px 0 16px;padding:14px 16px;border-left:3px solid var(--accent);background:var(--soft);color:var(--muted);font-size:.88rem}.response-time-note strong{color:var(--ink)}
@media(max-width:700px){.cal-testimonial-grid,.plan-choice-standalone{grid-template-columns:1fr}.cal-testimonial-card{padding:24px}.cal-testimonial-person img{width:56px;height:56px}}

/* ==========================================================================
   CALYNEVO v0.7.16 - Project testimonial refinement
   Scope: ONLY the testimonial block used on DressYourBody and Afghan Community
   project case-study pages. Homepage testimonials are intentionally untouched.
   ========================================================================== */

.cal-case-testimonial{
  padding:clamp(52px,6vw,76px) 0;
  background:var(--soft);
  border-top:1px solid var(--line);
}
.cal-case-testimonial .cal-testimonial-card--single{
  max-width:920px;
  margin-inline:auto;
  padding:clamp(26px,3vw,34px);
  gap:22px;
  border:1px solid var(--line);
  border-radius:4px;
  background:var(--surface-elevated);
  color:var(--ink);
  box-shadow:0 12px 30px rgba(18,28,21,.055);
}
.cal-case-testimonial .cal-testimonial-person{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.cal-case-testimonial .cal-testimonial-person img{
  display:block;
  flex:0 0 58px;
  width:58px!important;
  height:58px!important;
  max-width:58px!important;
  min-width:58px!important;
  aspect-ratio:1;
  border-radius:50%;
  object-fit:cover;
}
.cal-case-testimonial .cal-testimonial-person>div{
  min-width:0;
}
.cal-case-testimonial .cal-testimonial-person .eyebrow{
  margin:0 0 7px;
}
.cal-case-testimonial .cal-testimonial-person h2{
  margin:0!important;
  font-size:clamp(2rem,2.5vw,2.4rem)!important;
  line-height:1.06!important;
  letter-spacing:-.035em;
  font-weight:500;
}
.cal-case-testimonial .cal-testimonial-person p:last-child{
  margin:7px 0 0;
  color:var(--muted);
  font-size:.84rem;
  line-height:1.4;
}
.cal-case-testimonial .cal-testimonial-card blockquote{
  max-width:72ch;
  margin:0;
  color:var(--ink);
  font-size:clamp(1.05rem,1rem + .22vw,1.18rem);
  line-height:1.65;
  letter-spacing:-.012em;
}

/* Mobile: compact premium card, small circular portrait, full quote retained. */
@media(max-width:700px){
  .cal-case-testimonial{
    padding:40px 0;
  }
  .cal-case-testimonial .cal-testimonial-card--single{
    gap:18px;
    padding:20px;
    border-radius:3px;
    box-shadow:0 8px 22px rgba(18,28,21,.045);
  }
  .cal-case-testimonial .cal-testimonial-person{
    gap:12px;
    align-items:center;
  }
  .cal-case-testimonial .cal-testimonial-person img{
    flex-basis:52px;
    width:52px!important;
    height:52px!important;
    max-width:52px!important;
    min-width:52px!important;
  }
  .cal-case-testimonial .cal-testimonial-person .eyebrow{
    margin-bottom:5px;
  }
  .cal-case-testimonial .cal-testimonial-person h2{
    font-size:clamp(1.7rem,7.1vw,1.9rem)!important;
    line-height:1.08!important;
  }
  .cal-case-testimonial .cal-testimonial-person p:last-child{
    margin-top:5px;
    font-size:.78rem;
  }
  .cal-case-testimonial .cal-testimonial-card blockquote{
    max-width:none;
    font-size:1rem;
    line-height:1.62;
  }
}

@media(max-width:380px){
  .cal-case-testimonial .cal-testimonial-card--single{
    padding:18px;
  }
  .cal-case-testimonial .cal-testimonial-person img{
    flex-basis:48px;
    width:48px!important;
    height:48px!important;
    max-width:48px!important;
    min-width:48px!important;
  }
  .cal-case-testimonial .cal-testimonial-person h2{
    font-size:1.62rem!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .cal-case-testimonial .cal-testimonial-card--single{
    transition:none!important;
  }
}