/* Canto: one shared palette, type system and layout for the institutional site. */
:root{
  --canto-night:#05070a;
  --canto-hero:#090d14;
  --canto-navy:#101c38;
  --canto-paper:#f2f1ec;
  --canto-white:#fff;
  --canto-ink:#101c38;
  --canto-muted:#4b5563;
  --canto-subtle:#596575;
  --canto-silver:#cdd2da;
  --canto-silver-dim:#b8c0cd;
  --canto-silver-faint:#a9b3c2;
  --canto-on-dark:#f3f4f6;
  --canto-line-light:rgba(16,28,56,.16);
  --canto-line-light-strong:rgba(16,28,56,.32);
  --canto-line-dark:rgba(205,210,218,.16);
  --canto-line-dark-strong:rgba(205,210,218,.32);
  --canto-font:'Jost',-apple-system,sans-serif;
  --canto-width:1180px;
  --canto-gutter:clamp(20px,5vw,64px);
  --canto-space-sm:16px;
  --canto-space-md:24px;
  --canto-space-lg:40px;
  --canto-section:clamp(64px,8vw,112px);
  --canto-button-radius:4px;
  --bg:var(--canto-night);--navy:var(--canto-navy);
  --white:var(--canto-on-dark);--silver:var(--canto-silver);
  --silver-dim:var(--canto-silver-dim);--silver-faint:var(--canto-silver-faint);
  --line:var(--canto-line-dark);--line-strong:var(--canto-line-dark-strong);
  --display:var(--canto-font);--body:var(--canto-font);
  --maxw:var(--canto-width);--gutter:var(--canto-gutter);
}
html,body{overflow-x:clip}
.wrap,.hero-inner{max-width:var(--canto-width);padding-inline:var(--canto-gutter)}
.section{padding-block:var(--canto-section)}
h1,h2{min-width:0;overflow-wrap:break-word;text-wrap:balance}
.micro{font-family:var(--canto-font);letter-spacing:0;font-size:14px}
/* The same shape and feedback on every Canto action. */
.btn,.hero .btn-primary,#diagnostico .home-questionnaire .btn{
  border-radius:var(--canto-button-radius);clip-path:none;
  min-height:50px;box-shadow:none;
  transition:background-color .18s ease,border-color .18s ease;
}
.hero .btn-primary{background:var(--canto-on-dark);border:1px solid var(--canto-on-dark)}
.hero .btn-primary:hover{background:var(--canto-white);border-color:var(--canto-white);box-shadow:none;transform:none}
.btn-primary:hover,.hero .btn-primary:active{transform:none}
.btn:active{filter:brightness(.93)}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.btn:disabled{background:var(--canto-muted);color:var(--canto-white);cursor:not-allowed}
.btn-arrow,.btn:hover .btn-arrow{transform:none;transition:none}
.attention-canvas{opacity:1}
@media(max-width:639px){.attention-canvas{opacity:.95}}
.hero h1 .hero-line-secondary{color:inherit}
.service-row,.service-row:hover{padding-left:0;transition:none}
#diagnostico{
  background:var(--canto-white);color:var(--canto-ink);
  --bg:var(--canto-white);--white:var(--canto-ink);
  --silver-dim:var(--canto-muted);--silver-faint:var(--canto-subtle);
  --accent:var(--canto-navy);--line:var(--canto-line-light);--line-strong:var(--canto-line-light-strong);
}
#diagnostico > .wrap{max-width:var(--canto-width);width:100%;padding-inline:var(--canto-gutter);padding-block:0}
#diagnostico .form-panel{max-width:720px;padding-inline:0}
#diagnostico .btn-primary{background:var(--canto-navy);color:var(--canto-white)}
#diagnostico .btn:disabled{background:var(--canto-muted);color:var(--canto-white);opacity:.65;cursor:not-allowed}
#diagnostico .home-questionnaire .micro{font-family:var(--canto-font)}
@media(prefers-reduced-motion:reduce){.btn,.hero .btn-primary{transition:none}}

/* Real client evidence: an editorial introduction beside measured results. */
.client-case{background:var(--canto-night);color:var(--canto-on-dark)}
.case-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px)}
.case-intro .h2{max-width:18ch}
.case-location{margin-top:var(--canto-space-sm);color:var(--canto-silver-dim)}
.case-intro .lede{margin-top:var(--canto-space-md);max-width:42ch}
.case-draft-note{margin-top:var(--canto-space-md);font-size:14px;color:var(--canto-silver-dim);max-width:44ch}
.case-results{margin:0}
.case-results>div{display:flex;flex-direction:column-reverse;gap:8px;padding:var(--canto-space-md) 0;border-bottom:1px solid var(--canto-line-dark)}
.case-results>div:first-child{padding-top:0}
.case-results dt{font-size:16px;line-height:1.5;color:var(--canto-silver-dim);max-width:36ch}
.case-results dd{margin:0;font-size:clamp(40px,5vw,64px);line-height:1.1;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.case-results .case-investment dd{font-size:clamp(24px,3vw,32px)}
.case-source{margin-top:var(--canto-space-lg);max-width:75ch;color:var(--canto-silver-dim);font-size:14px;line-height:1.6}
.case-source summary{cursor:pointer;width:fit-content;padding-block:8px;text-decoration:underline;text-underline-offset:4px}
.case-source summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.case-source p{margin-top:12px}
.case-media[hidden]{display:none}
.case-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--canto-space-md);margin-top:var(--canto-space-lg)}
.case-media figure{margin:0}
.case-media img,.case-media video{display:block;width:100%;height:auto;border-radius:var(--canto-button-radius)}
.case-media figcaption{margin-top:12px;color:var(--canto-silver-dim);font-size:14px}
@media(max-width:759px){.case-layout{grid-template-columns:minmax(0,1fr)}.case-media{grid-template-columns:minmax(0,1fr)}}

.motion-toggle{position:fixed;right:16px;bottom:90px;z-index:110;background:var(--canto-night);color:var(--canto-on-dark);border:1px solid var(--canto-silver-faint);border-radius:4px;padding:10px 14px;font:14px var(--canto-font)}
.motion-toggle[hidden]{display:none}
.calendar-fallback{display:inline-block;margin-block:16px;text-decoration:underline}
.motion-paused .reveal,.motion-paused #metodo .section-head,.motion-paused #metodo .bigidea-copy{opacity:1!important;transform:none!important;transition:none!important}

/* Neutral hero tones reduce the blue cast across displays. */
.hero .lede{color:#bfbfbf}

/* Opaque header action stays legible over the moving hero. */
@media(min-width:640px){
  .site-header .header-cta{background:#f3f4f6;color:#090d14;border-color:#f3f4f6}
  .site-header .header-cta:hover{background:#fff;color:#090d14;border-color:#fff}
}