/* =====================================================
JP OIL HUB - PROFESSIONAL STYLE
===================================================== */

:root{
    --primary:#a60000;
    --secondary:#ff9800;
    --gold:#ffc107;
    --dark:#1b1b1b;
    --light:#fafafa;
    --white:#fff;
    --shadow:0 20px 50px rgba(0,0,0,.12);
    --radius:22px;
    }
    
    *{
    margin:0;
    padding:0;
    box-sizing:border-box;
    }
    
    html{
    scroll-behavior:smooth;
    }
    
    body{
    font-family:'Poppins',sans-serif;
    background:#fff;
    color:#222;
    line-height:1.6;
    }
    
    img{
    max-width:100%;
    display:block;
    }
    
    a{
    text-decoration:none;
    }
    
    section{
    padding:90px 8%;
    }
    
    
    /* ================= HEADER ================= */
    
    header{
    position:fixed;
    top:0;
    width:100%;
    z-index:999;
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(15px);
    box-shadow:0 5px 25px rgba(0,0,0,.08);
    }
    
    .navbar{
    height:85px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    }
    
    .logo{
    display:flex;
    align-items:center;
    gap:15px;
    }
    
    .logo img{
    width:60px;
    height:60px;
    border-radius:50%;
    object-fit:cover;
    }
    
    .logo h2{
    font-size:30px;
    font-weight:800;
    color:var(--primary);
    }
    
    .menu{
    display:flex;
    gap:30px;
    }
    
    .menu a{
    color:#333;
    font-weight:600;
    transition:.3s;
    }
    
    .menu a:hover{
    color:var(--primary);
    }
    
    
    /* ================= BUTTONS ================= */
    
    .btn-primary,
    .btn-outline{
    padding:14px 32px;
    border-radius:50px;
    font-weight:700;
    display:inline-block;
    transition:.4s;
    }
    
    .btn-primary{
    background:linear-gradient(135deg,#a60000,#e53935);
    color:white;
    box-shadow:var(--shadow);
    }
    
    .btn-primary:hover{
    transform:translateY(-5px);
    }
    
    .btn-outline{
    border:2px solid var(--primary);
    color:var(--primary);
    }
    
    .btn-outline:hover{
    background:var(--primary);
    color:white;
    }
    
    
    /* ================= HERO ================= */
    
    /* =====================================
     HERO PREMIUM JP OIL
    ===================================== */
    
    
    .hero{
    
    height:95vh;
    
    position:relative;
    
    display:flex;
    
    align-items:center;
    
    overflow:hidden;
    
    margin-top:80px;
    
    }
    
    
    
    .hero-background{
    
    position:absolute;
    
    inset:0;
    
    background-image:url("image/5.jpg");
    
    background-size:cover;
    
    background-position:center;
    
    transform:scale(1.05);
    
    animation:zoomHero 15s infinite alternate;
    
    }
    
    
    
    @keyframes zoomHero{
    
    from{
    
    transform:scale(1);
    
    }
    
    to{
    
    transform:scale(1.12);
    
    }
    
    }
    
    
    
    
    .hero-overlay{
    
    position:absolute;
    
    inset:0;
    
    background:
    
    linear-gradient(
    90deg,
    rgba(0,0,0,.75),
    rgba(0,0,0,.35)
    );
    
    }
    
    
    
    
    .hero-content{
    
    position:relative;
    
    z-index:2;
    
    max-width:750px;
    
    color:white;
    
    padding-left:8%;
    
    }
    
    
    
    .hero-tag{
    
    display:inline-block;
    
    background:#ffc107;
    
    color:#222;
    
    padding:10px 25px;
    
    border-radius:30px;
    
    font-weight:700;
    
    margin-bottom:25px;
    
    }
    
    
    
    .hero-content h1{
    
    font-size:70px;
    
    line-height:1.1;
    
    font-weight:800;
    
    margin-bottom:25px;
    
    }
    
    
    
    .hero-content p{
    
    font-size:21px;
    
    line-height:1.8;
    
    color:#f5f5f5;
    
    margin-bottom:40px;
    
    }
    
    
    
    
    .hero-buttons{
    
    display:flex;
    
    gap:20px;
    
    }
    
    
    
    
    .hero-trust{
    
    display:flex;
    
    gap:30px;
    
    margin-top:50px;
    
    }
    
    
    
    .hero-trust div{
    
    display:flex;
    
    align-items:center;
    
    gap:10px;
    
    font-weight:600;
    
    }
    
    
    
    .hero-trust i{
    
    color:#ffc107;
    
    }
    
    
    
    
    @media(max-width:900px){
    
    
    .hero{
    
    height:90vh;
    
    }
    
    
    
    .hero-content{
    
    padding:0 25px;
    
    }
    
    
    
    .hero-content h1{
    
    font-size:40px;
    
    }
    
    
    
    .hero-content p{
    
    font-size:17px;
    
    }
    
    
    
    .hero-trust{
    
    display:none;
    
    }
    
    
    }
    
    
    /* ================= STATS ================= */
    
    .stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
    background:#fafafa;
    }
    
    .stat{
    text-align:center;
    padding:35px;
    border-radius:20px;
    background:white;
    box-shadow:var(--shadow);
    transition:.4s;
    }
    
    .stat:hover{
    transform:translateY(-10px);
    }
    
    .stat h2{
    font-size:45px;
    color:var(--primary);
    }
    
    
    /* ================= PRODUCTS ================= */
    
    .products h2,
    .process h2,
    .testimonials h2,
    .blog h2,
    .contact h2{
    text-align:center;
    font-size:40px;
    margin-bottom:50px;
    font-weight:800;
    }
    
    .cards{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;
    }
    
    .card{
    background:white;
    border-radius:25px;
    overflow:hidden;
    box-shadow:var(--shadow);
    padding-bottom:25px;
    transition:.4s;
    }
    
    .card:hover{
    transform:translateY(-12px);
    }
    
    .card img{
    height:260px;
    width:100%;
    object-fit:contain;
    padding:25px;
    }
    
    .card h3,
    .card p{
    padding:0 25px;
    }
    
    .card button{
    margin:20px 25px;
    background:var(--primary);
    color:white;
    border:0;
    padding:12px 30px;
    border-radius:30px;
    }
    
    
    /* ================= PROCESS ================= */
    
    .steps{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
    }
    
    .step{
    text-align:center;
    padding:35px;
    border-radius:20px;
    background:#fff;
    box-shadow:var(--shadow);
    }
    
    .step i{
    font-size:45px;
    color:var(--primary);
    margin-bottom:20px;
    }
    
    
    /* ================= INDUSTRY ================= */
    
    .industry{
    display:flex;
    align-items:center;
    gap:50px;
    background:#fafafa;
    }
    
    .industry .left{
    flex:1;
    }
    
    .industry h2{
    font-size:45px;
    margin-bottom:20px;
    }
    
    .industry .right{
    flex:1;
    }
    
    .industry img{
    border-radius:25px;
    box-shadow:var(--shadow);
    }
    
    
    /* ================= TESTIMONIAL ================= */
    
    .testimonial{
    max-width:600px;
    margin:auto;
    background:white;
    padding:40px;
    border-radius:25px;
    box-shadow:var(--shadow);
    text-align:center;
    }
    
    
    /* ================= BLOG ================= */
    
    .blog-card{
    max-width:450px;
    margin:auto;
    background:white;
    border-radius:20px;
    overflow:hidden;
    box-shadow:var(--shadow);
    }
    
    .blog-card h3,
    .blog-card a{
    display:block;
    padding:20px;
    }
    
    
    /* ================= CONTACT ================= */
    
    .contact form{
    max-width:700px;
    margin:auto;
    display:grid;
    gap:20px;
    }
    
    .contact input,
    .contact textarea{
    padding:18px;
    border-radius:15px;
    border:1px solid #ddd;
    font-size:16px;
    }
    
    .contact button{
    background:var(--primary);
    color:white;
    border:0;
    padding:15px;
    border-radius:30px;
    font-weight:bold;
    }
    
    
    /* ================= FOOTER ================= */
    
    footer{
    background:#111;
    color:white;
    text-align:center;
    padding:40px;
    }
    
    .footer-logo{
    font-size:30px;
    font-weight:800;
    color:var(--gold);
    }
    
    
    /* ================= RESPONSIVE ================= */
    
    
    @media(max-width:1000px){
    
    .menu{
    display:none;
    }
    
    .stats,
    .cards,
    .steps{
    grid-template-columns:repeat(2,1fr);
    }
    
    .industry{
    flex-direction:column;
    }
    
    }
    
    
    @media(max-width:600px){
    
    section{
    padding:60px 5%;
    }
    
    .logo h2{
    font-size:22px;
    }
    
    .hero{
    height:85vh;
    }
    
    .hero-content p{
    font-size:17px;
    }
    
    .hero-buttons{
    flex-direction:column;
    }
    
    .stats,
    .cards,
    .steps{
    grid-template-columns:1fr;
    }
    
    .products h2,
    .process h2,
    .contact h2{
    font-size:30px;
    }
    
    .industry h2{
    font-size:32px;
    }
    
    }
    
    
    
    /* =====================================================
    JP OIL HUB - PREMIUM ENHANCEMENT PACK
    BLOC 2
    ===================================================== */
    
    
    /* ===== GLOBAL PREMIUM EFFECT ===== */
    
    ::selection{
    background:var(--primary);
    color:white;
    }
    
    
    body{
    overflow-x:hidden;
    }
    
    
    section{
    position:relative;
    }
    
    
    h1,h2,h3{
    letter-spacing:-.5px;
    }
    
    
    /* ===== HEADER IMPROVEMENT ===== */
    
    header{
    transition:.4s;
    }
    
    
    header:hover{
    box-shadow:0 10px 40px rgba(0,0,0,.15);
    }
    
    
    .logo img{
    transition:.5s;
    }
    
    
    .logo img:hover{
    transform:rotate(10deg) scale(1.1);
    }
    
    
    .actions a{
    white-space:nowrap;
    }
    
    
    /* ===== HERO PREMIUM ===== */
    
    
    .hero:after{
    content:"";
    position:absolute;
    bottom:-1px;
    left:0;
    width:100%;
    height:120px;
    background:linear-gradient(
    transparent,
    white
    );
    z-index:1;
    }
    
    
    .hero-content{
    animation:heroMove 1.2s ease;
    }
    
    
    @keyframes heroMove{
    
    from{
    opacity:0;
    transform:translateY(60px);
    }
    
    to{
    opacity:1;
    transform:translateY(0);
    }
    
    }
    
    
    
    .hero-buttons a{
    position:relative;
    overflow:hidden;
    }
    
    
    .hero-buttons a:before{
    content:"";
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background:white;
    opacity:.2;
    transition:.5s;
    }
    
    
    .hero-buttons a:hover:before{
    left:100%;
    }
    
    
    /* ===== TITLES ===== */
    
    
    .products h2:after,
    .process h2:after,
    .blog h2:after,
    .contact h2:after{
    
    content:"";
    display:block;
    width:80px;
    height:5px;
    background:var(--gold);
    border-radius:20px;
    margin:15px auto;
    
    }
    
    
    
    /* ===== STATS ADVANCED ===== */
    
    
    .stats{
    position:relative;
    margin-top:-40px;
    z-index:5;
    }
    
    
    .stat{
    cursor:pointer;
    border-top:5px solid var(--primary);
    }
    
    
    .stat p{
    color:#777;
    font-weight:600;
    }
    
    
    .stat h2{
    transition:.4s;
    }
    
    
    .stat:hover h2{
    transform:scale(1.15);
    color:var(--gold);
    }
    
    
    
    
    /* ===== PRODUCTS ADVANCED ===== */
    
    
    .card{
    position:relative;
    }
    
    
    .card:before{
    
    content:"QUALITÉ PREMIUM";
    
    position:absolute;
    
    top:20px;
    
    left:20px;
    
    background:var(--primary);
    
    color:white;
    
    font-size:11px;
    
    font-weight:700;
    
    padding:7px 15px;
    
    border-radius:30px;
    
    z-index:2;
    
    }
    
    
    
    .card img{
    
    transition:.5s;
    
    }
    
    
    
    .card:hover img{
    
    transform:scale(1.08);
    
    }
    
    
    
    .card h3{
    
    font-size:24px;
    
    color:var(--primary);
    
    margin-top:10px;
    
    }
    
    
    
    .card p{
    
    color:#666;
    
    }
    
    
    
    .card button{
    
    transition:.4s;
    
    cursor:pointer;
    
    }
    
    
    
    .card button:hover{
    
    background:var(--gold);
    
    color:#222;
    
    transform:translateY(-4px);
    
    }
    
    
    
    /* ===== PROCESS ===== */
    
    
    .step{
    
    position:relative;
    
    overflow:hidden;
    
    }
    
    
    .step:before{
    
    content:"";
    
    position:absolute;
    
    width:100px;
    
    height:100px;
    
    background:rgba(183,28,28,.08);
    
    border-radius:50%;
    
    top:-30px;
    
    right:-30px;
    
    }
    
    
    
    .step i{
    
    transition:.4s;
    
    }
    
    
    
    .step:hover i{
    
    transform:translateY(-10px) rotate(5deg);
    
    color:var(--gold);
    
    }
    
    
    
    /* ===== INDUSTRY ===== */
    
    
    .industry{
    
    overflow:hidden;
    
    }
    
    
    
    .industry .left{
    
    animation:leftMove 1s ease;
    
    }
    
    
    
    @keyframes leftMove{
    
    from{
    
    opacity:0;
    
    transform:translateX(-50px);
    
    }
    
    to{
    
    opacity:1;
    
    transform:translateX(0);
    
    }
    
    }
    
    
    
    .industry img{
    
    transition:.5s;
    
    }
    
    
    
    .industry img:hover{
    
    transform:scale(1.05);
    
    }
    
    
    
    /* ===== TESTIMONIAL ===== */
    
    
    .testimonial{
    
    position:relative;
    
    }
    
    
    
    .testimonial:before{
    
    content:"“";
    
    position:absolute;
    
    top:-40px;
    
    left:20px;
    
    font-size:100px;
    
    color:var(--gold);
    
    font-weight:800;
    
    }
    
    
    
    .testimonial p{
    
    font-size:20px;
    
    font-style:italic;
    
    }
    
    
    
    /* ===== BLOG PREMIUM ===== */
    
    
    .blog-card img{
    
    height:260px;
    
    width:100%;
    
    object-fit:cover;
    
    }
    
    
    
    .blog-card h3{
    
    font-size:22px;
    
    }
    
    
    
    .blog-card a{
    
    color:var(--primary);
    
    font-weight:700;
    
    transition:.3s;
    
    }
    
    
    
    .blog-card a:hover{
    
    color:var(--gold);
    
    }
    
    
    
    /* ===== CONTACT PREMIUM ===== */
    
    
    .contact{
    
    background:
    
    linear-gradient(
    
    135deg,
    
    #fff,
    
    #fafafa
    
    );
    
    }
    
    
    
    .contact input:focus,
    .contact textarea:focus{
    
    outline:none;
    
    border-color:var(--primary);
    
    box-shadow:0 0 15px rgba(183,28,28,.2);
    
    }
    
    
    
    .contact button{
    
    cursor:pointer;
    
    transition:.4s;
    
    }
    
    
    
    .contact button:hover{
    
    background:#7f0000;
    
    transform:translateY(-5px);
    
    }
    
    
    
    /* ===== FOOTER ADVANCED ===== */
    
    
    footer{
    
    position:relative;
    
    overflow:hidden;
    
    }
    
    
    footer:before{
    
    content:"";
    
    position:absolute;
    
    width:300px;
    
    height:300px;
    
    background:rgba(255,193,7,.08);
    
    border-radius:50%;
    
    top:-150px;
    
    right:-100px;
    
    }
    
    
    
    .footer-logo{
    
    position:relative;
    
    }
    
    
    
    /* ===== SCROLL ANIMATION ===== */
    
    
    .card,
    .stat,
    .step,
    .blog-card,
    .testimonial{
    
    animation:fadeUp .8s ease both;
    
    }
    
    
    
    @keyframes fadeUp{
    
    from{
    
    opacity:0;
    
    transform:translateY(30px);
    
    }
    
    
    to{
    
    opacity:1;
    
    transform:translateY(0);
    
    }
    
    }
    
    
    
    /* ===== MOBILE POWER ===== */
    
    
    @media(max-width:600px){
    
    
    .actions{
    
    gap:8px;
    
    }
    
    
    .actions .btn-outline{
    
    display:none;
    
    }
    
    
    .hero-content{
    
    text-align:center;
    
    }
    
    
    .hero-buttons{
    
    align-items:center;
    
    }
    
    
    .card:before{
    
    font-size:9px;
    
    }
    
    
    .stat h2{
    
    font-size:38px;
    
    }
    
    
    .industry{
    
    text-align:center;
    
    }
    
    
    .testimonial{
    
    padding:30px 20px;
    
    }
    
    }
    
    
    
    /* ======================================
    MODULE 1 SHOP JP OIL
    ====================================== */
    
    
    .shop-section{
    background:#fafafa;
    }
    
    
    .shop-title{
    text-align:center;
    margin-bottom:50px;
    }
    
    
    .shop-title span{
    color:#b71c1c;
    font-weight:800;
    }
    
    
    .shop-title h2{
    font-size:42px;
    font-weight:800;
    }
    
    
    .shop-grid{
    
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    
    }
    
    
    
    .shop-card{
    
    background:white;
    border-radius:25px;
    overflow:hidden;
    box-shadow:0 15px 40px #0001;
    position:relative;
    transition:.4s;
    
    }
    
    
    
    .shop-card:hover{
    
    transform:translateY(-12px);
    
    }
    
    
    
    .shop-card img{
    
    height:280px;
    width:100%;
    object-fit:contain;
    padding:25px;
    
    }
    
    
    
    .product-badge{
    
    position:absolute;
    top:20px;
    left:20px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:8px 18px;
    
    border-radius:30px;
    
    font-size:13px;
    
    font-weight:700;
    
    }
    
    
    
    .shop-content{
    
    padding:25px;
    
    }
    
    
    .shop-content h3{
    
    font-size:24px;
    
    color:#b71c1c;
    
    }
    
    
    .description{
    
    color:#777;
    
    margin:15px 0;
    
    }
    
    
    .price{
    
    font-size:28px;
    
    font-weight:800;
    
    color:#222;
    
    }
    
    
    .stock{
    
    margin:15px 0;
    
    color:#2e7d32;
    
    font-weight:600;
    
    }
    
    
    .shop-actions{
    
    display:flex;
    
    gap:10px;
    
    }
    
    
    .shop-actions button,
    .shop-actions a{
    
    flex:1;
    
    text-align:center;
    
    padding:12px;
    
    border-radius:30px;
    
    border:0;
    
    background:#b71c1c;
    
    color:white;
    
    font-weight:700;
    
    cursor:pointer;
    
    }
    
    
    .shop-actions a{
    
    background:#25D366;
    
    }
    
    
    .industrial{
    
    border:3px solid #ff9800;
    
    }
    
    
    
    
    @media(max-width:900px){
    
    .shop-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    }
    
    
    
    @media(max-width:600px){
    
    .shop-grid{
    
    grid-template-columns:1fr;
    
    }
    
    .shop-title h2{
    
    font-size:30px;
    
    }
    
    }
    /* ===== END PREMIUM PACK ===== */
    
    
    
    /* =====================================
     MODULE 3 B2B JP OIL
    ===================================== */
    
    
    .b2b-section{
    
    background:
    linear-gradient(
    135deg,
    #fff7e6,
    #fff
    );
    
    }
    
    
    
    .b2b-header{
    
    text-align:center;
    
    max-width:800px;
    
    margin:auto;
    
    }
    
    
    
    .b2b-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    }
    
    
    
    .b2b-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:15px 0;
    
    }
    
    
    
    .b2b-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:40px;
    
    margin-top:50px;
    
    }
    
    
    
    .calculator-box{
    
    background:white;
    
    padding:40px;
    
    border-radius:30px;
    
    box-shadow:0 20px 50px #0002;
    
    }
    
    
    
    .calculator-box h3{
    
    font-size:28px;
    
    color:#b71c1c;
    
    margin-bottom:25px;
    
    }
    
    
    
    .calculator-box label{
    
    font-weight:700;
    
    display:block;
    
    margin-top:15px;
    
    }
    
    
    
    .calculator-box select{
    
    width:100%;
    
    padding:15px;
    
    border-radius:15px;
    
    border:1px solid #ddd;
    
    margin-top:8px;
    
    font-size:16px;
    
    }
    
    
    
    .price-result{
    
    background:#fafafa;
    
    margin-top:25px;
    
    padding:25px;
    
    border-radius:20px;
    
    text-align:center;
    
    }
    
    
    
    #quoteResult{
    
    font-size:35px;
    
    font-weight:800;
    
    color:#b71c1c;
    
    }
    
    
    
    .calculator-box button{
    
    margin-top:25px;
    
    width:100%;
    
    padding:16px;
    
    background:#25D366;
    
    color:white;
    
    border:0;
    
    border-radius:40px;
    
    font-size:18px;
    
    font-weight:700;
    
    cursor:pointer;
    
    }
    
    
    
    
    .b2b-info{
    
    display:grid;
    
    gap:25px;
    
    }
    
    
    
    .info-card{
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    box-shadow:0 15px 35px #0001;
    
    transition:.4s;
    
    }
    
    
    
    .info-card:hover{
    
    transform:translateX(10px);
    
    }
    
    
    
    .info-card i{
    
    font-size:40px;
    
    color:#b71c1c;
    
    margin-bottom:15px;
    
    }
    
    
    
    .info-card h3{
    
    font-size:22px;
    
    }
    
    
    
    
    @media(max-width:900px){
    
    
    .b2b-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    .b2b-header h2{
    
    font-size:32px;
    
    }
    
    }
    
    
    
    /* =================================================
    MODULE FABRICATION JP OIL
    ================================================= */
    
    
    .manufacturing{
    
    background:#fff;
    
    }
    
    
    
    .manufacturing-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .manufacturing-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    letter-spacing:2px;
    
    }
    
    
    
    .manufacturing-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .manufacturing-header p{
    
    color:#777;
    
    font-size:18px;
    
    }
    
    
    
    
    
    .production-timeline{
    
    position:relative;
    
    max-width:1100px;
    
    margin:auto;
    
    }
    
    
    
    .production-timeline:before{
    
    content:"";
    
    position:absolute;
    
    left:50%;
    
    top:0;
    
    height:100%;
    
    width:4px;
    
    background:#b71c1c;
    
    transform:translateX(-50%);
    
    }
    
    
    
    .production-step{
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    margin-bottom:70px;
    
    position:relative;
    
    }
    
    
    
    .production-step:nth-child(even){
    
    flex-direction:row-reverse;
    
    }
    
    
    
    .icon{
    
    width:80px;
    
    height:80px;
    
    background:#b71c1c;
    
    color:white;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    font-size:35px;
    
    position:absolute;
    
    left:50%;
    
    transform:translateX(-50%);
    
    z-index:2;
    
    }
    
    
    
    .content{
    
    width:45%;
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    box-shadow:0 20px 50px rgba(0,0,0,.12);
    
    }
    
    
    
    .content h3{
    
    font-size:25px;
    
    color:#b71c1c;
    
    margin-bottom:15px;
    
    }
    
    
    
    .content p{
    
    color:#666;
    
    margin-bottom:20px;
    
    }
    
    
    
    .content img{
    
    height:230px;
    
    width:100%;
    
    object-fit:cover;
    
    border-radius:20px;
    
    }
    
    
    
    
    .factory-video{
    
    max-width:900px;
    
    margin:80px auto 0;
    
    text-align:center;
    
    }
    
    
    
    .factory-video h2{
    
    font-size:35px;
    
    margin-bottom:30px;
    
    }
    
    
    
    .factory-video video{
    
    width:100%;
    
    border-radius:25px;
    
    box-shadow:0 20px 50px #0002;
    
    }
    
    
    
    
    @media(max-width:900px){
    
    
    .production-timeline:before{
    
    left:20px;
    
    }
    
    
    .production-step,
    .production-step:nth-child(even){
    
    flex-direction:column;
    
    align-items:flex-start;
    
    padding-left:60px;
    
    }
    
    
    
    .icon{
    
    left:20px;
    
    }
    
    
    
    .content{
    
    width:100%;
    
    }
    
    
    
    .manufacturing-header h2{
    
    font-size:32px;
    
    }
    
    
    }
    
    
    
    
    /* ==========================================
    MODULE A : UNIVERS DU PALMIER
    ========================================== */
    
    
    .palm-world{
    
    background:
    linear-gradient(
    135deg,
    #fff,
    #fff8e8
    );
    
    }
    
    
    
    .palm-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .palm-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    letter-spacing:2px;
    
    }
    
    
    
    .palm-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .palm-history{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:50px;
    
    align-items:center;
    
    }
    
    
    
    .palm-image img{
    
    height:450px;
    
    width:100%;
    
    object-fit:cover;
    
    border-radius:30px;
    
    box-shadow:0 20px 50px #0002;
    
    }
    
    
    
    .palm-text h3{
    
    font-size:32px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    .palm-text p{
    
    color:#666;
    
    font-size:17px;
    
    margin-bottom:20px;
    
    }
    
    
    
    .palm-title{
    
    text-align:center;
    
    margin:80px 0 40px;
    
    }
    
    
    
    .palm-cards{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    .palm-card{
    
    background:white;
    
    padding:35px;
    
    border-radius:25px;
    
    text-align:center;
    
    box-shadow:0 15px 40px #0001;
    
    transition:.4s;
    
    }
    
    
    
    .palm-card:hover{
    
    transform:translateY(-10px);
    
    }
    
    
    
    .palm-card i{
    
    font-size:45px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    .products-palm{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:25px;
    
    }
    
    
    
    .products-palm div{
    
    background:white;
    
    border-radius:20px;
    
    overflow:hidden;
    
    box-shadow:0 15px 35px #0001;
    
    transition:.4s;
    
    }
    
    
    
    .products-palm div:hover{
    
    transform:scale(1.04);
    
    }
    
    
    
    .products-palm img{
    
    height:220px;
    
    width:100%;
    
    object-fit:cover;
    
    }
    
    
    
    .products-palm h3,
    .products-palm p{
    
    padding:10px 20px;
    
    }
    
    
    
    .did-you-know{
    
    margin-top:80px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:35px;
    
    border-radius:30px;
    
    display:flex;
    
    align-items:center;
    
    gap:25px;
    
    }
    
    
    
    .did-you-know i{
    
    font-size:50px;
    
    color:#ffc107;
    
    }
    
    
    
    .did-you-know button{
    
    margin-left:auto;
    
    padding:14px 25px;
    
    border-radius:30px;
    
    border:0;
    
    background:#ffc107;
    
    font-weight:bold;
    
    cursor:pointer;
    
    }
    
    
    
    @media(max-width:900px){
    
    
    .palm-history{
    
    grid-template-columns:1fr;
    
    }
    
    
    .palm-cards{
    
    grid-template-columns:1fr;
    
    }
    
    
    .products-palm{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    .did-you-know{
    
    flex-direction:column;
    
    text-align:center;
    
    }
    
    
    .did-you-know button{
    
    margin:auto;
    
    }
    
    
    }
    
    
    
    @media(max-width:600px){
    
    
    .products-palm{
    
    grid-template-columns:1fr;
    
    }
    
    
    .palm-header h2{
    
    font-size:30px;
    
    }
    
    
    }
    
    
    
    /* =====================================
     MODULE C : RECETTE DU JOUR
    ===================================== */
    
    
    .recipe-section{
    
    background:#fff8e8;
    
    }
    
    
    
    .recipe-header{
    
    text-align:center;
    
    max-width:800px;
    
    margin:auto;
    
    margin-bottom:60px;
    
    }
    
    
    
    .recipe-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    letter-spacing:2px;
    
    }
    
    
    
    .recipe-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:15px 0;
    
    }
    
    
    
    .recipe-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:50px;
    
    max-width:1200px;
    
    margin:auto;
    
    background:white;
    
    padding:40px;
    
    border-radius:35px;
    
    box-shadow:0 20px 50px #0002;
    
    }
    
    
    
    
    .recipe-image{
    
    position:relative;
    
    }
    
    
    
    .recipe-image img{
    
    width:100%;
    
    height:500px;
    
    object-fit:cover;
    
    border-radius:30px;
    
    }
    
    
    
    
    .recipe-badge{
    
    position:absolute;
    
    top:25px;
    
    left:25px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:12px 25px;
    
    border-radius:30px;
    
    font-weight:700;
    
    }
    
    
    
    
    
    .recipe-content h2{
    
    font-size:35px;
    
    color:#b71c1c;
    
    margin-bottom:25px;
    
    }
    
    
    
    
    .recipe-info{
    
    display:flex;
    
    gap:20px;
    
    flex-wrap:wrap;
    
    margin-bottom:30px;
    
    }
    
    
    
    .recipe-info div{
    
    background:#fafafa;
    
    padding:12px 18px;
    
    border-radius:20px;
    
    }
    
    
    
    .recipe-info i{
    
    color:#b71c1c;
    
    margin-right:8px;
    
    }
    
    
    
    .recipe-content h3{
    
    margin-top:25px;
    
    font-size:22px;
    
    }
    
    
    
    .recipe-content ul{
    
    margin-top:15px;
    
    }
    
    
    
    .recipe-content li{
    
    margin-bottom:10px;
    
    }
    
    
    
    .recipe-change{
    
    margin-left:20px;
    
    padding:14px 25px;
    
    border:none;
    
    border-radius:30px;
    
    background:#ffc107;
    
    font-weight:700;
    
    cursor:pointer;
    
    }
    
    
    
    
    @media(max-width:900px){
    
    
    .recipe-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .recipe-image img{
    
    height:350px;
    
    }
    
    
    
    .recipe-header h2{
    
    font-size:32px;
    
    }
    
    
    
    }
    
    
    /* =====================================
     MODULE D : GALERIE CULINAIRE
    ===================================== */
    
    
    .culinary-gallery{
    
    background:#fff;
    
    }
    
    
    
    .gallery-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:50px;
    
    }
    
    
    
    .gallery-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    letter-spacing:2px;
    
    }
    
    
    
    .gallery-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .gallery-filter{
    
    display:flex;
    
    justify-content:center;
    
    gap:15px;
    
    flex-wrap:wrap;
    
    margin-bottom:50px;
    
    }
    
    
    
    .gallery-filter button{
    
    padding:12px 25px;
    
    border-radius:30px;
    
    border:none;
    
    background:#b71c1c;
    
    color:white;
    
    font-weight:600;
    
    cursor:pointer;
    
    transition:.3s;
    
    }
    
    
    
    .gallery-filter button:hover{
    
    background:#ffc107;
    
    color:#222;
    
    }
    
    
    
    
    .gallery-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    .food-card{
    
    background:white;
    
    border-radius:25px;
    
    overflow:hidden;
    
    box-shadow:0 15px 40px #0002;
    
    transition:.4s;
    
    }
    
    
    
    .food-card:hover{
    
    transform:translateY(-10px);
    
    }
    
    
    
    
    .food-card img{
    
    width:100%;
    
    height:280px;
    
    object-fit:cover;
    
    }
    
    
    
    
    
    .food-content{
    
    padding:25px;
    
    }
    
    
    
    
    .food-content h3{
    
    font-size:22px;
    
    color:#b71c1c;
    
    margin-bottom:10px;
    
    }
    
    
    
    .food-content p{
    
    color:#777;
    
    margin-bottom:20px;
    
    }
    
    
    
    .food-content a{
    
    display:inline-block;
    
    padding:10px 20px;
    
    background:#ffc107;
    
    color:#222;
    
    border-radius:25px;
    
    font-weight:700;
    
    }
    
    
    
    
    
    .hide-food{
    
    display:none;
    
    }
    
    
    
    
    
    @media(max-width:900px){
    
    
    .gallery-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    }
    
    
    
    @media(max-width:600px){
    
    
    .gallery-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .gallery-header h2{
    
    font-size:32px;
    
    }
    
    
    }
    
    
    
    /* =====================================
     MODULE E : CONSEILS & ASTUCES
    ===================================== */
    
    
    .tips-section{
    
    background:#fff8e8;
    
    }
    
    
    
    .tips-header{
    
    text-align:center;
    
    max-width:800px;
    
    margin:auto;
    
    margin-bottom:50px;
    
    }
    
    
    
    .tips-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    letter-spacing:2px;
    
    }
    
    
    
    .tips-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .tips-filter{
    
    display:flex;
    
    justify-content:center;
    
    gap:15px;
    
    flex-wrap:wrap;
    
    margin-bottom:50px;
    
    }
    
    
    
    .tips-filter button{
    
    padding:12px 25px;
    
    border:0;
    
    border-radius:30px;
    
    background:#b71c1c;
    
    color:white;
    
    font-weight:600;
    
    cursor:pointer;
    
    transition:.3s;
    
    }
    
    
    
    .tips-filter button:hover{
    
    background:#ffc107;
    
    color:#222;
    
    }
    
    
    
    .tips-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    .tip-card{
    
    background:white;
    
    padding:35px;
    
    border-radius:25px;
    
    box-shadow:0 15px 40px #0002;
    
    transition:.4s;
    
    }
    
    
    
    .tip-card:hover{
    
    transform:translateY(-10px);
    
    }
    
    
    
    .tip-card i{
    
    font-size:40px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    .tip-card h3{
    
    font-size:23px;
    
    margin-bottom:15px;
    
    }
    
    
    
    .tip-card p{
    
    color:#777;
    
    line-height:1.7;
    
    margin-bottom:20px;
    
    }
    
    
    
    .tip-card a{
    
    color:#b71c1c;
    
    font-weight:700;
    
    }
    
    
    
    .hide-tip{
    
    display:none;
    
    }
    
    
    
    @media(max-width:900px){
    
    .tips-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    }
    
    
    
    @media(max-width:600px){
    
    .tips-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    .tips-header h2{
    
    font-size:32px;
    
    }
    
    }
    
    
    /* =====================================
     MODULE F : DEFIS JP OIL
    ===================================== */
    
    
    .challenge-section{
    
    background:white;
    
    }
    
    
    
    .challenge-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:60px;
    
    }
    
    
    
    .challenge-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    letter-spacing:2px;
    
    }
    
    
    
    .challenge-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    .challenge-main{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:50px;
    
    align-items:center;
    
    }
    
    
    
    .challenge-image{
    
    position:relative;
    
    }
    
    
    
    .challenge-image img{
    
    width:100%;
    
    height:500px;
    
    object-fit:cover;
    
    border-radius:35px;
    
    }
    
    
    
    .challenge-badge{
    
    position:absolute;
    
    top:25px;
    
    left:25px;
    
    background:#ffc107;
    
    padding:12px 25px;
    
    border-radius:30px;
    
    font-weight:800;
    
    }
    
    
    
    
    .challenge-content h2{
    
    font-size:35px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    .challenge-content p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    .challenge-info{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:15px;
    
    margin:35px 0;
    
    }
    
    
    
    .challenge-info div{
    
    background:#fafafa;
    
    padding:20px;
    
    border-radius:20px;
    
    text-align:center;
    
    }
    
    
    
    .challenge-info i{
    
    font-size:30px;
    
    color:#b71c1c;
    
    }
    
    
    
    .challenge-btn{
    
    display:inline-block;
    
    background:#25D366;
    
    color:white;
    
    padding:15px 30px;
    
    border-radius:40px;
    
    font-weight:700;
    
    }
    
    
    
    
    
    .winner-title{
    
    text-align:center;
    
    margin:90px 0 40px;
    
    }
    
    
    
    .winner-title h2{
    
    font-size:35px;
    
    }
    
    
    
    
    .winner-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    .winner-card{
    
    background:white;
    
    border-radius:25px;
    
    overflow:hidden;
    
    box-shadow:0 15px 40px #0002;
    
    text-align:center;
    
    }
    
    
    
    .winner-card img{
    
    width:100%;
    
    height:280px;
    
    object-fit:cover;
    
    }
    
    
    
    .winner-card h3{
    
    margin-top:20px;
    
    }
    
    
    
    .winner-card p{
    
    padding:15px;
    
    color:#777;
    
    }
    
    
    
    
    .join-challenge{
    
    margin-top:80px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:50px;
    
    border-radius:35px;
    
    text-align:center;
    
    }
    
    
    
    .join-challenge h2{
    
    font-size:35px;
    
    }
    
    
    
    .join-challenge a{
    
    display:inline-block;
    
    margin-top:25px;
    
    background:#ffc107;
    
    color:#222;
    
    padding:15px 30px;
    
    border-radius:40px;
    
    font-weight:700;
    
    }
    
    
    
    
    
    @media(max-width:900px){
    
    
    .challenge-main{
    
    grid-template-columns:1fr;
    
    }
    
    
    .challenge-info{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .winner-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .challenge-header h2{
    
    font-size:32px;
    
    }
    
    
    }
    
    
    
    /* =====================================
     MODULE G : POURQUOI CHOISIR JP OIL
    ===================================== */
    
    
    .why-section{
    
    background:#fff8e8;
    
    }
    
    
    
    .why-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:60px;
    
    }
    
    
    
    .why-header span{
    
    color:#b71c1c;
    
    font-weight:800;
    
    letter-spacing:2px;
    
    }
    
    
    
    .why-header h2{
    
    font-size:45px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    
    .why-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:50px;
    
    align-items:center;
    
    }
    
    
    
    .why-image{
    
    position:relative;
    
    }
    
    
    
    .why-image img{
    
    width:100%;
    
    height:500px;
    
    object-fit:cover;
    
    border-radius:35px;
    
    box-shadow:0 20px 50px #0002;
    
    }
    
    
    
    .quality-badge{
    
    position:absolute;
    
    bottom:25px;
    
    left:25px;
    
    background:#2e7d32;
    
    color:white;
    
    padding:15px 30px;
    
    border-radius:40px;
    
    font-weight:700;
    
    }
    
    
    
    
    
    .why-content h2{
    
    font-size:35px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    
    .quality-list{
    
    margin-top:35px;
    
    }
    
    
    
    .quality-item{
    
    display:flex;
    
    gap:20px;
    
    margin-bottom:25px;
    
    }
    
    
    
    .quality-item i{
    
    font-size:35px;
    
    color:#b71c1c;
    
    }
    
    
    
    .quality-item h3{
    
    margin-bottom:5px;
    
    }
    
    
    
    
    
    .comparison-box{
    
    margin-top:100px;
    
    text-align:center;
    
    }
    
    
    
    .comparison-box h2{
    
    font-size:35px;
    
    margin-bottom:40px;
    
    }
    
    
    
    .comparison-grid{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:30px;
    
    }
    
    
    
    
    
    .compare-card{
    
    background:white;
    
    padding:40px;
    
    border-radius:30px;
    
    box-shadow:0 15px 40px #0002;
    
    text-align:left;
    
    border-top:6px solid #b71c1c;
    
    }
    
    
    
    .compare-card h3{
    
    font-size:30px;
    
    color:#b71c1c;
    
    margin-bottom:25px;
    
    }
    
    
    
    .compare-card li{
    
    margin-bottom:15px;
    
    font-size:17px;
    
    }
    
    
    
    
    
    .compare-card.old{
    
    border-color:#777;
    
    }
    
    
    
    .compare-card.old h3{
    
    color:#555;
    
    }
    
    
    
    
    
    @media(max-width:900px){
    
    
    .why-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .comparison-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .why-header h2{
    
    font-size:32px;
    
    }
    
    
    
    }
    
    
    
    
    
    
    /* =====================================
     HEADER PREMIUM JP OIL
    ===================================== */
    
    
    .main-header{
    
    position:fixed;
    
    top:0;
    
    left:0;
    
    width:100%;
    
    z-index:999;
    
    background:white;
    
    box-shadow:0 5px 25px rgba(0,0,0,.12);
    
    }
    
    
    
    .navbar{
    
    height:85px;
    
    display:flex;
    
    align-items:center;
    
    justify-content:space-between;
    
    padding:0 6%;
    
    }
    
    
    
    
    .logo{
    
    display:flex;
    
    align-items:center;
    
    gap:15px;
    
    }
    
    
    
    .logo img{
    
    width:65px;
    
    height:65px;
    
    border-radius:50%;
    
    object-fit:cover;
    
    }
    
    
    
    .logo h2{
    
    font-size:30px;
    
    color:#b71c1c;
    
    font-weight:800;
    
    }
    
    
    
    .logo h2 span{
    
    color:#f59d00;
    
    }
    
    
    
    .logo small{
    
    display:block;
    
    font-size:12px;
    
    color:#777;
    
    }
    
    
    
    
    .menu{
    
    display:flex;
    
    align-items:center;
    
    gap:25px;
    
    }
    
    
    
    .menu li a{
    
    color:#333;
    
    font-size:14px;
    
    font-weight:600;
    
    display:flex;
    
    align-items:center;
    
    gap:7px;
    
    transition:.3s;
    
    }
    
    
    
    .menu li a i{
    
    color:#b71c1c;
    
    }
    
    
    
    .menu li a:hover{
    
    color:#b71c1c;
    
    }
    
    
    
    
    
    .header-actions{
    
    display:flex;
    
    gap:15px;
    
    align-items:center;
    
    }
    
    
    
    
    .login-btn{
    
    padding:12px 22px;
    
    border:2px solid #b71c1c;
    
    border-radius:30px;
    
    color:#b71c1c;
    
    font-weight:700;
    
    }
    
    
    
    .order-btn{
    
    padding:13px 25px;
    
    background:#b71c1c;
    
    color:white;
    
    border-radius:30px;
    
    font-weight:700;
    
    }
    
    
    
    .order-btn:hover{
    
    background:#8e0000;
    
    }
    
    
    
    
    
    .mobile-btn{
    
    display:none;
    
    font-size:30px;
    
    color:#b71c1c;
    
    cursor:pointer;
    
    }
    
    
    
    
    
    @media(max-width:1100px){
    
    
    
    .menu{
    
    position:absolute;
    
    top:85px;
    
    left:0;
    
    width:100%;
    
    background:white;
    
    display:none;
    
    flex-direction:column;
    
    padding:30px;
    
    box-shadow:0 15px 30px #0002;
    
    }
    
    
    
    .menu.active{
    
    display:flex;
    
    }
    
    
    
    .header-actions{
    
    display:none;
    
    }
    
    
    
    .mobile-btn{
    
    display:block;
    
    }
    
    
    
    .navbar{
    
    padding:0 25px;
    
    }
    
    
    
    }


    li{
        list-style: none;
    }




        /* =================================
PANIER JP OIL
================================= */


.cart-page{

    padding:120px 8% 80px;
    
    background:#fafafa;
    
    }
    
    
    
    .cart-page h1{
    
    text-align:center;
    
    font-size:45px;
    
    color:#b71c1c;
    
    margin-bottom:50px;
    
    }
    
    
    
    .cart-container{
    
    display:grid;
    
    grid-template-columns:2fr 1fr;
    
    gap:30px;
    
    }
    
    
    
    .cart-product{
    
    background:white;
    
    padding:20px;
    
    border-radius:20px;
    
    display:flex;
    
    align-items:center;
    
    gap:20px;
    
    margin-bottom:20px;
    
    box-shadow:0 10px 30px #0001;
    
    }
    
    
    
    .cart-product img{
    
    width:100px;
    
    height:100px;
    
    object-fit:contain;
    
    }
    
    
    
    .quantity{
    
    display:flex;
    
    gap:15px;
    
    align-items:center;
    
    }
    
    
    
    .quantity button{
    
    width:35px;
    
    height:35px;
    
    border:0;
    
    border-radius:50%;
    
    background:#b71c1c;
    
    color:white;
    
    }
    
    
    
    .delete{
    
    margin-left:auto;
    
    background:#dc3545;
    
    color:white;
    
    border:0;
    
    padding:10px 20px;
    
    border-radius:30px;
    
    }
    
    
    
    .cart-summary{
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    height:max-content;
    
    box-shadow:0 10px 30px #0001;
    
    }
    
    
    
    .total-box{
    
    font-size:25px;
    
    font-weight:800;
    
    margin-top:30px;
    
    }
    
    
    
    #total{
    
    color:#b71c1c;
    
    }
    
    
    
    .customer-form{
    
    margin-top:40px;
    
    background:white;
    
    padding:35px;
    
    border-radius:25px;
    
    }
    
    
    
    .customer-form input,
    .customer-form textarea{
    
    width:100%;
    
    padding:15px;
    
    margin:10px 0;
    
    border:1px solid #ddd;
    
    border-radius:15px;
    
    }
    
    
    
    .customer-form button{
    
    width:100%;
    
    padding:16px;
    
    background:#b71c1c;
    
    color:white;
    
    border:0;
    
    border-radius:40px;
    
    font-size:18px;
    
    font-weight:700;
    
    }
    
    
    
    .empty-cart{
    
    background:white;
    
    padding:50px;
    
    text-align:center;
    
    border-radius:20px;
    
    font-size:25px;
    
    }
    
    
    
    
    @media(max-width:800px){
    
    
    .cart-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    .cart-product{
    
    flex-direction:column;
    
    text-align:center;
    
    }
    
    
    .delete{
    
    margin:auto;
    
    }
    
    
    }





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

.shop-hero{

    position:relative;
    
    padding:150px 8% 100px;
    
    background:linear-gradient(135deg,#fff8e8,#fff);
    
    overflow:hidden;
    
    }
    
    .shop-overlay{
    
    position:absolute;
    
    top:0;
    
    left:0;
    
    width:100%;
    
    height:100%;
    
    background:url(images/palm-pattern.png);
    
    opacity:.04;
    
    }
    
    .shop-container{
    
    position:relative;
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    align-items:center;
    
    gap:70px;
    
    }
    
    .shop-badge{
    
    display:inline-block;
    
    padding:10px 25px;
    
    background:#ffe9b3;
    
    color:#b71c1c;
    
    border-radius:40px;
    
    font-weight:700;
    
    margin-bottom:25px;
    
    }
    
    .shop-left h1{
    
    font-size:58px;
    
    font-weight:800;
    
    line-height:1.15;
    
    margin-bottom:25px;
    
    color:#222;
    
    }
    
    .shop-left p{
    
    font-size:18px;
    
    line-height:1.9;
    
    color:#666;
    
    margin-bottom:35px;
    
    }
    
    .shop-buttons{
    
    display:flex;
    
    gap:20px;
    
    margin-bottom:50px;
    
    }
    
    .shop-features{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:20px;
    
    }
    
    .feature{
    
    display:flex;
    
    gap:15px;
    
    background:white;
    
    padding:20px;
    
    border-radius:20px;
    
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    
    }
    
    .feature i{
    
    font-size:28px;
    
    color:#b71c1c;
    
    }
    
    .feature h4{
    
    margin-bottom:5px;
    
    font-size:16px;
    
    }
    
    .feature p{
    
    margin:0;
    
    font-size:13px;
    
    }
    
    .shop-right{
    
    position:relative;
    
    text-align:center;
    
    }
    
    .shop-right img{
    
    width:100%;
    
    max-width:500px;
    
    margin:auto;
    
    animation:floatBottle 4s ease-in-out infinite;
    
    }
    
    @keyframes floatBottle{
    
    0%,100%{
    
    transform:translateY(0);
    
    }
    
    50%{
    
    transform:translateY(-18px);
    
    }
    
    }
    
    .floating-card{
    
    position:absolute;
    
    background:white;
    
    padding:15px 20px;
    
    border-radius:20px;
    
    display:flex;
    
    gap:12px;
    
    align-items:center;
    
    box-shadow:0 15px 35px rgba(0,0,0,.12);
    
    font-weight:600;
    
    }
    
    .floating-card i{
    
    color:#b71c1c;
    
    font-size:22px;
    
    }
    
    .card1{
    
    top:40px;
    
    left:-20px;
    
    }
    
    .card2{
    
    right:-10px;
    
    top:180px;
    
    }
    
    .card3{
    
    left:40px;
    
    bottom:40px;
    
    }
    
    @media(max-width:992px){
    
    .shop-container{
    
    grid-template-columns:1fr;
    
    text-align:center;
    
    }
    
    .shop-buttons{
    
    justify-content:center;
    
    }
    
    .shop-features{
    
    grid-template-columns:1fr;
    
    }
    
    .shop-left h1{
    
    font-size:42px;
    
    }
    
    .shop-right{
    
    margin-top:50px;
    
    }
    
    .floating-card{
    
    display:none;
    
    }
    
    }



    /*====================================================
RECHERCHE & FILTRES
====================================================*/

.search-section{

    padding:90px 8%;
    
    background:#ffffff;
    
    }
    
    .search-title{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:50px;
    
    }
    
    .search-title span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    .search-title h2{
    
    font-size:45px;
    
    margin:15px 0;
    
    font-weight:800;
    
    }
    
    .search-title p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    .search-box{
    
    display:flex;
    
    justify-content:center;
    
    gap:20px;
    
    margin-bottom:40px;
    
    flex-wrap:wrap;
    
    }
    
    .search-input{
    
    background:#fff;
    
    width:650px;
    
    display:flex;
    
    align-items:center;
    
    padding:18px 25px;
    
    border-radius:60px;
    
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    
    }
    
    .search-input i{
    
    color:#b71c1c;
    
    font-size:22px;
    
    margin-right:15px;
    
    }
    
    .search-input input{
    
    border:none;
    
    outline:none;
    
    width:100%;
    
    font-size:17px;
    
    background:none;
    
    }
    
    .search-btn{
    
    padding:18px 35px;
    
    border:none;
    
    border-radius:50px;
    
    background:#b71c1c;
    
    color:white;
    
    font-size:16px;
    
    font-weight:700;
    
    cursor:pointer;
    
    transition:.3s;
    
    }
    
    .search-btn:hover{
    
    background:#8d1515;
    
    }
    
    .filter-grid{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:18px;
    
    margin-top:30px;
    
    }
    
    .filter{
    
    padding:18px;
    
    background:#fafafa;
    
    border:2px solid #eee;
    
    border-radius:18px;
    
    font-weight:700;
    
    cursor:pointer;
    
    transition:.3s;
    
    }
    
    .filter i{
    
    display:block;
    
    font-size:24px;
    
    margin-bottom:10px;
    
    color:#b71c1c;
    
    }
    
    .filter:hover{
    
    background:#b71c1c;
    
    color:white;
    
    }
    
    .filter:hover i{
    
    color:#ffc107;
    
    }
    
    .filter.active{
    
    background:#b71c1c;
    
    color:white;
    
    }
    
    .filter.active i{
    
    color:#ffc107;
    
    }
    
    .quick-info{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:25px;
    
    margin-top:60px;
    
    }
    
    .quick-info div{
    
    background:#fff8e8;
    
    padding:30px;
    
    border-radius:20px;
    
    text-align:center;
    
    }
    
    .quick-info h3{
    
    font-size:35px;
    
    color:#b71c1c;
    
    margin-bottom:10px;
    
    }
    
    .quick-info p{
    
    color:#666;
    
    }
    
    @media(max-width:992px){
    
    .filter-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    .quick-info{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    .search-input{
    
    width:100%;
    
    }
    
    }
    
    @media(max-width:600px){
    
    .filter-grid{
    
    grid-template-columns:1fr;
    
    }
    
    .quick-info{
    
    grid-template-columns:1fr;
    
    }
    
    .search-title h2{
    
    font-size:32px;
    
    }
    
    }



    /*====================================================
CATEGORIES PRODUITS
====================================================*/

.categories-section{

    padding:100px 8%;
    
    background:#fdfdfd;
    
    }
    
    .section-title{
    
    text-align:center;
    
    max-width:800px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    .section-title span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    .section-title h2{
    
    font-size:48px;
    
    font-weight:800;
    
    margin:18px 0;
    
    }
    
    .section-title p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    .categories-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:35px;
    
    }
    
    .category-card{
    
    background:#fff;
    
    border-radius:25px;
    
    padding:30px;
    
    text-align:center;
    
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    
    transition:.4s;
    
    position:relative;
    
    overflow:hidden;
    
    }
    
    .category-card::before{
    
    content:"";
    
    position:absolute;
    
    top:0;
    
    left:0;
    
    width:100%;
    
    height:6px;
    
    background:#b71c1c;
    
    transform:scaleX(0);
    
    transition:.4s;
    
    }
    
    .category-card:hover::before{
    
    transform:scaleX(1);
    
    }
    
    .category-card:hover{
    
    transform:translateY(-12px);
    
    }
    
    .category-image{
    
    height:220px;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin-bottom:25px;
    
    }
    
    .category-image img{
    
    max-height:210px;
    
    transition:.4s;
    
    }
    
    .category-card:hover img{
    
    transform:scale(1.08) rotate(-3deg);
    
    }
    
    .category-card h3{
    
    font-size:28px;
    
    margin-bottom:12px;
    
    color:#222;
    
    }
    
    .category-card p{
    
    color:#666;
    
    line-height:1.7;
    
    margin-bottom:25px;
    
    }
    
    .category-card a{
    
    display:inline-flex;
    
    align-items:center;
    
    gap:10px;
    
    font-weight:700;
    
    color:#b71c1c;
    
    }
    
    .category-card a i{
    
    transition:.3s;
    
    }
    
    .category-card:hover a i{
    
    transform:translateX(6px);
    
    }
    
    @media(max-width:992px){
    
    .categories-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    }
    
    @media(max-width:650px){
    
    .categories-grid{
    
    grid-template-columns:1fr;
    
    }
    
    .section-title h2{
    
    font-size:34px;
    
    }
    
    }



    /*====================================================
CATALOGUE PRODUITS
====================================================*/

.catalog-section{

    padding:100px 8%;
    
    background:#fff8f3;
    
    }
    
    .catalog-grid{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:30px;
    
    }
    
    .product-card{
    
    background:white;
    
    border-radius:25px;
    
    overflow:hidden;
    
    position:relative;
    
    box-shadow:0 15px 35px rgba(0,0,0,.08);
    
    transition:.4s;
    
    }
    
    .product-card:hover{
    
    transform:translateY(-10px);
    
    }
    
    .product-badge{
    
    position:absolute;
    
    top:20px;
    
    left:20px;
    
    background:#2e7d32;
    
    color:white;
    
    padding:8px 18px;
    
    border-radius:30px;
    
    font-size:13px;
    
    font-weight:700;
    
    z-index:2;
    
    }
    
    .product-badge.promo{
    
    background:#d32f2f;
    
    }
    
    .product-image{
    
    height:260px;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    background:#fff;
    
    padding:25px;
    
    }
    
    .product-image img{
    
    max-height:220px;
    
    transition:.4s;
    
    }
    
    .product-card:hover img{
    
    transform:scale(1.08);
    
    }
    
    .product-content{
    
    padding:25px;
    
    }
    
    .product-content h3{
    
    font-size:24px;
    
    margin-bottom:12px;
    
    }
    
    .product-content p{
    
    color:#666;
    
    margin-bottom:20px;
    
    line-height:1.7;
    
    }
    
    .product-info{
    
    display:flex;
    
    justify-content:space-between;
    
    margin-bottom:20px;
    
    font-size:14px;
    
    }
    
    .product-info span{
    
    color:#777;
    
    }
    
    .product-info i{
    
    color:#ff9800;
    
    }
    
    .product-content h2{
    
    font-size:30px;
    
    color:#b71c1c;
    
    margin-bottom:25px;
    
    }
    
    .product-buttons{
    
    display:flex;
    
    gap:12px;
    
    }
    
    .product-buttons a{
    
    flex:1;
    
    text-align:center;
    
    padding:14px;
    
    border-radius:15px;
    
    font-weight:700;
    
    transition:.3s;
    
    }
    
    .product-buttons a:first-child{
    
    background:#b71c1c;
    
    color:white;
    
    }
    
    .product-buttons a:last-child{
    
    background:#f3f3f3;
    
    color:#333;
    
    }
    
    .product-buttons a:hover{
    
    transform:translateY(-3px);
    
    }
    
    @media(max-width:1100px){
    
    .catalog-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    }
    
    @media(max-width:650px){
    
    .catalog-grid{
    
    grid-template-columns:1fr;
    
    }
    
    }




    /*==========================================
PROMOTIONS
==========================================*/

.promo-section{

    padding:100px 8%;
    
    background:linear-gradient(135deg,#fff8ef,#fff);
    
    }
    
    .promo-title{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:60px;
    
    }
    
    .promo-title span{
    
    color:#c62828;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    .promo-title h2{
    
    font-size:48px;
    
    margin:20px 0;
    
    font-weight:800;
    
    }
    
    .promo-title p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    .promo-grid{
    
    display:grid;
    
    grid-template-columns:2fr 1fr 1fr;
    
    gap:30px;
    
    }
    
    .promo-card{
    
    background:white;
    
    border-radius:25px;
    
    overflow:hidden;
    
    box-shadow:0 20px 45px rgba(0,0,0,.08);
    
    transition:.4s;
    
    position:relative;
    
    }
    
    .promo-card:hover{
    
    transform:translateY(-10px);
    
    }
    
    .promo-label{
    
    position:absolute;
    
    top:20px;
    
    left:20px;
    
    background:#d32f2f;
    
    color:white;
    
    padding:8px 20px;
    
    border-radius:40px;
    
    font-size:14px;
    
    font-weight:700;
    
    z-index:2;
    
    }
    
    .promo-image{
    
    height:260px;
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    background:#fffdf8;
    
    padding:20px;
    
    }
    
    .promo-image img{
    
    max-height:220px;
    
    transition:.4s;
    
    }
    
    .promo-card:hover img{
    
    transform:scale(1.08);
    
    }
    
    .promo-content{
    
    padding:30px;
    
    }
    
    .promo-content h3{
    
    font-size:28px;
    
    margin-bottom:15px;
    
    }
    
    .promo-content p{
    
    line-height:1.8;
    
    color:#666;
    
    margin-bottom:20px;
    
    }
    
    .promo-price{
    
    margin-bottom:25px;
    
    }
    
    .old-price{
    
    text-decoration:line-through;
    
    color:#999;
    
    display:block;
    
    margin-bottom:8px;
    
    }
    
    .promo-price h2{
    
    color:#c62828;
    
    font-size:36px;
    
    }
    
    .promo-footer{
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    }
    
    .promo-footer div{
    
    color:#777;
    
    font-size:14px;
    
    }
    
    .promo-footer i{
    
    color:#ff9800;
    
    margin-right:5px;
    
    }
    
    .promo-footer a{
    
    background:#b71c1c;
    
    color:white;
    
    padding:12px 24px;
    
    border-radius:30px;
    
    font-weight:700;
    
    transition:.3s;
    
    }
    
    .promo-footer a:hover{
    
    background:#8b0000;
    
    }
    
    .featured{
    
    border:3px solid #ffc107;
    
    }
    
    @media(max-width:1100px){
    
    .promo-grid{
    
    grid-template-columns:1fr;
    
    }
    
    }



    /*==========================================
COMPARATEUR DES FORMATS
==========================================*/

.compare-section{

    padding:100px 8%;
    
    background:#fafafa;
    
    }
    
    .compare-title{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:50px;
    
    }
    
    .compare-title span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    .compare-title h2{
    
    font-size:48px;
    
    margin:20px 0;
    
    font-weight:800;
    
    }
    
    .compare-title p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    .compare-table{
    
    overflow-x:auto;
    
    background:white;
    
    border-radius:25px;
    
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    
    }
    
    .compare-table table{
    
    width:100%;
    
    border-collapse:collapse;
    
    }
    
    .compare-table thead{
    
    background:#b71c1c;
    
    color:white;
    
    }
    
    .compare-table th{
    
    padding:22px;
    
    font-size:17px;
    
    }
    
    .compare-table td{
    
    padding:20px;
    
    text-align:center;
    
    border-bottom:1px solid #eee;
    
    }
    
    .compare-table tbody tr:hover{
    
    background:#fff8ef;
    
    }
    
    .compare-table img{
    
    width:55px;
    
    display:block;
    
    margin:auto;
    
    margin-bottom:10px;
    
    }
    
    .compare-table a{
    
    background:#b71c1c;
    
    color:white;
    
    padding:10px 20px;
    
    border-radius:30px;
    
    font-weight:700;
    
    display:inline-block;
    
    transition:.3s;
    
    }
    
    .compare-table a:hover{
    
    background:#8b0000;
    
    }
    
    @media(max-width:768px){
    
    .compare-title h2{
    
    font-size:34px;
    
    }
    
    .compare-table{
    
    font-size:14px;
    
    }
    
    .compare-table th,
    
    .compare-table td{
    
    padding:15px;
    
    }
    
    }



    /*==========================================
POURQUOI ACHETER
==========================================*/

.why-buy-section{

    padding:100px 8%;
    
    background:#fffdf8;
    
    }
    
    .why-buy-title{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:60px;
    
    }
    
    .why-buy-title span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    .why-buy-title h2{
    
    font-size:48px;
    
    margin:20px 0;
    
    font-weight:800;
    
    }
    
    .why-buy-title p{
    
    line-height:1.8;
    
    color:#666;
    
    }
    
    .why-buy-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    margin-bottom:90px;
    
    }
    
    .why-card{
    
    background:white;
    
    padding:35px;
    
    border-radius:25px;
    
    text-align:center;
    
    box-shadow:0 15px 35px rgba(0,0,0,.08);
    
    transition:.4s;
    
    }
    
    .why-card:hover{
    
    transform:translateY(-10px);
    
    }
    
    .why-icon{
    
    width:85px;
    
    height:85px;
    
    margin:auto;
    
    margin-bottom:25px;
    
    background:#fff3ef;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    }
    
    .why-icon i{
    
    font-size:35px;
    
    color:#b71c1c;
    
    }
    
    .why-card h3{
    
    margin-bottom:15px;
    
    font-size:24px;
    
    }
    
    .why-card p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    .why-bottom{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:70px;
    
    align-items:center;
    
    }
    
    .why-left h2{
    
    font-size:42px;
    
    margin-bottom:25px;
    
    }
    
    .why-left p{
    
    line-height:1.9;
    
    color:#666;
    
    margin-bottom:25px;
    
    }
    
    .why-left ul{
    
    margin-bottom:35px;
    
    }
    
    .why-left ul li{
    
    margin-bottom:18px;
    
    font-size:17px;
    
    }
    
    .why-left ul i{
    
    color:#2e7d32;
    
    margin-right:10px;
    
    }
    
    .why-right img{
    
    width:100%;
    
    max-width:520px;
    
    display:block;
    
    margin:auto;
    
    }
    
    @media(max-width:992px){
    
    .why-buy-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    .why-bottom{
    
    grid-template-columns:1fr;
    
    }
    
    }
    
    @media(max-width:650px){
    
    .why-buy-grid{
    
    grid-template-columns:1fr;
    
    }
    
    .why-buy-title h2{
    
    font-size:34px;
    
    }
    
    .why-left h2{
    
    font-size:30px;
    
    }
    
    }




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

.product-hero{

    padding:140px 8% 100px;
    
    background:#fffdf9;
    
    }
    
    .product-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:80px;
    
    align-items:center;
    
    }
    
    .product-gallery{
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    
    }
    
    .main-image{
    
    height:520px;
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    }
    
    .main-image img{
    
    max-height:470px;
    
    transition:.4s;
    
    cursor:zoom-in;
    
    }
    
    .main-image img:hover{
    
    transform:scale(1.08);
    
    }
    
    .thumbs{
    
    display:flex;
    
    justify-content:center;
    
    gap:15px;
    
    margin-top:30px;
    
    }
    
    .thumbs img{
    
    width:90px;
    
    height:90px;
    
    border-radius:15px;
    
    padding:10px;
    
    background:#fafafa;
    
    cursor:pointer;
    
    border:2px solid transparent;
    
    transition:.3s;
    
    }
    
    .thumbs img:hover,
    
    .thumbs img.active{
    
    border-color:#b71c1c;
    
    }
    
    .product-tag{
    
    display:inline-block;
    
    background:#fff0d8;
    
    padding:10px 25px;
    
    border-radius:30px;
    
    font-weight:700;
    
    color:#b71c1c;
    
    margin-bottom:25px;
    
    }
    
    .product-details h1{
    
    font-size:52px;
    
    font-weight:800;
    
    line-height:1.2;
    
    margin-bottom:20px;
    
    }
    
    .rating{
    
    display:flex;
    
    align-items:center;
    
    gap:15px;
    
    margin-bottom:30px;
    
    }
    
    .stars{
    
    color:#ffb400;
    
    font-size:18px;
    
    }
    
    .price-box{
    
    display:flex;
    
    align-items:center;
    
    gap:20px;
    
    margin-bottom:25px;
    
    }
    
    .price-box h2{
    
    font-size:46px;
    
    color:#b71c1c;
    
    }
    
    .old-price{
    
    text-decoration:line-through;
    
    color:#888;
    
    font-size:20px;
    
    }
    
    .discount{
    
    background:#2e7d32;
    
    color:white;
    
    padding:8px 18px;
    
    border-radius:30px;
    
    font-weight:700;
    
    }
    
    .description{
    
    font-size:17px;
    
    line-height:1.9;
    
    color:#666;
    
    margin-bottom:30px;
    
    }
    
    .stock{
    
    display:inline-flex;
    
    gap:10px;
    
    padding:12px 22px;
    
    background:#e8f5e9;
    
    color:#2e7d32;
    
    border-radius:30px;
    
    font-weight:700;
    
    margin-bottom:35px;
    
    }
    
    .infos-grid{
    
    display:grid;
    
    grid-template-columns:repeat(2,1fr);
    
    gap:20px;
    
    margin-bottom:40px;
    
    }
    
    .infos-grid div{
    
    background:white;
    
    padding:20px;
    
    border-radius:18px;
    
    box-shadow:0 10px 25px rgba(0,0,0,.05);
    
    }
    
    .infos-grid h4{
    
    margin-bottom:8px;
    
    }
    
    .action-buttons{
    
    display:flex;
    
    flex-wrap:wrap;
    
    gap:15px;
    
    margin-bottom:35px;
    
    }
    
    .buy-btn,
    
    .cart-btn,
    
    .whatsapp-btn{
    
    padding:16px 28px;
    
    border-radius:40px;
    
    font-weight:700;
    
    transition:.3s;
    
    }
    
    .buy-btn{
    
    background:#b71c1c;
    
    color:white;
    
    }
    
    .cart-btn{
    
    background:#f2f2f2;
    
    color:#333;
    
    }
    
    .whatsapp-btn{
    
    background:#25d366;
    
    color:white;
    
    }
    
    .action-buttons a:hover{
    
    transform:translateY(-4px);
    
    }
    
    .trust-icons{
    
    display:flex;
    
    flex-wrap:wrap;
    
    gap:25px;
    
    font-size:15px;
    
    color:#666;
    
    }
    
    .trust-icons i{
    
    color:#b71c1c;
    
    margin-right:8px;
    
    }
    
    @media(max-width:992px){
    
    .product-container{
    
    grid-template-columns:1fr;
    
    }
    
    .product-details h1{
    
    font-size:38px;
    
    }
    
    .main-image{
    
    height:350px;
    
    }
    
    .main-image img{
    
    max-height:300px;
    
    }
    
    }
    
    @media(max-width:600px){
    
    .infos-grid{
    
    grid-template-columns:1fr;
    
    }
    
    .action-buttons{
    
    flex-direction:column;
    
    }
    
    .buy-btn,
    
    .cart-btn,
    
    .whatsapp-btn{
    
    text-align:center;
    
    }
    
    }




    /*==================================================
CONFIGURATION COMMANDE
==================================================*/


.order-config{

    padding:80px 8%;
    
    background:#fff;
    
    }
    
    
    
    .order-container{
    
    display:grid;
    
    grid-template-columns:1.5fr .8fr;
    
    gap:40px;
    
    align-items:start;
    
    }
    
    
    
    .order-box,
    
    .summary-box{
    
    background:white;
    
    padding:40px;
    
    border-radius:30px;
    
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    
    }
    
    
    
    
    .order-title span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .order-title h2{
    
    font-size:36px;
    
    margin:15px 0 35px;
    
    }
    
    
    
    
    
    .option-group h3,
    
    .quantity-box h3,
    
    .delivery-choice h3{
    
    font-size:20px;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    
    .format-options{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:20px;
    
    }
    
    
    
    .format-card{
    
    cursor:pointer;
    
    }
    
    
    
    .format-card input{
    
    display:none;
    
    }
    
    
    
    .format-card div{
    
    padding:25px;
    
    border:2px solid #eee;
    
    border-radius:20px;
    
    text-align:center;
    
    transition:.3s;
    
    }
    
    
    
    .format-card i{
    
    font-size:35px;
    
    color:#b71c1c;
    
    margin-bottom:15px;
    
    }
    
    
    
    .format-card h4{
    
    font-size:22px;
    
    }
    
    
    
    .format-card:hover div,
    
    .format-card.active div{
    
    border-color:#b71c1c;
    
    background:#fff6f3;
    
    }
    
    
    
    
    
    .quantity-control{
    
    display:flex;
    
    align-items:center;
    
    gap:20px;
    
    margin-bottom:35px;
    
    }
    
    
    
    .quantity-control button{
    
    width:45px;
    
    height:45px;
    
    border:none;
    
    border-radius:50%;
    
    background:#b71c1c;
    
    color:white;
    
    font-size:25px;
    
    cursor:pointer;
    
    }
    
    
    
    .quantity-control input{
    
    width:70px;
    
    height:45px;
    
    text-align:center;
    
    font-size:20px;
    
    border:1px solid #ddd;
    
    border-radius:10px;
    
    }
    
    
    
    
    
    .delivery-choice label{
    
    display:block;
    
    padding:15px;
    
    background:#fafafa;
    
    border-radius:15px;
    
    margin-bottom:10px;
    
    cursor:pointer;
    
    }
    
    
    
    
    
    .summary-box{
    
    position:sticky;
    
    top:100px;
    
    }
    
    
    
    .summary-box h2{
    
    font-size:30px;
    
    margin-bottom:30px;
    
    }
    
    
    
    
    
    .summary-line,
    
    .total-line{
    
    display:flex;
    
    justify-content:space-between;
    
    margin-bottom:20px;
    
    }
    
    
    
    .total-line strong{
    
    font-size:35px;
    
    color:#b71c1c;
    
    }
    
    
    
    
    
    .checkout-btn,
    
    .whatsapp-order{
    
    width:100%;
    
    padding:18px;
    
    border:none;
    
    border-radius:40px;
    
    font-size:17px;
    
    font-weight:700;
    
    cursor:pointer;
    
    margin-top:15px;
    
    }
    
    
    
    .checkout-btn{
    
    background:#b71c1c;
    
    color:white;
    
    }
    
    
    
    .whatsapp-order{
    
    background:#25d366;
    
    color:white;
    
    }
    
    
    
    @media(max-width:992px){
    
    .order-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .summary-box{
    
    position:relative;
    
    }
    
    
    
    .format-options{
    
    grid-template-columns:1fr;
    
    }
    
    }




    /*==================================================
DESCRIPTION PRODUIT
==================================================*/


.product-description-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    .description-container{
    
    display:grid;
    
    grid-template-columns:1.2fr .8fr;
    
    gap:70px;
    
    align-items:start;
    
    }
    
    
    
    .section-label{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .description-content h2{
    
    font-size:42px;
    
    line-height:1.3;
    
    margin:20px 0 30px;
    
    font-weight:800;
    
    }
    
    
    
    .description-content p{
    
    font-size:17px;
    
    line-height:1.9;
    
    color:#666;
    
    margin-bottom:25px;
    
    }
    
    
    
    .quality-points{
    
    margin-top:35px;
    
    }
    
    
    
    .quality-points div{
    
    display:flex;
    
    align-items:center;
    
    gap:15px;
    
    margin-bottom:18px;
    
    font-size:17px;
    
    }
    
    
    
    .quality-points i{
    
    width:35px;
    
    height:35px;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    background:#2e7d32;
    
    color:white;
    
    border-radius:50%;
    
    }
    
    
    
    
    .technical-card{
    
    background:white;
    
    padding:40px;
    
    border-radius:30px;
    
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    
    }
    
    
    
    .technical-card h3{
    
    font-size:30px;
    
    margin-bottom:30px;
    
    }
    
    
    
    .technical-item{
    
    display:flex;
    
    gap:20px;
    
    padding:20px 0;
    
    border-bottom:1px solid #eee;
    
    }
    
    
    
    .technical-item:last-child{
    
    border-bottom:none;
    
    }
    
    
    
    .technical-item i{
    
    font-size:30px;
    
    color:#b71c1c;
    
    width:40px;
    
    }
    
    
    
    .technical-item strong{
    
    font-size:18px;
    
    }
    
    
    
    .technical-item p{
    
    color:#666;
    
    margin-top:5px;
    
    }
    
    
    
    
    @media(max-width:992px){
    
    
    .description-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    .description-content h2{
    
    font-size:34px;
    
    }
    
    
    }



    /*==================================================
BIENFAITS ET UTILISATIONS
==================================================*/


.benefits-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    .benefits-title{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:60px;
    
    }
    
    
    
    .benefits-title span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .benefits-title h2{
    
    font-size:48px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .benefits-title p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .benefits-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    margin-bottom:80px;
    
    }
    
    
    
    
    .benefit-card{
    
    padding:35px;
    
    background:#fffdf8;
    
    border-radius:25px;
    
    text-align:center;
    
    transition:.4s;
    
    box-shadow:0 10px 30px rgba(0,0,0,.06);
    
    }
    
    
    
    .benefit-card:hover{
    
    transform:translateY(-10px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    
    }
    
    
    
    
    
    .benefit-icon{
    
    width:85px;
    
    height:85px;
    
    margin:auto;
    
    margin-bottom:25px;
    
    border-radius:50%;
    
    background:#b71c1c;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    }
    
    
    
    .benefit-icon i{
    
    font-size:35px;
    
    color:white;
    
    }
    
    
    
    
    .benefit-card h3{
    
    font-size:25px;
    
    margin-bottom:15px;
    
    }
    
    
    
    .benefit-card p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    /* BANNER FINAL */
    
    
    .usage-banner{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:50px;
    
    align-items:center;
    
    background:#b71c1c;
    
    padding:50px;
    
    border-radius:35px;
    
    color:white;
    
    overflow:hidden;
    
    }
    
    
    
    .usage-text h2{
    
    font-size:38px;
    
    margin-bottom:20px;
    
    }
    
    
    
    .usage-text p{
    
    line-height:1.8;
    
    margin-bottom:30px;
    
    }
    
    
    
    .usage-image img{
    
    width:100%;
    
    border-radius:25px;
    
    }
    
    
    
    
    
    @media(max-width:992px){
    
    
    .benefits-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    .usage-banner{
    
    grid-template-columns:1fr;
    
    }
    
    
    }
    
    
    
    
    
    @media(max-width:600px){
    
    
    .benefits-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    .benefits-title h2{
    
    font-size:34px;
    
    }
    
    
    .usage-text h2{
    
    font-size:30px;
    
    }
    
    
    }




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


.fabrication-hero{

    height:90vh;
    
    background:
    url("images/fabrication-bg.jpg")
    center/cover no-repeat;
    
    position:relative;
    
    display:flex;
    
    align-items:center;
    
    padding:0 8%;
    
    }
    
    
    .fabrication-overlay{
    
    position:absolute;
    
    inset:0;
    
    background:
    linear-gradient(
    90deg,
    rgba(0,0,0,.75),
    rgba(0,0,0,.35)
    );
    
    }
    
    
    
    .fabrication-content{
    
    position:relative;
    
    z-index:2;
    
    max-width:750px;
    
    color:white;
    
    }
    
    
    
    .fabrication-content span{
    
    display:inline-block;
    
    background:#ffc107;
    
    color:#7b1c00;
    
    padding:12px 25px;
    
    border-radius:40px;
    
    font-weight:700;
    
    margin-bottom:25px;
    
    }
    
    
    
    .fabrication-content h1{
    
    font-size:65px;
    
    line-height:1.15;
    
    font-weight:800;
    
    margin-bottom:25px;
    
    }
    
    
    
    .fabrication-content p{
    
    font-size:20px;
    
    line-height:1.8;
    
    color:#f1f1f1;
    
    margin-bottom:40px;
    
    }
    
    
    
    .fabrication-buttons{
    
    display:flex;
    
    gap:20px;
    
    }
    
    
    
    .fabrication-buttons a{
    
    display:flex;
    
    align-items:center;
    
    gap:10px;
    
    }
    
    
    
    @media(max-width:900px){
    
    
    .fabrication-hero{
    
    height:auto;
    
    padding-top:150px;
    
    padding-bottom:100px;
    
    }
    
    
    
    .fabrication-content h1{
    
    font-size:40px;
    
    }
    
    
    
    .fabrication-content p{
    
    font-size:16px;
    
    }
    
    
    
    .fabrication-buttons{
    
    flex-direction:column;
    
    }
    
    
    
    }




    /*====================================================
PROCESSUS FABRICATION
====================================================*/


.process-section{

    padding:100px 8%;
    
    background:#fff;
    
    }
    
    
    
    .process-title{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:80px;
    
    }
    
    
    
    .process-title span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .process-title h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .process-title p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .process-timeline{
    
    position:relative;
    
    }
    
    
    
    .process-timeline::before{
    
    content:"";
    
    position:absolute;
    
    left:50%;
    
    top:0;
    
    height:100%;
    
    width:4px;
    
    background:#ffc107;
    
    transform:translateX(-50%);
    
    }
    
    
    
    .process-item{
    
    display:grid;
    
    grid-template-columns:1fr 100px 1fr;
    
    align-items:center;
    
    gap:40px;
    
    margin-bottom:90px;
    
    position:relative;
    
    }
    
    
    
    .process-item.reverse .process-image{
    
    grid-column:3;
    
    }
    
    
    
    .process-item.reverse .process-content{
    
    grid-column:1;
    
    grid-row:1;
    
    }
    
    
    
    .process-number{
    
    width:70px;
    
    height:70px;
    
    background:#b71c1c;
    
    color:white;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    font-size:22px;
    
    font-weight:800;
    
    z-index:2;
    
    margin:auto;
    
    }
    
    
    
    .process-image{
    
    height:330px;
    
    overflow:hidden;
    
    border-radius:30px;
    
    box-shadow:0 15px 35px rgba(0,0,0,.12);
    
    }
    
    
    
    .process-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    transition:.5s;
    
    }
    
    
    
    .process-image:hover img{
    
    transform:scale(1.1);
    
    }
    
    
    
    .process-content{
    
    background:#fff8ef;
    
    padding:35px;
    
    border-radius:30px;
    
    }
    
    
    
    .process-content i{
    
    font-size:40px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    .process-content h3{
    
    font-size:28px;
    
    margin-bottom:15px;
    
    }
    
    
    
    .process-content p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    @media(max-width:900px){
    
    
    .process-timeline::before{
    
    left:35px;
    
    }
    
    
    
    .process-item,
    
    .process-item.reverse{
    
    display:flex;
    
    flex-direction:column;
    
    align-items:flex-start;
    
    padding-left:70px;
    
    }
    
    
    
    .process-number{
    
    position:absolute;
    
    left:0;
    
    top:20px;
    
    }
    
    
    
    .process-image{
    
    width:100%;
    
    height:250px;
    
    }
    
    
    
    .process-content{
    
    width:100%;
    
    }
    
    
    
    }






    /*====================================================
QUALITE FABRICATION
====================================================*/


.quality-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    .quality-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .quality-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .quality-header h2{
    
    font-size:48px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .quality-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    .quality-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:60px;
    
    align-items:center;
    
    }
    
    
    
    
    
    .quality-image{
    
    position:relative;
    
    height:550px;
    
    }
    
    
    
    .quality-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    border-radius:35px;
    
    }
    
    
    
    
    
    .quality-badge{
    
    position:absolute;
    
    bottom:30px;
    
    left:30px;
    
    background:white;
    
    padding:25px;
    
    border-radius:25px;
    
    box-shadow:0 15px 30px rgba(0,0,0,.15);
    
    display:flex;
    
    align-items:center;
    
    gap:15px;
    
    }
    
    
    
    .quality-badge i{
    
    font-size:35px;
    
    color:#ffc107;
    
    }
    
    
    
    
    
    .quality-card{
    
    display:flex;
    
    gap:25px;
    
    background:white;
    
    padding:25px;
    
    border-radius:25px;
    
    margin-bottom:20px;
    
    box-shadow:0 10px 25px rgba(0,0,0,.06);
    
    transition:.3s;
    
    }
    
    
    
    .quality-card:hover{
    
    transform:translateX(10px);
    
    }
    
    
    
    
    
    .quality-icon{
    
    min-width:60px;
    
    height:60px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    }
    
    
    
    .quality-icon i{
    
    color:white;
    
    font-size:25px;
    
    }
    
    
    
    .quality-card h3{
    
    font-size:22px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .quality-card p{
    
    color:#666;
    
    line-height:1.7;
    
    }
    
    
    
    
    
    .commitments{
    
    margin-top:80px;
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:25px;
    
    }
    
    
    
    .commitments div{
    
    background:white;
    
    padding:35px 25px;
    
    text-align:center;
    
    border-radius:25px;
    
    box-shadow:0 10px 25px rgba(0,0,0,.06);
    
    }
    
    
    
    .commitments i{
    
    font-size:40px;
    
    color:#2e7d32;
    
    margin-bottom:20px;
    
    }
    
    
    
    .commitments h3{
    
    margin-bottom:10px;
    
    }
    
    
    
    .commitments p{
    
    color:#666;
    
    }
    
    
    
    
    @media(max-width:950px){
    
    
    .quality-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .commitments{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    }
    
    
    
    @media(max-width:600px){
    
    
    .commitments{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .quality-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .quality-image{
    
    height:350px;
    
    }
    
    
    }





    /*====================================================
GALERIE FABRICATION
====================================================*/


.factory-gallery-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    .gallery-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:60px;
    
    }
    
    
    
    
    .gallery-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .gallery-header h2{
    
    font-size:48px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .gallery-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .factory-gallery{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    grid-auto-rows:260px;
    
    gap:25px;
    
    }
    
    
    
    
    
    .gallery-item{
    
    position:relative;
    
    overflow:hidden;
    
    border-radius:30px;
    
    cursor:pointer;
    
    }
    
    
    
    
    
    .gallery-item.big{
    
    grid-column:span 2;
    
    grid-row:span 2;
    
    }
    
    
    
    
    
    .gallery-item img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    transition:.5s;
    
    }
    
    
    
    
    .gallery-item:hover img{
    
    transform:scale(1.12);
    
    }
    
    
    
    
    
    .gallery-overlay{
    
    position:absolute;
    
    bottom:0;
    
    left:0;
    
    width:100%;
    
    padding:30px;
    
    background:
    linear-gradient(
    transparent,
    rgba(0,0,0,.8)
    );
    
    color:white;
    
    }
    
    
    
    .gallery-overlay h3{
    
    font-size:25px;
    
    }
    
    
    
    
    .gallery-overlay p{
    
    margin-top:8px;
    
    }
    
    
    
    
    
    
    /*========================
    VIDEO
    =========================*/
    
    
    .production-video{
    
    margin-top:100px;
    
    }
    
    
    
    
    
    .video-container{
    
    background:#b71c1c;
    
    border-radius:40px;
    
    padding:60px;
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:50px;
    
    align-items:center;
    
    color:white;
    
    }
    
    
    
    
    .video-content span{
    
    font-weight:700;
    
    letter-spacing:2px;
    
    color:#ffc107;
    
    }
    
    
    
    .video-content h2{
    
    font-size:45px;
    
    margin:25px 0;
    
    line-height:1.3;
    
    }
    
    
    
    .video-content p{
    
    line-height:1.8;
    
    margin-bottom:35px;
    
    }
    
    
    
    .video-btn{
    
    display:inline-flex;
    
    align-items:center;
    
    gap:12px;
    
    background:white;
    
    color:#b71c1c;
    
    padding:18px 35px;
    
    border-radius:40px;
    
    font-weight:700;
    
    }
    
    
    
    
    
    .video-box video{
    
    width:100%;
    
    height:350px;
    
    object-fit:cover;
    
    border-radius:30px;
    
    }
    
    
    
    
    
    
    
    @media(max-width:1000px){
    
    
    .factory-gallery{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    .video-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    }
    
    
    
    
    @media(max-width:600px){
    
    
    .factory-gallery{
    
    grid-template-columns:1fr;
    
    grid-auto-rows:250px;
    
    }
    
    
    
    .gallery-item.big{
    
    grid-column:auto;
    
    grid-row:auto;
    
    }
    
    
    
    .video-container{
    
    padding:30px;
    
    }
    
    
    
    .video-content h2{
    
    font-size:32px;
    
    }
    
    
    
    }





    /*====================================================
ENGAGEMENTS JP OIL
====================================================*/


.commitment-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    .commitment-header{
    
    text-align:center;
    
    max-width:900px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .commitment-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .commitment-header h2{
    
    font-size:48px;
    
    font-weight:800;
    
    line-height:1.3;
    
    margin:20px 0;
    
    }
    
    
    
    .commitment-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .commitment-wrapper{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:60px;
    
    align-items:center;
    
    }
    
    
    
    
    
    .commitment-image{
    
    position:relative;
    
    height:600px;
    
    }
    
    
    
    .commitment-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    border-radius:35px;
    
    }
    
    
    
    
    
    .impact-box{
    
    position:absolute;
    
    bottom:30px;
    
    left:30px;
    
    right:30px;
    
    background:white;
    
    padding:25px;
    
    border-radius:25px;
    
    display:flex;
    
    gap:20px;
    
    align-items:center;
    
    box-shadow:0 15px 35px rgba(0,0,0,.15);
    
    }
    
    
    
    .impact-box i{
    
    font-size:45px;
    
    color:#2e7d32;
    
    }
    
    
    
    
    
    .commitment-cards{
    
    display:grid;
    
    grid-template-columns:1fr;
    
    gap:25px;
    
    }
    
    
    
    
    
    .commitment-card{
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    display:flex;
    
    gap:25px;
    
    box-shadow:0 10px 30px rgba(0,0,0,.06);
    
    transition:.3s;
    
    }
    
    
    
    .commitment-card:hover{
    
    transform:translateX(10px);
    
    }
    
    
    
    
    
    .commitment-icon{
    
    min-width:65px;
    
    height:65px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    }
    
    
    
    .commitment-icon i{
    
    color:white;
    
    font-size:28px;
    
    }
    
    
    
    
    
    .commitment-card h3{
    
    font-size:23px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .commitment-card p{
    
    color:#666;
    
    line-height:1.7;
    
    }
    
    
    
    
    
    
    
    /*=========================
    STATISTIQUES
    =========================*/
    
    
    .impact-stats{
    
    margin-top:90px;
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:25px;
    
    }
    
    
    
    
    
    .impact-stats div{
    
    background:white;
    
    text-align:center;
    
    padding:35px;
    
    border-radius:25px;
    
    box-shadow:0 10px 25px rgba(0,0,0,.06);
    
    }
    
    
    
    .impact-stats h2{
    
    font-size:45px;
    
    color:#b71c1c;
    
    margin-bottom:10px;
    
    }
    
    
    
    .impact-stats p{
    
    color:#666;
    
    }
    
    
    
    
    
    @media(max-width:950px){
    
    
    .commitment-wrapper{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .impact-stats{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    }
    
    
    
    
    @media(max-width:600px){
    
    
    .commitment-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .commitment-image{
    
    height:350px;
    
    }
    
    
    
    .commitment-card{
    
    flex-direction:column;
    
    }
    
    
    
    .impact-stats{
    
    grid-template-columns:1fr;
    
    }
    
    
    }





    /*====================================================
PARTENAIRES JP OIL
====================================================*/


.partners-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    .partners-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .partners-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .partners-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .partners-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .partners-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    
    .partner-card{
    
    padding:35px;
    
    border-radius:30px;
    
    background:#fff8f1;
    
    transition:.4s;
    
    }
    
    
    
    .partner-card:hover{
    
    transform:translateY(-10px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.1);
    
    }
    
    
    
    
    .partner-icon{
    
    width:75px;
    
    height:75px;
    
    border-radius:50%;
    
    background:#b71c1c;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin-bottom:25px;
    
    }
    
    
    
    .partner-icon i{
    
    color:white;
    
    font-size:32px;
    
    }
    
    
    
    
    .partner-card h3{
    
    font-size:27px;
    
    margin-bottom:15px;
    
    }
    
    
    
    .partner-card p{
    
    color:#666;
    
    line-height:1.8;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    .partner-card a{
    
    color:#b71c1c;
    
    font-weight:700;
    
    }
    
    
    
    
    
    
    /* LOGOS */
    
    
    .partner-logos{
    
    margin-top:90px;
    
    text-align:center;
    
    }
    
    
    
    .partner-logos h3{
    
    font-size:30px;
    
    margin-bottom:40px;
    
    }
    
    
    
    
    
    .logos-grid{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:25px;
    
    }
    
    
    
    .logos-grid div{
    
    height:120px;
    
    background:#fafafa;
    
    border-radius:20px;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    padding:20px;
    
    }
    
    
    
    .logos-grid img{
    
    max-height:70px;
    
    }
    
    
    
    
    
    
    
    /* CTA */
    
    
    .partner-cta{
    
    margin-top:80px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:45px;
    
    border-radius:35px;
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    gap:30px;
    
    }
    
    
    
    .partner-cta h2{
    
    font-size:35px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .partner-cta p{
    
    color:#f5dddd;
    
    }
    
    
    
    
    @media(max-width:950px){
    
    
    .partners-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    .logos-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    .partner-cta{
    
    flex-direction:column;
    
    text-align:center;
    
    }
    
    
    }
    
    
    
    
    
    @media(max-width:600px){
    
    
    .partners-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .logos-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .partners-header h2{
    
    font-size:35px;
    
    }
    
    
    }




    /*====================================================
CONTACT FABRICATION
====================================================*/


.contact-factory-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    .factory-contact-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    .factory-contact-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .factory-contact-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .factory-contact-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .factory-contact-container{
    
    display:grid;
    
    grid-template-columns:1.3fr .7fr;
    
    gap:50px;
    
    align-items:start;
    
    }
    
    
    
    
    
    
    .quote-box{
    
    background:white;
    
    padding:45px;
    
    border-radius:35px;
    
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    
    }
    
    
    
    
    .quote-box h3{
    
    font-size:35px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .quote-box p{
    
    color:#777;
    
    margin-bottom:35px;
    
    }
    
    
    
    
    
    .input-row{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:20px;
    
    }
    
    
    
    
    .input-group{
    
    margin-bottom:20px;
    
    }
    
    
    
    
    .input-group label{
    
    display:block;
    
    font-weight:600;
    
    margin-bottom:10px;
    
    }
    
    
    
    .input-group input,
    
    .input-group select,
    
    .input-group textarea{
    
    width:100%;
    
    padding:16px;
    
    border:1px solid #ddd;
    
    border-radius:15px;
    
    font-family:inherit;
    
    font-size:15px;
    
    outline:none;
    
    }
    
    
    
    .input-group input:focus,
    
    .input-group textarea:focus{
    
    border-color:#b71c1c;
    
    }
    
    
    
    
    
    .quote-box button{
    
    width:100%;
    
    padding:18px;
    
    border:none;
    
    border-radius:40px;
    
    background:#b71c1c;
    
    color:white;
    
    font-size:17px;
    
    font-weight:700;
    
    cursor:pointer;
    
    }
    
    
    
    
    
    
    
    .factory-info-box{
    
    display:flex;
    
    flex-direction:column;
    
    gap:25px;
    
    }
    
    
    
    
    .info-card{
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    display:flex;
    
    gap:20px;
    
    align-items:center;
    
    box-shadow:0 10px 25px rgba(0,0,0,.06);
    
    }
    
    
    
    .info-card i{
    
    font-size:35px;
    
    color:#b71c1c;
    
    }
    
    
    
    .info-card h3{
    
    margin-bottom:8px;
    
    }
    
    
    
    .info-card p{
    
    color:#777;
    
    }
    
    
    
    
    
    
    /* FINAL */
    
    
    .final-factory-banner{
    
    margin-top:80px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:60px;
    
    border-radius:40px;
    
    text-align:center;
    
    }
    
    
    
    .final-factory-banner h2{
    
    font-size:45px;
    
    margin-bottom:20px;
    
    }
    
    
    
    .final-factory-banner p{
    
    margin-bottom:35px;
    
    line-height:1.8;
    
    }
    
    
    
    .final-factory-banner a{
    
    display:inline-block;
    
    margin:10px;
    
    }
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .factory-contact-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .input-row{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .final-factory-banner h2{
    
    font-size:32px;
    
    }
    
    
    }
    
    
    
    @media(max-width:600px){
    
    
    .quote-box{
    
    padding:25px;
    
    }
    
    
    .factory-contact-header h2{
    
    font-size:35px;
    
    }
    
    
    .final-factory-banner{
    
    padding:35px 20px;
    
    }
    
    
    }




    /*====================================================
QUALITE PAGE
BLOC 1 HERO
====================================================*/


.quality-hero{


    height:90vh;
    
    background:
    url("images/quality-hero.jpg")
    center/cover no-repeat;
    
    
    position:relative;
    
    display:flex;
    
    align-items:center;
    
    padding:0 8%;
    
    
    }
    
    
    
    
    .quality-overlay{
    
    
    position:absolute;
    
    inset:0;
    
    background:
    linear-gradient(
    90deg,
    rgba(0,0,0,.75),
    rgba(0,0,0,.35)
    );
    
    
    }
    
    
    
    
    .quality-hero-content{
    
    
    position:relative;
    
    z-index:2;
    
    max-width:750px;
    
    color:white;
    
    
    }
    
    
    
    
    
    .quality-hero-content span{
    
    
    color:#ffc107;
    
    font-weight:700;
    
    letter-spacing:3px;
    
    font-size:15px;
    
    
    }
    
    
    
    
    
    .quality-hero-content h1{
    
    
    font-size:65px;
    
    line-height:1.15;
    
    font-weight:800;
    
    margin:25px 0;
    
    
    }
    
    
    
    
    
    .quality-hero-content p{
    
    
    font-size:20px;
    
    line-height:1.8;
    
    color:#eee;
    
    margin-bottom:40px;
    
    
    }
    
    
    
    
    
    .quality-buttons{
    
    
    display:flex;
    
    gap:20px;
    
    
    }
    
    
    
    
    
    @media(max-width:800px){
    
    
    
    .quality-hero{
    
    
    height:80vh;
    
    }
    
    
    
    .quality-hero-content h1{
    
    
    font-size:38px;
    
    
    }
    
    
    
    .quality-hero-content p{
    
    
    font-size:16px;
    
    
    }
    
    
    
    .quality-buttons{
    
    
    flex-direction:column;
    
    
    }
    
    
    }



    /*====================================================
QUALITE PAGE
BLOC 2 : STANDARDS
====================================================*/


.quality-standard-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    .standard-header{
    
    max-width:850px;
    
    margin:auto;
    
    text-align:center;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    
    .standard-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .standard-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    .standard-header p{
    
    color:#666;
    
    line-height:1.8;
    
    font-size:17px;
    
    }
    
    
    
    
    
    
    
    .standard-grid{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    
    
    .standard-card{
    
    
    background:white;
    
    padding:40px 30px;
    
    border-radius:30px;
    
    text-align:center;
    
    box-shadow:0 10px 30px rgba(0,0,0,.07);
    
    transition:.4s;
    
    
    }
    
    
    
    
    .standard-card:hover{
    
    
    transform:translateY(-12px);
    
    
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    
    
    }
    
    
    
    
    
    .standard-icon{
    
    
    width:80px;
    
    height:80px;
    
    margin:auto;
    
    margin-bottom:25px;
    
    border-radius:50%;
    
    background:#b71c1c;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    
    }
    
    
    
    
    
    .standard-icon i{
    
    
    font-size:35px;
    
    color:white;
    
    
    }
    
    
    
    
    
    .standard-card h3{
    
    
    font-size:23px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    .standard-card p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    @media(max-width:1100px){
    
    
    .standard-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    }
    
    
    
    
    @media(max-width:600px){
    
    
    .standard-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .standard-header h2{
    
    font-size:35px;
    
    }
    
    
    }





    /*====================================================
QUALITE PAGE
BLOC 3 : LABORATOIRE
====================================================*/


.laboratory-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    .laboratory-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .laboratory-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .laboratory-header h2{
    
    font-size:48px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .laboratory-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .laboratory-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:60px;
    
    align-items:center;
    
    }
    
    
    
    
    
    
    
    .laboratory-image{
    
    height:600px;
    
    position:relative;
    
    }
    
    
    
    .laboratory-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    border-radius:35px;
    
    }
    
    
    
    
    
    
    
    .lab-badge{
    
    position:absolute;
    
    bottom:30px;
    
    left:30px;
    
    background:white;
    
    padding:25px;
    
    border-radius:25px;
    
    display:flex;
    
    align-items:center;
    
    gap:20px;
    
    box-shadow:0 15px 35px rgba(0,0,0,.15);
    
    }
    
    
    
    .lab-badge i{
    
    font-size:40px;
    
    color:#b71c1c;
    
    }
    
    
    
    
    
    .analysis-content{
    
    display:flex;
    
    flex-direction:column;
    
    gap:25px;
    
    }
    
    
    
    
    
    
    .analysis-card{
    
    display:flex;
    
    gap:25px;
    
    background:#fff8f1;
    
    padding:30px;
    
    border-radius:25px;
    
    transition:.3s;
    
    }
    
    
    
    .analysis-card:hover{
    
    transform:translateX(10px);
    
    }
    
    
    
    
    
    .analysis-icon{
    
    min-width:65px;
    
    height:65px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    }
    
    
    
    .analysis-icon i{
    
    font-size:28px;
    
    color:white;
    
    }
    
    
    
    
    
    .analysis-card h3{
    
    font-size:24px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .analysis-card p{
    
    color:#666;
    
    line-height:1.7;
    
    }
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .laboratory-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .laboratory-image{
    
    height:400px;
    
    }
    
    
    }
    
    
    
    @media(max-width:600px){
    
    
    .laboratory-header h2{
    
    font-size:34px;
    
    }
    
    
    
    .analysis-card{
    
    flex-direction:column;
    
    }
    
    
    }




    /*====================================================
QUALITE PAGE
BLOC 4 : CARACTERISTIQUES HUILE
====================================================*/


.oil-characteristics-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    .characteristics-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .characteristics-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .characteristics-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .characteristics-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .characteristics-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:60px;
    
    align-items:center;
    
    }
    
    
    
    
    
    
    
    .oil-premium-image{
    
    height:600px;
    
    position:relative;
    
    }
    
    
    
    .oil-premium-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    border-radius:40px;
    
    }
    
    
    
    
    
    
    
    .natural-badge{
    
    position:absolute;
    
    bottom:30px;
    
    left:30px;
    
    background:white;
    
    padding:25px;
    
    border-radius:25px;
    
    display:flex;
    
    align-items:center;
    
    gap:20px;
    
    box-shadow:0 15px 35px rgba(0,0,0,.15);
    
    }
    
    
    
    .natural-badge i{
    
    font-size:40px;
    
    color:#2e7d32;
    
    }
    
    
    
    
    
    
    
    
    .characteristics-list{
    
    display:flex;
    
    flex-direction:column;
    
    gap:25px;
    
    }
    
    
    
    
    
    
    .characteristic-item{
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    display:flex;
    
    gap:25px;
    
    align-items:flex-start;
    
    box-shadow:0 10px 25px rgba(0,0,0,.06);
    
    transition:.3s;
    
    }
    
    
    
    .characteristic-item:hover{
    
    transform:translateX(10px);
    
    }
    
    
    
    
    .characteristic-item i{
    
    width:60px;
    
    height:60px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    color:white;
    
    font-size:25px;
    
    }
    
    
    
    
    
    
    .characteristic-item h3{
    
    font-size:24px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .characteristic-item p{
    
    color:#666;
    
    line-height:1.7;
    
    }
    
    
    
    
    
    
    
    /* BARRES */
    
    
    .quality-progress-box{
    
    margin-top:80px;
    
    background:white;
    
    padding:45px;
    
    border-radius:35px;
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:40px;
    
    }
    
    
    
    
    .progress-item h3{
    
    margin-bottom:15px;
    
    }
    
    
    
    
    
    .progress-bar{
    
    height:12px;
    
    background:#eee;
    
    border-radius:20px;
    
    overflow:hidden;
    
    }
    
    
    
    .progress-bar span{
    
    display:block;
    
    height:100%;
    
    background:#b71c1c;
    
    border-radius:20px;
    
    }
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .characteristics-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .quality-progress-box{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .oil-premium-image{
    
    height:400px;
    
    }
    
    
    }
    
    
    
    
    @media(max-width:600px){
    
    
    .characteristics-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .characteristic-item{
    
    flex-direction:column;
    
    }
    
    
    }


    /*====================================================
QUALITE PAGE
BLOC 5 : TRACABILITE
====================================================*/


.traceability-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    .traceability-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .traceability-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .traceability-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .traceability-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    .trace-container{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    
    .trace-card{
    
    background:#fff8f1;
    
    padding:35px;
    
    border-radius:30px;
    
    position:relative;
    
    text-align:center;
    
    transition:.4s;
    
    }
    
    
    
    .trace-card:hover{
    
    transform:translateY(-10px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.1);
    
    }
    
    
    
    
    
    .trace-number{
    
    position:absolute;
    
    top:20px;
    
    right:25px;
    
    font-size:45px;
    
    font-weight:800;
    
    color:rgba(183,28,28,.15);
    
    }
    
    
    
    
    
    .trace-icon{
    
    width:80px;
    
    height:80px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin:0 auto 25px;
    
    }
    
    
    
    .trace-icon i{
    
    font-size:35px;
    
    color:white;
    
    }
    
    
    
    
    
    .trace-card h3{
    
    font-size:24px;
    
    margin-bottom:15px;
    
    }
    
    
    
    
    .trace-card p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    /*==========================
    TIMELINE
    ==========================*/
    
    
    .trace-line{
    
    margin-top:80px;
    
    background:#b71c1c;
    
    padding:35px;
    
    border-radius:30px;
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:20px;
    
    }
    
    
    
    
    
    .line-step{
    
    background:white;
    
    padding:20px;
    
    border-radius:20px;
    
    text-align:center;
    
    font-weight:700;
    
    color:#777;
    
    }
    
    
    
    
    .line-step.active{
    
    color:#b71c1c;
    
    }
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .trace-container{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    .trace-line{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    }
    
    
    
    
    
    @media(max-width:600px){
    
    
    .trace-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .trace-line{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .traceability-header h2{
    
    font-size:35px;
    
    }
    
    
    }




    /*====================================================
QUALITE PAGE
BLOC 6 : CERTIFICATIONS
====================================================*/


.certification-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    .certification-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .certification-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .certification-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .certification-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .certification-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:60px;
    
    align-items:center;
    
    }
    
    
    
    
    
    
    
    .certification-image{
    
    height:600px;
    
    position:relative;
    
    }
    
    
    
    .certification-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    border-radius:40px;
    
    }
    
    
    
    
    
    
    .certificate-badge{
    
    position:absolute;
    
    bottom:30px;
    
    left:30px;
    
    background:white;
    
    padding:25px;
    
    border-radius:25px;
    
    display:flex;
    
    align-items:center;
    
    gap:20px;
    
    box-shadow:0 15px 35px rgba(0,0,0,.15);
    
    }
    
    
    
    .certificate-badge i{
    
    font-size:40px;
    
    color:#ffc107;
    
    }
    
    
    
    
    
    .certification-content{
    
    display:flex;
    
    flex-direction:column;
    
    gap:25px;
    
    }
    
    
    
    
    
    .certification-card{
    
    background:white;
    
    padding:30px;
    
    border-radius:25px;
    
    display:flex;
    
    gap:25px;
    
    align-items:flex-start;
    
    box-shadow:0 10px 25px rgba(0,0,0,.06);
    
    transition:.3s;
    
    }
    
    
    
    .certification-card:hover{
    
    transform:translateX(10px);
    
    }
    
    
    
    
    
    .certification-icon{
    
    min-width:65px;
    
    height:65px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    }
    
    
    
    .certification-icon i{
    
    font-size:28px;
    
    color:white;
    
    }
    
    
    
    
    
    .certification-card h3{
    
    font-size:23px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .certification-card p{
    
    color:#666;
    
    line-height:1.7;
    
    }
    
    
    
    
    
    
    /* DOCUMENTS */
    
    
    .quality-documents{
    
    margin-top:90px;
    
    background:white;
    
    padding:45px;
    
    border-radius:35px;
    
    text-align:center;
    
    }
    
    
    
    .quality-documents h3{
    
    font-size:30px;
    
    margin-bottom:40px;
    
    }
    
    
    
    
    
    .documents-grid{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:25px;
    
    }
    
    
    
    
    
    .document-box{
    
    padding:30px;
    
    background:#fff8f1;
    
    border-radius:25px;
    
    }
    
    
    
    .document-box i{
    
    font-size:40px;
    
    color:#b71c1c;
    
    margin-bottom:15px;
    
    }
    
    
    
    .document-box p{
    
    font-weight:600;
    
    }
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .certification-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .documents-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    }
    
    
    
    @media(max-width:600px){
    
    
    .documents-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .certification-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .certification-card{
    
    flex-direction:column;
    
    }
    
    
    }



    /*====================================================
QUALITE PAGE
BLOC 7 : FAQ + CONTACT
====================================================*/


.quality-faq-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    .faq-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    .faq-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .faq-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .faq-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    
    .faq-container{
    
    max-width:950px;
    
    margin:auto;
    
    display:flex;
    
    flex-direction:column;
    
    gap:20px;
    
    }
    
    
    
    
    
    
    .faq-item{
    
    background:#fff8f1;
    
    border-radius:20px;
    
    overflow:hidden;
    
    }
    
    
    
    
    
    .faq-question{
    
    width:100%;
    
    border:none;
    
    background:none;
    
    padding:25px 30px;
    
    font-size:18px;
    
    font-weight:700;
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    cursor:pointer;
    
    text-align:left;
    
    color:#222;
    
    }
    
    
    
    
    
    .faq-question i{
    
    color:#b71c1c;
    
    transition:.3s;
    
    }
    
    
    
    
    
    .faq-answer{
    
    padding:0 30px 25px;
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    /* CONTACT FINAL */
    
    
    .quality-contact-banner{
    
    margin-top:90px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:60px;
    
    border-radius:40px;
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    gap:40px;
    
    }
    
    
    
    
    
    .quality-contact-banner h2{
    
    font-size:40px;
    
    margin-bottom:15px;
    
    }
    
    
    
    .quality-contact-banner p{
    
    line-height:1.8;
    
    color:#f5f5f5;
    
    }
    
    
    
    
    
    .quality-contact-buttons{
    
    display:flex;
    
    gap:20px;
    
    flex-wrap:wrap;
    
    }
    
    
    
    
    
    .quality-contact-buttons .btn-outline{
    
    border-color:white;
    
    color:white;
    
    }
    
    
    
    
    
    .quality-contact-buttons .btn-outline:hover{
    
    background:white;
    
    color:#b71c1c;
    
    }
    
    
    
    
    
    
    
    
    @media(max-width:900px){
    
    
    .quality-contact-banner{
    
    flex-direction:column;
    
    text-align:center;
    
    }
    
    
    
    }
    
    
    
    @media(max-width:600px){
    
    
    .faq-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .quality-contact-banner{
    
    padding:35px 20px;
    
    }
    
    
    
    .quality-contact-banner h2{
    
    font-size:30px;
    
    }
    
    
    .faq-question{
    
    font-size:16px;
    
    }
    
    
    }


    /*====================================================
PAGE PROFESSIONNEL
BLOC 1 : HERO
====================================================*/


.pro-hero{

    height:90vh;
    
    background:
    url("images/pro-hero.jpg")
    center/cover no-repeat;
    
    
    position:relative;
    
    display:flex;
    
    align-items:center;
    
    padding:0 8%;
    
    
    }
    
    
    
    
    .pro-overlay{
    
    position:absolute;
    
    inset:0;
    
    background:
    linear-gradient(
    90deg,
    rgba(0,0,0,.75),
    rgba(0,0,0,.35)
    );
    
    }
    
    
    
    
    
    .pro-hero-content{
    
    position:relative;
    
    z-index:2;
    
    max-width:800px;
    
    color:white;
    
    }
    
    
    
    
    
    .pro-hero-content span{
    
    color:#ffc107;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    
    .pro-hero-content h1{
    
    font-size:65px;
    
    line-height:1.15;
    
    font-weight:800;
    
    margin:25px 0;
    
    }
    
    
    
    
    
    .pro-hero-content p{
    
    font-size:20px;
    
    line-height:1.8;
    
    color:#eee;
    
    margin-bottom:40px;
    
    }
    
    
    
    
    .pro-buttons{
    
    display:flex;
    
    gap:20px;
    
    }
    
    
    
    
    
    @media(max-width:800px){
    
    
    .pro-hero{
    
    height:80vh;
    
    }
    
    
    
    .pro-hero-content h1{
    
    font-size:38px;
    
    }
    
    
    
    .pro-hero-content p{
    
    font-size:16px;
    
    }
    
    
    
    .pro-buttons{
    
    flex-direction:column;
    
    }
    
    
    
    }


    /*====================================================
PAGE PROFESSIONNEL
BLOC 2 : SOLUTIONS METIERS
====================================================*/


.business-solutions{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    .business-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .business-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .business-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .business-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .business-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    
    
    
    .business-card{
    
    background:white;
    
    border-radius:30px;
    
    overflow:hidden;
    
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    
    transition:.4s;
    
    }
    
    
    
    .business-card:hover{
    
    transform:translateY(-12px);
    
    box-shadow:0 20px 45px rgba(0,0,0,.15);
    
    }
    
    
    
    
    
    .business-image{
    
    height:230px;
    
    overflow:hidden;
    
    }
    
    
    
    
    
    .business-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    transition:.5s;
    
    }
    
    
    
    
    
    .business-card:hover img{
    
    transform:scale(1.1);
    
    }
    
    
    
    
    
    
    .business-content{
    
    padding:30px;
    
    }
    
    
    
    
    
    .business-content i{
    
    font-size:35px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    
    .business-content h3{
    
    font-size:25px;
    
    margin-bottom:15px;
    
    }
    
    
    
    
    .business-content p{
    
    color:#666;
    
    line-height:1.7;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    
    .business-content a{
    
    color:#b71c1c;
    
    font-weight:700;
    
    }
    
    
    
    
    
    
    
    @media(max-width:1100px){
    
    
    .business-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    }
    
    
    
    
    
    @media(max-width:700px){
    
    
    .business-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .business-header h2{
    
    font-size:35px;
    
    }
    
    
    }


    /*====================================================
PAGE PROFESSIONNEL
BLOC 3 : FORMATS PROFESSIONNELS
====================================================*/


.professional-format-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    .format-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .format-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .format-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    .format-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .format-grid{
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    
    
    
    .format-card{
    
    background:#fff8f1;
    
    border-radius:30px;
    
    overflow:hidden;
    
    transition:.4s;
    
    }
    
    
    
    .format-card:hover{
    
    transform:translateY(-12px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    
    }
    
    
    
    
    
    
    
    .format-image{
    
    height:260px;
    
    overflow:hidden;
    
    }
    
    
    
    .format-image img{
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    }
    
    
    
    
    
    
    .format-content{
    
    padding:30px;
    
    text-align:center;
    
    }
    
    
    
    
    
    .format-content i{
    
    font-size:40px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    
    .format-content h3{
    
    font-size:25px;
    
    margin-bottom:15px;
    
    }
    
    
    
    .format-content p{
    
    color:#666;
    
    line-height:1.7;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    .format-content span{
    
    background:#b71c1c;
    
    color:white;
    
    padding:8px 18px;
    
    border-radius:30px;
    
    font-size:13px;
    
    font-weight:600;
    
    }
    
    
    
    
    
    
    
    
    /* BANNER */
    
    
    .volume-banner{
    
    margin-top:80px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:45px;
    
    border-radius:35px;
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    gap:30px;
    
    }
    
    
    
    .volume-banner h2{
    
    font-size:35px;
    
    margin-bottom:10px;
    
    }
    
    
    
    .volume-banner p{
    
    line-height:1.7;
    
    }
    
    
    
    
    
    @media(max-width:1100px){
    
    
    .format-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    }
    
    
    
    
    
    @media(max-width:700px){
    
    
    .format-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .volume-banner{
    
    flex-direction:column;
    
    text-align:center;
    
    }
    
    
    
    .format-header h2{
    
    font-size:35px;
    
    }
    
    
    }



    /*====================================================
PAGE PROFESSIONNEL
BLOC 4 : CALCULATEUR
====================================================*/


.calculator-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    .calculator-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .calculator-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    .calculator-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .calculator-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .calculator-container{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:50px;
    
    align-items:center;
    
    }
    
    
    
    
    
    
    
    .calculator-box{
    
    
    background:white;
    
    padding:45px;
    
    border-radius:35px;
    
    box-shadow:0 15px 35px rgba(0,0,0,.08);
    
    }
    
    
    
    
    
    .calculator-box h3{
    
    font-size:30px;
    
    margin-bottom:35px;
    
    }
    
    
    
    
    
    .calc-group{
    
    margin-bottom:25px;
    
    }
    
    
    
    
    .calc-group label{
    
    display:block;
    
    font-weight:600;
    
    margin-bottom:10px;
    
    }
    
    
    
    
    .calc-group input,
    
    .calc-group select{
    
    
    width:100%;
    
    padding:16px;
    
    border-radius:15px;
    
    border:1px solid #ddd;
    
    font-size:15px;
    
    }
    
    
    
    
    
    .calculator-box button{
    
    
    width:100%;
    
    padding:18px;
    
    border:none;
    
    background:#b71c1c;
    
    color:white;
    
    font-size:16px;
    
    font-weight:700;
    
    border-radius:40px;
    
    cursor:pointer;
    
    }
    
    
    
    
    
    
    
    
    
    /* RESULTAT */
    
    
    .result-box{
    
    
    background:#b71c1c;
    
    color:white;
    
    padding:45px;
    
    border-radius:35px;
    
    text-align:center;
    
    }
    
    
    
    
    
    .result-icon i{
    
    font-size:60px;
    
    color:#ffc107;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    
    .result-box h3{
    
    font-size:35px;
    
    margin-bottom:30px;
    
    }
    
    
    
    
    .result-item{
    
    background:white;
    
    color:#222;
    
    padding:20px;
    
    border-radius:20px;
    
    margin-bottom:15px;
    
    display:flex;
    
    justify-content:space-between;
    
    }
    
    
    
    
    
    .result-item strong{
    
    color:#b71c1c;
    
    }
    
    
    
    
    
    
    
    @media(max-width:900px){
    
    
    .calculator-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .calculator-header h2{
    
    font-size:35px;
    
    }
    
    
    }



    /*====================================================
PAGE PROFESSIONNEL
BLOC 5 : SERVICES
====================================================*/


.professional-services-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    .services-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    .services-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .services-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    .services-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    
    .services-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    
    
    
    
    .service-card{
    
    
    background:#fff8f1;
    
    padding:40px 30px;
    
    border-radius:30px;
    
    text-align:center;
    
    transition:.4s;
    
    border:1px solid transparent;
    
    }
    
    
    
    .service-card:hover{
    
    
    transform:translateY(-12px);
    
    background:white;
    
    border-color:#eee;
    
    box-shadow:0 20px 40px rgba(0,0,0,.1);
    
    
    }
    
    
    
    
    
    
    
    
    .service-icon{
    
    
    width:80px;
    
    height:80px;
    
    margin:auto;
    
    margin-bottom:25px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    }
    
    
    
    .service-icon i{
    
    font-size:35px;
    
    color:white;
    
    }
    
    
    
    
    
    .service-card h3{
    
    
    font-size:25px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .service-card p{
    
    
    color:#666;
    
    line-height:1.8;
    
    margin-bottom:20px;
    
    
    }
    
    
    
    
    
    .service-card a{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    }
    
    
    
    
    
    
    
    @media(max-width:1000px){
    
    
    .services-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    }
    
    
    
    
    @media(max-width:650px){
    
    
    .services-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .services-header h2{
    
    font-size:35px;
    
    }
    
    
    }



    /*====================================================
PAGE PROFESSIONNEL
BLOC 6 : TEMOIGNAGES
====================================================*/


.professional-testimonial-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    .testimonial-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    .testimonial-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .testimonial-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    .testimonial-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    
    .testimonial-grid{
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    }
    
    
    
    
    
    
    
    
    .professional-testimonial-card{
    
    background:white;
    
    padding:40px 30px;
    
    border-radius:30px;
    
    box-shadow:0 10px 30px rgba(0,0,0,.07);
    
    text-align:center;
    
    transition:.4s;
    
    }
    
    
    
    
    .professional-testimonial-card:hover{
    
    transform:translateY(-10px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    
    }
    
    
    
    
    
    .company-logo{
    
    
    width:80px;
    
    height:80px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin:auto;
    
    margin-bottom:25px;
    
    }
    
    
    
    .company-logo i{
    
    font-size:35px;
    
    color:white;
    
    }
    
    
    
    
    
    
    
    .professional-testimonial-card p{
    
    color:#666;
    
    font-style:italic;
    
    line-height:1.8;
    
    margin-bottom:25px;
    
    }
    
    
    
    
    
    
    
    .client-info h3{
    
    font-size:22px;
    
    margin-bottom:8px;
    
    }
    
    
    
    
    .client-info span{
    
    color:#999;
    
    font-size:14px;
    
    }
    
    
    
    
    .stars{
    
    color:#ffc107;
    
    font-size:22px;
    
    margin-top:20px;
    
    }
    
    
    
    
    
    
    
    
    
    /* VIDEO BOX */
    
    
    .testimonial-video-box{
    
    
    margin-top:80px;
    
    background:#b71c1c;
    
    color:white;
    
    padding:50px;
    
    border-radius:40px;
    
    display:flex;
    
    align-items:center;
    
    justify-content:space-between;
    
    gap:30px;
    
    
    }
    
    
    
    
    
    .testimonial-video-box i{
    
    font-size:70px;
    
    color:#ffc107;
    
    }
    
    
    
    
    
    .testimonial-video-box h2{
    
    font-size:35px;
    
    margin-bottom:15px;
    
    }
    
    
    
    
    .testimonial-video-box p{
    
    line-height:1.7;
    
    }
    
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .testimonial-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .testimonial-video-box{
    
    flex-direction:column;
    
    text-align:center;
    
    }
    
    
    }
    
    
    
    
    @media(max-width:600px){
    
    
    .testimonial-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .testimonial-video-box{
    
    padding:35px 20px;
    
    }
    
    
    }



    /*====================================================
PAGE PROFESSIONNEL
BLOC 7 : CONTACT COMMERCIAL
====================================================*/


.professional-contact-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    .pro-contact-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    .pro-contact-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .pro-contact-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    .pro-contact-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .professional-contact-container{
    
    display:grid;
    
    grid-template-columns:1fr 1.2fr;
    
    gap:50px;
    
    align-items:start;
    
    }
    
    
    
    
    
    
    
    /* INFORMATIONS */
    
    
    .commercial-info{
    
    background:#b71c1c;
    
    color:white;
    
    padding:45px;
    
    border-radius:35px;
    
    }
    
    
    
    
    .commercial-info h3{
    
    font-size:30px;
    
    margin-bottom:35px;
    
    }
    
    
    
    
    
    .commercial-item{
    
    display:flex;
    
    gap:20px;
    
    align-items:center;
    
    margin-bottom:25px;
    
    }
    
    
    
    
    
    .commercial-item i{
    
    font-size:30px;
    
    color:#ffc107;
    
    }
    
    
    
    
    
    .commercial-item h4{
    
    font-size:18px;
    
    margin-bottom:5px;
    
    }
    
    
    
    .commercial-item p{
    
    color:#eee;
    
    }
    
    
    
    
    
    .whatsapp-btn{
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    gap:10px;
    
    background:#25d366;
    
    color:white;
    
    padding:16px;
    
    border-radius:40px;
    
    font-weight:700;
    
    margin-top:30px;
    
    }
    
    
    
    
    
    
    
    
    
    /* FORMULAIRE */
    
    
    .commercial-form{
    
    background:#fff8f1;
    
    padding:45px;
    
    border-radius:35px;
    
    }
    
    
    
    
    
    .commercial-form h3{
    
    font-size:30px;
    
    margin-bottom:30px;
    
    }
    
    
    
    
    .form-row{
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:20px;
    
    }
    
    
    
    
    
    .commercial-form input,
    
    .commercial-form select,
    
    .commercial-form textarea{
    
    
    width:100%;
    
    padding:17px;
    
    border-radius:15px;
    
    border:1px solid #ddd;
    
    margin-bottom:20px;
    
    font-family:Poppins;
    
    }
    
    
    
    
    
    .commercial-form textarea{
    
    height:140px;
    
    resize:none;
    
    }
    
    
    
    
    
    .commercial-form button{
    
    
    width:100%;
    
    background:#b71c1c;
    
    border:none;
    
    color:white;
    
    padding:18px;
    
    border-radius:40px;
    
    font-size:16px;
    
    font-weight:700;
    
    cursor:pointer;
    
    }
    
    
    
    
    
    @media(max-width:950px){
    
    
    .professional-contact-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .form-row{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .pro-contact-header h2{
    
    font-size:35px;
    
    }
    
    
    
    }





    /*====================================================
PAGE EXPORT
BLOC 1 : HERO
====================================================*/


.export-hero{

    height:90vh;
    
    background:
    url("images/export-hero.jpg")
    center/cover no-repeat;
    
    position:relative;
    
    display:flex;
    
    align-items:center;
    
    padding:0 8%;
    
    }
    
    
    
    .export-overlay{
    
    position:absolute;
    
    inset:0;
    
    background:
    linear-gradient(
    90deg,
    rgba(0,0,0,.75),
    rgba(0,0,0,.35)
    );
    
    }
    
    
    
    
    
    .export-hero-content{
    
    position:relative;
    
    z-index:2;
    
    max-width:850px;
    
    color:white;
    
    }
    
    
    
    
    
    .export-hero-content span{
    
    color:#ffc107;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .export-hero-content h1{
    
    font-size:65px;
    
    line-height:1.15;
    
    font-weight:800;
    
    margin:25px 0;
    
    }
    
    
    
    
    
    .export-hero-content p{
    
    font-size:20px;
    
    line-height:1.8;
    
    color:#eee;
    
    margin-bottom:40px;
    
    }
    
    
    
    
    
    .export-buttons{
    
    display:flex;
    
    gap:20px;
    
    }
    
    
    
    
    
    
    
    @media(max-width:800px){
    
    
    .export-hero{
    
    height:80vh;
    
    }
    
    
    
    .export-hero-content h1{
    
    font-size:38px;
    
    }
    
    
    
    .export-hero-content p{
    
    font-size:16px;
    
    }
    
    
    
    .export-buttons{
    
    flex-direction:column;
    
    }
    
    
    }


    /*====================================================
PAGE EXPORT
BLOC 2 : AVANTAGES EXPORT
====================================================*/


.export-advantages{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    
    .export-advantages-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    
    .export-advantages-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    
    .export-advantages-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    .export-advantages-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .advantages-grid{
    
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    
    }
    
    
    
    
    
    
    
    .advantage-card{
    
    
    background:white;
    
    padding:40px 30px;
    
    border-radius:30px;
    
    text-align:center;
    
    transition:.4s;
    
    box-shadow:0 10px 25px rgba(0,0,0,.05);
    
    
    }
    
    
    
    
    
    .advantage-card:hover{
    
    
    transform:translateY(-12px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    
    
    }
    
    
    
    
    
    
    
    
    .advantage-icon{
    
    
    width:85px;
    
    height:85px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin:auto;
    
    margin-bottom:25px;
    
    
    }
    
    
    
    
    
    .advantage-icon i{
    
    
    font-size:35px;
    
    color:white;
    
    
    }
    
    
    
    
    
    
    
    
    .advantage-card h3{
    
    
    font-size:25px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .advantage-card p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    @media(max-width:1000px){
    
    
    .advantages-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    }
    
    
    
    
    @media(max-width:650px){
    
    
    .advantages-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .export-advantages-header h2{
    
    font-size:35px;
    
    }
    
    
    }


    /*====================================================
PAGE EXPORT
BLOC 3 : CAPACITES EXPORT
====================================================*/


.export-capacity-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    .capacity-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    
    .capacity-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    
    .capacity-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    
    .capacity-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    .capacity-container{
    
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    
    }
    
    
    
    
    
    
    
    .capacity-card{
    
    
    background:#fff8f1;
    
    border-radius:30px;
    
    overflow:hidden;
    
    transition:.4s;
    
    
    }
    
    
    
    
    
    .capacity-card:hover{
    
    
    transform:translateY(-10px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    
    
    }
    
    
    
    
    
    
    
    .capacity-image{
    
    height:260px;
    
    overflow:hidden;
    
    }
    
    
    
    
    .capacity-image img{
    
    
    width:100%;
    
    height:100%;
    
    object-fit:cover;
    
    
    }
    
    
    
    
    
    
    .capacity-content{
    
    
    padding:35px;
    
    text-align:center;
    
    
    }
    
    
    
    
    
    .capacity-content i{
    
    
    font-size:40px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    
    }
    
    
    
    
    .capacity-content h3{
    
    
    font-size:25px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .capacity-content p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    
    /* CHIFFRES */
    
    
    .export-numbers{
    
    
    margin-top:80px;
    
    background:#b71c1c;
    
    padding:50px;
    
    border-radius:35px;
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    text-align:center;
    
    color:white;
    
    
    }
    
    
    
    
    
    .export-number h2{
    
    
    font-size:45px;
    
    color:#ffc107;
    
    margin-bottom:10px;
    
    
    }
    
    
    
    
    
    .export-number p{
    
    
    font-size:16px;
    
    }
    
    
    
    
    @media(max-width:950px){
    
    
    .capacity-container{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .export-numbers{
    
    grid-template-columns:repeat(2,1fr);
    
    gap:30px;
    
    }
    
    
    }
    
    
    
    
    
    @media(max-width:600px){
    
    
    .export-numbers{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .capacity-header h2{
    
    font-size:35px;
    
    }
    
    
    }



    /*====================================================
PAGE EXPORT
BLOC 4 : PROCESSUS EXPORT
====================================================*/


.export-process-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    .process-export-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:80px;
    
    }
    
    
    
    
    .process-export-header span{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    
    }
    
    
    
    
    .process-export-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    
    .process-export-header p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    .export-timeline{
    
    
    max-width:1000px;
    
    margin:auto;
    
    position:relative;
    
    
    }
    
    
    
    
    
    
    
    .export-timeline::before{
    
    
    content:"";
    
    position:absolute;
    
    left:50%;
    
    top:0;
    
    bottom:0;
    
    width:3px;
    
    background:#b71c1c;
    
    transform:translateX(-50%);
    
    
    }
    
    
    
    
    
    
    
    .export-step{
    
    
    display:flex;
    
    justify-content:center;
    
    position:relative;
    
    margin-bottom:50px;
    
    
    }
    
    
    
    
    
    
    
    
    .step-number{
    
    
    width:70px;
    
    height:70px;
    
    background:#b71c1c;
    
    color:white;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    font-size:22px;
    
    font-weight:800;
    
    z-index:2;
    
    
    }
    
    
    
    
    
    
    
    
    .step-content{
    
    
    width:45%;
    
    background:white;
    
    padding:35px;
    
    border-radius:30px;
    
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    
    
    }
    
    
    
    
    
    
    .export-step:nth-child(odd) .step-content{
    
    
    margin-right:auto;
    
    }
    
    
    
    .export-step:nth-child(even) .step-content{
    
    
    margin-left:auto;
    
    }
    
    
    
    
    
    .step-content i{
    
    
    font-size:40px;
    
    color:#ffc107;
    
    margin-bottom:20px;
    
    
    }
    
    
    
    
    .step-content h3{
    
    
    font-size:25px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .step-content p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    @media(max-width:800px){
    
    
    
    .export-timeline::before{
    
    left:35px;
    
    }
    
    
    
    
    .export-step{
    
    
    justify-content:flex-start;
    
    gap:25px;
    
    }
    
    
    
    
    
    .step-content{
    
    
    width:calc(100% - 95px);
    
    }
    
    
    
    
    
    .export-step:nth-child(odd) .step-content,
    .export-step:nth-child(even) .step-content{
    
    
    margin:0;
    
    }
    
    
    
    .process-export-header h2{
    
    font-size:35px;
    
    }
    
    
    
    }


    /*====================================================
PAGE EXPORT
BLOC 5 : DOCUMENTS EXPORT
====================================================*/


.export-documents-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    
    
    .documents-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    
    .documents-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    .documents-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    
    .documents-header p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    .documents-grid{
    
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    
    }
    
    
    
    
    
    
    
    .document-card{
    
    
    background:#fff8f1;
    
    padding:40px 30px;
    
    border-radius:30px;
    
    text-align:center;
    
    transition:.4s;
    
    
    }
    
    
    
    
    
    .document-card:hover{
    
    
    transform:translateY(-10px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.1);
    
    
    }
    
    
    
    
    
    
    
    .document-icon{
    
    
    width:85px;
    
    height:85px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin:auto;
    
    margin-bottom:25px;
    
    
    }
    
    
    
    
    
    .document-icon i{
    
    
    font-size:35px;
    
    color:white;
    
    
    }
    
    
    
    
    
    
    
    .document-card h3{
    
    
    font-size:25px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    .document-card p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    /* BANNER */
    
    
    .export-support-banner{
    
    
    margin-top:80px;
    
    padding:50px;
    
    background:#b71c1c;
    
    border-radius:40px;
    
    color:white;
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    gap:30px;
    
    
    }
    
    
    
    
    
    .export-support-banner h2{
    
    
    font-size:35px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .export-support-banner p{
    
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    @media(max-width:950px){
    
    
    .documents-grid{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    .export-support-banner{
    
    flex-direction:column;
    
    text-align:center;
    
    }
    
    
    }
    
    
    
    
    
    @media(max-width:650px){
    
    
    .documents-grid{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .documents-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .export-support-banner{
    
    padding:35px 20px;
    
    }
    
    
    
    }



    /*====================================================
PAGE EXPORT
BLOC 6 : ZONES INTERNATIONALES
====================================================*/


.export-zones-section{

    padding:100px 8%;
    
    background:#fff8f1;
    
    }
    
    
    
    
    
    
    
    .zones-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    
    .zones-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    
    .zones-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    
    .zones-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    
    
    /* CARTE */
    
    
    .world-map-container{
    
    
    position:relative;
    
    max-width:1000px;
    
    margin:auto;
    
    }
    
    
    
    
    .world-map-container img{
    
    
    width:100%;
    
    opacity:.8;
    
    
    }
    
    
    
    
    
    
    .map-point{
    
    
    position:absolute;
    
    text-align:center;
    
    }
    
    
    
    
    .map-point span{
    
    
    display:block;
    
    width:18px;
    
    height:18px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    margin:auto;
    
    box-shadow:0 0 0 10px rgba(183,28,28,.2);
    
    
    }
    
    
    
    
    .map-point h4{
    
    
    margin-top:10px;
    
    background:white;
    
    padding:8px 15px;
    
    border-radius:20px;
    
    font-size:14px;
    
    
    }
    
    
    
    
    
    
    .africa{
    
    left:48%;
    
    top:50%;
    
    }
    
    
    
    
    
    .europe{
    
    left:50%;
    
    top:25%;
    
    }
    
    
    
    
    
    .america{
    
    left:22%;
    
    top:45%;
    
    }
    
    
    
    
    
    .asia{
    
    right:18%;
    
    top:45%;
    
    }
    
    
    
    
    
    
    
    
    /* PARTENAIRES */
    
    
    .partner-types{
    
    
    margin-top:80px;
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    gap:25px;
    
    }
    
    
    
    
    
    .partner-card{
    
    
    background:white;
    
    padding:35px 25px;
    
    border-radius:25px;
    
    text-align:center;
    
    transition:.3s;
    
    
    }
    
    
    
    
    
    .partner-card:hover{
    
    
    transform:translateY(-10px);
    
    box-shadow:0 15px 30px rgba(0,0,0,.1);
    
    
    }
    
    
    
    
    
    .partner-card i{
    
    
    font-size:35px;
    
    color:#b71c1c;
    
    margin-bottom:20px;
    
    
    }
    
    
    
    
    
    .partner-card h3{
    
    margin-bottom:15px;
    
    font-size:22px;
    
    }
    
    
    
    
    .partner-card p{
    
    color:#666;
    
    line-height:1.7;
    
    }
    
    
    
    
    
    
    
    
    
    /* STATS */
    
    
    .international-stats{
    
    
    margin-top:80px;
    
    background:#b71c1c;
    
    padding:50px;
    
    border-radius:35px;
    
    display:grid;
    
    grid-template-columns:repeat(4,1fr);
    
    text-align:center;
    
    color:white;
    
    
    }
    
    
    
    
    .international-stats h2{
    
    
    font-size:45px;
    
    color:#ffc107;
    
    }
    
    
    
    
    
    .international-stats p{
    
    margin-top:10px;
    
    }
    
    
    
    
    
    
    
    
    
    @media(max-width:1000px){
    
    
    .partner-types{
    
    grid-template-columns:repeat(2,1fr);
    
    }
    
    
    
    .international-stats{
    
    grid-template-columns:repeat(2,1fr);
    
    gap:30px;
    
    }
    
    
    }
    
    
    
    
    @media(max-width:600px){
    
    
    .partner-types,
    
    .international-stats{
    
    grid-template-columns:1fr;
    
    }
    
    
    
    .zones-header h2{
    
    font-size:35px;
    
    }
    
    
    
    .world-map-container{
    
    display:none;
    
    }
    
    
    }



    /*====================================================
PAGE EXPORT
BLOC 7 : DEVIS EXPORT
====================================================*/


.export-quote-section{

    padding:100px 8%;
    
    background:white;
    
    }
    
    
    
    
    
    
    
    
    .quote-header{
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    }
    
    
    
    
    
    .quote-header span{
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    }
    
    
    
    
    
    .quote-header h2{
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    }
    
    
    
    
    .quote-header p{
    
    color:#666;
    
    line-height:1.8;
    
    }
    
    
    
    
    
    
    
    
    
    .quote-container{
    
    
    display:grid;
    
    grid-template-columns:1fr 1.2fr;
    
    gap:50px;
    
    align-items:start;
    
    
    }
    
    
    
    
    
    
    
    
    
    /* BOX CONTACT */
    
    
    .export-contact-box{
    
    
    background:#b71c1c;
    
    color:white;
    
    padding:45px;
    
    border-radius:35px;
    
    
    }
    
    
    
    
    
    .export-contact-box h3{
    
    font-size:30px;
    
    margin-bottom:20px;
    
    }
    
    
    
    
    .export-contact-box p{
    
    line-height:1.8;
    
    }
    
    
    
    
    
    .export-contact-item{
    
    
    display:flex;
    
    gap:20px;
    
    align-items:center;
    
    margin-top:30px;
    
    
    }
    
    
    
    
    .export-contact-item i{
    
    
    font-size:30px;
    
    color:#ffc107;
    
    
    }
    
    
    
    
    
    .export-contact-item h4{
    
    
    margin-bottom:5px;
    
    
    }
    
    
    
    
    
    
    
    .export-whatsapp{
    
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    gap:10px;
    
    background:#25d366;
    
    padding:17px;
    
    border-radius:40px;
    
    margin-top:40px;
    
    color:white;
    
    font-weight:700;
    
    
    }
    
    
    
    
    
    
    
    
    
    /* FORMULAIRE */
    
    
    .export-form-box{
    
    
    background:#fff8f1;
    
    padding:45px;
    
    border-radius:35px;
    
    
    }
    
    
    
    
    
    .export-form-box h3{
    
    
    font-size:30px;
    
    margin-bottom:30px;
    
    
    }
    
    
    
    
    
    
    .export-form-row{
    
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:20px;
    
    
    }
    
    
    
    
    
    
    
    .export-form-box input,
    
    .export-form-box select,
    
    .export-form-box textarea{
    
    
    width:100%;
    
    padding:17px;
    
    border-radius:15px;
    
    border:1px solid #ddd;
    
    margin-bottom:20px;
    
    font-family:Poppins;
    
    
    }
    
    
    
    
    
    
    
    .export-form-box textarea{
    
    
    height:150px;
    
    resize:none;
    
    
    }
    
    
    
    
    
    
    
    
    .export-form-box button{
    
    
    width:100%;
    
    background:#b71c1c;
    
    color:white;
    
    border:none;
    
    padding:18px;
    
    border-radius:40px;
    
    font-size:16px;
    
    font-weight:700;
    
    cursor:pointer;
    
    
    }
    
    
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .quote-container{
    
    
    grid-template-columns:1fr;
    
    
    }
    
    
    
    .export-form-row{
    
    
    grid-template-columns:1fr;
    
    
    }
    
    
    
    .quote-header h2{
    
    font-size:35px;
    
    }
    
    
    }




    /*====================================================
PAGE CONTACT
BLOC 1 : HERO
====================================================*/


.contact-hero{


    height:85vh;
    
    background:
    
    url("images/contact-bg.jpg")
    
    center/cover no-repeat;
    
    position:relative;
    
    display:flex;
    
    align-items:center;
    
    padding:0 8%;
    
    
    }
    
    
    
    
    
    .contact-overlay{
    
    
    position:absolute;
    
    inset:0;
    
    background:
    
    linear-gradient(
    
    90deg,
    
    rgba(0,0,0,.75),
    
    rgba(0,0,0,.35)
    
    );
    
    
    }
    
    
    
    
    
    .contact-hero-content{
    
    
    position:relative;
    
    z-index:2;
    
    color:white;
    
    max-width:850px;
    
    
    }
    
    
    
    
    
    .contact-hero-content span{
    
    
    color:#ffc107;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    
    }
    
    
    
    
    
    .contact-hero-content h1{
    
    
    font-size:65px;
    
    font-weight:800;
    
    margin:25px 0;
    
    
    }
    
    
    
    
    
    .contact-hero-content p{
    
    
    font-size:20px;
    
    line-height:1.8;
    
    color:#eee;
    
    margin-bottom:40px;
    
    
    }
    
    
    
    
    
    .contact-buttons{
    
    
    display:flex;
    
    gap:20px;
    
    
    }
    
    
    
    
    
    @media(max-width:800px){
    
    
    
    .contact-hero{
    
    
    height:75vh;
    
    
    }
    
    
    
    
    .contact-hero-content h1{
    
    
    font-size:38px;
    
    
    }
    
    
    
    
    .contact-hero-content p{
    
    
    font-size:16px;
    
    
    }
    
    
    
    
    .contact-buttons{
    
    
    flex-direction:column;
    
    
    }
    
    
    
    }



    /*====================================================
PAGE CONTACT
BLOC 2 : INFORMATIONS CONTACT
====================================================*/


.contact-info-section{


    padding:100px 8%;
    
    background:#fff8f1;
    
    
    }
    
    
    
    
    
    
    
    .contact-info-header{
    
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    
    }
    
    
    
    
    
    .contact-info-header span{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    
    }
    
    
    
    
    
    .contact-info-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    .contact-info-header p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    
    .contact-info-grid{
    
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    
    }
    
    
    
    
    
    
    
    .contact-info-card{
    
    
    background:white;
    
    padding:40px 30px;
    
    border-radius:30px;
    
    text-align:center;
    
    transition:.4s;
    
    box-shadow:0 10px 25px rgba(0,0,0,.05);
    
    
    }
    
    
    
    
    
    .contact-info-card:hover{
    
    
    transform:translateY(-10px);
    
    box-shadow:0 20px 40px rgba(0,0,0,.12);
    
    
    }
    
    
    
    
    
    
    
    
    .contact-icon{
    
    
    width:80px;
    
    height:80px;
    
    background:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin:auto;
    
    margin-bottom:25px;
    
    
    }
    
    
    
    
    
    .contact-icon i{
    
    
    font-size:35px;
    
    color:white;
    
    
    }
    
    
    
    
    
    
    
    .contact-icon.whatsapp{
    
    
    background:#25d366;
    
    }
    
    
    
    
    
    
    
    
    .contact-info-card h3{
    
    
    font-size:25px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .contact-info-card p{
    
    
    color:#666;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .contact-info-card a{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    text-decoration:none;
    
    
    }
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .contact-info-grid{
    
    
    grid-template-columns:repeat(2,1fr);
    
    
    }
    
    
    }
    
    
    
    
    
    
    @media(max-width:600px){
    
    
    .contact-info-grid{
    
    
    grid-template-columns:1fr;
    
    
    }
    
    
    
    .contact-info-header h2{
    
    
    font-size:35px;
    
    
    }
    
    
    }



    /*====================================================
PAGE CONTACT
BLOC 3 : FORMULAIRE
====================================================*/


.contact-form-section{


    padding:100px 8%;
    
    background:white;
    
    
    }
    
    
    
    
    
    
    
    
    .contact-form-header{
    
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    
    }
    
    
    
    
    
    .contact-form-header span{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    
    }
    
    
    
    
    
    .contact-form-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    .contact-form-header p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    
    .contact-form-container{
    
    
    display:grid;
    
    grid-template-columns:1fr 1.2fr;
    
    gap:50px;
    
    align-items:center;
    
    
    }
    
    
    
    
    
    
    
    
    
    /* IMAGE */
    
    
    .contact-form-side{
    
    
    border-radius:35px;
    
    overflow:hidden;
    
    background:#fff8f1;
    
    
    }
    
    
    
    
    .contact-form-side img{
    
    
    width:100%;
    
    height:300px;
    
    object-fit:cover;
    
    
    }
    
    
    
    
    .contact-side-content{
    
    
    padding:35px;
    
    
    }
    
    
    
    
    
    .contact-side-content h3{
    
    
    font-size:30px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    .contact-side-content p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    .contact-mini{
    
    
    display:flex;
    
    align-items:center;
    
    gap:15px;
    
    margin-top:20px;
    
    font-weight:600;
    
    
    }
    
    
    
    
    
    .contact-mini i{
    
    
    color:#b71c1c;
    
    
    }
    
    
    
    
    
    
    
    
    
    /* FORMULAIRE */
    
    
    .contact-form-box{
    
    
    background:#fff8f1;
    
    padding:45px;
    
    border-radius:35px;
    
    
    }
    
    
    
    
    
    .form-contact-row{
    
    
    display:grid;
    
    grid-template-columns:1fr 1fr;
    
    gap:20px;
    
    
    }
    
    
    
    
    
    
    
    
    .contact-form-box input,
    
    .contact-form-box select,
    
    .contact-form-box textarea{
    
    
    width:100%;
    
    padding:17px;
    
    border-radius:15px;
    
    border:1px solid #ddd;
    
    margin-bottom:20px;
    
    font-family:Poppins;
    
    
    }
    
    
    
    
    
    .contact-form-box textarea{
    
    
    height:160px;
    
    resize:none;
    
    
    }
    
    
    
    
    
    
    
    .contact-form-box button{
    
    
    width:100%;
    
    background:#b71c1c;
    
    color:white;
    
    border:none;
    
    padding:18px;
    
    border-radius:40px;
    
    font-size:16px;
    
    font-weight:700;
    
    cursor:pointer;
    
    
    }
    
    
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .contact-form-container{
    
    
    grid-template-columns:1fr;
    
    
    }
    
    
    
    .form-contact-row{
    
    
    grid-template-columns:1fr;
    
    
    }
    
    
    
    .contact-form-header h2{
    
    
    font-size:35px;
    
    
    }
    
    
    }



    /*====================================================
PAGE CONTACT
BLOC 4 : LOCALISATION MAP
====================================================*/


.contact-map-section{


    padding:100px 8%;
    
    background:#fff8f1;
    
    
    }
    
    
    
    
    
    
    
    .map-header{
    
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    
    }
    
    
    
    
    
    .map-header span{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    
    }
    
    
    
    
    
    .map-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    
    .map-header p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    
    .map-container{
    
    
    display:grid;
    
    grid-template-columns:1fr 1.5fr;
    
    gap:40px;
    
    align-items:stretch;
    
    
    }
    
    
    
    
    
    
    
    /* CARTE INFORMATIONS */
    
    
    .location-card{
    
    
    background:#b71c1c;
    
    color:white;
    
    padding:45px;
    
    border-radius:35px;
    
    
    }
    
    
    
    
    
    .location-icon{
    
    
    width:80px;
    
    height:80px;
    
    background:#ffc107;
    
    color:#b71c1c;
    
    border-radius:50%;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    margin-bottom:25px;
    
    
    }
    
    
    
    
    
    .location-icon i{
    
    
    font-size:35px;
    
    
    }
    
    
    
    
    
    .location-card h3{
    
    
    font-size:30px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .location-card p{
    
    
    line-height:1.8;
    
    color:#eee;
    
    
    }
    
    
    
    
    
    
    
    
    
    .location-info{
    
    
    margin-top:35px;
    
    
    }
    
    
    
    
    
    .location-info div{
    
    
    display:flex;
    
    align-items:center;
    
    gap:15px;
    
    margin-bottom:20px;
    
    
    }
    
    
    
    
    
    .location-info i{
    
    
    font-size:22px;
    
    color:#ffc107;
    
    
    }
    
    
    
    
    
    
    
    
    .map-button{
    
    
    display:flex;
    
    justify-content:center;
    
    background:#ffc107;
    
    color:#222;
    
    padding:16px;
    
    border-radius:40px;
    
    margin-top:30px;
    
    font-weight:700;
    
    
    }
    
    
    
    
    
    
    
    
    
    /* GOOGLE MAP */
    
    
    .google-map-box{
    
    
    border-radius:35px;
    
    overflow:hidden;
    
    min-height:450px;
    
    
    }
    
    
    
    
    
    .google-map-box iframe{
    
    
    width:100%;
    
    height:100%;
    
    min-height:450px;
    
    border:0;
    
    
    }
    
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .map-container{
    
    
    grid-template-columns:1fr;
    
    
    }
    
    
    
    .map-header h2{
    
    
    font-size:35px;
    
    
    }
    
    
    }



    /*====================================================
PAGE CONTACT
BLOC 5 : SERVICES CONTACT
====================================================*/


.contact-services-section{


    padding:100px 8%;
    
    background:white;
    
    
    }
    
    
    
    
    
    
    
    .contact-services-header{
    
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    
    }
    
    
    
    
    
    .contact-services-header span{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    
    }
    
    
    
    
    
    .contact-services-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    
    .contact-services-header p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    
    .contact-services-grid{
    
    
    display:grid;
    
    grid-template-columns:repeat(3,1fr);
    
    gap:30px;
    
    
    }
    
    
    
    
    
    
    
    
    .contact-service-card{
    
    
    background:#fff8f1;
    
    padding:40px 30px;
    
    border-radius:30px;
    
    text-align:center;
    
    transition:.4s;
    
    border:1px solid transparent;
    
    
    }
    
    
    
    
    
    .contact-service-card:hover{
    
    
    transform:translateY(-10px);
    
    background:white;
    
    border-color:#eee;
    
    box-shadow:0 20px 40px rgba(0,0,0,.1);
    
    
    }
    
    
    
    
    
    
    
    
    .service-contact-icon{
    
    
    width:85px;
    
    height:85px;
    
    background:#b71c1c;
    
    color:white;
    
    border-radius:50%;
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    margin:auto;
    
    margin-bottom:25px;
    
    
    }
    
    
    
    
    
    .service-contact-icon i{
    
    
    font-size:35px;
    
    
    }
    
    
    
    
    
    
    
    .contact-service-card h3{
    
    
    font-size:25px;
    
    margin-bottom:15px;
    
    
    }
    
    
    
    
    
    .contact-service-card p{
    
    
    color:#666;
    
    line-height:1.8;
    
    margin-bottom:25px;
    
    
    }
    
    
    
    
    
    .contact-service-card a{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    text-decoration:none;
    
    
    }
    
    
    
    
    
    
    
    
    @media(max-width:950px){
    
    
    .contact-services-grid{
    
    
    grid-template-columns:repeat(2,1fr);
    
    
    }
    
    
    }
    
    
    
    
    
    
    @media(max-width:600px){
    
    
    .contact-services-grid{
    
    
    grid-template-columns:1fr;
    
    
    }
    
    
    
    .contact-services-header h2{
    
    
    font-size:35px;
    
    
    }
    
    
    }



    /*====================================================
PAGE CONTACT
BLOC 6 : FAQ
====================================================*/


.contact-faq-section{


    padding:100px 8%;
    
    background:#fff8f1;
    
    
    }
    
    
    
    
    
    
    
    .faq-header{
    
    
    text-align:center;
    
    max-width:850px;
    
    margin:auto;
    
    margin-bottom:70px;
    
    
    }
    
    
    
    
    
    .faq-header span{
    
    
    color:#b71c1c;
    
    font-weight:700;
    
    letter-spacing:2px;
    
    
    }
    
    
    
    
    
    .faq-header h2{
    
    
    font-size:50px;
    
    font-weight:800;
    
    margin:20px 0;
    
    
    }
    
    
    
    
    .faq-header p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    
    
    
    
    .faq-container{
    
    
    max-width:900px;
    
    margin:auto;
    
    
    }
    
    
    
    
    
    
    
    .faq-item{
    
    
    background:white;
    
    border-radius:20px;
    
    margin-bottom:20px;
    
    overflow:hidden;
    
    box-shadow:0 8px 20px rgba(0,0,0,.05);
    
    
    }
    
    
    
    
    
    
    
    .faq-question{
    
    
    width:100%;
    
    border:none;
    
    background:white;
    
    padding:25px 30px;
    
    display:flex;
    
    justify-content:space-between;
    
    align-items:center;
    
    font-size:18px;
    
    font-weight:700;
    
    cursor:pointer;
    
    text-align:left;
    
    
    }
    
    
    
    
    
    .faq-question i{
    
    
    color:#b71c1c;
    
    transition:.3s;
    
    
    }
    
    
    
    
    
    .faq-answer{
    
    
    padding:0 30px 25px;
    
    display:none;
    
    
    }
    
    
    
    
    
    .faq-answer p{
    
    
    color:#666;
    
    line-height:1.8;
    
    
    }
    
    
    
    
    
    .faq-item.active .faq-answer{
    
    
    display:block;
    
    
    }
    
    
    
    
    
    .faq-item.active .faq-question i{
    
    
    transform:rotate(180deg);
    
    
    }
    
    
    
    
    
    
    
    
    @media(max-width:600px){
    
    
    
    .faq-header h2{
    
    
    font-size:35px;
    
    
    }
    
    
    
    
    .faq-question{
    
    
    font-size:16px;
    
    padding:20px;
    
    
    }
    
    
    }



    /*====================================================
PAGE CONTACT
BLOC 7 : CALL TO ACTION FINAL
====================================================*/


.contact-cta-section{


    height:500px;
    
    background:
    
    url("images/jpoil-contact-final.jpg")
    
    center/cover no-repeat;
    
    position:relative;
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    padding:0 8%;
    
    
    }
    
    
    
    
    
    
    
    .contact-cta-overlay{
    
    
    position:absolute;
    
    inset:0;
    
    
    background:
    
    linear-gradient(
    
    90deg,
    
    rgba(183,28,28,.9),
    
    rgba(0,0,0,.6)
    
    );
    
    
    }
    
    
    
    
    
    
    
    .contact-cta-content{
    
    
    position:relative;
    
    z-index:2;
    
    text-align:center;
    
    color:white;
    
    max-width:900px;
    
    
    }
    
    
    
    
    
    
    
    .contact-cta-content span{
    
    
    color:#ffc107;
    
    font-weight:800;
    
    letter-spacing:3px;
    
    
    }
    
    
    
    
    
    
    
    .contact-cta-content h2{
    
    
    font-size:55px;
    
    font-weight:800;
    
    margin:25px 0;
    
    
    }
    
    
    
    
    
    .contact-cta-content p{
    
    
    font-size:20px;
    
    line-height:1.8;
    
    color:#eee;
    
    margin-bottom:40px;
    
    
    }
    
    
    
    
    
    
    
    
    .cta-buttons{
    
    
    display:flex;
    
    justify-content:center;
    
    gap:25px;
    
    
    }
    
    
    
    
    
    
    
    
    
    .btn-whatsapp{
    
    
    background:#25d366;
    
    color:white;
    
    padding:16px 35px;
    
    border-radius:40px;
    
    font-weight:700;
    
    display:flex;
    
    align-items:center;
    
    gap:10px;
    
    text-decoration:none;
    
    
    }
    
    
    
    
    
    
    
    .btn-whatsapp i{
    
    
    font-size:22px;
    
    
    }
    
    
    
    
    
    
    
    
    
    @media(max-width:800px){
    
    
    .contact-cta-section{
    
    
    height:auto;
    
    padding:90px 8%;
    
    
    }
    
    
    
    .contact-cta-content h2{
    
    
    font-size:35px;
    
    
    }
    
    
    
    
    
    .contact-cta-content p{
    
    
    font-size:16px;
    
    
    }
    
    
    
    
    .cta-buttons{
    
    
    flex-direction:column;
    
    
    }
    
    
    }



    /*====================================================
JP OIL
SECTION : LES GAMMES
====================================================*/

.gammes-section{

    padding:100px 8%;
    
    background:linear-gradient(180deg,#fffdf9,#fff6ea);
    
    }
    
    
    
    
    
    
    /*==========================
    TITRE
    ==========================*/
    
    .section-title{
    
    max-width:900px;
    
    margin:auto;
    
    text-align:center;
    
    margin-bottom:70px;
    
    }
    
    .section-title span{
    
    display:inline-block;
    
    background:#ffe9b5;
    
    color:#b71c1c;
    
    padding:8px 18px;
    
    border-radius:30px;
    
    font-weight:700;
    
    font-size:14px;
    
    letter-spacing:1px;
    
    margin-bottom:20px;
    
    }
    
    .section-title h2{
    
    font-size:48px;
    
    font-weight:800;
    
    color:#222;
    
    margin-bottom:25px;
    
    line-height:1.2;
    
    }
    
    .section-title p{
    
    font-size:18px;
    
    color:#666;
    
    line-height:1.9;
    
    }
    
    
    
    
    
    /*==========================
    GRID
    ==========================*/
    
    .gammes-grid{
    
    display:grid;
    
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    
    gap:30px;
    
    }
    
    
    
    
    
    /*==========================
    CARTE
    ==========================*/
    
    .gamme-card{
    
    background:#fff;
    
    border-radius:25px;
    
    padding:35px;
    
    text-align:center;
    
    box-shadow:0 15px 35px rgba(0,0,0,.06);
    
    transition:.35s;
    
    border:1px solid #f2f2f2;
    
    position:relative;
    
    overflow:hidden;
    
    }
    
    .gamme-card::before{
    
    content:"";
    
    position:absolute;
    
    top:0;
    
    left:0;
    
    width:100%;
    
    height:5px;
    
    background:linear-gradient(90deg,#b71c1c,#ff9800);
    
    }
    
    .gamme-card:hover{
    
    transform:translateY(-12px);
    
    box-shadow:0 25px 45px rgba(0,0,0,.12);
    
    }
    
    
    
    
    
    /*==========================
    ICONE
    ==========================*/
    
    .gamme-icon{
    
    width:90px;
    
    height:90px;
    
    margin:auto;
    
    margin-bottom:25px;
    
    border-radius:50%;
    
    background:linear-gradient(135deg,#b71c1c,#ff9800);
    
    display:flex;
    
    align-items:center;
    
    justify-content:center;
    
    font-size:42px;
    
    box-shadow:0 12px 25px rgba(183,28,28,.25);
    
    }
    
    
    
    
    
    /*==========================
    TEXTE
    ==========================*/
    
    .gamme-card h3{
    
    font-size:26px;
    
    color:#222;
    
    margin-bottom:18px;
    
    font-weight:700;
    
    }
    
    .gamme-card p{
    
    font-size:16px;
    
    line-height:1.8;
    
    color:#666;
    
    }
    
    
    
    
    
    /*==========================
    EFFET
    ==========================*/
    
    .gamme-card:hover h3{
    
    color:#b71c1c;
    
    }
    
    
    
    
    
    /*==========================
    RESPONSIVE
    ==========================*/
    
    @media(max-width:992px){
    
    .gammes-section{
    
    padding:80px 6%;
    
    }
    
    .section-title h2{
    
    font-size:40px;
    
    }
    
    }
    
    @media(max-width:768px){
    
    .section-title h2{
    
    font-size:32px;
    
    }
    
    .section-title p{
    
    font-size:16px;
    
    }
    
    .gammes-grid{
    
    grid-template-columns:1fr;
    
    gap:20px;
    
    }
    
    .gamme-card{
    
    padding:30px;
    
    }
    
    .gamme-icon{
    
    width:80px;
    
    height:80px;
    
    font-size:36px;
    
    }
    
    }
    
    @media(max-width:480px){
    
    .gammes-section{
    
    padding:60px 5%;
    
    }
    
    .section-title{
    
    margin-bottom:45px;
    
    }
    
    .section-title h2{
    
    font-size:28px;
    
    }
    
    .section-title span{
    
    font-size:13px;
    
    padding:7px 15px;
    
    }
    
    .gamme-card h3{
    
    font-size:22px;
    
    }
    
    .gamme-card p{
    
    font-size:15px;
    
    }
    
    }


/* --- GESTION MOBILE POUR LE BOUTON PANIER --- */
@media (max-width: 768px) {
    /* 1. S'assurer que le conteneur d'actions reste visible */
    .header-actions {
        display: flex !important;
        align-items: center;
        gap: 8px;
        margin-right: 10px; /* Espace avant le bouton menu hamburger */
    }

    /* 2. Cacher le texte "Grossiste?" si l'espace est réduit, ou l'adapter */
    .header-actions .login-btn {
        display: none; /* Masque "Grossiste?" sur très petits écrans pour gagner de la place */
    }

    /* 3. Mettre en valeur le bouton Panier sur mobile */
    .header-actions .order-btn {
        display: inline-flex !important;
        align-items: center;
        gap: 5px;
        padding: 6px 12px;
        font-size: 0.85rem;
        white-space: nowrap;
        z-index: 1001; /* Garantit qu'il passe au-dessus des autres éléments */
    }

    /* 4. Alignement du bloc complet de navigation */
    .navbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
}


    /*====================================================
JP OIL BUSINESS
RESPONSIVE PREMIUM
====================================================*/