/* Esquadrias Amarante — ardósia, marfim e madeira. */
:root {
  --canvas:#18272c;
  --surface:#263941;
  --subtle:#2e4249;
  --input:#1b2b31;
  --ink:#f5f4ef;
  --muted:#b4c3cf;
  --accent:#e8bb95;
  --brand-red:#87563c;
  --accent-hover:#a56d4d;
  --stroke:#304350;
  --strong-stroke:#537286;
  --button:#1a2b39;
  --hover:#243d4e;
  --tint:#213647;
  --header:#101923f5;
  --nav-bg:#111d28;
  --nav-active:#273b4a;
  --nav-selected:#f6d2b2;
  --nav-active-stroke:#7a694b;
  --amarante-ease:cubic-bezier(.2,.75,.24,1);
}
html body.mv-design {
  background:radial-gradient(ellipse at 78% 0,#253748 0,transparent 48%),var(--canvas)!important;
}
html body.mv-design #app>.design-header {
  border-bottom:1px solid #40515c;
  box-shadow:0 8px 22px #0003;
}
html body.mv-design #app>#nav {
  border-color:var(--stroke)!important;
}
html body.mv-design #app #nav button.on {
  color:#f6d2b2!important;
  background:#293642!important;
  border-color:#89634d!important;
}
body.mv-design #nav button svg { color:#a6bccd }
body.mv-design #nav button.on svg { color:#efca83 }
body.mv-design .design-pagehead h1 { letter-spacing:-.045em; font-weight:730 }
body.mv-design .design-pagehead .design-eyebrow { color:#e8bb95 }
html body.mv-design #app .design-hero {
  min-height:360px!important;
  padding:0!important;
  grid-template-columns:minmax(0,1fr) minmax(0,47%);
  gap:0;
  align-items:stretch;
  border:1px solid #465561!important;
  border-radius:22px!important;
  background:linear-gradient(125deg,#182b3a,#101b25 67%,#101923)!important;
  box-shadow:0 22px 45px #0004;
}
body.mv-design .design-hero-copy {
  padding:clamp(28px,4.6vw,66px);
  align-self:center;
}
html body.mv-design #app .design-hero .design-eyebrow {
  color:#e8bb95!important;
  letter-spacing:.14em;
}
html body.mv-design #app .design-hero h2 {
  font-family:Georgia,serif;
  font-size:clamp(35px,4vw,65px)!important;
  line-height:1.03!important;
  color:#fcf7ed!important;
}
html body.mv-design #app .design-hero p {
  color:#c2d1db!important;
  font-size:clamp(14px,1.5vw,16px)!important;
  font-weight:500!important;
}
body.mv-design .design-hero .design-glass {
  position:relative;
  width:100%;
  height:100%;
  min-width:0;
  margin:0;
  padding:0;
}
html body.mv-design .design-hero .design-facade {
  border:0;
  border-radius:0;
  min-height:100%;
  box-shadow:none;
}
body.mv-design .design-facade img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
body.mv-design .design-facade:after {
  background:linear-gradient(90deg,#101b25 0%,transparent 24%),linear-gradient(0deg,#09121be8,transparent 42%);
}
body.mv-design .design-facade figcaption { left:clamp(22px,4vw,56px); bottom:25px; color:#f2c9a7 }
html body.mv-design[data-design=prisma] #app .design-hero .design-actions button.p,
html body.design-login .enter {
  background:linear-gradient(130deg,#f4d3b5,#d5a17b)!important;
  border-color:#e6b892!important;
  color:#19212a!important;
  box-shadow:0 5px 18px #cfaa5b25;
}
body.mv-design #cards .card,
body.mv-design .amarante-service-card {
  background:linear-gradient(155deg,#1c2b37,#121e28);
  border:1px solid var(--stroke);
  border-radius:16px;
}
body.mv-design .amarante-service-card small { color:#f0c7a9 }
body.mv-design .design-footer { gap:12px; flex-wrap:wrap }
html body.design-login {
  background:radial-gradient(ellipse at 85% 0,#243b4c,transparent 57%),#18272c;
}
body.design-login .login-story {
  isolation:isolate;
  background:#142331 url('/images/amarante-fachada.webp') 48% center / cover no-repeat;
}
body.design-login .login-story:before {
  position:absolute;
  content:"";
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,#0b1722ed,#101e2ba3 68%,#17293840),linear-gradient(0deg,#101923bf,transparent 65%);
}
body.design-login .login-story .login-art { display:none }
body.design-login .login-story-copy h2 { color:#fff7e8; font-size:clamp(37px,5.2vw,80px); line-height:1.02; margin:0 0 22px }
body.design-login .login-story-copy p { max-width:26rem; color:#e0eaf0 }
body.design-login .login-form-area main {
  background:linear-gradient(155deg,#1a2b39,#111c26);
  border:1px solid #425867;
  box-shadow:0 22px 55px #0006;
  border-radius:23px;
}
body.design-login .login-kicker { color:#f0c7a9 }
body.design-login .brand img { border-radius:8px }
body.design-login #status:empty { min-height:0; margin:0 }
body.amarante-demo { --red:#1b5877; background:#eef3f7 }
body.amarante-demo .hero { border-radius:20px; overflow:hidden }
body.amarante-demo .hero-copy { border-left:4px solid #c09855 }
body.amarante-demo figure img { width:100%; object-fit:cover }
:where(body.mv-design,body.design-login,body.amarante-demo) :is(button,a,input,select,summary):focus-visible {
  outline:2px solid #efbf9b;
  outline-offset:3px;
}
@media (max-width:700px) {
  html body.mv-design #app .design-hero { grid-template-columns:1fr; min-height:0!important }
  body.mv-design .design-hero-copy { padding:28px 22px }
  body.mv-design .design-hero .design-glass { display:block; height:185px; min-height:185px }
  body.mv-design .design-facade:after { background:linear-gradient(0deg,#09121bdc,transparent 65%) }
  body.mv-design .design-facade figcaption { bottom:14px }
  body.design-login .login-story-copy { margin-top:24px }
  body.design-login .login-story-copy h2 { font-size:clamp(32px,7vw,44px) }
  body.design-login .login-form-area { min-height:auto; padding:26px 16px }
}
@media (prefers-reduced-motion:no-preference) {
  body:not(.noanim) :is(button,.button,.cta-primary,summary) {
    transition:translate .22s var(--amarante-ease),scale .15s ease-out,background-color .2s,border-color .2s,box-shadow .22s;
  }
  body:not(.noanim) :is(button:not(:disabled),.button,.cta-primary,summary):active { scale:.975 }
  body.mv-design:not(.noanim)[data-dir="l"] { --amarante-shift:-13px }
  body.mv-design:not(.noanim) #design-main .tab.on { animation:amarante-route .32s var(--amarante-ease) both }
  body.mv-design:not(.noanim) #design-main .tab.on>* { animation:none }
  body:not(.noanim) :is(dialog[open],.ov:not([hidden])>.md,#asp:not([hidden])) {
    animation:amarante-window .27s var(--amarante-ease) both;
  }
  body:not(.noanim) dialog[open]::backdrop { animation:amarante-fade .24s ease-out }
  body.mv-design:not(.noanim) details[open]>summary+* { animation:amarante-route .24s var(--amarante-ease) }
  body.design-login .login-form-area main,
  body.amarante-demo .hero { animation:amarante-route .55s var(--amarante-ease) both }
  body.design-login .login-story-copy { animation:amarante-window .65s var(--amarante-ease) both }
  body.design-login #submit:disabled { cursor:wait }
}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  body:not(.noanim) :is(.design-actions button,.enter,.amarante-service-card button,.hero-actions .button):not(:disabled):hover { translate:0 -2px; box-shadow:0 8px 24px #0005 }
  body:not(.noanim) .design-actions svg { transition:translate .25s var(--amarante-ease) }
  body:not(.noanim) .design-actions button:hover svg { translate:3px -2px }
  body.mv-design:not(.noanim) :is(#cards .card,.amarante-service-card,.design-facade img) { transition:translate .26s var(--amarante-ease),scale .48s var(--amarante-ease),border-color .26s }
  body.mv-design:not(.noanim) :is(#cards .card,.amarante-service-card):hover { translate:0 -3px; border-color:#967b4f }
  body.mv-design:not(.noanim) .design-facade:hover img { scale:1.045 }
}
@media (prefers-reduced-motion:reduce) {
  :where(body.mv-design,body.design-login,body.amarante-demo) *,
  :where(body.mv-design,body.design-login,body.amarante-demo) *::before,
  :where(body.mv-design,body.design-login,body.amarante-demo) *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important }
}
@keyframes amarante-route {
  from { opacity:0; translate:var(--amarante-shift,13px) 6px }
  to { opacity:1; translate:0 0 }
}
@keyframes amarante-window {
  from { opacity:0; translate:0 11px; scale:.985 }
  to { opacity:1; translate:0 0; scale:1 }
}
@keyframes amarante-fade { from { opacity:0 } to { opacity:1 } }

/* A fachada ocupa um quadro horizontal, com espaço para as ações ao lado. */
html body.mv-design #app .design-hero {
  grid-template-columns: minmax(0, 1fr) minmax(0, 50%);
  background: linear-gradient(112deg,#334952,#22343b 62%) !important;
  border-radius: 12px !important;
}
body.mv-design .design-hero .design-glass {
  padding: 22px 22px 22px 0;
  display: flex;
  align-items: center;
}
html body.mv-design .design-hero .design-facade {
  width: 100%;
  min-height: 0;
  aspect-ratio: 1.64;
  height: auto;
  border: 1px solid #b7a89c65;
  border-radius: 6px;
}
body.mv-design .design-facade:after { background:linear-gradient(0deg,#17272eea,transparent 42%) }
body.mv-design .design-facade figcaption { left: 18px; bottom: 14px }
body.mv-design .design-hero h2,
body.design-login .login-story-copy h2,
body.amarante-demo .hero h1 { font-family: Georgia, serif; font-weight: 500; letter-spacing: -.035em }

html body.design-login { background: #f2ebe0; grid-template-columns: 1.18fr 1fr }
body.design-login .login-story {
  background: repeating-linear-gradient(90deg,#ffffff06 0 1px,transparent 1px 52px),linear-gradient(135deg,#344b54,#1d3037);
  color: #fff5e8;
  padding: clamp(28px,4.5vw,72px);
}
body.design-login .login-story::before { display:none }
body.design-login .login-story-copy { margin: 30px 0 24px }
body.design-login .login-story-copy h2 { font-size: clamp(38px,4.65vw,72px); margin-bottom: 12px }
body.design-login .login-story-copy p { opacity: 1; max-width: 39ch; color: #dce5e5 }
body.design-login .login-story .login-art {
  display:block;
  margin:26px 0 0;
  height:auto;
  max-width:700px;
  border:1px solid #e9cbb18a;
  padding:8px;
  background:#f6eadb0e;
}
body.design-login .login-art::before { display:none }
body.design-login .login-art img { display:block; width:100%; aspect-ratio:364/189; object-fit:cover }
body.design-login .login-story-foot { opacity:1; color:#e5d2c4; padding-top:14px }
body.design-login .login-form-area { color:#263941; color-scheme:light }
body.design-login .login-form-area main {
  width:min(100%,465px);
  background:#fffbf5;
  color:#263941;
  border:1px solid #c9b7a6;
  border-top:4px solid #956448;
  border-radius:8px;
  box-shadow:0 22px 64px #67463219;
}
body.design-login main .brand { display:block }
body.design-login main .brand img { display:none }
body.design-login main .brand h1 { font-family:Georgia,serif; font-weight:500; letter-spacing:-.025em; font-size:clamp(25px,3vw,36px); color:#253840 }
body.design-login main :is(.hint,footer,footer a) { color:#51463e }
body.design-login main input:not([type=checkbox]) { background:#fffdf9; color:#253840; border-color:#a9998c }
body.design-login main .password button { background:#eee4d8; color:#253840; border-color:#a9998c }
html body.design-login main .enter { background:#263941!important; border-color:#263941!important; color:#fff4e8!important; box-shadow:none }
body.design-login main #status { color:#8d302c }
body.amarante-demo { --red:#754930; background:#f5efe6 }
body.amarante-demo .hero { border-radius:8px }
body.amarante-demo .hero-copy { border-left-color:#a57755 }
body.amarante-demo .hero figure { background:#263941; padding:9px; border-radius:5px }
body.amarante-demo .hero figcaption { color:#f7e5d6 }
@media(max-width:700px) {
  html body.mv-design #app .design-hero { grid-template-columns:1fr }
  body.mv-design .design-hero .design-glass { height:auto; min-height:0; padding:0 16px 16px }
  html body.mv-design .design-hero .design-facade { aspect-ratio:1.92 }
  html body.design-login { display:block }
  body.design-login .login-story { min-height:0; padding:23px 18px 16px }
  body.design-login .login-story-copy { margin:18px 0 0 }
  body.design-login .login-story-copy h2 { font-size:clamp(28px,7.5vw,44px) }
  body.design-login .login-story-copy p { display:none }
  body.design-login .login-story .login-art { margin:14px 0 0; padding:4px }
  body.design-login .login-story-foot { display:none }
  body.design-login .login-form-area { min-height:0; padding:18px 12px 26px }
}

/* Papel, madeira e tipografia editorial da galeria Amarante. */
html body.mv-design {
  color-scheme:light;
  --canvas:#f3eadc;
  --surface:#fffbf5;
  --subtle:#f8efe2;
  --input:#fffdfa;
  --ink:#30231a;
  --muted:#665145;
  --placeholder:#79675a;
  --accent:#794b31;
  --brand-red:#75472f;
  --accent-hover:#613820;
  --stroke:#d7c4b2;
  --strong-stroke:#ad9078;
  --button:#f3e6d6;
  --hover:#ead6c0;
  --tint:#f1dfcb;
  --header:#fcf6edf5;
  --nav-bg:#f7eddf;
  --nav-ink:#38291e;
  --nav-muted:#664f40;
  --nav-hover:#eddcc9;
  --nav-active:#ebd7c2;
  --nav-selected:#56331f;
  --nav-active-stroke:#b89478;
  --footer:#efe3d3;
  --drawing-bg:#fff9ef;
  --success:#32624b;
  --warning:#865920;
  --warning-bg:#f7e8cf;
  --danger:#8f352d;
  background:var(--canvas)!important;
}
html body.mv-design #app .design-header { box-shadow:none; border-bottom-color:var(--stroke) }
html body.mv-design #app #nav button.on { color:#56331f!important; background:#ead5bf!important; border-color:#ba977a!important }
body.mv-design #nav button svg, body.mv-design #nav button.on svg { color:#794b31 }
body.mv-design .design-pagehead .design-eyebrow { color:#794b31 }
html body.mv-design #app .design-hero {
  background:linear-gradient(112deg,#fffaf2,#f0dfcb)!important;
  border-color:#cfb8a1!important;
  box-shadow:0 12px 32px #61412910;
}
html body.mv-design #app .design-hero h2 { color:#30231a!important; font-weight:500 }
html body.mv-design #app .design-hero h2 em { color:#794b31 }
html body.mv-design #app .design-hero .design-eyebrow { color:#794b31!important }
html body.mv-design #app .design-hero p { color:#5d483a!important }
html body.mv-design[data-design=prisma] #app .design-hero .design-actions button.p {
  background:#75472f!important; color:#fffaf3!important; border-color:#75472f!important;
}
body.mv-design #cards .card, body.mv-design .amarante-service-card {
  background:var(--surface);
  border-radius:8px;
}
body.mv-design .amarante-service-card small { color:#794b31 }
body.mv-design .amarante-quote-start { background:#fff8ef; border-color:#ac7958; }
#amarante-wood-title { font-family:Georgia,serif; font-weight:500; font-size:clamp(25px,3vw,36px); }
#amarante-wood-categories { display:grid; grid-template-columns:repeat(auto-fit,minmax(112px,1fr)); gap:8px; flex:1 0 100%; }
#amarante-wood-categories button { min-height:44px; }
.amarante-portfolio-link { color:var(--accent); text-underline-offset:3px; }
#amarante-custom-label[hidden] { display:none!important; }
#amarante-service-dialog :focus-visible, #amarante-wood-categories button:focus-visible { outline-color:#794b31; }
body.design-login .login-story {
  background:repeating-linear-gradient(90deg,#72523909 0 1px,transparent 1px 52px),linear-gradient(135deg,#f6ecdd,#ecdbc4);
  color:#30231a;
}
body.design-login .login-story-copy h2 { color:#34251a; }
body.design-login .login-story-copy p, body.design-login .login-story-foot { color:#654e3e; }
body.design-login .login-story .login-art { border-color:#b18d70; }
html body.design-login main .enter { background:#75472f!important; border-color:#75472f!important; }
html body.mv-design #app #amarante-wood-title,
html body.mv-design #app .design-hero h2 { font-family:Georgia,serif!important; }
html body.mv-design #app .amarante-quote-start {
  background:#fff8ef!important;
  border-top-color:#ac7958!important;
}