/* ============================================================
   DIVALVS — NATIVE CSS UTILITIES
   ------------------------------------------------------------
   Local CSS replacement for the small set of utility classes
   used by front-page.php and page-produtos.php.
   No Tailwind runtime/CDN is required.
   ============================================================ */

*,*::before,*::after{box-sizing:border-box}

/*
 * Minimal Tailwind-preflight compatibility.
 * The previous browser Tailwind runtime reset the browser's default
 * <figure> margins and block-sized media. Without that reset, the two
 * "A equipa" portraits lose 40px on each side and render much smaller.
 * Keep the native performance build, but preserve the original geometry.
 */
figure{margin:0}
img,video{display:block;max-width:100%;height:auto}


/* ============================================================
   HOME + LOJA — STANDALONE STOREFRONT CANVAS
   ------------------------------------------------------------
   These two custom templates render their own document shell and must not
   inherit the active theme's default header, footer or white body canvas.
   The gradient/background matches the remaining DIVALVS commerce pages.
   ============================================================ */
html{
    min-height:100%!important;
    margin:0!important;
    background:#b8a6a6!important;
}

body.divalvs-front-page,
body.divalvs-products-page{
    min-height:100vh!important;
    min-height:100dvh!important;
    margin:0!important;
    overflow-x:hidden!important;
    color:#fff!important;
    background:
        linear-gradient(135deg,rgba(145,105,96,.82),rgba(222,206,210,.76) 52%,rgba(160,175,202,.78)),
        url('Background.webp') center/cover fixed!important;
    font-family:var(--divalvs-font-family)!important;
}

body.divalvs-front-page::before,
body.divalvs-products-page::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-1;
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
    pointer-events:none;
}

body.divalvs-front-page #app-shell,
body.divalvs-products-page #app-shell{
    position:relative;
    z-index:0;
    width:100%;
    min-height:100vh;
    min-height:100dvh;
    background:transparent!important;
}

@media(max-width:1024px), (prefers-reduced-motion:reduce){
    body.divalvs-front-page,
    body.divalvs-products-page{
        background-attachment:scroll!important;
    }
}

/* Position */
.relative{position:relative!important}
.absolute{position:absolute!important}
.fixed{position:fixed!important}
.inset-0{inset:0!important}
.top-2{top:.5rem!important}
.top-5{top:1.25rem!important}
.top-\[64\%\]{top:64%!important}
.right-0{right:0!important}
.right-2{right:.5rem!important}
.right-6{right:1.5rem!important}
.left-5{left:1.25rem!important}
.left-6{left:1.5rem!important}
.bottom-6{bottom:1.5rem!important}
.z-0{z-index:0!important}
.z-10{z-index:10!important}
.z-20{z-index:20!important}
.z-50{z-index:50!important}

/* Display */
.hidden{display:none!important}
.flex{display:flex!important}
.inline-flex{display:inline-flex!important}
.grid{display:grid!important}

/* Flex / grid */
.flex-col{flex-direction:column!important}
.flex-wrap{flex-wrap:wrap!important}
.items-center{align-items:center!important}
.items-start{align-items:flex-start!important}
.justify-start{justify-content:flex-start!important}
.justify-center{justify-content:center!important}
.justify-between{justify-content:space-between!important}
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))!important}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}

/* Sizing */
.w-full{width:100%!important}
.w-5{width:1.25rem!important}
.w-8{width:2rem!important}
.w-12{width:3rem!important}
.w-\[280px\]{width:280px!important}
.h-auto{height:auto!important}
.h-full{height:100%!important}
.h-5{height:1.25rem!important}
.h-8{height:2rem!important}
.h-12{height:3rem!important}
.h-\[420px\]{height:420px!important}
.min-h-\[100dvh\]{min-height:100dvh!important}
.max-w-full{max-width:100%!important}
.max-w-3xl{max-width:48rem!important}
.max-w-4xl{max-width:56rem!important}
.max-w-5xl{max-width:64rem!important}
.aspect-\[3\/4\]{aspect-ratio:3/4!important}

/* Spacing */
.mx-auto{margin-left:auto!important;margin-right:auto!important}
.mx-2{margin-left:.5rem!important;margin-right:.5rem!important}
.my-auto{margin-top:auto!important;margin-bottom:auto!important}
.mt-1{margin-top:.25rem!important}
.mt-3{margin-top:.75rem!important}
.mt-4{margin-top:1rem!important}
.mt-6{margin-top:1.5rem!important}
.mb-1\.5{margin-bottom:.375rem!important}
.mb-4{margin-bottom:1rem!important}
.p-2{padding:.5rem!important}
.p-4{padding:1rem!important}
.p-6{padding:1.5rem!important}
.px-6{padding-left:1.5rem!important;padding-right:1.5rem!important}
.py-6{padding-top:1.5rem!important;padding-bottom:1.5rem!important}
.py-8{padding-top:2rem!important;padding-bottom:2rem!important}
.py-12{padding-top:3rem!important;padding-bottom:3rem!important}
.pt-1{padding-top:.25rem!important}
.pt-2{padding-top:.5rem!important}
.pt-4{padding-top:1rem!important}
.pt-20{padding-top:5rem!important}
.pb-2{padding-bottom:.5rem!important}
.pb-8{padding-bottom:2rem!important}
.pb-16{padding-bottom:4rem!important}
.gap-2{gap:.5rem!important}
.gap-3{gap:.75rem!important}
.gap-4{gap:1rem!important}
.gap-8{gap:2rem!important}
.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem!important}
.space-y-6>:not([hidden])~:not([hidden]){margin-top:1.5rem!important}
.space-y-10>:not([hidden])~:not([hidden]){margin-top:2.5rem!important}
.space-y-12>:not([hidden])~:not([hidden]){margin-top:3rem!important}

/* Borders / radius */
.border{border-width:1px!important;border-style:solid!important}
.border-t{border-top-width:1px!important;border-top-style:solid!important}
.border-b{border-bottom-width:1px!important;border-bottom-style:solid!important}
.border-white\/10{border-color:rgba(255,255,255,.10)!important}
.border-white\/15{border-color:rgba(255,255,255,.15)!important}
.border-stone-200\/60{border-color:rgba(231,229,228,.60)!important}
.rounded-full{border-radius:9999px!important}
.rounded-2xl{border-radius:1rem!important}
.rounded-3xl{border-radius:1.5rem!important}
.rounded-l-2xl{border-top-left-radius:1rem!important;border-bottom-left-radius:1rem!important}

/* Background */
.bg-black\/10{background-color:rgba(0,0,0,.10)!important}
.bg-black\/20{background-color:rgba(0,0,0,.20)!important}
.bg-black\/30{background-color:rgba(0,0,0,.30)!important}
.bg-black\/40{background-color:rgba(0,0,0,.40)!important}
.bg-black\/90{background-color:rgba(0,0,0,.90)!important}
.bg-white\/5{background-color:rgba(255,255,255,.05)!important}
.bg-cover{background-size:cover!important}
.bg-center{background-position:center!important}
.bg-right-top{background-position:right top!important}
.bg-no-repeat{background-repeat:no-repeat!important}
.bg-gradient-to-t.from-stone-950\/90.via-stone-900\/30.to-transparent{
    background-image:linear-gradient(to top,rgba(12,10,9,.90),rgba(28,25,23,.30),transparent)!important
}

/* Media/object */
.object-cover{object-fit:cover!important}
.object-top{object-position:top!important}
.overflow-hidden{overflow:hidden!important}
.pointer-events-none{pointer-events:none!important}

/* Typography */
.text-left{text-align:left!important}
.text-center{text-align:center!important}
.text-xs{font-size:var(--divalvs-font-size-xs)!important;line-height:var(--divalvs-line-height-xs)!important}
.text-sm{font-size:var(--divalvs-font-size-sm)!important;line-height:var(--divalvs-line-height-sm)!important}
.text-base{font-size:var(--divalvs-font-size-base)!important;line-height:var(--divalvs-line-height-base)!important}
.text-xl{font-size:var(--divalvs-font-size-xl)!important;line-height:var(--divalvs-line-height-xl)!important}
.text-2xl{font-size:var(--divalvs-font-size-2xl)!important;line-height:var(--divalvs-line-height-2xl)!important}
.text-3xl{font-size:var(--divalvs-font-size-3xl)!important;line-height:var(--divalvs-line-height-3xl)!important}
.text-5xl{font-size:var(--divalvs-font-size-5xl)!important;line-height:1!important}
.text-\[11px\]{font-size:11px!important}
.font-extralight{font-weight:200!important}
.font-light{font-weight:300!important}
.font-medium{font-weight:500!important}
.font-semibold{font-weight:600!important}
.uppercase{text-transform:uppercase!important}
.leading-7{line-height:1.75rem!important}
.leading-relaxed{line-height:1.625!important}
.tracking-tight{letter-spacing:-.025em!important}
.tracking-wide{letter-spacing:var(--divalvs-tracking-wide)!important}
.tracking-wider{letter-spacing:var(--divalvs-tracking-wider)!important}
.tracking-widest{letter-spacing:var(--divalvs-tracking-widest)!important}
.tracking-\[0\.3em\]{letter-spacing:.3em!important}
.tracking-\[0\.35em\]{letter-spacing:var(--divalvs-tracking-kicker)!important}
.tracking-\[0\.4em\]{letter-spacing:var(--divalvs-tracking-eyebrow)!important}
.whitespace-nowrap{white-space:nowrap!important}
.break-words{overflow-wrap:break-word!important}

/* Colors */
.text-black{color:#000!important}
.text-black\/70{color:rgba(0,0,0,.70)!important}
.text-black\/80{color:rgba(0,0,0,.80)!important}
.text-white{color:#fff!important}
.text-white\/70{color:rgba(255,255,255,.70)!important}
.text-white\/80{color:rgba(255,255,255,.80)!important}
.text-white\/90{color:rgba(255,255,255,.90)!important}
.text-stone-200{color:#e7e5e4!important}
.text-stone-400{color:#a8a29e!important}

/* Opacity */
.opacity-60{opacity:.60!important}
.opacity-80{opacity:.80!important}
.opacity-90{opacity:.90!important}

/* Effects */
.backdrop-blur-\[1px\]{-webkit-backdrop-filter:blur(1px)!important;backdrop-filter:blur(1px)!important}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.25)!important}
.drop-shadow{filter:drop-shadow(0 1px 1px rgba(0,0,0,.05))}
.filter.invert{filter:invert(1)!important}
.filter.invert.brightness-200.drop-shadow-2xl{
    filter:invert(1) brightness(2) drop-shadow(0 25px 25px rgba(0,0,0,.15))!important
}

/* Interaction / transitions */
.cursor-pointer{cursor:pointer!important}
.focus\:outline-none:focus{outline:2px solid transparent!important;outline-offset:2px!important}
.transition-all{transition-property:all!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}
.transition-transform{transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}
.duration-300{transition-duration:300ms!important}
.duration-500{transition-duration:500ms!important}
.duration-700{transition-duration:700ms!important}
.hover\:scale-105:hover{transform:scale(1.05)!important}
.hover\:scale-\[1\.02\]:hover{transform:scale(1.02)!important}
.group:hover .group-hover\:scale-105{transform:scale(1.05)!important}
.group:hover .group-hover\:opacity-100{opacity:1!important}
.group:hover .group-hover\:translate-y-0\.5{transform:translateY(.125rem)!important}

/* Bounce */
@keyframes divalvs-native-bounce{
    0%,100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(.8,0,1,1)}
    50%{transform:none;animation-timing-function:cubic-bezier(0,0,.2,1)}
}
.animate-bounce{animation:divalvs-native-bounce 1s infinite!important}

/* Existing DIVALVS performance helper */
.cv-auto{content-visibility:auto;contain-intrinsic-size:auto 700px}

/* Responsive equivalents */
@media(min-width:640px){
    .sm\:min-h-screen{min-height:100vh!important}
    .sm\:px-10{padding-left:2.5rem!important;padding-right:2.5rem!important}
    .sm\:w-\[440px\]{width:440px!important}
    .sm\:text-2xl{font-size:var(--divalvs-font-size-2xl)!important;line-height:var(--divalvs-line-height-2xl)!important}
    .sm\:text-7xl{font-size:var(--divalvs-font-size-7xl)!important;line-height:1!important}
    .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(min-width:768px){
    .md\:text-3xl{font-size:var(--divalvs-font-size-3xl)!important;line-height:var(--divalvs-line-height-3xl)!important}
}
@media(min-width:1024px){
    .lg\:text-3xl{font-size:var(--divalvs-font-size-3xl)!important;line-height:var(--divalvs-line-height-3xl)!important}
}

/* ============================================================
   HOME PAGE COMPONENTS
   Consolidated from the former front-page.css to remove one
   render-blocking request while keeping Home/LOJA utilities shared.
   ============================================================ */
.divalvs-hero-login-btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    min-width:174px!important;
    min-height:44px!important;

    box-sizing:border-box!important;

    margin:18px 0 0!important;
    padding:0 22px!important;

    border:0!important;
    border-radius:12px!important;

    background:rgba(255,255,255,.94)!important;
    color:#171717!important;

    font-family:var(--divalvs-font-family)!important;
    font-size:var(--divalvs-font-size-2xs)!important;
    font-weight:800!important;
    line-height:1.2!important;

    letter-spacing:.12em!important;
    text-align:center!important;
    text-decoration:none!important;
    text-transform:uppercase!important;

    box-shadow:
        0 10px 26px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.78)!important;

    -webkit-backdrop-filter:blur(10px)!important;
    backdrop-filter:blur(10px)!important;

    transform:none!important;
}

.divalvs-hero-login-btn:hover,
.divalvs-hero-login-btn:focus,
.divalvs-hero-login-btn:active{
    background:#fff!important;
    color:#171717!important;
    text-decoration:none!important;
    box-shadow:
        0 10px 26px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.78)!important;
    outline:none!important;
    transform:none!important;
}

@media(max-width:680px){
    .divalvs-hero-login-btn{
        min-width:160px!important;
        min-height:42px!important;
        margin-top:16px!important;
        padding:0 18px!important;
        font-size:var(--divalvs-font-size-3xs)!important;
    }
}


/* ============================================================
   HOME TILE HEADERS
   ------------------------------------------------------------
   PRODUTOS, SERVIÇOS and A EQUIPA use the same title treatment as
   the product-name row inside LOJA tiles. Section headings outside
   the tiles are deliberately not used.
   ============================================================ */
.divalvs-home-tile-title{
    position:relative!important;
    z-index:10!important;
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    color:#171717!important;
    font-family:var(--divalvs-font-family)!important;
    font-size:16px!important;
    font-weight:700!important;
    line-height:24px!important;
    letter-spacing:0!important;
    text-align:left!important;
    text-transform:uppercase!important;
}

.divalvs-home-tile-title--media{
    position:absolute!important;
    top:24px!important;
    left:24px!important;
    right:24px!important;
    width:auto!important;
    color:#fff!important;
    text-shadow:0 1px 3px rgba(0,0,0,.35)!important;
}

.divalvs-home-team-copy p{
    margin-top:0!important;
    margin-bottom:0!important;
}


/* LOJA uses one continuous overlay for content and the global footer. */
body.divalvs-products-page::after{
    content:""!important;
    position:fixed!important;
    inset:0!important;
    z-index:0!important;
    background:rgba(0,0,0,.30)!important;
    pointer-events:none!important;
}

body.divalvs-products-page #app-shell{
    position:relative!important;
    z-index:1!important;
}

/* ============================================================
   HOME > SERVIÇOS BOOKING ACTION
   ------------------------------------------------------------
   The booking control shares the SERVIÇOS header row and uses the
   same 48px icon geometry as the service action buttons below.
   ============================================================ */
.divalvs-services-heading-row{
    position:relative!important;
    z-index:10!important;
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:16px!important;
    width:100%!important;
    min-height:48px!important;
    margin:0!important;
    padding:0!important;
}

.divalvs-services-heading-row .divalvs-home-tile-title{
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    padding-top:0!important;
}

.divalvs-services-booking-btn{
    position:relative!important;
    z-index:20!important;
    display:inline-flex!important;
    flex:0 0 48px!important;
    align-items:center!important;
    justify-content:center!important;
    width:48px!important;
    min-width:48px!important;
    max-width:48px!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:var(--divalvs-radius-icon-button)!important;
    overflow:hidden!important;
    background:transparent!important;
    box-shadow:none!important;
    text-decoration:none!important;
    cursor:pointer!important;
    transform:none!important;
    transition:none!important;
    animation:none!important;
    -webkit-tap-highlight-color:transparent!important;
}

.divalvs-services-booking-btn img{
    display:block!important;
    width:48px!important;
    min-width:48px!important;
    max-width:48px!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:var(--divalvs-radius-icon-button)!important;
    object-fit:cover!important;
    pointer-events:none!important;
    transform:none!important;
    transition:none!important;
    animation:none!important;
}

.divalvs-services-booking-btn:hover,
.divalvs-services-booking-btn:focus,
.divalvs-services-booking-btn:focus-visible,
.divalvs-services-booking-btn:active{
    background:transparent!important;
    box-shadow:none!important;
    transform:none!important;
    transition:none!important;
    animation:none!important;
}

.divalvs-services-booking-btn:focus-visible{
    outline:2px solid rgba(23,23,23,.72)!important;
    outline-offset:3px!important;
}

