:root{
    --bg:#f4f0ea;
    --bg-2:#fffaf3;
    --ink:#11161d;
    --text:#f8fafc;
    --muted:#6b7280;
    --muted-light:#c5ccd6;
    --line:rgba(255,255,255,.12);
    --line-dark:rgba(16,20,24,.12);
    --card:#ffffff;
    --night:#070a0d;
    --night-2:#101820;
    --night-3:#16232c;
    --orange:#ff6200;
    --orange-2:#ff8a1e;
    --orange-soft:#ffe2ce;
    --blue:#1f68b3;
    --blue-soft:#d9ebff;
    --success:#55c7c4;
    --radius-xl:34px;
    --radius-lg:24px;
    --radius-md:16px;
    --shadow:0 24px 80px rgba(4,8,12,.18);
    --shadow-soft:0 18px 55px rgba(12,20,30,.10);
    --container:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color:var(--ink);
    background:
        radial-gradient(circle at top left, rgba(255,98,0,.12), transparent 28rem),
        radial-gradient(circle at 90% 20%, rgba(31,104,179,.08), transparent 22rem),
        var(--bg);
    line-height:1.5;
    overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
.container{width:min(var(--container), calc(100% - 40px));margin-inline:auto}
.section{padding:84px 0}
.section-tight{padding:54px 0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--orange);text-transform:uppercase;font-weight:900;font-size:12px;letter-spacing:.12em;margin-bottom:12px}
.eyebrow::before{content:"";width:26px;height:3px;border-radius:999px;background:var(--orange)}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(42px,7vw,88px);line-height:.95;letter-spacing:-.07em;margin-bottom:22px}
h2{font-size:clamp(32px,4vw,56px);line-height:1;letter-spacing:-.045em;margin-bottom:16px}
h3{font-size:22px;line-height:1.12;letter-spacing:-.02em;margin-bottom:10px}
p{color:var(--muted);font-size:16px}
.lead{font-size:clamp(18px,2vw,22px);color:rgba(255,255,255,.78);max-width:650px}
.text-gradient{background:linear-gradient(135deg,var(--orange),var(--orange-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.orange{color:var(--orange)}

/* Header */
.site-header{
    position:sticky;top:0;z-index:50;background:rgba(7,10,13,.82);backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(255,255,255,.08);transition:box-shadow .25s ease, background .25s ease;
}
.site-header.is-scrolled{background:rgba(7,10,13,.96);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.header-inner{height:84px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:flex;align-items:center;min-width:170px}
.brand-logo{height:54px;width:auto;object-fit:contain}
.main-nav{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:6px}
.main-nav a{color:rgba(255,255,255,.76);font-weight:750;font-size:14px;padding:10px 14px;border-radius:999px;transition:.22s ease}
.main-nav a:hover,.main-nav a.is-active{color:#fff;background:rgba(255,98,0,.18)}
.main-nav a.is-active{box-shadow:inset 0 -2px 0 var(--orange)}
.header-actions{display:flex;align-items:center;gap:14px}
.phone-link{display:flex;align-items:center;gap:8px;color:#fff;font-weight:800;font-size:14px;white-space:nowrap}
.phone-link .icon{width:18px;height:18px;color:var(--orange)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;border:1px solid transparent;padding:14px 20px;font-weight:900;cursor:pointer;transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;white-space:nowrap}
.btn .icon{width:18px;height:18px}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--orange),#ff7a18);color:white;box-shadow:0 18px 36px rgba(255,98,0,.25)}
.btn-outline{border-color:rgba(255,255,255,.24);color:#fff;background:rgba(255,255,255,.04)}
.btn-light{border-color:var(--line-dark);background:#fff;color:var(--ink)}
.btn-small{padding:11px 16px;border-radius:12px;font-size:14px}
.nav-toggle{display:none;width:46px;height:46px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);border-radius:14px;color:white;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.nav-toggle span{width:20px;height:2px;background:#fff;border-radius:9px;transition:.2s ease}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.is-open span:nth-child(2){opacity:0}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Honeycomb + dark sections */
.honey-dark{position:relative;isolation:isolate;background:linear-gradient(135deg,var(--night),var(--night-2) 54%,#0b1117);color:#fff;overflow:hidden}
.honey-dark::before,.honey-dark::after{content:"";position:absolute;inset:auto;pointer-events:none;z-index:-1;background-size:62px 54px;opacity:.45}
.honey-dark::before{width:520px;height:520px;left:-120px;top:50px;background-image:url("data:image/svg+xml,%3Csvg width='62' height='54' viewBox='0 0 62 54' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 1 31 9.95v17.9L15.5 36.8 0 27.85V9.95L15.5 1Z' fill='none' stroke='%23ff6200' stroke-opacity='.32' stroke-width='1.4'/%3E%3Cpath d='M46.5 18 62 26.95v17.9L46.5 53.8 31 44.85v-17.9L46.5 18Z' fill='none' stroke='%23ff6200' stroke-opacity='.28' stroke-width='1.4'/%3E%3C/svg%3E");mask-image:linear-gradient(90deg,#000,transparent)}
.honey-dark::after{width:470px;height:560px;right:-110px;bottom:20px;background-image:url("data:image/svg+xml,%3Csvg width='62' height='54' viewBox='0 0 62 54' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 1 31 9.95v17.9L15.5 36.8 0 27.85V9.95L15.5 1Z' fill='none' stroke='%23ff6200' stroke-opacity='.42' stroke-width='1.4'/%3E%3Cpath d='M46.5 18 62 26.95v17.9L46.5 53.8 31 44.85v-17.9L46.5 18Z' fill='none' stroke='%23ff6200' stroke-opacity='.35' stroke-width='1.4'/%3E%3C/svg%3E");mask-image:radial-gradient(circle,#000 0 45%,transparent 75%)}

/* Hero */
.hero{padding:88px 0 60px;min-height:calc(100vh - 84px);display:flex;align-items:center}
.hero-grid{display:grid;grid-template-columns:.95fr 1.25fr;gap:48px;align-items:center}
.hero-copy{position:relative;z-index:2}
.hero-copy h1{color:#fff}
.hero-copy p:not(.lead){color:rgba(255,255,255,.72)}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:32px 0}
.hero-proof{display:flex;gap:16px;flex-wrap:wrap;margin-top:28px}
.proof-pill{display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);border-radius:999px;padding:9px 12px;color:rgba(255,255,255,.78);font-weight:750;font-size:13px}
.proof-pill .icon{width:18px;height:18px;color:var(--orange)}
.hero-stage{position:relative;min-width:0}
.hero-slider{position:relative;border-radius:var(--radius-xl);overflow:hidden;border:1px solid rgba(255,255,255,.12);box-shadow:var(--shadow);background:#101820;height:570px}
.hero-slide{position:absolute;inset:0;opacity:0;transform:scale(1.04);transition:opacity .5s ease, transform .8s ease}
.hero-slide.is-active{opacity:1;transform:scale(1)}
.hero-slide img{width:100%;height:100%;object-fit:cover;filter:saturate(1.04) contrast(1.05)}
.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.68))}
.slide-caption{position:absolute;left:28px;right:28px;bottom:28px;z-index:2;display:flex;align-items:end;justify-content:space-between;gap:20px}
.slide-caption h3{font-size:34px;color:#fff;margin:0}
.slide-caption p{color:rgba(255,255,255,.75);margin:6px 0 0}
.slide-number{font-weight:950;font-size:14px;color:var(--orange);letter-spacing:.12em}
.slider-arrows{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;pointer-events:none;z-index:5;padding:0 12px}
.slider-btn{pointer-events:auto;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(8,11,14,.62);color:#fff;cursor:pointer;display:grid;place-items:center;font-size:24px;transition:.2s ease}
.slider-btn:hover{background:var(--orange);border-color:var(--orange)}
.slider-dots{position:absolute;left:28px;bottom:105px;z-index:6;display:flex;gap:8px}
.slider-dot{width:10px;height:10px;border-radius:999px;border:0;background:rgba(255,255,255,.45);cursor:pointer;transition:.2s ease}
.slider-dot.is-active{background:var(--orange);width:28px}
.hero-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.hero-thumb{position:relative;border:1px solid rgba(255,255,255,.13);background:#111;border-radius:16px;overflow:hidden;height:102px;cursor:pointer;padding:0;opacity:.72;transition:.25s ease}
.hero-thumb.is-active,.hero-thumb:hover{opacity:1;transform:translateY(-2px);border-color:rgba(255,98,0,.75)}
.hero-thumb img{width:100%;height:100%;object-fit:cover}
.hero-thumb span{position:absolute;left:10px;bottom:8px;color:#fff;font-weight:850;font-size:12px;text-shadow:0 2px 8px #000}

/* Service cards */
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:34px}
.section-head p{max-width:470px;margin-bottom:0}
.services-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.service-mini,.service-card{position:relative;border-radius:var(--radius-lg);background:var(--card);border:1px solid var(--line-dark);overflow:hidden;box-shadow:var(--shadow-soft);transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
.service-mini:hover,.service-card:hover{transform:translateY(-6px);box-shadow:0 28px 70px rgba(10,16,23,.18);border-color:rgba(255,98,0,.35)}
.service-mini{padding:22px;min-height:230px;display:flex;flex-direction:column;justify-content:space-between}
.icon-badge{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;color:var(--orange);background:linear-gradient(135deg,var(--orange-soft),#fff);border:1px solid rgba(255,98,0,.18)}
.icon-badge .icon{width:28px;height:28px}
.service-mini h3{font-size:19px;margin:18px 0 8px}
.service-mini p{font-size:14px;margin:0 0 18px}
.card-link{display:inline-flex;align-items:center;gap:8px;color:var(--orange);font-weight:900;font-size:14px}
.card-link .icon{width:15px;height:15px}
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.service-card.dark{background:linear-gradient(180deg,#0e151b,#080b0f);color:#fff;border-color:rgba(255,255,255,.12)}
.service-card.dark p{color:rgba(255,255,255,.68)}
.service-media{height:260px;position:relative;overflow:hidden}
.service-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.service-card:hover .service-media img{transform:scale(1.05)}
.service-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.74))}
.service-media .icon-badge{position:absolute;left:18px;bottom:18px;z-index:2;background:var(--orange);color:#fff;border:0}
.service-body{padding:24px}
.service-body h3{color:inherit}
.tag-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tag-list span{font-size:12px;font-weight:850;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:rgba(255,255,255,.78);border-radius:999px;padding:7px 10px}
.service-card:not(.dark) .tag-list span{border-color:var(--line-dark);background:#f7f2eb;color:#475569}

/* Why / bento */
.why{background:#fff;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark)}
.why-grid{display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:18px;align-items:stretch}
.why-intro{padding:26px;background:linear-gradient(135deg,#111820,#24313d);border-radius:var(--radius-lg);color:#fff;position:relative;overflow:hidden}
.why-intro::after{content:"";position:absolute;inset:auto -60px -100px auto;width:260px;height:260px;background:radial-gradient(circle,rgba(255,98,0,.35),transparent 60%)}
.why-intro h2{font-size:38px;margin-bottom:14px}
.why-intro p{color:rgba(255,255,255,.7)}
.why-item{padding:24px;border:1px solid var(--line-dark);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-soft)}
.why-item .icon{width:40px;height:40px;color:var(--orange);margin-bottom:18px}
.why-item h3{font-size:18px}
.why-item p{font-size:14px;margin-bottom:0}

/* Portfolio */
.portfolio{padding:84px 0;background:linear-gradient(180deg,#0a0f14,#101920);color:#fff;position:relative;overflow:hidden}
.portfolio::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='62' height='54' viewBox='0 0 62 54' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 1 31 9.95v17.9L15.5 36.8 0 27.85V9.95L15.5 1Z' fill='none' stroke='%23ff6200' stroke-opacity='.11' stroke-width='1.4'/%3E%3C/svg%3E");opacity:.8;mask-image:linear-gradient(90deg,#000,transparent 25%,transparent 75%,#000)}
.portfolio .container{position:relative;z-index:1}
.portfolio h2,.portfolio h3{color:#fff}
.portfolio p{color:rgba(255,255,255,.66)}
.filter-bar{display:flex;gap:8px;overflow:auto;padding-bottom:10px;margin-bottom:28px;scrollbar-width:none}
.filter-bar::-webkit-scrollbar{display:none}
.filter-btn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:rgba(255,255,255,.78);padding:10px 16px;border-radius:999px;font-weight:850;cursor:pointer;white-space:nowrap;transition:.2s ease}
.filter-btn.is-active,.filter-btn:hover{background:var(--orange);border-color:var(--orange);color:#fff}
.projects-row{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:18px}
.project-card{position:relative;border-radius:22px;overflow:hidden;min-height:380px;background:#111;border:1px solid rgba(255,255,255,.12);box-shadow:0 22px 65px rgba(0,0,0,.25);display:flex;align-items:flex-end;isolation:isolate}
.project-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .6s ease}
.project-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12) 20%,rgba(4,7,10,.94));z-index:-1}
.project-card:hover img{transform:scale(1.06)}
.project-body{padding:22px;width:100%}
.project-cat{font-size:12px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;color:var(--orange)}
.project-body h3{font-size:22px;margin:5px 0}
.project-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.project-tags span{font-size:11px;font-weight:850;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);border-radius:999px;padding:6px 9px;color:rgba(255,255,255,.78)}
.portfolio-actions{text-align:center;margin-top:30px}

/* Design/Web split */
.split-section{background:#fff}
.split-grid{display:grid;grid-template-columns:.9fr 1.2fr;gap:28px;align-items:center}
.feature-panel{border-radius:var(--radius-xl);padding:34px;background:linear-gradient(135deg,#111820,#0b0f14);color:#fff;position:relative;overflow:hidden;box-shadow:var(--shadow)}
.feature-panel p{color:rgba(255,255,255,.72)}
.feature-panel::after{content:"";position:absolute;right:-60px;bottom:-80px;width:280px;height:280px;background:radial-gradient(circle,rgba(255,98,0,.35),transparent 68%)}
.bento-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.bento-card{padding:24px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--line-dark);box-shadow:var(--shadow-soft);min-height:230px}
.bento-card img{height:170px;width:100%;object-fit:cover;border-radius:18px;margin-bottom:18px}
.bento-card .icon-badge{margin-bottom:14px}

/* CTA / contact */
.cta-band{padding:34px;border-radius:var(--radius-xl);background:linear-gradient(135deg,var(--orange),#ff8a1e);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:22px;box-shadow:0 24px 70px rgba(255,98,0,.25);position:relative;overflow:hidden}
.cta-band::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='62' height='54' viewBox='0 0 62 54' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 1 31 9.95v17.9L15.5 36.8 0 27.85V9.95L15.5 1Z' fill='none' stroke='%23ffffff' stroke-opacity='.18' stroke-width='1.4'/%3E%3C/svg%3E");mask-image:linear-gradient(90deg,transparent,#000)}
.cta-band > *{position:relative;z-index:1}
.cta-band h2{font-size:34px;margin-bottom:6px;color:#fff}
.cta-band p{color:rgba(255,255,255,.86);margin:0}
.cta-band .btn{background:#fff;color:var(--ink)}

.contact-preview{padding:84px 0;background:linear-gradient(180deg,#0a0f14,#070a0d);color:#fff;position:relative;overflow:hidden}
.contact-preview::after{content:"";position:absolute;right:-80px;top:80px;width:420px;height:420px;background:radial-gradient(circle,rgba(255,98,0,.18),transparent 60%)}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:42px;position:relative;z-index:1}
.contact-card{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);border-radius:var(--radius-xl);padding:28px;box-shadow:var(--shadow);backdrop-filter:blur(14px)}
.contact-list{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:14px}
.contact-list li{display:flex;align-items:flex-start;gap:12px;color:rgba(255,255,255,.82);font-weight:700}
.contact-list .icon{width:22px;height:22px;color:var(--orange);flex:0 0 auto}
.contact-list a:hover{color:var(--orange)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-field{display:flex;flex-direction:column;gap:7px}
.form-field.full{grid-column:1/-1}
.form-field label{font-size:13px;font-weight:850;color:rgba(255,255,255,.82)}
.form-field input,.form-field select,.form-field textarea{
    width:100%;border:1px solid rgba(255,255,255,.14);background:rgba(8,12,16,.72);color:#fff;border-radius:14px;padding:14px 15px;outline:none;transition:.2s ease
}
.form-field textarea{resize:vertical;min-height:145px}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(255,98,0,.12)}
.form-field input::placeholder,.form-field textarea::placeholder{color:rgba(255,255,255,.38)}
.form-choice-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:6px}
.choice-pill{display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:12px;color:rgba(255,255,255,.82);cursor:pointer;transition:.2s ease;font-weight:800;font-size:13px;background:rgba(255,255,255,.04)}
.choice-pill input{display:none}
.choice-pill .icon{width:18px;height:18px;color:var(--orange)}
.choice-pill:has(input:checked){background:rgba(255,98,0,.18);border-color:var(--orange);color:#fff}
.file-drop{border:1px dashed rgba(255,255,255,.22);border-radius:16px;padding:18px;text-align:center;color:rgba(255,255,255,.62);cursor:pointer;background:rgba(255,255,255,.04)}
.file-drop input{display:none}
.file-drop strong{display:block;color:#fff;margin-bottom:4px}
.form-note{font-size:13px;color:rgba(255,255,255,.56);margin:10px 0 0}
.alert{border-radius:16px;padding:14px 16px;margin-bottom:18px;font-weight:750}
.alert-error{background:#ffe7e0;color:#9b1c1c;border:1px solid #ffc4b5}
.alert-success{background:#dcfce7;color:#176233;border:1px solid #a7f3d0}

/* Page hero */
.page-hero{padding:82px 0 62px}
.page-hero-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:center}
.page-hero h1{color:#fff;font-size:clamp(46px,6vw,80px)}
.page-visual{height:440px;border-radius:var(--radius-xl);overflow:hidden;border:1px solid rgba(255,255,255,.12);box-shadow:var(--shadow);position:relative}
.page-visual img{width:100%;height:100%;object-fit:cover}
.page-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.45))}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}
.stat{padding:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);border-radius:18px}
.stat strong{display:block;color:var(--orange);font-size:30px;line-height:1}
.stat span{font-size:13px;color:rgba(255,255,255,.68)}

/* FAQ */
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.faq-item{border:1px solid var(--line-dark);border-radius:18px;background:#fff;box-shadow:var(--shadow-soft);overflow:hidden}
.faq-question{width:100%;border:0;background:transparent;padding:18px 20px;text-align:left;font-weight:900;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:var(--ink)}
.faq-question::after{content:"+";color:var(--orange);font-size:26px;line-height:1}
.faq-item.is-open .faq-question::after{content:"−"}
.faq-answer{display:none;padding:0 20px 18px;color:var(--muted)}
.faq-item.is-open .faq-answer{display:block}

/* Subcontract */
.process-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.process-step{padding:24px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--line-dark);box-shadow:var(--shadow-soft)}
.process-step strong{display:grid;place-items:center;width:38px;height:38px;border-radius:14px;background:var(--orange);color:white;margin-bottom:18px}
.tick-list{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:11px}
.tick-list li{display:flex;gap:10px;align-items:flex-start;color:rgba(255,255,255,.78)}
.tick-list .icon{width:18px;height:18px;color:var(--orange);flex:0 0 auto;margin-top:2px}
.light-list li{color:var(--muted)}

/* Footer */
.site-footer{padding:56px 0 24px;border-top:1px solid rgba(255,255,255,.08)}
.footer-grid{display:grid;grid-template-columns:1.2fr .7fr 1.1fr 1fr;gap:38px}
.footer-logo{height:58px;width:auto;margin-bottom:18px}
.footer-brand p{color:rgba(255,255,255,.66);max-width:270px}
.socials{display:flex;gap:10px;margin-top:18px}
.socials a{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);font-weight:900;color:#fff}
.site-footer h3{font-size:14px;color:#fff;text-transform:uppercase;letter-spacing:.08em;margin-bottom:16px}
.footer-links{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.footer-links.two-cols{grid-template-columns:1fr 1fr;gap:8px 18px}
.footer-links a{color:rgba(255,255,255,.66);font-size:14px}
.footer-links a:hover{color:var(--orange)}
.contact-list.small li{font-size:14px;color:rgba(255,255,255,.7)}
.contact-list.small .icon{width:18px;height:18px}
.footer-bottom{display:flex;justify-content:space-between;gap:20px;color:rgba(255,255,255,.45);font-size:13px;border-top:1px solid rgba(255,255,255,.08);padding-top:22px;margin-top:40px}
.footer-bottom a:hover{color:var(--orange)}
.back-to-top{position:fixed;right:20px;bottom:20px;width:46px;height:46px;border-radius:50%;border:0;background:var(--orange);color:#fff;font-weight:900;box-shadow:0 15px 30px rgba(255,98,0,.35);cursor:pointer;opacity:0;transform:translateY(12px);transition:.25s ease;z-index:30}
.back-to-top.is-visible{opacity:1;transform:none}

/* Animations */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease, transform .6s ease}
.reveal.is-visible{opacity:1;transform:none}

@media (max-width:1050px){
    .header-actions .phone-link{display:none}
    .main-nav{position:fixed;top:84px;left:20px;right:20px;display:none;flex-direction:column;align-items:stretch;border-radius:24px;background:rgba(7,10,13,.97);padding:14px;box-shadow:var(--shadow)}
    .main-nav.is-open{display:flex}
    .nav-toggle{display:flex}
    .main-nav a{padding:14px 16px}
    .hero-grid,.page-hero-grid,.split-grid,.contact-grid{grid-template-columns:1fr}
    .hero{min-height:auto;padding-top:62px}
    .hero-slider{height:520px}
    .services-strip{grid-template-columns:repeat(2,1fr)}
    .why-grid{grid-template-columns:1fr 1fr}
    .why-intro{grid-column:1/-1}
    .projects-row{grid-template-columns:repeat(2,1fr)}
    .footer-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:720px){
    .container{width:min(100% - 24px,var(--container))}
    .header-inner{height:72px}
    .brand-logo{height:44px}
    .main-nav{top:72px}
    .header-actions .btn{display:none}
    .section,.portfolio,.contact-preview{padding:58px 0}
    .section-head{display:block}
    .hero-slider{height:430px;border-radius:24px}
    .slide-caption{display:block;bottom:22px;left:20px;right:20px}
    .slide-caption h3{font-size:25px}
    .slider-dots{bottom:88px;left:20px}
    .hero-thumbs{grid-template-columns:repeat(2,1fr)}
    .services-strip,.service-grid,.projects-row,.bento-grid,.why-grid,.faq-grid,.process-row,.stats-row{grid-template-columns:1fr}
    .form-grid,.form-choice-grid{grid-template-columns:1fr}
    .page-visual{height:310px}
    .footer-grid{grid-template-columns:1fr}
    .footer-links.two-cols{grid-template-columns:1fr}
    .footer-bottom{flex-direction:column}
    .cta-band{display:block;text-align:left}
    .cta-band .btn{margin-top:18px}
}

/* Admin images */
.brand-wrap,.footer-logo-wrap,.page-visual,.service-media,.project-card,.bento-card,.hero-slide,.hero-thumb,.admin-image-card-preview{position:relative}
.admin-topbar{position:relative;z-index:120;background:#11161d;color:#fff;border-bottom:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;gap:12px;padding:9px 16px;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.22);flex-wrap:wrap}
.admin-topbar strong{color:var(--orange)}
.admin-topbar span{color:rgba(255,255,255,.72)}
.admin-topbar a,.admin-topbar .admin-inline-edit{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:999px;background:rgba(255,98,0,.96);color:#fff;font-size:12px;font-weight:950;padding:8px 11px;box-shadow:0 12px 32px rgba(0,0,0,.22);cursor:pointer;line-height:1;white-space:nowrap;transition:.2s ease}
.admin-topbar a:hover,.admin-topbar .admin-inline-edit:hover{background:var(--orange);border-color:var(--orange);transform:none}
.admin-flash{position:fixed;pointer-events:none;top:18px;left:50%;transform:translateX(-50%);z-index:300;max-width:min(720px,calc(100% - 24px));padding:13px 18px;border-radius:16px;font-weight:900;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.admin-flash-success{background:#dcfce7;color:#176233;border:1px solid #a7f3d0}
.admin-flash-error{background:#ffe7e0;color:#9b1c1c;border:1px solid #ffc4b5}
.admin-image-edit{position:absolute;top:10px;right:10px;z-index:25;border:0;border-radius:999px;background:rgba(255,98,0,.96);color:#fff;font-size:12px;font-weight:950;padding:8px 11px;box-shadow:0 12px 32px rgba(0,0,0,.28);cursor:pointer;opacity:.96;transition:.2s ease;line-height:1;white-space:nowrap}
.admin-image-edit:hover{transform:translateY(-2px);background:#ff7a18}
.brand-wrap .admin-image-edit{top:50%;right:-74px;transform:translateY(-50%)}
.brand-wrap .admin-image-edit:hover{transform:translateY(calc(-50% - 2px))}
.footer-logo-wrap{display:inline-block;margin-bottom:18px}
.footer-logo-wrap .footer-logo{margin-bottom:0}
.footer-logo-wrap .admin-image-edit{top:-6px;right:-84px}
.admin-image-modal{position:fixed;inset:0;z-index:500;display:none;align-items:center;justify-content:center;padding:18px}
.admin-image-modal.is-open{display:flex}
.admin-image-backdrop{position:absolute;inset:0;background:rgba(4,7,10,.78);backdrop-filter:blur(12px)}
.admin-image-dialog{position:relative;z-index:1;width:min(760px,100%);max-height:calc(100vh - 36px);overflow:auto;background:#fff;border-radius:28px;box-shadow:0 30px 100px rgba(0,0,0,.42);border:1px solid rgba(16,20,24,.12)}
.admin-image-close{position:absolute;top:14px;right:14px;width:38px;height:38px;border:0;border-radius:50%;background:#f3f4f6;color:#11161d;font-size:26px;line-height:1;cursor:pointer;z-index:2}
.admin-image-form{padding:28px}
.admin-image-form-head span{display:inline-flex;color:var(--orange);font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:950;margin-bottom:8px}
.admin-image-form-head h2{font-size:34px;margin-bottom:8px;color:var(--ink)}
.admin-image-form-head p{margin-bottom:18px}
.admin-image-preview{height:240px;border-radius:22px;overflow:hidden;background:#111820;border:1px solid var(--line-dark);margin-bottom:18px;display:grid;place-items:center}
.admin-image-preview img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;background:#111820}
.admin-image-upload{display:block;border:1px dashed rgba(16,20,24,.22);border-radius:18px;padding:16px;background:#faf7f2;margin-bottom:16px;cursor:pointer}
.admin-image-upload strong{display:block;margin-bottom:8px;color:var(--ink)}
.admin-image-upload input{display:block;margin:8px 0;color:var(--ink)}
.admin-image-upload span{display:block;font-size:13px;color:var(--muted)}
.admin-image-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:12px}
.admin-image-grid label,.admin-login-form label{display:flex;flex-direction:column;gap:7px;font-size:13px;color:var(--ink);font-weight:850}
.admin-image-grid input,.admin-image-grid select,.admin-login-form input{width:100%;border:1px solid var(--line-dark);border-radius:14px;padding:13px 14px;outline:none;background:#fff;color:var(--ink)}
.admin-image-grid input:focus,.admin-image-grid select:focus,.admin-login-form input:focus{border-color:var(--orange);box-shadow:0 0 0 4px rgba(255,98,0,.12)}
.admin-image-range{grid-column:span 1}
.admin-image-range span{display:inline-flex;margin-left:auto;color:var(--orange);font-weight:950}
.admin-image-range input[type="range"]{padding:0;height:38px;accent-color:var(--orange);cursor:pointer}
.admin-image-range small{display:block;color:var(--muted);font-size:11px;font-weight:700;line-height:1.35}

.admin-image-reset{display:flex;gap:9px;align-items:center;font-weight:850;color:var(--ink);margin:12px 0 20px}
.admin-image-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.admin-login-hero{min-height:calc(100vh - 84px);display:flex;align-items:center}
.admin-login-card{max-width:560px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);border-radius:32px;padding:34px;box-shadow:var(--shadow);backdrop-filter:blur(14px)}
.admin-login-card h1{font-size:clamp(38px,5vw,66px)}
.admin-login-form{display:grid;gap:14px;margin-top:24px}
.admin-login-form label{color:#fff}
.admin-login-form input{background:rgba(255,255,255,.94)}
.admin-login-note{color:rgba(255,255,255,.62);font-size:13px;margin-top:16px}
.admin-images-hero{padding-bottom:48px}
.admin-images-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.admin-image-card{border:1px solid var(--line-dark);border-radius:24px;background:#fff;box-shadow:var(--shadow-soft);overflow:hidden}
.admin-image-card-preview{height:210px;background:#111820;display:grid;place-items:center;overflow:hidden}
.admin-image-card-preview img{width:100%;height:100%;object-fit:cover}
.admin-image-card-body{padding:18px}
.admin-image-card-body h3{font-size:18px;margin-bottom:8px}
.admin-image-card-body p{font-size:12px;word-break:break-word;margin-bottom:8px}
.admin-image-card-body small{display:block;color:var(--orange);font-weight:850}
@media (max-width:1050px){.admin-images-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-topbar{flex-wrap:wrap}.brand-wrap .admin-image-edit{right:-54px}}
@media (max-width:720px){.admin-topbar{position:relative;font-size:12px;justify-content:flex-start}.admin-topbar span{display:none}.admin-image-grid,.admin-images-grid{grid-template-columns:1fr}.admin-image-form{padding:22px}.admin-image-preview{height:190px}.brand-wrap .admin-image-edit{right:-48px;padding:7px 8px;font-size:11px}.footer-logo-wrap .admin-image-edit{right:-68px}.admin-image-edit{font-size:11px;padding:7px 9px}}

/* Admin paramètres globaux */
.stats-wrap{position:relative;display:inline-block;width:100%}
.admin-inline-edit{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:999px;background:rgba(255,98,0,.96);color:#fff;font-size:12px;font-weight:950;padding:8px 11px;box-shadow:0 12px 32px rgba(0,0,0,.22);cursor:pointer;line-height:1;white-space:nowrap;transition:.2s ease}
.admin-inline-edit:hover{transform:translateY(-2px);background:#ff7a18}
.admin-stats-edit{margin-top:12px}
.socials-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.admin-social-edit{padding:7px 10px}
.admin-project-toolbar{display:flex;justify-content:flex-end;margin:0 0 18px}
.project-card .admin-tags-edit{right:108px;background:rgba(17,24,39,.92)}
.project-card .admin-tags-edit:hover{background:#111827}
.admin-content-modal{position:fixed;inset:0;z-index:520;display:none;align-items:center;justify-content:center;padding:18px}
.admin-content-modal.is-open{display:flex}
.admin-content-dialog{width:min(820px,100%)}
.admin-content-modal .admin-image-backdrop{background:rgba(4,7,10,.82);backdrop-filter:blur(12px)}
.admin-content-modal .admin-image-dialog{position:relative;z-index:2;background:#fff;color:var(--ink)}
.admin-content-modal .admin-image-actions{position:sticky;bottom:0;background:#fff;padding-top:14px}

.admin-panel{display:none}
.admin-selected-project{font-weight:900;color:var(--ink);margin-bottom:12px}
.admin-tags-options{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 10px}
.admin-tag-choice{display:inline-flex!important;align-items:center;gap:8px;flex-direction:row!important;border:1px solid var(--line-dark);border-radius:999px;padding:10px 12px;background:#fff;font-size:13px;color:var(--ink);font-weight:900;cursor:pointer;transition:.2s ease}
.admin-tag-choice input{width:auto!important;padding:0!important;accent-color:var(--orange)}
.admin-tag-choice:has(input:checked){background:rgba(255,98,0,.12);border-color:rgba(255,98,0,.55);color:var(--orange)}
.admin-tag-choice:has(input:disabled):not(:has(input:checked)){opacity:.42;cursor:not-allowed}
.admin-help-small{font-size:12px;color:var(--muted);margin-top:8px}
@media (max-width:720px){.project-card .admin-tags-edit{right:10px;top:52px}.admin-project-toolbar{justify-content:stretch}.admin-add-project-btn{width:100%}}


/* Correctif admin : ne jamais décaler/couvrir le header */
.admin-topbar{display:none!important}
.admin-dock{
    position:fixed;
    left:18px;
    bottom:18px;
    z-index:460;
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    max-width:calc(100vw - 36px);
    padding:10px 12px;
    border-radius:999px;
    background:rgba(7,10,13,.92);
    color:#fff;
    border:1px solid rgba(255,255,255,.16);
    box-shadow:0 18px 50px rgba(0,0,0,.35);
    backdrop-filter:blur(14px);
    font-size:13px;
}
.admin-dock strong{color:var(--orange);font-weight:950}
.admin-dock a{color:#fff;font-weight:900;border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:8px 11px;background:rgba(255,255,255,.06);line-height:1}
.admin-dock a:hover{background:var(--orange);border-color:var(--orange)}

/* Le bouton image du logo header ne doit plus se poser sur la navigation */
.site-header .brand-wrap .admin-image-edit{
    top:calc(100% + 8px)!important;
    left:0!important;
    right:auto!important;
    transform:none!important;
    z-index:90;
}
.site-header .brand-wrap .admin-image-edit:hover{transform:translateY(-2px)!important}

/* Les modales paramètres doivent être de vraies fenêtres fermées par défaut */
.admin-content-modal:not(.is-open){display:none!important}
.admin-content-modal.is-open{
    position:fixed!important;
    inset:0!important;
    z-index:620!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:18px!important;
    background:transparent!important;
}
.admin-content-modal .admin-image-backdrop{position:absolute!important;inset:0!important;z-index:0!important}
.admin-content-modal .admin-content-dialog,
.admin-content-modal .admin-image-dialog{
    position:relative!important;
    z-index:2!important;
    width:min(820px, calc(100vw - 36px))!important;
    max-height:calc(100vh - 36px)!important;
    overflow:auto!important;
    margin:0!important;
}

/* Placement propre des boutons près des zones concernées */
.stats-wrap .admin-stats-edit{display:inline-flex;margin-top:14px}
.socials-wrap .admin-social-edit{margin-top:18px;background:rgba(255,98,0,.96);color:#fff}

@media (max-width:720px){
    .admin-dock{left:10px;right:10px;bottom:10px;border-radius:18px;justify-content:center;font-size:12px}
    .site-header .brand-wrap .admin-image-edit{top:calc(100% + 6px)!important;font-size:10px!important;padding:6px 8px!important}
}

.admin-zone-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.admin-zone-head h3{margin-bottom:0}
.socials-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.stats-wrap{position:relative;display:inline-flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
.stats-wrap .admin-inline-edit{margin-top:6px}
.footer-brand .admin-inline-edit,.contact-list + .admin-inline-edit{margin-top:8px}

/* Correctif boutons admin inline : même esprit que le bouton Image */
.admin-inline-edit,
.admin-social-edit,
.admin-stats-edit,
.admin-contact-edit{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    border:0!important;
    border-radius:999px!important;
    background:rgba(255,98,0,.96)!important;
    color:#fff!important;
    font-size:12px!important;
    font-weight:950!important;
    padding:8px 11px!important;
    box-shadow:0 12px 32px rgba(0,0,0,.22)!important;
    cursor:pointer!important;
    line-height:1!important;
    white-space:nowrap!important;
    transition:.2s ease!important;
}
.admin-inline-edit:hover,
.admin-social-edit:hover,
.admin-stats-edit:hover,
.admin-contact-edit:hover{
    transform:translateY(-2px)!important;
    background:#ff7a18!important;
    color:#fff!important;
}
.footer-brand .admin-social-edit{margin-top:0}
.admin-zone-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.stats-wrap{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
.stats-wrap .admin-stats-edit{margin-top:6px}

/* Aperçu image réaliste dans la modale + champs texte */
.admin-image-preview{
    width:100%;
    aspect-ratio:16/9;
    height:auto!important;
    min-height:180px;
    max-height:360px;
}
.admin-image-preview img{
    display:block;
    width:100%!important;
    height:100%!important;
    object-fit:cover;
    object-position:50% 50%;
}
.admin-reset-position-btn{
    grid-column:1 / -1;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    border:1px solid rgba(255,98,0,.28);
    background:#fff7ed;
    color:var(--orange);
    border-radius:14px;
    padding:12px 14px;
    font-weight:950;
    cursor:pointer;
}
.admin-reset-position-btn:hover{background:var(--orange);color:#fff}
.admin-image-content-fields{
    margin:18px 0;
    padding:16px;
    border:1px solid var(--line-dark);
    border-radius:18px;
    background:#fbfaf8;
}
.admin-image-content-fields h3{
    font-size:18px;
    color:var(--ink);
    margin-bottom:12px;
}
.admin-image-content-fields label{
    display:flex;
    flex-direction:column;
    gap:7px;
    font-size:13px;
    color:var(--ink);
    font-weight:850;
    margin-bottom:12px;
}
.admin-image-content-fields input,
.admin-image-content-fields textarea{
    width:100%;
    border:1px solid var(--line-dark);
    border-radius:14px;
    padding:13px 14px;
    outline:none;
    background:#fff;
    color:var(--ink);
    font:inherit;
}
.admin-image-content-fields input:focus,
.admin-image-content-fields textarea:focus{
    border-color:var(--orange);
    box-shadow:0 0 0 4px rgba(255,98,0,.12);
}
.admin-image-content-fields small{color:var(--muted);font-weight:700}

/* =========================================================
   Apparence paramétrable
   Ces règles utilisent les variables injectées par l'admin
   Apparence. Elles gardent le style actuel si rien n'est modifié.
   ========================================================= */
:root{
    --band-light:#ffffff;
    --footer-bg:var(--night);
    --dark-gradient:linear-gradient(135deg,var(--night),var(--night-2) 54%,var(--night-3));
    --portfolio-gradient:linear-gradient(180deg,var(--night),var(--night-2));
    --contact-gradient:linear-gradient(180deg,var(--night),var(--footer-bg));
    --orange-gradient:linear-gradient(135deg,var(--orange),var(--orange-2));
    --header-bg:rgba(7,10,13,.82);
    --header-bg-scrolled:rgba(7,10,13,.96);
    --body-orange-glow:rgba(255,98,0,.12);
    --body-blue-glow:rgba(31,104,179,.08);
    --honey-pattern:url("data:image/svg+xml,%3Csvg width='62' height='54' viewBox='0 0 62 54' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 1 31 9.95v17.9L15.5 36.8 0 27.85V9.95L15.5 1Z' fill='none' stroke='%23ff6200' stroke-opacity='.32' stroke-width='1.4'/%3E%3Cpath d='M46.5 18 62 26.95v17.9L46.5 53.8 31 44.85v-17.9L46.5 18Z' fill='none' stroke='%23ff6200' stroke-opacity='.28' stroke-width='1.4'/%3E%3C/svg%3E");
    --honey-pattern-size:62px 54px;
    --honey-pattern-opacity:.13;
    --honey-pattern-opacity-soft:.16;
    --white-pattern:url("data:image/svg+xml,%3Csvg width='62' height='54' viewBox='0 0 62 54' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.5 1 31 9.95v17.9L15.5 36.8 0 27.85V9.95L15.5 1Z' fill='none' stroke='%23ffffff' stroke-opacity='.18' stroke-width='1.4'/%3E%3C/svg%3E");
}
body{
    background:
        radial-gradient(circle at top left, var(--body-orange-glow), transparent 28rem),
        radial-gradient(circle at 90% 20%, var(--body-blue-glow), transparent 22rem),
        var(--bg);
}
.text-gradient,.btn-primary,.cta-band{background:var(--orange-gradient)}
.site-header{background:var(--header-bg)}
.site-header.is-scrolled{background:var(--header-bg-scrolled)}
.honey-dark{background:var(--dark-gradient)}
.honey-dark::before,.honey-dark::after{
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    opacity:var(--honey-pattern-opacity)!important;
}
.portfolio{
    background:var(--portfolio-gradient);
}
.portfolio::before{
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    opacity:var(--honey-pattern-opacity-soft)!important;
}
.cta-band::after{
    background-image:var(--white-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
}
.contact-preview{background:var(--contact-gradient)}
.split-section,.why{background:var(--band-light)}
.feature-panel,.why-intro{background:var(--dark-gradient)}
.service-card.dark{background:linear-gradient(180deg,var(--night-2),var(--night))}
.btn-primary{background:var(--orange-gradient);box-shadow:0 18px 36px var(--orange-shadow, rgba(255,98,0,.25))}
.cta-band{background:var(--orange-gradient);box-shadow:0 24px 70px var(--orange-shadow, rgba(255,98,0,.25))}
.admin-image-edit,.admin-inline-edit,.admin-social-edit,.admin-stats-edit,.admin-contact-edit,.admin-dock a:hover,.back-to-top{background:var(--orange)!important}
.admin-image-edit:hover,.admin-inline-edit:hover,.admin-social-edit:hover,.admin-stats-edit:hover,.admin-contact-edit:hover{background:var(--orange-2)!important}
.site-footer{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:var(--footer-bg);
    color:var(--text);
}
.site-footer::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    pointer-events:none;
    background-image:var(--honey-pattern);
    background-size:var(--honey-pattern-size);
    opacity:var(--honey-pattern-opacity-soft);
    mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000);
}
.site-footer p,.footer-links a,.contact-list.small li,.footer-bottom{color:rgba(255,255,255,.66)}



/* =========================================================
   HEADER TEXTE UNIQUEMENT — compatible Admin Apparence
   (garde les variables d'apparence, supprime seulement l'effet bouton du header)
========================================================= */
.site-header.site-header-text-only .main-nav,
.site-header.site-header-text-only [data-main-nav]{
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    padding:0!important;
}
.site-header.site-header-text-only .main-nav > a,
.site-header.site-header-text-only [data-main-nav] > a,
.site-header.site-header-text-only .header-actions .btn,
.site-header.site-header-text-only .header-text-link{
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}
.site-header.site-header-text-only .main-nav > a:hover,
.site-header.site-header-text-only [data-main-nav] > a:hover{color:#fff!important;background:transparent!important}
.site-header.site-header-text-only .main-nav > a.is-active,
.site-header.site-header-text-only [data-main-nav] > a.is-active{color:var(--orange)!important;background:transparent!important}


/* =========================================================
   PATCH FINAL — motifs dynamiques réellement visibles
   Les motifs ne sont plus figés dans le CSS : ils utilisent
   --honey-pattern / --honey-pattern-size / --honey-pattern-opacity.
   Zones concernées : hero, page-hero, portfolio, CTA, contact, footer.
   ========================================================= */
:root{
    --honey-pattern-size:62px 54px;
    --honey-pattern-opacity:.45;
    --honey-pattern-opacity-soft:.18;
    --dark-gradient:linear-gradient(135deg,var(--night),var(--night-2) 54%,var(--night-3));
    --portfolio-gradient:linear-gradient(180deg,var(--night),var(--night-2));
    --contact-gradient:linear-gradient(180deg,var(--night),var(--footer-bg, var(--night)));
    --orange-gradient:linear-gradient(135deg,var(--orange),var(--orange-2));
}

.honey-dark{
    background-image:var(--honey-pattern), var(--dark-gradient)!important;
    background-size:var(--honey-pattern-size), auto!important;
    background-position:center, center!important;
    background-repeat:repeat, no-repeat!important;
}
.honey-dark::before,
.honey-dark::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    pointer-events:none!important;
    z-index:0!important;
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    background-repeat:repeat!important;
    opacity:var(--honey-pattern-opacity)!important;
}
.honey-dark::before{
    width:560px!important;
    height:560px!important;
    left:-120px!important;
    top:44px!important;
    mask-image:linear-gradient(90deg,#000,transparent 82%)!important;
}
.honey-dark::after{
    width:520px!important;
    height:620px!important;
    right:-120px!important;
    bottom:0!important;
    mask-image:radial-gradient(circle,#000 0 48%,transparent 78%)!important;
}
.honey-dark > *{position:relative;z-index:1}

.portfolio{
    background-image:var(--honey-pattern), var(--portfolio-gradient)!important;
    background-size:var(--honey-pattern-size), auto!important;
    background-repeat:repeat, no-repeat!important;
    background-position:center, center!important;
}
.portfolio::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    display:block!important;
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    background-repeat:repeat!important;
    opacity:var(--honey-pattern-opacity-soft)!important;
    mask-image:linear-gradient(90deg,#000,transparent 22%,transparent 78%,#000)!important;
    pointer-events:none!important;
}

.contact-preview{
    background-image:var(--honey-pattern), var(--contact-gradient)!important;
    background-size:var(--honey-pattern-size), auto!important;
    background-repeat:repeat, no-repeat!important;
    background-position:center, center!important;
}
.contact-preview::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    display:block!important;
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    background-repeat:repeat!important;
    opacity:var(--honey-pattern-opacity-soft)!important;
    mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent)!important;
    pointer-events:none!important;
}
.contact-preview > *{position:relative;z-index:1}

.site-footer.honey-dark{
    background-image:var(--honey-pattern), var(--dark-gradient)!important;
    background-size:var(--honey-pattern-size), auto!important;
}
.site-footer.honey-dark::before,
.site-footer.honey-dark::after{
    opacity:var(--honey-pattern-opacity-soft)!important;
}

.cta-band{
    background-image:var(--honey-pattern), var(--orange-gradient)!important;
    background-size:var(--honey-pattern-size), auto!important;
    background-repeat:repeat, no-repeat!important;
    background-position:center, center!important;
}
.cta-band::after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    display:block!important;
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    background-repeat:repeat!important;
    opacity:.22!important;
    mask-image:linear-gradient(90deg,transparent,#000)!important;
    pointer-events:none!important;
}

/* Dans l’aperçu admin, on rend les motifs plus visibles quand la zone est sélectionnée/survolée. */
body.pixel-appearance-preview-frame .pixel-preview-zone:hover::before,
body.pixel-appearance-preview-frame .pixel-preview-zone:hover::after,
body.pixel-appearance-preview-frame .pixel-preview-zone.is-preview-selected::before,
body.pixel-appearance-preview-frame .pixel-preview-zone.is-preview-selected::after{
    opacity:min(.85, calc(var(--honey-pattern-opacity) + .18))!important;
}

/* Le header reste texte uniquement : pas de pilule, pas de bouton. */
.site-header.site-header-text-only .main-nav,
.site-header.site-header-text-only [data-main-nav],
.site-header.site-header-text-only .main-nav>a,
.site-header.site-header-text-only [data-main-nav]>a,
.site-header.site-header-text-only .header-actions .btn,
.site-header.site-header-text-only .header-text-link{
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}
.site-header.site-header-text-only .main-nav>a:hover,
.site-header.site-header-text-only [data-main-nav]>a:hover,
.site-header.site-header-text-only .header-text-link:hover{color:#fff!important}
.site-header.site-header-text-only .main-nav>a.is-active,
.site-header.site-header-text-only [data-main-nav]>a.is-active{color:var(--orange)!important}


/* =========================================================
   FORCE FOOTER MOTIF DYNAMIQUE
   Sécurité : même si un ancien SVG est codé en dur plus haut,
   le footer et les zones sombres prennent le motif paramétré.
   ========================================================= */
html body .site-footer.honey-dark,
html body .honey-dark,
html body .portfolio,
html body .contact-preview,
html body .cta-band{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
}
html body .site-footer.honey-dark{
    background-image:var(--honey-pattern), var(--dark-gradient)!important;
    background-size:var(--honey-pattern-size), auto!important;
    background-repeat:repeat, no-repeat!important;
    background-position:center, center!important;
}
html body .site-footer.honey-dark::before,
html body .site-footer.honey-dark::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    inset:0!important;
    width:auto!important;
    height:auto!important;
    left:0!important;
    right:0!important;
    top:0!important;
    bottom:0!important;
    pointer-events:none!important;
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    background-repeat:repeat!important;
    background-position:center!important;
    z-index:0!important;
}
html body .site-footer.honey-dark::before{
    opacity:var(--honey-pattern-opacity)!important;
    mask-image:linear-gradient(90deg,#000 0%,transparent 34%,transparent 66%,#000 100%)!important;
}
html body .site-footer.honey-dark::after{
    opacity:var(--honey-pattern-opacity-soft)!important;
    mask-image:radial-gradient(circle at 82% 38%,#000 0 34%,transparent 72%)!important;
}
html body .site-footer.honey-dark > *{position:relative!important;z-index:1!important;}


/* ==============================
   Correctifs finaux demandés
   - Motifs dynamiques sur PC et mobile
   - Hero texte en encart mobile
   - Formulaire projet sans débordement
   - Taille .eyebrow paramétrable
   ============================== */
.eyebrow{font-size:var(--eyebrow-font-size,12px)!important}

/* Le motif doit toujours utiliser les variables injectées par l’admin, pas un SVG figé. */
html body .honey-dark,
html body .portfolio,
html body .contact-preview,
html body .cta-band,
html body .site-footer.honey-dark{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
}
html body .honey-dark{background-image:var(--honey-pattern),var(--dark-gradient)!important;background-size:var(--honey-pattern-size),auto!important;background-repeat:repeat,no-repeat!important;background-position:center,center!important}
html body .portfolio{background-image:var(--honey-pattern),var(--portfolio-gradient)!important;background-size:var(--honey-pattern-size),auto!important;background-repeat:repeat,no-repeat!important;background-position:center,center!important}
html body .contact-preview{background-image:var(--honey-pattern),var(--contact-gradient)!important;background-size:var(--honey-pattern-size),auto!important;background-repeat:repeat,no-repeat!important;background-position:center,center!important}
html body .cta-band{background-image:var(--honey-pattern),var(--orange-gradient)!important;background-size:var(--honey-pattern-size),auto!important;background-repeat:repeat,no-repeat!important;background-position:center,center!important}
html body .site-footer.honey-dark{background-image:var(--honey-pattern),var(--dark-gradient)!important;background-size:var(--honey-pattern-size),auto!important;background-repeat:repeat,no-repeat!important;background-position:center,center!important}
html body .honey-dark::before,
html body .honey-dark::after,
html body .portfolio::before,
html body .contact-preview::before,
html body .cta-band::after,
html body .site-footer.honey-dark::before,
html body .site-footer.honey-dark::after{
    background-image:var(--honey-pattern)!important;
    background-size:var(--honey-pattern-size)!important;
    background-repeat:repeat!important;
    background-position:center!important;
}

/* Formulaire contact : les choix restent dans leur zone, même avec les longs libellés. */
.form-choice-grid{
    grid-template-columns:repeat(auto-fit,minmax(135px,1fr))!important;
    align-items:stretch!important;
}
.choice-pill{
    min-width:0!important;
    width:100%!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.22!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
}
.choice-pill span{min-width:0!important;display:block!important;overflow-wrap:anywhere!important}

/* Mobile : la première zone texte des pages hero devient un encart sombre paramétrable. */
@media (max-width:720px){
    .hero.honey-dark .hero-copy,
    .page-hero.honey-dark .page-hero-grid > .reveal:first-child,
    .page-hero.honey-dark > .container > .reveal:first-child,
    .page-hero.honey-dark > .container:not(.page-hero-grid){
        background:var(--mobile-hero-card-bg,var(--night))!important;
        border:1px solid rgba(255,255,255,.12)!important;
        padding:22px 18px!important;
        border-radius:18px!important;
        box-shadow:0 18px 55px rgba(0,0,0,.28)!important;
        backdrop-filter:blur(10px)!important;
    }
    .hero.honey-dark .hero-copy .hero-actions{
        margin:24px 0 18px!important;
    }
    .hero.honey-dark .hero-copy .hero-proof{
        margin-top:18px!important;
    }
    .form-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .choice-pill{padding:11px 8px!important;font-size:12px!important}
}
@media (max-width:430px){.form-choice-grid{grid-template-columns:1fr!important}}


/* =========================================================
   PATCH 2026-06-15 — correction mobile index + contact
   - Supprime la barre orange sur le texte dégradé iPhone/Safari
   - Force les boutons Type de projet à rester dans l'encart contact
   - Garde le header sans lien Devis
   ========================================================= */

/* 1) Correction iPhone/Safari : le dégradé du titre doit être du TEXTE,
      jamais un rectangle de fond. */
html body .text-gradient,
html body h1 .text-gradient,
html body .hero-copy h1 .text-gradient{
    background:var(--orange-gradient, linear-gradient(135deg,var(--orange),var(--orange-2)))!important;
    -webkit-background-clip:text!important;
    background-clip:text!important;
    -webkit-text-fill-color:transparent!important;
    color:transparent!important;
    display:inline!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    box-shadow:none!important;
    border-radius:0!important;
    line-height:inherit!important;
}
@supports not (-webkit-background-clip:text){
    html body .text-gradient,
    html body h1 .text-gradient,
    html body .hero-copy h1 .text-gradient{
        background:none!important;
        color:var(--orange)!important;
    }
}

/* 2) Mobile : l'encart texte du hero reste sombre, sans masquer le titre. */
@media (max-width:720px){
    html body .hero.honey-dark .hero-copy,
    html body .page-hero.honey-dark .page-hero-grid > .reveal:first-child,
    html body .page-hero.honey-dark > .container > .reveal:first-child,
    html body .page-hero.honey-dark > .container:not(.page-hero-grid){
        background:var(--mobile-hero-card-bg, rgba(5,8,11,.86))!important;
        border:1px solid rgba(255,255,255,.12)!important;
        padding:22px 18px!important;
        border-radius:18px!important;
        box-shadow:0 18px 55px rgba(0,0,0,.28)!important;
        backdrop-filter:blur(10px)!important;
        -webkit-backdrop-filter:blur(10px)!important;
    }

    html body .hero-copy h1{
        overflow:visible!important;
    }
}

/* 3) Contact : la grille de choix ne doit jamais dépasser de l'encart. */
html body .contact-preview .contact-card,
html body .contact-preview .form-grid,
html body .contact-preview .form-field,
html body .contact-preview .form-field.full{
    min-width:0!important;
    max-width:100%!important;
}

html body .contact-preview .contact-card{
    overflow:hidden!important;
}

html body .contact-preview .form-choice-grid{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
}

html body .contact-preview .choice-pill{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:86px!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    gap:9px!important;
    padding:12px 10px!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.18!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
}

html body .contact-preview .choice-pill .icon{
    flex:0 0 auto!important;
    width:20px!important;
    height:20px!important;
}

html body .contact-preview .choice-pill span{
    flex:1 1 90px!important;
    min-width:0!important;
    max-width:100%!important;
    display:block!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
}

@media (max-width:480px){
    html body .contact-preview .form-choice-grid{
        grid-template-columns:1fr!important;
    }
}

/* 4) Sécurité header : aucun lien Devis ne doit s'afficher dans le header. */
html body .site-header .header-quote-link,
html body .site-header a[href="contact.php"].header-quote-link{
    display:none!important;
}


/* =========================================================
   PATCH URGENT CONTACT — boutons Type de projet dans l'encart
   À coller tout en bas de assets/css/style.css si besoin.
   ========================================================= */
html body .contact-preview .contact-grid,
html body .contact-preview .contact-card,
html body .contact-preview .form-grid,
html body .contact-preview .form-field,
html body .contact-preview .form-field.full{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
}
html body .contact-preview .contact-card{
    overflow:hidden!important;
}
html body .contact-preview .form-choice-grid,
html body .contact-preview .pixel-project-choice-grid{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
}
html body .contact-preview .choice-pill,
html body .contact-preview .pixel-project-choice-pill{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:82px!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    padding:12px 10px!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.18!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
}
html body .contact-preview .choice-pill .icon,
html body .contact-preview .pixel-project-choice-pill .icon{
    flex:0 0 auto!important;
    width:20px!important;
    height:20px!important;
}
html body .contact-preview .choice-pill span,
html body .contact-preview .pixel-project-choice-pill span{
    flex:1 1 96px!important;
    min-width:0!important;
    max-width:100%!important;
    display:block!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
}
@media (max-width:520px){
    html body .contact-preview .form-choice-grid,
    html body .contact-preview .pixel-project-choice-grid{grid-template-columns:1fr!important;}
    html body .contact-preview .choice-pill,
    html body .contact-preview .pixel-project-choice-pill{min-height:64px!important;}
}


/* =========================================================
   PATCH FINAL — mobile 2 colonnes contact + why + carousel accueil
   ========================================================= */

/* Contact : toujours 2 boutons par ligne, y compris sur téléphone. */
html body .contact-preview .form-choice-grid,
html body .contact-preview .pixel-project-choice-grid{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
}
html body .contact-preview .choice-pill,
html body .contact-preview .pixel-project-choice-pill{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:72px!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    padding:10px 7px!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.12!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
}
html body .contact-preview .choice-pill .icon,
html body .contact-preview .pixel-project-choice-pill .icon{
    flex:0 0 auto!important;
    width:18px!important;
    height:18px!important;
}
html body .contact-preview .choice-pill span,
html body .contact-preview .pixel-project-choice-pill span{
    flex:1 1 72px!important;
    min-width:0!important;
    max-width:100%!important;
    display:block!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
    hyphens:auto!important;
}
@media (max-width:430px){
    html body .contact-preview .form-choice-grid,
    html body .contact-preview .pixel-project-choice-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:8px!important;
    }
    html body .contact-preview .choice-pill,
    html body .contact-preview .pixel-project-choice-pill{
        min-height:68px!important;
        padding:9px 5px!important;
        font-size:11px!important;
    }
    html body .contact-preview .choice-pill .icon,
    html body .contact-preview .pixel-project-choice-pill .icon{
        width:16px!important;
        height:16px!important;
    }
}

/* Accueil mobile : section pourquoi nous choisir en 2 encards par ligne, centrée. */
@media (max-width:720px){
    html body .why-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:12px!important;
        align-items:stretch!important;
    }
    html body .why-intro{
        grid-column:1/-1!important;
        text-align:center!important;
    }
    html body .why-intro .eyebrow{
        justify-content:center!important;
    }
    html body .why-item{
        min-width:0!important;
        padding:18px 10px!important;
        text-align:center!important;
        display:flex!important;
        flex-direction:column!important;
        align-items:center!important;
        justify-content:flex-start!important;
    }
    html body .why-item .icon{
        margin-left:auto!important;
        margin-right:auto!important;
    }
    html body .why-item h3{
        font-size:15px!important;
    }
    html body .why-item p{
        font-size:12px!important;
        line-height:1.35!important;
    }
}

/* Sécurité : la zone réalisations accueil est un slider, pas une grille. */
html body .portfolio [data-home-project-slider],
html body [data-home-project-slider] .home-project-stage,
html body [data-home-project-slider] .home-project-slider{
    width:100%!important;
    max-width:100%!important;
}
html body [data-home-project-slider] .home-project-track{
    display:flex!important;
}
html body [data-home-project-slider] .home-project-slide{
    flex:0 0 100%!important;
    min-width:100%!important;
}


/* =========================================================
   PATCH ACCUEIL — points du slider prestations sous le bouton + CTA supprimé dans index.php
   ========================================================= */
html body .hero-stage[data-service-slider] .prestation-slider > .slider-dots{
    position:static!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    transform:none!important;
    z-index:2!important;
    margin:14px auto 0!important;
    padding:0 0 2px!important;
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    gap:8px!important;
    width:auto!important;
    max-width:100%!important;
    pointer-events:auto!important;
}
html body .hero-stage[data-service-slider] .prestation-slider > .slider-dots .slider-dot{
    flex:0 0 auto!important;
}
@media (max-width:720px){
    html body .hero-stage[data-service-slider] .prestation-slider > .slider-dots{
        margin-top:12px!important;
        margin-bottom:0!important;
    }
}

/* =========================================================
   PATCH RÉALISATIONS — texte réellement HORS image
   Le bloc image et le bloc texte sont séparés dans la carte.
   ========================================================= */
html body [data-filter-wrap] .projects-row{
    align-items:stretch!important;
}

html body [data-filter-wrap] .project-card{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
    background:#070a0d!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:22px!important;
    isolation:auto!important;
}

html body [data-filter-wrap] .project-card::before{
    content:none!important;
    display:none!important;
}

html body [data-filter-wrap] .project-media{
    position:relative!important;
    z-index:1!important;
    width:100%!important;
    height:255px!important;
    min-height:255px!important;
    overflow:hidden!important;
    background:#111820!important;
    flex:0 0 auto!important;
}

html body [data-filter-wrap] .project-card .project-media > img,
html body [data-filter-wrap] .project-card .project-media > img[data-managed-image]{
    position:relative!important;
    inset:auto!important;
    z-index:1!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    object-fit:cover!important;
    object-position:50% 50%;
    border-radius:0!important;
    opacity:1!important;
}

html body [data-filter-wrap] .project-card:hover .project-media > img{
    transform:scale(1.05)!important;
}

html body [data-filter-wrap] .project-body{
    position:relative!important;
    z-index:2!important;
    width:100%!important;
    margin:0!important;
    padding:20px 22px 22px!important;
    background:linear-gradient(180deg,#070a0d,#05070a)!important;
    border-top:1px solid rgba(255,255,255,.10)!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    flex:1 1 auto!important;
}

html body [data-filter-wrap] .project-cat{
    display:block!important;
    margin:0 0 8px!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    color:var(--orange)!important;
    font-size:12px!important;
    line-height:1.1!important;
}

html body [data-filter-wrap] .project-body h3{
    color:#fff!important;
    margin:0 0 10px!important;
    font-size:22px!important;
    line-height:1.15!important;
    text-shadow:none!important;
}

html body [data-filter-wrap] .project-body p{
    color:rgba(255,255,255,.72)!important;
    margin:0!important;
    line-height:1.45!important;
    text-shadow:none!important;
}

html body [data-filter-wrap] .project-tags{
    margin-top:16px!important;
}

html body [data-filter-wrap] .project-tags span{
    background:rgba(255,255,255,.06)!important;
    border-color:rgba(255,255,255,.18)!important;
    color:rgba(255,255,255,.78)!important;
}

html body [data-filter-wrap] .project-card .admin-image-edit{
    top:10px!important;
    right:10px!important;
    z-index:30!important;
}

html body [data-filter-wrap] .project-card .admin-tags-edit{
    top:50px!important;
    right:10px!important;
}

@media (max-width:1050px){
    html body [data-filter-wrap] .project-media{
        height:235px!important;
        min-height:235px!important;
    }
}

@media (max-width:720px){
    html body [data-filter-wrap] .project-media{
        height:230px!important;
        min-height:230px!important;
    }

    html body [data-filter-wrap] .project-body{
        padding:18px!important;
    }

    html body [data-filter-wrap] .project-body h3{
        font-size:20px!important;
    }

    html body [data-filter-wrap] .project-body p{
        font-size:14px!important;
    }
}

/* =========================================================
   PATCH HEADER NOIR — 2026-06-16
   Fond du header forcé en noir, textes blancs.
   Hover + lien actif restent sur var(--orange), donc paramétrables
   depuis Admin > Apparence.
   ========================================================= */
html body .site-header,
html body .site-header.site-header-text-only,
html body header.site-header.site-header-text-only,
html body .site-header.site-header-text-only.is-scrolled{
    background:#000!important;
    background-image:none!important;
    color:#fff!important;
}
html body .site-header.site-header-text-only .main-nav,
html body .site-header.site-header-text-only [data-main-nav]{
    background:transparent!important;
    background-image:none!important;
}
html body .site-header.site-header-text-only .main-nav > a,
html body .site-header.site-header-text-only [data-main-nav] > a,
html body .site-header.site-header-text-only .phone-link,
html body .site-header.site-header-text-only .header-text-link,
html body .site-header.site-header-text-only .header-actions > a,
html body .site-header.site-header-text-only .header-actions .btn{
    color:#fff!important;
}
html body .site-header.site-header-text-only .main-nav > a:hover,
html body .site-header.site-header-text-only [data-main-nav] > a:hover,
html body .site-header.site-header-text-only .main-nav > a.is-active,
html body .site-header.site-header-text-only [data-main-nav] > a.is-active,
html body .site-header.site-header-text-only .phone-link:hover,
html body .site-header.site-header-text-only .header-text-link:hover,
html body .site-header.site-header-text-only .header-actions > a:hover,
html body .site-header.site-header-text-only .header-actions .btn:hover{
    color:var(--orange)!important;
    background:transparent!important;
    box-shadow:none!important;
}
html body .site-header.site-header-text-only .phone-link .icon,
html body .site-header.site-header-text-only .nav-toggle span{
    color:var(--orange)!important;
}
@media(max-width:1050px){
    html body .site-header.site-header-text-only .main-nav,
    html body .site-header.site-header-text-only [data-main-nav]{
        background:#000!important;
        background-image:none!important;
    }
}
