/* Base do site: portado do template "Site Ursula Teles v2" */
html{scroll-behavior:smooth}
body{margin:0;background:var(--ut-bg);color:var(--ut-muted);font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:var(--ut-cream);text-decoration:none}
a:hover{color:var(--ut-accent)}
::selection{background:var(--ut-accent);color:var(--ut-tinta)}
img{display:block}

/* Keyframes */
@keyframes utLineUp{from{transform:translateY(115%)}to{transform:translateY(0)}}
@keyframes utFade{from{opacity:0}to{opacity:1}}
@keyframes utGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes utCurtain{to{transform:translateY(-101%);visibility:hidden}}
@keyframes utPreOut{to{opacity:0;transform:translateY(-28px)}}
@keyframes utClipIn{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes utDrift{from{transform:scale(1.05)}to{transform:scale(1.15)}}
@keyframes utMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes utScan{from{transform:translateX(-101%)}to{transform:translateX(101%)}}

/* Componentes do design system (portados de _ds_bundle.js) */
.kicker{font-family:var(--font-body);font-weight:400;font-size:var(--type-kicker-size);line-height:var(--type-kicker-lh);letter-spacing:var(--type-kicker-ls);text-transform:uppercase;color:var(--ut-muted)}
.tag{display:inline-block;background-color:rgba(21,18,14,0.9);padding:4px 8px;font-family:var(--font-body);font-weight:400;font-size:var(--type-tag-size);line-height:var(--type-tag-lh);letter-spacing:var(--type-tag-ls);text-transform:uppercase;color:var(--ut-cream);white-space:nowrap}
.btn{display:inline-flex;flex-direction:row;gap:12px;align-items:center;justify-content:center;padding:12px 24px;cursor:pointer;box-sizing:border-box;font-family:var(--font-body);font-weight:400;font-size:var(--type-kicker-size);line-height:var(--type-kicker-lh);letter-spacing:3.136px;text-transform:uppercase;white-space:nowrap;user-select:none;background:none;border:none;border-radius:0}
.btn--sm{padding:8px 16px}
.btn--primary{background-color:var(--ut-cream);color:var(--ut-tinta)}
.btn--outline{border:var(--hairline);color:var(--ut-muted)}
.monogram{width:38px;height:38px;border-radius:50%;border:1px solid var(--ut-border);display:flex;justify-content:center;align-items:center;box-sizing:border-box}
.monogram span{font-family:var(--font-display);font-weight:400;font-size:17.86px;line-height:1;color:var(--ut-cream)}
.section-head{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-end;gap:32px;padding-bottom:24px;border-bottom:var(--hairline)}
.section-head h2{margin:0;padding:16px 0;font-family:var(--font-display);font-weight:400;font-size:var(--type-h2-size);line-height:var(--type-h2-lh);letter-spacing:var(--type-h2-ls);color:var(--ut-cream)}
.section-head p{margin:0;max-width:320px;padding-bottom:8px;font-family:var(--font-body);font-weight:400;font-size:var(--type-small-size);line-height:var(--type-small-lh);text-align:right;color:var(--ut-muted)}

/* Estados de hover (equivalem aos style-hover do template; !important vence o estilo inline) */
.hover-cream:hover{color:var(--ut-cream)!important}
.hover-accent:hover{color:var(--ut-accent)!important}
.zoomable:hover{transform:scale(1.03)}
.fl{display:inline-block;transition:color .25s,font-style .25s}
.fl:hover{color:var(--ut-argila)!important;font-style:italic}

/* Responsivo */
@media (max-width:900px){
  [data-grid="hero"]{grid-template-columns:1fr !important;min-height:auto !important}
  [data-grid="about"]{grid-template-columns:1fr !important}
  [data-nav]{display:none !important}
}
@media (max-width:1100px){[data-rail]{display:none !important}}
