﻿/* ================================================================
   IT-DIRECT - Design System v2.0  |  Premium AI Automation Website
   ================================================================ */

/* 1. Tokens */
:root {
  --dark:#08152A; --dark-2:#0F2040; --orange:#F55D2C; --orange-dark:#D4451A; --orange-light:#FF7D50;
  --white:#FFFFFF; --bg:#F6F8FC; --bg-2:#EEF1F8; --text:#0D1C30; --muted:#6B7A90; --border:#DDE3EE;
  --grad-orange:linear-gradient(135deg,#FF7D50 0%,#F55D2C 50%,#D4451A 100%);
  --grad-dark:linear-gradient(160deg,#0F2040 0%,#08152A 100%);
  --s1:0 2px 8px rgba(8,21,42,.06); --s2:0 8px 32px rgba(8,21,42,.10); --s3:0 24px 64px rgba(8,21,42,.16);
  --s-orange:0 8px 32px rgba(245,93,44,.30);
  --container:1160px; --r-sm:8px; --r-md:14px; --r-lg:24px;
  --f-head:'Space Grotesk',system-ui,sans-serif; --f-body:'Inter',system-ui,sans-serif;
}

/* 2. Reset */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}}
body{font-family:var(--f-body);color:var(--text);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{max-width:100%;display:block;} a{color:inherit;text-decoration:none;} button{font-family:inherit;cursor:pointer;border:none;background:none;} ul{list-style:none;}

/* 3. Typography */
h1,h2,h3,h4{font-family:var(--f-head);font-weight:700;line-height:1.1;letter-spacing:-.02em;}
h1{font-size:clamp(2.2rem,5.5vw,3.8rem);}
h2{font-size:clamp(1.8rem,3.5vw,2.8rem);}
h3{font-size:1.15rem;font-weight:600;letter-spacing:-.01em;}
p{line-height:1.65;}
.section-label{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--orange);margin-bottom:16px;}
.section-label::before{content:'';width:18px;height:2px;background:var(--orange);border-radius:2px;flex-shrink:0;}
.gradient-text{background:var(--grad-orange);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* 4. Layout */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 24px;}
section{padding:96px 0;}
@media(max-width:768px){section{padding:64px 0;}}

/* 5. Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-body);font-weight:600;font-size:.95rem;padding:14px 28px;border-radius:var(--r-sm);border:2px solid transparent;transition:all .2s ease;cursor:pointer;white-space:nowrap;}
.btn:focus-visible{outline:3px solid var(--orange);outline-offset:3px;}
.btn-orange{background:var(--grad-orange);color:var(--white);box-shadow:var(--s-orange);}
.btn-orange:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(245,93,44,.4);}
.btn-ghost-light{background:rgba(255,255,255,.08);color:var(--white);border-color:rgba(255,255,255,.22);backdrop-filter:blur(8px);}
.btn-ghost-light:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.4);transform:translateY(-1px);}

/* 6. Navigation */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .3s,box-shadow .3s;}
.nav.scrolled{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--border),var(--s1);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 0;}
.logo{display:flex;align-items:center;gap:10px;font-family:var(--f-head);font-size:1.1rem;font-weight:700;color:var(--white);transition:color .3s;}
.nav.scrolled .logo{color:var(--text);}
.logo-cutout{fill:#F5F7FA;}
.nav-links{display:flex;align-items:center;gap:32px;}
.nav-links a{font-size:.9rem;font-weight:500;color:rgba(255,255,255,.7);transition:color .2s;}
.nav-links a:hover,.nav-links a.active{color:var(--white);}
.nav.scrolled .nav-links a{color:var(--muted);}
.nav.scrolled .nav-links a:hover,.nav.scrolled .nav-links a.active{color:var(--text);}
.nav-actions{display:flex;align-items:center;gap:12px;}
.nav.scrolled .btn-ghost-light{background:transparent;color:var(--text);border-color:var(--border);backdrop-filter:none;}
.nav.scrolled .btn-ghost-light:hover{background:var(--bg);}
.nav-hamburger{display:none;flex-direction:column;gap:5px;padding:4px;}
.nav-hamburger span{display:block;width:24px;height:2px;background:var(--white);border-radius:2px;transition:all .3s;}
.nav.scrolled .nav-hamburger span{background:var(--text);}
@media(max-width:900px){
  .nav-links{display:none;} .nav-hamburger{display:flex;} .nav-actions .btn{display:none;}
  .nav-links.mobile-open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(8,21,42,.97);padding:20px 24px 28px;gap:18px;border-top:1px solid rgba(255,255,255,.08);}
  .nav.scrolled .nav-links.mobile-open{background:var(--white);border-top-color:var(--border);}
  .nav.scrolled .nav-links.mobile-open a{color:var(--text);}
}

/* 7. Hero */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;background:var(--grad-dark);overflow:hidden;padding-top:72px;}
.hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.05) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;}
.hero-orb{position:absolute;border-radius:50%;filter:blur(100px);pointer-events:none;}
.hero-orb-1{width:700px;height:700px;background:radial-gradient(circle,rgba(245,93,44,.18) 0%,transparent 70%);top:-250px;right:-150px;}
.hero-orb-2{width:500px;height:500px;background:radial-gradient(circle,rgba(30,77,160,.25) 0%,transparent 70%);bottom:-150px;left:-150px;}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;padding:80px 0;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(245,93,44,.1);border:1px solid rgba(245,93,44,.22);color:var(--orange-light);font-size:.78rem;font-weight:600;padding:6px 14px;border-radius:100px;margin-bottom:24px;letter-spacing:.03em;}
.badge-dot{width:6px;height:6px;border-radius:50%;background:var(--orange);animation:pulse-dot 2s ease-in-out infinite;}
@keyframes pulse-dot{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.5);opacity:.5;}}
.hero-title{color:var(--white);margin-bottom:24px;}
.hero-desc{font-size:1.1rem;color:rgba(255,255,255,.62);max-width:500px;margin-bottom:36px;line-height:1.75;}
.hero-desc strong{color:rgba(255,255,255,.85);font-weight:600;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:40px;}
.hero-proof{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.78rem;color:rgba(255,255,255,.38);}
.hero-proof span::before{content:"check ";color:var(--orange);}

/* Workflow card */
.hero-visual{position:relative;}
.workflow-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);padding:28px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 40px 80px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.08);}
.wf-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08);}
.wf-title{font-family:var(--f-head);font-size:.9rem;font-weight:600;color:var(--white);}
.wf-status{display:flex;align-items:center;gap:6px;font-size:.74rem;color:#4ADE80;font-weight:500;}
.wf-status-dot{width:6px;height:6px;border-radius:50%;background:#4ADE80;animation:pulse-dot 2s infinite;}
.wf-steps{display:flex;flex-direction:column;}
.wf-step{display:flex;align-items:flex-start;gap:14px;padding:12px 0;position:relative;}
.wf-step:not(:last-child)::after{content:'';position:absolute;left:15px;top:44px;width:2px;height:100%;background:rgba(255,255,255,.07);}
.wf-step.active:not(:last-child)::after{background:linear-gradient(to bottom,rgba(245,93,44,.5),rgba(255,255,255,.07));}
.wf-icon{width:32px;height:32px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:.88rem;flex-shrink:0;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);color:rgba(255,255,255,.35);}
.wf-step.completed .wf-icon{background:rgba(74,222,128,.12);border-color:rgba(74,222,128,.3);color:#4ADE80;}
.wf-step.active .wf-icon{background:rgba(245,93,44,.14);border-color:rgba(245,93,44,.35);color:var(--orange-light);animation:glow-pulse 2s ease-in-out infinite;}
@keyframes glow-pulse{0%,100%{box-shadow:0 0 0 0 rgba(245,93,44,0);}50%{box-shadow:0 0 18px 4px rgba(245,93,44,.22);}}
.wf-info{display:flex;flex-direction:column;gap:2px;padding-top:4px;}
.wf-info strong{font-size:.86rem;font-weight:600;color:var(--white);}
.wf-info small{font-size:.73rem;color:rgba(255,255,255,.38);}
.wf-step.active .wf-info strong{color:var(--orange-light);}
.wf-footer{margin-top:24px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);font-size:.78rem;color:rgba(255,255,255,.38);}
.wf-footer strong{color:var(--orange-light);}
.float-badges{position:absolute;inset:0;pointer-events:none;}
.float-badge{position:absolute;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.75);font-size:.7rem;font-weight:600;padding:6px 13px;border-radius:100px;backdrop-filter:blur(8px);animation:float var(--dur,4s) ease-in-out var(--del,0s) infinite;}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
@media(max-width:1020px){.hero-grid{grid-template-columns:1fr;gap:52px;padding:60px 0;}.hero-desc{max-width:100%;}.float-badges{display:none;}}
@media(max-width:600px){.hero-title{font-size:2.1rem;}}

/* 8. Stats */
.stats-strip{background:var(--white);border-bottom:1px solid var(--border);padding:44px 0;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;}
.stat-item{text-align:center;}
.stat-value{font-family:var(--f-head);font-size:2.4rem;font-weight:700;color:var(--text);line-height:1;margin-bottom:8px;}
.stat-value .accent{color:var(--orange);}
.stat-label{font-size:.82rem;color:var(--muted);line-height:1.4;}
@media(max-width:640px){.stats-grid{grid-template-columns:repeat(2,1fr);gap:28px;}}

/* 9. Services */
.services-section{background:var(--bg);}
.section-header{margin-bottom:52px;}
.section-header p{font-size:1.05rem;color:var(--muted);max-width:540px;margin-top:14px;line-height:1.7;}
.services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;}
.service-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:36px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.service-card:hover{transform:translateY(-5px);box-shadow:var(--s3);border-color:rgba(245,93,44,.18);}
.service-icon{width:52px;height:52px;border-radius:var(--r-md);background:var(--dark);display:flex;align-items:center;justify-content:center;margin-bottom:22px;transition:background .2s;}
.service-card:hover .service-icon{background:var(--orange);}
.service-icon svg{width:22px;height:22px;stroke:var(--orange);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:stroke .2s;}
.service-card:hover .service-icon svg{stroke:var(--white);}
.service-card h3{margin-bottom:10px;}
.service-card p{font-size:.9rem;color:var(--muted);line-height:1.7;}
.service-card p strong{color:var(--text);}
.service-gain{display:inline-flex;align-items:center;gap:5px;margin-top:18px;font-size:.75rem;font-weight:600;color:#059669;background:rgba(5,150,105,.07);border:1px solid rgba(5,150,105,.14);padding:4px 12px;border-radius:100px;}
.service-gain::before{content:"up ";}
@media(max-width:720px){.services-grid{grid-template-columns:1fr;}}

/* 10. Cas d'usage */
.use-cases-section{background:var(--white);}
.use-cases-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:52px;}
.use-case-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:32px;transition:transform .25s,box-shadow .25s;}
.use-case-card:hover{transform:translateY(-3px);box-shadow:var(--s2);}
.uc-sector{display:flex;align-items:center;gap:10px;margin-bottom:18px;}
.uc-sector-icon{width:40px;height:40px;border-radius:var(--r-sm);background:var(--dark);display:flex;align-items:center;justify-content:center;font-size:1.1rem;}
.uc-sector-label{font-size:.73rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);}
.uc-headline{font-family:var(--f-head);font-size:1.05rem;font-weight:700;color:var(--text);margin-bottom:10px;}
.uc-desc{font-size:.87rem;color:var(--muted);margin-bottom:20px;line-height:1.65;}
.uc-metrics{display:flex;gap:12px;}
.uc-metric{flex:1;background:var(--white);border:1px solid var(--border);border-radius:var(--r-sm);padding:12px 10px;text-align:center;}
.uc-metric-value{font-family:var(--f-head);font-size:1.3rem;font-weight:700;color:var(--orange);}
.uc-metric-label{font-size:.68rem;color:var(--muted);margin-top:3px;line-height:1.3;}
@media(max-width:720px){.use-cases-grid{grid-template-columns:1fr;}}

/* 11. Processus */
.process-section{background:var(--dark);position:relative;overflow:hidden;}
.process-section::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px;}
.process-section .section-label{color:var(--orange-light);}
.process-section h2{color:var(--white);}
.process-section .section-header p{color:rgba(255,255,255,.48);}
.process-steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);margin-top:56px;}
.process-steps::before{content:'';position:absolute;top:23px;left:11%;right:11%;height:2px;background:linear-gradient(to right,var(--orange) 0%,rgba(245,93,44,.15) 100%);z-index:0;}
.process-step{position:relative;z-index:1;padding-right:20px;}
.step-number{width:48px;height:48px;border-radius:50%;background:var(--orange);color:var(--white);font-family:var(--f-head);font-weight:700;font-size:1rem;display:flex;align-items:center;justify-content:center;margin-bottom:22px;box-shadow:var(--s-orange);}
.process-step h3{color:var(--white);margin-bottom:10px;font-size:1rem;}
.process-step p{font-size:.86rem;color:rgba(255,255,255,.48);line-height:1.65;}
.process-step p strong{color:rgba(255,255,255,.7);}
.step-tag{display:inline-block;margin-top:14px;font-size:.72rem;font-weight:600;color:var(--orange-light);background:rgba(245,93,44,.1);border:1px solid rgba(245,93,44,.2);padding:3px 10px;border-radius:100px;}
@media(max-width:900px){.process-steps{grid-template-columns:repeat(2,1fr);gap:36px;}.process-steps::before{display:none;}.process-step{padding-right:0;}}
@media(max-width:560px){.process-steps{grid-template-columns:1fr;}}

/* 12. Comparaison */
.compare-section{background:var(--bg);}
.compare-table{margin-top:52px;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--s1);}
.compare-row{display:grid;grid-template-columns:1.5fr 1fr 1fr;border-bottom:1px solid var(--border);}
.compare-row:last-child{border-bottom:none;}
.compare-row > div{padding:16px 24px;font-size:.9rem;}
.compare-row.head{background:var(--dark);}
.compare-row.head > div{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.5);}
.compare-row.head .cmp-itdirect{color:var(--orange-light);}
.cmp-yes{color:#059669;font-weight:600;}
.cmp-no{color:var(--muted);}
.compare-row:not(.head):hover{background:var(--bg-2);}
@media(max-width:640px){.compare-row{grid-template-columns:1fr;}.compare-row > div:not(:first-child){border-top:1px dashed var(--border);}}

/* 13. FAQ */
.faq-section{background:var(--white);}
.faq-grid{margin-top:52px;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;}
.faq-item{border-bottom:1px solid var(--border);}
.faq-item:last-child{border-bottom:none;}
.faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 28px;text-align:left;font-family:var(--f-body);font-size:.98rem;font-weight:600;color:var(--text);transition:background .15s,color .15s;}
.faq-question:hover{background:var(--bg);}
.faq-question.open{color:var(--orange);background:rgba(245,93,44,.03);}
.faq-chevron{flex-shrink:0;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);display:flex;align-items:center;justify-content:center;transition:transform .35s ease,border-color .2s,background .2s;}
.faq-chevron svg{width:12px;height:12px;stroke:var(--muted);fill:none;stroke-width:2.5;stroke-linecap:round;transition:stroke .2s;}
.faq-question.open .faq-chevron{transform:rotate(180deg);border-color:var(--orange);background:rgba(245,93,44,.08);}
.faq-question.open .faq-chevron svg{stroke:var(--orange);}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .42s cubic-bezier(.4,0,.2,1);}
.faq-answer-inner{padding:0 28px 24px;font-size:.9rem;color:var(--muted);line-height:1.75;}
@media(max-width:600px){.faq-question{padding:18px 20px;}.faq-answer-inner{padding:0 20px 20px;}}

/* 14. CTA */
.cta-section{background:var(--dark);text-align:center;position:relative;overflow:hidden;}
.cta-section::before{content:'';position:absolute;top:-250px;left:50%;transform:translateX(-50%);width:800px;height:800px;background:radial-gradient(circle,rgba(245,93,44,.14) 0%,transparent 65%);pointer-events:none;}
.cta-section .section-label{color:var(--orange-light);}
.cta-section h2{color:var(--white);position:relative;}
.cta-section p{color:rgba(255,255,255,.5);max-width:480px;margin:16px auto 40px;font-size:1.05rem;}
.cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;position:relative;}

/* 15. Contact */
.contact-section{background:var(--bg);}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;margin-top:52px;}
.contact-form{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:40px;box-shadow:var(--s1);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.field{margin-bottom:20px;}
.field label{display:block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:7px;}
.field input,.field textarea,.field select{width:100%;font-family:var(--f-body);font-size:.93rem;padding:12px 16px;border:1.5px solid var(--border);border-radius:var(--r-sm);background:var(--bg);color:var(--text);transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none;}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(245,93,44,.1);}
.field textarea{resize:vertical;min-height:120px;}
#form-status{display:none;padding:14px 18px;background:rgba(5,150,105,.07);border:1px solid rgba(5,150,105,.18);border-radius:var(--r-sm);color:#059669;font-size:.9rem;margin-top:16px;line-height:1.5;}
.contact-info{display:flex;flex-direction:column;gap:20px;}
.contact-info-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:26px 28px;transition:box-shadow .2s;}
.contact-info-card:hover{box-shadow:var(--s2);}
.ci-icon{width:42px;height:42px;border-radius:var(--r-sm);background:var(--dark);display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.ci-icon svg{width:18px;height:18px;stroke:var(--orange);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.ci-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:4px;}
.ci-value{font-size:1rem;font-weight:600;color:var(--text);}
.ci-value a{transition:color .2s;}
.ci-value a:hover{color:var(--orange);}
.card-dark{background:var(--dark)!important;border-color:rgba(255,255,255,.06)!important;}
.card-dark .ci-label{color:rgba(255,255,255,.4);}
.card-dark .big-value{font-family:var(--f-head);font-size:1.5rem;font-weight:700;color:var(--white);}
.card-dark small{font-size:.82rem;color:rgba(255,255,255,.35);margin-top:4px;display:block;}
@media(max-width:800px){.contact-grid{grid-template-columns:1fr;}.form-row{grid-template-columns:1fr;}}

/* 16. Footer */
footer{background:var(--dark);color:rgba(255,255,255,.45);padding:64px 0 32px;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-bottom:48px;}
.footer-logo{display:flex;align-items:center;gap:10px;font-family:var(--f-head);font-weight:700;font-size:1.05rem;color:var(--white);margin-bottom:14px;}
.footer-brand p{font-size:.87rem;line-height:1.7;max-width:280px;}
.footer-tagline{font-size:.75rem!important;color:rgba(255,255,255,.22)!important;margin-top:10px!important;}
.footer-col h5{font-family:var(--f-head);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.88);margin-bottom:16px;}
.footer-col a{display:block;font-size:.87rem;color:rgba(255,255,255,.42);margin-bottom:10px;transition:color .2s;}
.footer-col a:hover{color:var(--white);}
.footer-cta-link{color:var(--orange-light)!important;font-weight:600;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.8rem;}
.footer-bottom a{color:rgba(255,255,255,.3);transition:color .2s;}
.footer-bottom a:hover{color:rgba(255,255,255,.7);}
@media(max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.footer-grid{grid-template-columns:1fr;}.footer-bottom{flex-direction:column;text-align:center;}}

/* 17. Reveal animations */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .65s ease,transform .65s ease;}
.reveal.revealed{opacity:1;transform:none;}
.reveal-delay-1{transition-delay:.1s;}
.reveal-delay-2{transition-delay:.2s;}
.reveal-delay-3{transition-delay:.3s;}

/* ═══════════════════════════════════════════════════════════════
   CTA SECTION
════════════════════════════════════════════════════════════════ */
.cta-section { padding: 100px 0; background: var(--grad-dark); position: relative; overflow: hidden; }
.cta-inner { display: grid; grid-template-columns: 1fr 420px; gap: 64px; align-items: center; position: relative; z-index: 1; }
.cta-glow { position: absolute; inset: 0; background: radial-gradient(ellipse 600px 400px at 20% 50%, rgba(245,93,44,.18) 0%, transparent 70%); pointer-events: none; }
.cta-badge { display: inline-block; background: rgba(245,93,44,.2); border: 1px solid rgba(245,93,44,.4); color: var(--orange-light); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 5px 14px; border-radius: 100px; margin-bottom: 20px; }
.cta-content h2 { font-size: clamp(2rem,3.5vw,2.8rem); color: #fff; line-height: 1.15; margin-bottom: 18px; }
.cta-content p { color: rgba(255,255,255,.75); font-size: 1.05rem; line-height: 1.7; margin-bottom: 28px; }
.cta-list { list-style: none; margin-bottom: 36px; display: flex; flex-direction: column; gap: 10px; }
.cta-list li { color: rgba(255,255,255,.85); font-size: .95rem; padding-left: 26px; position: relative; }
.cta-list li::before { content: "\2713"; position: absolute; left: 0; color: var(--orange-light); font-weight: 700; }
.cta-actions { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.btn-ghost-light { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.2); color: #fff; padding: 13px 22px; display: inline-flex; align-items: center; gap: 8px; border-radius: var(--r-md); font-weight: 600; font-size: .9rem; transition: background .2s; }
.btn-ghost-light:hover { background: rgba(255,255,255,.15); color: #fff; }
.btn-lg { padding: 16px 32px; font-size: 1rem; }

/* CTA Visual Card */
.cta-visual { display: flex; justify-content: center; }
.cta-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: var(--r-lg); padding: 28px; width: 100%; max-width: 340px; backdrop-filter: blur(12px); }
.cta-card-header { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.7); font-size: .875rem; font-weight: 600; margin-bottom: 24px; }
.cta-card-body { display: flex; flex-direction: column; gap: 14px; margin-bottom: 24px; }
.audit-item { display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: var(--r-sm); font-size: .9rem; }
.audit-item.done { background: rgba(255,255,255,.06); color: rgba(255,255,255,.7); }
.audit-item.active { background: rgba(245,93,44,.15); border: 1px solid rgba(245,93,44,.3); color: #fff; font-weight: 600; }
.audit-item.pending { background: rgba(255,255,255,.03); color: rgba(255,255,255,.35); }
.audit-icon { font-size: 1rem; width: 22px; text-align: center; flex-shrink: 0; }
.audit-item.done .audit-icon { color: #4ade80; }
.audit-item.active .audit-icon { color: var(--orange-light); }
@keyframes spin { to { transform: rotate(360deg); } }
.spin { display: inline-block; animation: spin 1.5s linear infinite; }
.cta-card-footer { text-align: center; }
.saving { background: var(--grad-orange); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-weight: 700; font-size: 1rem; }

/* ═══════════════════════════════════════════════════════════════
   CONTACT SECTION
════════════════════════════════════════════════════════════════ */
.contact-section { padding: 100px 0; background: var(--bg); }
.contact-grid { display: grid; grid-template-columns: 1fr 380px; gap: 64px; align-items: start; }

/* Form */
.contact-form-wrap { background: #fff; border: 1px solid var(--border); border-radius: var(--r-lg); padding: 40px; box-shadow: var(--s2); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }
.form-group label { font-size: .875rem; font-weight: 600; color: var(--text); }
.form-group input,
.form-group select,
.form-group textarea { border: 1.5px solid var(--border); border-radius: var(--r-sm); padding: 11px 14px; font-family: var(--f-body); font-size: .95rem; color: var(--text); background: var(--bg); transition: border-color .2s, box-shadow .2s; outline: none; width: 100%; box-sizing: border-box; }
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(245,93,44,.12); }
.form-group textarea { resize: vertical; min-height: 110px; }
.btn-full { width: 100%; justify-content: center; margin-top: 4px; }
.form-status { margin-top: 16px; padding: 14px 18px; background: #f0fdf4; border: 1px solid #86efac; border-radius: var(--r-sm); color: #15803d; font-size: .9rem; line-height: 1.5; }

/* Contact Info */
.contact-info { display: flex; flex-direction: column; gap: 16px; }
.info-card { background: #fff; border: 1px solid var(--border); border-radius: var(--r-md); padding: 20px 22px; display: flex; align-items: flex-start; gap: 16px; box-shadow: var(--s1); }
.info-icon { width: 42px; height: 42px; background: rgba(245,93,44,.08); border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center; color: var(--orange); flex-shrink: 0; }
.info-body { display: flex; flex-direction: column; gap: 4px; }
.info-body h4 { font-size: .95rem; font-weight: 700; color: var(--text); margin: 0; }
.info-body a { color: var(--orange); font-weight: 600; font-size: .9rem; text-decoration: none; }
.info-body a:hover { text-decoration: underline; }
.info-body span { color: var(--muted); font-size: .825rem; }
.info-card.guarantee { background: linear-gradient(135deg, #fff7f4 0%, #fff 100%); border-color: rgba(245,93,44,.2); align-items: flex-start; flex-direction: column; gap: 12px; }
.guarantee-icon { width: 36px; height: 36px; background: var(--grad-orange); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 1.1rem; flex-shrink: 0; }
.info-card.guarantee .info-body { gap: 6px; }
.info-card.guarantee .info-body p { color: var(--muted); font-size: .875rem; line-height: 1.6; margin: 0; }
.info-card.guarantee { flex-direction: row; }

/* ═══════════════════════════════════════════════════════════════
   FOOTER
════════════════════════════════════════════════════════════════ */
.footer { background: var(--dark); color: rgba(255,255,255,.7); padding: 72px 0 0; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1.5fr; gap: 48px; padding-bottom: 56px; border-bottom: 1px solid rgba(255,255,255,.08); }
.footer-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; margin-bottom: 16px; }
.footer-logo-text { font-family: var(--f-head); font-size: 1.25rem; font-weight: 800; color: #fff; letter-spacing: .02em; }
.footer-tagline { font-size: .9rem; line-height: 1.65; margin-bottom: 18px; color: rgba(255,255,255,.55); }
.footer-contact-mini { display: flex; flex-direction: column; gap: 6px; }
.footer-contact-mini a { color: var(--orange-light); font-size: .875rem; text-decoration: none; font-weight: 500; }
.footer-contact-mini a:hover { text-decoration: underline; }
.footer-nav-col h5 { font-size: .8rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.4); margin-bottom: 16px; }
.footer-nav-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-nav-col ul li a { color: rgba(255,255,255,.65); font-size: .9rem; text-decoration: none; transition: color .2s; }
.footer-nav-col ul li a:hover { color: var(--orange-light); }
.footer-cta-text { font-size: .875rem; line-height: 1.6; color: rgba(255,255,255,.55); margin-bottom: 16px; }
.btn-sm { padding: 10px 20px; font-size: .875rem; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; padding: 24px 0; font-size: .825rem; color: rgba(255,255,255,.35); }
.footer-made { font-style: italic; }

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE / TABLET
════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .cta-inner { grid-template-columns: 1fr; }
  .cta-visual { display: none; }
  .contact-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
}

@media (max-width: 768px) {
  .form-row { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
  .cta-actions { flex-direction: column; align-items: stretch; }
  .cta-actions .btn { text-align: center; justify-content: center; }
}
