/* CAREKA DIGITAL — MASTER SYSTEM V110
   V109.4 SAFE MEDIA + GLOBAL FOOTER preserved verbatim as foundation.
   Adds unified tokens, touch ergonomics, responsive safety and adaptive rendering.

   FOUNDATION:
   SAFE MEDIA FRAMING + GLOBAL FOOTER REFINEMENT
   Escopo fechado: enquadramento de mídia de projetos + footer global + CTA final da Home.
   Sem reconstrução de DOM, sem JS novo, sem alteração de conteúdo fora do rodapé. */

/* ============================================================
   01. SAFE MEDIA — project / case imagery
   ============================================================ */
.careka-v106-home .project-media,
.careka-final-project .media{
  --media-fit:contain;
  --media-x:50%;
  --media-y:50%;
  background:
    radial-gradient(circle at 50% 44%,rgba(211,162,93,.035),transparent 38%),
    linear-gradient(180deg,#080808,#050505)!important;
}

/* Home portfolio: these frames contain website/UI/brand captures. Integrity wins over crop. */
.careka-v106-home .project-media{
  display:grid!important;
  place-items:center!important;
}
.careka-v106-home .project-media img{
  width:100%!important;
  height:100%!important;
  padding:clamp(6px,.55vw,10px)!important;
  object-fit:var(--media-fit)!important;
  object-position:var(--media-x) var(--media-y)!important;
  transform:none!important;
  filter:none!important;
}
.careka-v106-home .project-media:hover img{transform:none!important}
.careka-v106-home .project-media::after{
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.10))!important;
}

/* Public project cases: show the complete project image, never an arbitrary 16:10 crop. */
.careka-final-project .media{
  display:grid!important;
  place-items:center!important;
  padding:clamp(8px,.8vw,14px)!important;
}
.careka-final-project .media img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  max-height:min(72vh,820px)!important;
  aspect-ratio:auto!important;
  object-fit:var(--media-fit)!important;
  object-position:var(--media-x) var(--media-y)!important;
  transform:none!important;
  filter:none!important;
}

/* The editorial/blog photography remains untouched: it was designed to behave as photography,
   while the project/case surfaces above are screenshot/brand-art families. */

/* ============================================================
   02. HOME FINAL-CONTACT CTA — same premium language as footer
   ============================================================ */
.careka-v106-home .contact-link{
  position:relative!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.005))!important;
  color:#f3efe8!important;
  border:1px solid rgba(211,162,93,.32)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  min-height:48px!important;
  padding-inline:18px!important;
  letter-spacing:.085em!important;
  transition:border-color .22s ease,background-color .22s ease,color .22s ease,transform .22s ease!important;
}
.careka-v106-home .contact-link::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:42px;
  height:1px;
  background:#d3a25d;
  opacity:.72;
}
.careka-v106-home .contact-link:hover{
  border-color:rgba(228,189,128,.62)!important;
  background:rgba(211,162,93,.035)!important;
  color:#fff!important;
  transform:translateY(-1px)!important;
}
.careka-v106-home .contact-link:focus-visible{
  outline:1px solid rgba(228,189,128,.78)!important;
  outline-offset:5px!important;
}

/* ============================================================
   03. GLOBAL FOOTER — identical component on all 56 canonical pages
   ============================================================ */
.careka-global-footer{
  --gf-bg:#050505;
  --gf-paper:#f3efe8;
  --gf-muted:rgba(243,239,232,.60);
  --gf-faint:rgba(243,239,232,.38);
  --gf-gold:#d3a25d;
  --gf-gold2:#e4bd80;
  --gf-line:rgba(255,255,255,.075);
  --gf-gold-line:rgba(211,162,93,.22);
  position:relative;
  isolation:isolate;
  width:100%;
  margin-top:clamp(72px,8vw,128px);
  background:var(--gf-bg)!important;
  color:var(--gf-paper)!important;
  border-top:1px solid var(--gf-line)!important;
  font-family:Inter,"Helvetica Neue",Arial,sans-serif;
}
.careka-global-footer::before{
  content:"";
  position:absolute;
  z-index:1;
  top:-1px;
  left:max(var(--cd-gutter,24px),calc((100% - var(--cd-max,1600px))/2));
  width:clamp(56px,8vw,126px);
  height:1px;
  background:linear-gradient(90deg,var(--gf-gold),rgba(211,162,93,.08));
  pointer-events:none;
}
.careka-global-footer *,
.careka-global-footer *::before,
.careka-global-footer *::after{box-sizing:border-box}
.careka-global-footer a{color:inherit}
.careka-global-footer__shell,
.careka-global-footer__bottom{
  width:min(var(--cd-max,1600px),calc(100% - (2 * var(--cd-gutter,clamp(20px,3.55vw,72px)))));
  margin-inline:auto;
}
.careka-global-footer__shell{
  display:grid;
  grid-template-columns:minmax(220px,1.05fr) minmax(150px,.62fr) minmax(210px,.78fr) minmax(260px,1.08fr);
  gap:clamp(28px,4vw,72px);
  align-items:start;
  padding:clamp(46px,5.4vw,82px) 0 clamp(38px,4.4vw,66px);
}
.careka-global-footer__brandlink{
  display:inline-flex;
  align-items:center;
  gap:13px;
  text-decoration:none;
}
.careka-global-footer__brandlink img{
  display:block;
  width:40px!important;
  height:40px!important;
  flex:0 0 40px;
  object-fit:cover!important;
  border:1px solid rgba(211,162,93,.18);
}
.careka-global-footer__brandlink span{display:grid;gap:3px}
.careka-global-footer__brandlink strong{
  color:var(--gf-paper);
  font-size:11px;
  line-height:1;
  letter-spacing:.17em;
  font-weight:700;
}
.careka-global-footer__brandlink small{
  color:var(--gf-faint);
  font-size:7px;
  line-height:1.2;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.careka-global-footer__brand>p{
  margin:13px 0 0;
  color:var(--gf-muted)!important;
  font-size:9px!important;
  line-height:1.5!important;
}
.careka-global-footer__nav{display:grid!important;gap:12px!important;align-content:start!important}
.careka-global-footer__nav a{
  position:relative;
  width:max-content;
  max-width:100%;
  color:var(--gf-muted)!important;
  text-decoration:none!important;
  font-size:9px!important;
  font-weight:500!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
  transition:color .2s ease!important;
}
.careka-global-footer__nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-5px;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,var(--gf-gold),transparent);
  transform:scaleX(0);
  transform-origin:left;
  opacity:.75;
  transition:transform .2s ease;
}
.careka-global-footer__nav a:hover{color:#fff!important}
.careka-global-footer__nav a:hover::after{transform:scaleX(1)}
.careka-global-footer__meta{display:grid;gap:6px;align-content:start}
.careka-global-footer__meta .careka-global-footer__eyebrow{
  margin-bottom:6px;
  color:var(--gf-gold)!important;
  font-size:7px!important;
  font-weight:600;
  letter-spacing:.16em!important;
  text-transform:uppercase;
}
.careka-global-footer__meta strong{
  color:var(--gf-paper)!important;
  font-size:11px!important;
  font-weight:500!important;
  line-height:1.35!important;
}
.careka-global-footer__meta>span:not(.careka-global-footer__eyebrow){
  color:var(--gf-faint)!important;
  font-size:8px!important;
  line-height:1.55!important;
}
.careka-global-footer__actions{display:grid;gap:14px;justify-items:stretch}
.careka-global-footer__cta{
  position:relative;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:48px!important;
  padding:0 16px!important;
  overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.005))!important;
  border:1px solid rgba(211,162,93,.30)!important;
  color:var(--gf-paper)!important;
  text-decoration:none!important;
  font-size:8px!important;
  font-weight:650!important;
  letter-spacing:.095em!important;
  text-transform:uppercase!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:border-color .22s ease,background-color .22s ease,color .22s ease,transform .22s ease!important;
}
.careka-global-footer__cta::before{
  content:"";
  position:absolute;
  top:-1px;
  left:-1px;
  width:40px;
  height:1px;
  background:var(--gf-gold2);
  opacity:.75;
}
.careka-global-footer__cta i{
  color:var(--gf-gold2)!important;
  font-style:normal!important;
  font-size:11px!important;
  transition:transform .22s ease!important;
}
.careka-global-footer__cta:hover{
  border-color:rgba(228,189,128,.62)!important;
  background:rgba(211,162,93,.035)!important;
  color:#fff!important;
  transform:translateY(-1px)!important;
}
.careka-global-footer__cta:hover i{transform:translate(1px,-1px)}
.careka-global-footer__top{
  display:inline-flex!important;
  align-items:center!important;
  justify-self:end;
  gap:8px!important;
  color:var(--gf-muted)!important;
  text-decoration:none!important;
  font-size:8px!important;
  font-weight:650!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
  transition:color .2s ease!important;
}
.careka-global-footer__top>span{
  width:28px;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--gf-gold));
  opacity:.52;
  transition:width .2s ease,opacity .2s ease;
}
.careka-global-footer__top b{font:inherit!important;color:inherit!important}
.careka-global-footer__top i{
  color:var(--gf-gold2)!important;
  font-style:normal!important;
  transition:transform .2s ease!important;
}
.careka-global-footer__top:hover{color:#fff!important}
.careka-global-footer__top:hover>span{width:36px;opacity:.9}
.careka-global-footer__top:hover i{transform:translateY(-1px)}
.careka-global-footer__bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:17px 0 22px;
  border-top:1px solid var(--gf-line);
  color:var(--gf-faint)!important;
  font-size:7px!important;
  line-height:1.5!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}
.careka-global-footer a:focus-visible{
  outline:1px solid rgba(228,189,128,.78)!important;
  outline-offset:5px!important;
}

/* Retire visually obsolete family footers if stale CSS/markup survives outside canonical paths. */
.careka-final .ckEditorialFooter,
.careka-final-project .case-site-foot{display:none!important}

@media(max-width:1100px){
  .careka-global-footer__shell{grid-template-columns:1fr 1fr;gap:36px 48px}
  .careka-global-footer__actions{justify-items:start}
  .careka-global-footer__top{justify-self:start}
}
@media(max-width:680px){
  .careka-global-footer{margin-top:64px}
  .careka-global-footer__shell{grid-template-columns:1fr;gap:28px;padding:42px 0 34px}
  .careka-global-footer__nav{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px 20px!important}
  .careka-global-footer__cta{width:100%}
  .careka-global-footer__bottom{align-items:flex-start;flex-direction:column;gap:7px}
  .careka-v106-home .project-media img{padding:4px!important}
  .careka-final-project .media{padding:6px!important}
  .careka-final-project .media img{max-height:none!important}
}
@media(prefers-reduced-motion:reduce){
  .careka-global-footer *,
  .careka-v106-home .contact-link{transition:none!important;animation:none!important}
}


/* ============================================================
   04. MASTER DESIGN SYSTEM — reconciled with Home V106
   ============================================================ */
:root{
  --cd-touch:44px;
  --cd-motion-fast:180ms;
  --cd-motion-normal:260ms;
  --cd-motion-slow:420ms;
  --cd-motion-ease:cubic-bezier(.22,1,.36,1);
  --cd-space-1:clamp(6px,.45vw,8px);
  --cd-space-2:clamp(10px,.8vw,14px);
  --cd-space-3:clamp(16px,1.2vw,20px);
  --cd-space-4:clamp(22px,1.8vw,30px);
  --cd-space-5:clamp(32px,2.7vw,46px);
  --cd-space-6:clamp(48px,4.2vw,72px);
  --cd-space-7:clamp(72px,6.5vw,112px);
}

/* Internal families inherit the exact Home reference neutrals. */
body.careka-final{
  --cd-muted:rgba(243,239,232,.62);
  --cd-faint:rgba(243,239,232,.38);
  --cd-line:rgba(255,255,255,.075);
  --cd-line-gold:rgba(211,162,93,.25);
  --cd-gutter:clamp(24px,3.55vw,72px);
  --cd-header:78px;
}

/* Text/rendering safety shared across the public product. */
html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-padding-top:var(--cd-header,78px);
}
:where(.careka-v106-home,body.careka-final){
  overflow-wrap:normal;
}
:where(.careka-v106-home,body.careka-final) :where(h1,h2,h3){
  text-wrap:balance;
}
:where(.careka-v106-home,body.careka-final) :where(p,li,figcaption){
  text-wrap:pretty;
}
:where(.careka-v106-home,body.careka-final) :where(img,svg,video,canvas){
  max-inline-size:100%;
}
:where(.careka-v106-home,body.careka-final) :where(.project-copy,.ckBlogHero__copy,.ckArticleHero__copy,.ckContentHero__grid>*,
  .ckArticleLayout>*,.grid>*,.careka-global-footer__shell>*){
  min-width:0;
}

/* Shared focus contract. */
:where(.careka-v106-home,body.careka-final,.careka-global-footer) :where(a,button,input,textarea,select,summary):focus-visible{
  outline:1px solid rgba(228,189,128,.86)!important;
  outline-offset:4px!important;
}

/* Internal header/navigation targets that were still at 42px. */
body.careka-final .ck-header-v75__cta,
body.careka-final-project .backlink,
body.articlePage .ckSideCta a,
body.blogEditorial .ckOfficialNav .nav-link{
  min-height:44px!important;
}

/* ============================================================
   05. SAFE AREAS + FLUID RESPONSIVE CONTRACT
   ============================================================ */
.careka-v106-home .site-header{
  padding-left:max(var(--cd-gutter),env(safe-area-inset-left))!important;
  padding-right:max(var(--cd-gutter),env(safe-area-inset-right))!important;
}
body.careka-final .ck-header-v75{
  padding-left:max(var(--cd-gutter),env(safe-area-inset-left))!important;
  padding-right:max(var(--cd-gutter),env(safe-area-inset-right))!important;
}
.careka-global-footer__shell,
.careka-global-footer__bottom{
  max-width:calc(100% - env(safe-area-inset-left) - env(safe-area-inset-right));
}

/* Touch ergonomics: visual density stays minimal; hit areas grow only where touch needs them. */
@media (hover:none),(pointer:coarse){
  .careka-v106-home .icon-button{
    min-width:var(--cd-touch)!important;
    min-height:var(--cd-touch)!important;
  }
  .careka-v106-home :where(.service-open,.editorial-filters button,.pillar-rail button,.menu-toggle){
    min-height:var(--cd-touch)!important;
  }
  .careka-global-footer__brandlink,
  .careka-global-footer__nav a,
  .careka-global-footer__top{
    min-height:var(--cd-touch)!important;
    display:flex!important;
    align-items:center!important;
  }
  body.careka-final .ck-v75-menu-card{
    min-height:48px!important;
  }
  body.careka-final-project .backlink,
  body.articlePage .ckSideCta a{
    min-height:var(--cd-touch)!important;
  }
}

@media(max-width:980px){
  body.careka-final{
    --cd-header:70px;
    --cd-gutter:clamp(18px,4.5vw,36px);
  }
}
@media(max-width:620px){
  body.careka-final{
    --cd-gutter:20px;
  }
}
@media(max-width:390px){
  .careka-global-footer__nav{
    grid-template-columns:1fr!important;
  }
  .careka-global-footer__shell{
    gap:24px!important;
  }
}

/* ============================================================
   06. PERFORMANCE-FIRST VISUAL BASE
   Default experience is complete and premium, but avoids costly compositing.
   Enhanced/Premium tiers restore richer effects after capability checks.
   ============================================================ */

/* Base tier: opaque sticky surfaces avoid continuous backdrop recomposition
   without changing brand contrast or hierarchy. */
.site-header,
body.careka-final .ck-header-v75,
body.careka-final-project .topbar{
  background:rgba(8,8,8,.985)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Expensive dialog blur is decorative only. */
html:not(.cd-cap-enhanced):not(.cd-cap-premium) .service-dialog::backdrop,
html:not(.cd-cap-enhanced):not(.cd-cap-premium) .all-projects-dialog::backdrop{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Enhanced surfaces: restrained blur, never animated. */
html.cd-cap-enhanced .site-header,
html.cd-cap-premium .site-header{
  background:rgba(8,8,8,.92)!important;
  backdrop-filter:blur(14px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.08)!important;
}
html.cd-cap-enhanced body.careka-final .ck-header-v75,
html.cd-cap-premium body.careka-final .ck-header-v75,
html.cd-cap-enhanced body.careka-final-project .topbar,
html.cd-cap-premium body.careka-final-project .topbar{
  background:rgba(8,8,8,.94)!important;
  backdrop-filter:blur(14px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.08)!important;
}
html.cd-cap-enhanced .service-dialog::backdrop,
html.cd-cap-premium .service-dialog::backdrop,
html.cd-cap-enhanced .all-projects-dialog::backdrop,
html.cd-cap-premium .all-projects-dialog::backdrop{
  backdrop-filter:blur(5px)!important;
  -webkit-backdrop-filter:blur(5px)!important;
}

/* ============================================================
   07. MOTION HIERARCHY
   Base: functional transitions only.
   Premium: a few high-value, transform/opacity-only microdetails.
   ============================================================ */
@media (hover:hover) and (pointer:fine){
  html.cd-cap-premium .careka-global-footer__cta,
  html.cd-cap-premium .careka-v106-home .contact-link,
  html.cd-cap-premium body.blogEditorial .ckPostCard,
  html.cd-cap-premium body.careka-final-project .panel{
    transition:
      transform var(--cd-motion-normal) var(--cd-motion-ease),
      border-color var(--cd-motion-fast) ease,
      background-color var(--cd-motion-fast) ease,
      color var(--cd-motion-fast) ease!important;
  }

  html.cd-cap-premium body.blogEditorial .ckPostCard:hover{
    transform:translateY(-2px)!important;
  }
  html.cd-cap-premium body.careka-final-project .panel:hover{
    transform:translateY(-1px)!important;
  }
  html.cd-cap-premium .careka-v106-home .project-media{
    transition:border-color var(--cd-motion-fast) ease,background-color var(--cd-motion-fast) ease!important;
  }
  html.cd-cap-premium .careka-v106-home .project-media:hover{
    border-color:rgba(211,162,93,.28)!important;
  }
}

/* Reduced motion is an explicit user preference and outranks every tier. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  :where(.careka-v106-home,body.careka-final,.careka-global-footer) *,
  :where(.careka-v106-home,body.careka-final,.careka-global-footer) *::before,
  :where(.careka-v106-home,body.careka-final,.careka-global-footer) *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    transition-delay:0ms!important;
  }
}

/* Forced-colors/high-contrast fallbacks. */
@media (forced-colors:active){
  .careka-global-footer,
  .careka-v106-home .contact-link,
  body.careka-final :where(.ck-v75-btn,.backlink){
    forced-color-adjust:auto;
  }
}
