
/* ============================= CSS ============================= */

/* ===================================================== */
/* USEFUL LINKS                                            */
/* ===================================================== */

.main-section-link-useful {margin-top:50px;padding-top:35px;border-top:2px solid rgba(0,0,0,0.08);}

.main-section-link-useful h3 {margin:0px 0px 25px 0px;font-size:24px;color:var(--maincolor1);text-align:center;}

.main-section-link-useful-grid {display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:15px;}

.main-section-link-useful-grid a {padding:12px 20px;border-radius:12px;background:rgba(107,92,141,0.08);color:var(--maincolor1);font-weight:600;text-decoration:none;transition:all .25s ease;}

.main-section-link-useful-grid a:hover {transform:translateY(-2px);background:var(--maincolor1);color:white;}

.main-section-link-useful-active {padding:12px 20px;border-radius:12px;background:var(--maincolor1);color:white;font-weight:700;cursor:default;}

@media all and (max-width:768px) {

    .main-section-link-useful-grid {flex-direction:column;align-items:stretch;}

    .main-section-link-useful-grid a {text-align:center;}

    .main-section-link-useful-active {text-align:center;}
}
/* =============================================================== */





/* ===================================================== */
/* HOME PAGE */
/* ===================================================== */

.home-home-main-content {background:var(--bodycolor);padding:20px 0 50px 0;min-height:600px;}



/* ===================================================== */
/* HERO */
/* ===================================================== */

.home-hero {max-width:1300px;margin:20px auto;padding:100px 50px;text-align:center;border-radius:20px;position:relative;overflow:hidden;background:linear-gradient(135deg,rgb(20,35,70),rgb(15,120,110));color:white;box-shadow:0 15px 40px rgba(0,0,0,0.20);}

.home-hero::before {content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at top right,rgba(255,255,255,0.15),transparent 40%);}

.home-hero > * {position:relative;z-index:2;}

.home-hero h1 {margin:0 0 20px 0;font-size:64px;font-weight:bold;letter-spacing:3px;color:white;text-shadow:0 2px 8px rgba(0,0,0,0.25);}

.home-hero p {max-width:750px;margin:0 auto 40px auto;font-size:24px;line-height:1.8;color:rgb(240,240,240);}

.home-hero-actions {display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap;}

.home-hero-actions a {display:inline-block;text-decoration:none;padding:16px 32px;border-radius:8px;font-size:17px;font-weight:bold;transition:0.25s;}

.home-hero-actions a:first-child, .home-hero-actions a:nth-child(2) {background:white;color:rgb(20,35,70);}

.home-hero-actions a:first-child:hover, .home-hero-actions a:nth-child(2):hover {transform:translateY(-3px);box-shadow:0 5px 15px rgba(0,0,0,0.20);}

.home-hero-actions a:last-child {background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.30);color:white;}

.home-hero-actions a:last-child:hover {background:rgba(255,255,255,0.25);}



/* ===================================================== */
/* COMMON SECTIONS */
/* ===================================================== */

.home-presentation-section,.home-installation-section,.home-condition-section {max-width:1300px;margin:40px auto;padding:40px;background:white;border-radius:15px;box-shadow:0 5px 20px rgba(0,0,0,0.08);}

.home-presentation-section h2,.home-installation-section h2,.home-condition-section h2 {margin:0 0 25px 0;padding-bottom:15px;font-size:32px;color:var(--maincolor1);border-bottom:3px solid rgb(15,120,110);}

.home-presentation-section p,.home-installation-section p,.home-condition-section p {margin-bottom:18px;line-height:1.9;text-align:left;font-size:16px;color:rgb(60,60,60);}



/* ===================================================== */
/* CONTENT LINKS */
/* ===================================================== */

.home-presentation-section a,.home-installation-section a,.home-condition-section a {display:inline-block;padding:8px 14px;margin:3px 0;background:rgb(15,120,110);color:white;text-decoration:none;border-radius:5px;font-weight:bold;transition:0.2s;}

.home-presentation-section a:hover,.home-installation-section a:hover,.home-condition-section a:hover {background:var(--maincolor1);}



/* ===================================================== */
/* ICONS */
/* ===================================================== */

.home-home-main-content .fa-angle-double-right {margin-right:10px;color:rgb(15,120,110);font-size:20px;}



/* ===================================================== */
/* BANNER */
/* ===================================================== */

.home-banner-section {max-width:1200px;margin:40px auto;text-align:center;}

.home-banner-image {max-width:100%;height:auto;border-radius:15px;box-shadow:0 10px 25px rgba(0,0,0,0.15);transition:0.3s;}

.home-banner-image:hover {transform:scale(1.02);}



/* ===================================================== */
/* INSTALLATION */
/* ===================================================== */

.home-installation-section p {margin-bottom:18px;}



/* ===================================================== */
/* CONDITIONS */
/* ===================================================== */

.home-condition-section {text-align:left;}



/* ===================================================== */
/* MOBILE */
/* ===================================================== */

@media all and (max-width:1024px) {

    .home-home-main-content {padding-top:10px;}

    .home-hero {margin:20px 10px;padding:60px 20px;}

    .home-hero h1 {font-size:38px;line-height:1.3;}

    .home-hero p {font-size:18px;line-height:1.7;}

    .home-hero-actions {flex-direction:column;align-items:center;}

    .home-hero-actions a {width:100%;max-width:320px;box-sizing:border-box;}

    .home-presentation-section,.home-installation-section,.home-condition-section {margin:20px 10px;padding:25px;}

    .home-presentation-section h2,.home-installation-section h2,.home-condition-section h2 {font-size:26px;}

    .home-presentation-section p,.home-installation-section p,.home-condition-section p {font-size:15px;}

    .home-banner-section {margin:20px 10px;}

}














