/*!
 * Start Bootstrap - Creative Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

html,
body {
    width: 100%;
    height: 100%;
}

body {
    font-family: Merriweather,'Helvetica Neue',Arial,sans-serif;
}

hr {
    max-width: 50px;
    border-color: #f05f40;
    border-width: 3px;
}

hr.light {
    border-color: #fff;
}

a {
    color: #f05f40;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

a:hover,
a:focus {
    color: #eb3812;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
}

p {
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 1.5;
}

.bg-primary {
    background-color: #f05f40;
}

.bg-dark {
    color: #fff;
    background-color: #222;
}

.text-faded {
    color: rgba(255,255,255,.7);
}

section {
    padding: 100px 0;
}

aside {
    padding: 50px 0;
}

.no-padding {
    padding: 0;
}

.navbar-default {
    border-color: rgba(34,34,34,.05);
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
    background-color: #fff;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.navbar-default .navbar-header .navbar-brand {
    text-transform: uppercase;
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
    font-weight: 700;
    color: #f05f40;
}

.navbar-default .navbar-header .navbar-brand:hover,
.navbar-default .navbar-header .navbar-brand:focus {
    color: #eb3812;
}

.navbar-default .nav > li>a,
.navbar-default .nav>li>a:focus {
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    color: #222;
}

.navbar-default .nav > li>a:hover,
.navbar-default .nav>li>a:focus:hover {
    color: #f05f40;
}

.navbar-default .nav > li.active>a,
.navbar-default .nav>li.active>a:focus {
    color: #f05f40!important;
    background-color: transparent;
}

.navbar-default .nav > li.active>a:hover,
.navbar-default .nav>li.active>a:focus:hover {
    background-color: transparent;
}

@media(min-width:768px) {
    .navbar-default {
        border-color: rgba(255,255,255,.3);
        background-color: transparent;
    }

    .navbar-default .navbar-header .navbar-brand {
        color: rgba(255,255,255,.7);
    }

    .navbar-default .navbar-header .navbar-brand:hover,
    .navbar-default .navbar-header .navbar-brand:focus {
        color: #fff;
    }

    .navbar-default .nav > li>a,
    .navbar-default .nav>li>a:focus {
        color: rgba(255,255,255,.7);
    }

    .navbar-default .nav > li>a:hover,
    .navbar-default .nav>li>a:focus:hover {
        color: #fff;
    }

    .navbar-default.affix {
        border-color: rgba(34,34,34,.05);
        background-color: #fff;
    }

    .navbar-default.affix .navbar-header .navbar-brand {
        font-size: 14px;
        color: #f05f40;
    }

    .navbar-default.affix .navbar-header .navbar-brand:hover,
    .navbar-default.affix .navbar-header .navbar-brand:focus {
        color: #eb3812;
    }

    .navbar-default.affix .nav > li>a,
    .navbar-default.affix .nav>li>a:focus {
        color: #222;
    }

    .navbar-default.affix .nav > li>a:hover,
    .navbar-default.affix .nav>li>a:focus:hover {
        color: #f05f40;
    }
}

header {
    position: relative;
    width: 100%;
    min-height: auto;
    text-align: center;
    color: #fff;
    background-image: url(../img/header.jpg);
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

header .header-content {
    position: relative;
    width: 100%;
    padding: 100px 15px;
    text-align: center;
}

header .header-content .header-content-inner h1 {
    margin-top: 0;
    margin-bottom: 0;
    text-transform: uppercase;
    font-weight: 700;
}

header .header-content .header-content-inner hr {
    margin: 30px auto;
}

header .header-content .header-content-inner p {
    margin-bottom: 50px;
    font-size: 16px;
    font-weight: 300;
    color: rgba(255,255,255,.7);
}

@media(min-width:768px) {
    header {
        min-height: 100%;
    }

    header .header-content {
        position: absolute;
        top: 50%;
        padding: 0 50px;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    header .header-content .header-content-inner {
        margin-right: auto;
        margin-left: auto;
        max-width: 1000px;
    }

    header .header-content .header-content-inner p {
        margin-right: auto;
        margin-left: auto;
        max-width: 80%;
        font-size: 18px;
    }
}

.section-heading {
    margin-top: 0;
}

.service-box {
    margin: 50px auto 0;
    max-width: 400px;
}

@media(min-width:992px) {
    .service-box {
        margin: 20px auto 0;
    }
}

.service-box p {
    margin-bottom: 0;
}

.portfolio-box {
    display: block;
    position: relative;
    margin: 0 auto;
    max-width: 650px;
}

.portfolio-box .portfolio-box-caption {
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    color: #fff;
    opacity: 0;
    background: rgba(240,95,64,.9);
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content {
    position: absolute;
    top: 50%;
    width: 100%;
    text-align: center;
    transform: translateY(-50%);
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category,
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    padding: 0 15px;
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    font-size: 18px;
}

.portfolio-box:hover .portfolio-box-caption {
    opacity: 1;
}

@media(min-width:768px) {
    .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
        font-size: 16px;
    }

    .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
        font-size: 22px;
    }
}

.call-to-action h2 {
    margin: 0 auto 20px;
}

.text-primary {
    color: #f05f40;
}

.no-gutter > [class*=col-] {
    padding-right: 0;
    padding-left: 0;
}

.btn-default {
    border-color: #fff;
    color: #222;
    background-color: #fff;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    border-color: #ededed;
    color: #222;
    background-color: #f2f2f2;
}

.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
    background-image: none;
}

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
    border-color: #fff;
    background-color: #fff;
}

.btn-default .badge {
    color: #fff;
    background-color: #222;
}

.btn-primary {
    border-color: #f05f40;
    color: #fff;
    background-color: #f05f40;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    border-color: #ed431f;
    color: #fff;
    background-color: #ee4b28;
}

.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    background-image: none;
}

.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    border-color: #f05f40;
    background-color: #f05f40;
}

.btn-primary .badge {
    color: #f05f40;
    background-color: #fff;
}

.btn {
    border: 0;
    border-radius: 300px;
    text-transform: uppercase;
    font-family: 'Open Sans','Helvetica Neue',Arial,sans-serif;
    font-weight: 700;
}

.btn-xl {
    padding: 15px 30px;
}

::-moz-selection {
    text-shadow: none;
    color: #fff;
    background: #222;
}

::selection {
    text-shadow: none;
    color: #fff;
    background: #222;
}

img::selection {
    color: #fff;
    background: 0 0;
}

img::-moz-selection {
    color: #fff;
    background: 0 0;
}

body {
    webkit-tap-highlight-color: #222;
}
/* Accessibility and native navigation */
.bg-primary,.btn-primary{background-color:#b63b23;border-color:#b63b23}
.text-faded{color:#fff}
a,.text-primary,.navbar-default .navbar-header .navbar-brand,.navbar-default.affix .navbar-header .navbar-brand{color:#a9341e}
a:hover,a:focus{color:#862817}
.btn-primary:hover,.btn-primary:focus{background-color:#96311d;border-color:#96311d;color:#fff}
.navbar-default .nav>li>a:hover,.navbar-default .nav>li>a:focus:hover,.navbar-default .nav>li.active>a{color:#a9341e!important}
#contact a{text-decoration:underline}
.skip-link{position:fixed;top:0;left:1rem;z-index:2000;background:#fff;color:#222;padding:1rem;transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}
a:focus-visible,button:focus-visible{outline:3px solid #222;outline-offset:4px;box-shadow:0 0 0 6px #fff}
main:focus,section:focus,header:focus{outline:none}
[id]{scroll-margin-top:70px}
header .header-content .header-content-inner h1{font-size:clamp(35px,5vw,65px)}
header .header-content .header-content-inner .hero-subtitle{color:#fff;font-size:clamp(18px,2vw,24px);font-weight:600;text-shadow:0 1px 5px #000}
.navbar-default{background:#fff}
.navbar-default .navbar-header .navbar-brand{font-size:clamp(14px,3.3vw,18px)}
.navbar-default .nav>li>a,.navbar-default .nav>li>a:focus{color:#222}
@media(min-width:768px){.navbar-default{background:#fff}.navbar-default .navbar-header .navbar-brand{color:#a9341e}.navbar-default .navbar-header .navbar-brand:hover,.navbar-default .navbar-header .navbar-brand:focus{color:#862817}.navbar-default .nav>li>a,.navbar-default .nav>li>a:focus{color:#222}.navbar-default .nav>li>a:hover{color:#a9341e}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

header{background-image:linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),url(../img/header.jpg)}
@media(min-width:768px){header{min-height:100vh}}

/* Service cards and progressive motion */
.services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0}
.services-grid>[class*=col-]{float:none;width:auto;padding:0;display:flex}
.service-box{width:100%;max-width:none;margin:0;padding:30px 24px;border:1px solid #dedede;border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.05);transition:transform .2s,box-shadow .2s}
.service-box:hover,.service-box:focus-within{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.1)}
.service-box h3{line-height:1.35;margin-top:20px;min-height:2.7em}
.service-box .service-intro{color:#444;margin-bottom:20px}
.service-box details{text-align:left;border-top:1px solid #eee;padding-top:16px}
.service-box summary{cursor:pointer;color:#a9341e;font:700 16px/1.5 'Open Sans',sans-serif;padding:8px 0}
.service-box summary:focus-visible{outline:3px solid #222;outline-offset:4px}
.service-box details[open] summary{margin-bottom:12px}
.process-section{background:#f7f4f2}
.process-grid{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;padding:0;margin:48px 0}
.process-grid li{padding:24px;background:#fff;border:1px solid #dedede;border-radius:18px}
.step-number{display:inline-block;color:#a9341e;font:700 36px/1.2 'Open Sans',sans-serif}
.process-grid h3{line-height:1.35}
@media(min-width:768px) and (max-width:991px){.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.services-grid,.process-grid{grid-template-columns:1fr}.service-box h3{min-height:0}section{padding:70px 0}}
@media(prefers-reduced-motion:no-preference){.hero-enter{animation:hero-in .65s ease-out both}.reveal-observed{opacity:0;transform:translateY(16px);transition:opacity .5s ease-out,transform .5s ease-out}.reveal-observed.is-visible,.reveal-observed:focus-within{opacity:1;transform:none}}
@keyframes hero-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.service-box:hover,.service-box:focus-within{transform:none}.reveal-observed{opacity:1;transform:none}}

.services-grid::before,.services-grid::after{display:none;content:none}

/* A concise, visual introduction to Viste-m */
.about-heading{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center;text-align:left}
.about-eyebrow{font:700 14px/1.5 'Open Sans',sans-serif;text-transform:uppercase;letter-spacing:.12em;margin-bottom:18px}
.about-heading h2{font-size:clamp(30px,3.3vw,44px);line-height:1.18;margin:0;font-weight:600}
.about-lead{font-size:19px;line-height:1.8;margin:0}
.about-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:48px 0 32px}
.about-benefits li{padding:28px;border:1px solid rgba(255,255,255,.55);border-radius:18px;background:rgba(0,0,0,.09)}
.about-label{font:700 13px/1.5 'Open Sans',sans-serif;text-transform:uppercase;letter-spacing:.08em}
.about-benefits h3{font-size:23px;line-height:1.35;margin:16px 0}
.about-benefits p{font-size:16px;line-height:1.7;margin:0}
.about-action{text-align:center}.about-action p{margin:0 0 18px;font-size:18px}
@media(max-width:767px){.about-heading,.about-benefits{grid-template-columns:1fr;gap:24px}.about-lead{font-size:17px}.about-benefits{margin-top:32px}.about-benefits li{padding:24px}}

.about-section{background:#f7f4f0;color:#282522}
.about-heading{grid-template-columns:1fr 1fr;gap:56px}
.about-heading>div{padding:16px 0}
.about-eyebrow,.about-label{color:#a9341e}
.about-lead{font-size:18px;line-height:1.8;margin-top:24px;color:#48413b}
.about-photo{margin:0;position:relative}
.about-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:20px}
.about-photo figcaption{position:absolute;bottom:14px;left:14px;background:#fff;color:#48413b;padding:6px 12px;border-radius:20px;font:600 12px/1.4 'Open Sans',sans-serif}
.about-benefits li{background:#fff;border:1px solid #ded7cf;border-top:3px solid #b63b23}
.about-benefits p{color:#48413b}
.about-action .btn{background:#b63b23;color:#fff}.about-action .btn:hover,.about-action .btn:focus{background:#96311d;color:#fff}
@media(max-width:767px){.about-heading{grid-template-columns:1fr;gap:24px}.about-heading>div{padding:0}.about-lead{font-size:17px;margin-top:20px}}

.whatsapp-contact{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:40px;padding:32px;background:#f2f7f3;border:1px solid #c8d9cc;border-radius:18px;text-align:left}
.whatsapp-contact h3{margin:0 0 12px;line-height:1.35}.whatsapp-contact p{margin:0;color:#444}
#contact .whatsapp-button{background:#186b38;color:#fff;text-decoration:none;flex-shrink:0;white-space:normal;line-height:1.5}
#contact .whatsapp-button:hover,#contact .whatsapp-button:focus{background:#12542b;color:#fff}
.site-footer{background:#282522;color:#fff;text-align:center;padding:36px 0}.site-footer p{font-size:15px;margin:0 0 10px}.site-footer a{color:#fff;font:700 17px/1.6 'Open Sans',sans-serif;text-decoration:underline;text-underline-offset:4px}
@media(max-width:767px){.whatsapp-contact{flex-direction:column;align-items:stretch;padding:24px;gap:20px}.whatsapp-button{text-align:center}}

.navbar-default .navbar-header .navbar-brand{display:flex;align-items:center;gap:10px;height:64px;padding:10px 15px;text-transform:none}
.navbar-brand img{display:block;width:40px;height:40px;object-fit:contain}
.navbar-brand span{display:flex;flex-direction:column;gap:4px}.navbar-brand strong{font:700 15px/1.15 'Open Sans',sans-serif;letter-spacing:.025em}.navbar-brand small{font:600 11px/1.1 'Open Sans',sans-serif;letter-spacing:.22em;text-transform:uppercase}
.navbar-default .navbar-toggle{margin-top:15px;margin-bottom:15px}
@media(min-width:768px){.navbar-default .nav>li>a{padding-top:22px;padding-bottom:22px}}
@media(max-width:380px){.navbar-brand strong{font-size:13px}.navbar-brand img{width:34px;height:34px}.navbar-default .navbar-header .navbar-brand{gap:8px}}
[id]{scroll-margin-top:84px}

/* Existing Viste-m identity, served locally without altering the artwork. */
.navbar-default .navbar-header .navbar-brand{padding:8px 15px}
.navbar-brand img{width:285px;height:48px;object-fit:contain}
@media(max-width:767px){.navbar-brand img{width:215px;height:auto;max-height:48px}}

/* New Viste-m logo with a clear local service descriptor. */
.navbar-default .navbar-header .navbar-brand{gap:16px}
.navbar-brand img{width:120px;height:auto;max-height:40px}
.navbar-brand .brand-descriptor{border-left:1px solid #d3c8bf;padding-left:16px;gap:5px}
.navbar-brand .brand-descriptor strong{font:700 14px/1.3 'Merriweather',serif;letter-spacing:0;color:#4a4039}
.navbar-brand .brand-descriptor small{font:700 10px/1.2 'Open Sans',sans-serif;letter-spacing:.2em;color:#a9341e}
@media(max-width:767px){.navbar-default .navbar-header .navbar-brand{gap:10px}.navbar-brand img{width:90px;max-height:36px}.navbar-brand .brand-descriptor{padding-left:10px}.navbar-brand .brand-descriptor strong{font-size:12px}.navbar-brand .brand-descriptor small{font-size:9px}}

.service-icon{display:inline-block;fill:none;stroke:#a9341e;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}

.needs-section{background:#fff}.needs-grid{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:36px 0 28px;padding:0}.needs-grid li{display:flex}.needs-grid a{display:flex;flex-direction:column;width:100%;padding:24px;border:1px solid #ded7cf;border-radius:16px;color:#282522;background:#f7f4f0;text-decoration:none}.needs-grid h3{font-size:21px;line-height:1.4;margin:0 0 14px}.needs-grid p{font-size:15px;color:#48413b}.needs-grid a>span{margin-top:auto;color:#a9341e;font:700 14px/1.6 'Open Sans',sans-serif}.needs-grid a:hover{border-color:#a9341e;background:#f1ebe5}
.tariffs-section{background:#f7f4f0;color:#282522}.tariff-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:36px 0}.tariff-grid>div{background:#fff;border:1px solid #ded7cf;border-radius:16px;padding:24px}.tariff-grid dt{font:700 16px/1.5 'Open Sans',sans-serif;margin-bottom:12px}.tariff-grid dd{font-size:16px}.tariff-grid strong{color:#a9341e;font-size:24px}
.faq-list{max-width:850px;margin:36px auto 0}.faq-list details{border-bottom:1px solid #ded7cf;padding:20px 0}.faq-list summary{font:700 18px/1.5 'Open Sans',sans-serif;cursor:pointer;color:#4a4039}.faq-list summary:focus-visible{outline:3px solid #222;outline-offset:6px}.faq-list details p{margin:18px 0 0;line-height:1.8;color:#48413b}
header{margin-top:64px;background-position:center top;min-height:calc(100vh - 64px)}
@media(max-width:767px){.needs-grid,.tariff-grid{grid-template-columns:1fr}header{background-position:68% top;min-height:600px}}
