/* Villa Garden 3.0: formas acolhedoras, marca original e componentes reutilizáveis. */
:root{
  --vg-radius-control:12px;
  --vg-radius-card:24px;
  --vg-radius-panel:32px;
  --vg-radius-pill:999px;
  --vg-radius-organic:24px 24px 112px 24px;
  --vg-section-space:clamp(64px,7vw,104px);
  --vg-surface-sage:#E8ECDD;
  --vg-surface-warm:#EFE6DB;
}
.vg-rounded-button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:52px;padding:14px 24px;border:1px solid transparent;border-radius:var(--vg-radius-pill);font:600 15px/1.3 var(--vg-font-body);text-decoration:none;cursor:pointer;background:var(--vg-forest);color:var(--vg-paper);transition:background 180ms ease,transform 180ms var(--vg-ease)}
.vg-rounded-button svg{width:18px;height:18px;flex:none}
.vg-rounded-button[data-tone="sand"]{background:var(--vg-sand);color:var(--vg-forest)}
.vg-rounded-button[data-tone="outline"]{background:transparent;color:inherit;border-color:currentColor}
.vg-rounded-button:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.vg-rounded-button:active{transform:scale(.98)}
.vg-rounded-button:disabled,.vg-rounded-button[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.vg-rounded-button:disabled:active{transform:none}
.vg-organic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.vg-path-card{position:relative;isolation:isolate;overflow:hidden;padding:clamp(26px,3.4vw,44px);border:1px solid #183f3214;border-radius:var(--vg-radius-panel);background:var(--vg-surface-sage);color:var(--vg-forest)}
.vg-path-card[data-tone="warm"]{background:var(--vg-surface-warm);color:var(--vg-earth)}
.vg-path-card h3{font:400 clamp(30px,3vw,42px)/1.12 var(--vg-font-display);margin:20px 0 14px}
.vg-path-card p{max-width:38ch;margin:0 0 24px}
.vg-path-card .vg-brand-motif{position:absolute;right:-4px;top:25px;width:112px;height:144px;opacity:.06;z-index:-1;pointer-events:none;object-fit:contain}
.vg-path-card ul{margin:0 0 28px;padding:0;list-style:none}
.vg-path-card li{padding:10px 0;border-bottom:1px solid #183f321a;font-size:16px}
.vg-path-card li::before{content:'↗';margin-right:12px;font-size:13px}
.vg-organic-media{position:relative;border-radius:var(--vg-radius-organic);overflow:hidden}
.vg-organic-media img{display:block;width:100%;height:100%;object-fit:cover}
.vg-comfort-card{padding:32px;border:1px solid #183f3214;border-radius:var(--vg-radius-card);background:var(--vg-white)}
.vg-brand-divider{display:flex;align-items:center;justify-content:center;gap:24px;width:100%;padding:12px 0}
.vg-brand-divider::before,.vg-brand-divider::after{content:'';height:1px;background:var(--vg-line);flex:1}
.vg-brand-divider img{display:block;width:28px;height:36px;object-fit:contain;opacity:.7}
@media(hover:hover) and (pointer:fine){.vg-rounded-button:hover:not(:disabled):not([aria-disabled="true"]){transform:translateY(-2px);background:#244f40}.vg-rounded-button[data-tone="sand"]:hover:not(:disabled){background:#F5EDE4}.vg-rounded-button[data-tone="outline"]:hover:not(:disabled){background:#183f3210}.vg-rounded-button:hover svg{transform:translateX(3px)}.vg-rounded-button svg{transition:transform 180ms var(--vg-ease)}}
@media(max-width:700px){.vg-organic-grid{grid-template-columns:1fr}.vg-path-card{padding:28px}.vg-rounded-button{padding-inline:21px}}
@media(prefers-reduced-motion:reduce){.vg-rounded-button,.vg-rounded-button svg{transition:none!important;transform:none!important}}

.vg-hero-panel{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:36px;padding:40px;background:var(--vg-forest);color:var(--vg-paper);border-radius:var(--vg-radius-panel)}
.vg-hero-panel__copy{min-width:0}.vg-hero-panel__logo{width:80px;height:68px;object-fit:contain;margin-bottom:30px}
.vg-hero-panel h3{font:400 clamp(36px,4vw,56px)/1.04 var(--vg-font-display);margin:0 0 20px;color:inherit}
.vg-hero-panel p{font-size:16px;line-height:1.6;margin:0 0 26px;color:#d3ddcb}
.vg-hero-panel figure{margin:0;aspect-ratio:4/5}
.vg-hero-panel>.vg-brand-motif{position:absolute;right:-65px;top:10px;width:230px;height:300px;opacity:.04;z-index:-1;pointer-events:none}
@media(max-width:700px){.vg-hero-panel{grid-template-columns:1fr;gap:30px;padding:28px}.vg-hero-panel h3{font-size:42px}.vg-hero-panel figure{max-height:390px}.vg-hero-panel .vg-rounded-button{font-size:14px}}