/* Isul’Admin · pétroles de la marque et orange des pictogrammes historiques. */
:root {
  --ink: #1b3e42;
  --deep: #0d2b2e;
  --teal: #32676d;
  --muted: #4b6264;
  --mist: #f2f7f8;
  --line: #d9e4e4;
  --orange: #f89522;
  --peach: #ffe4c0;
  --radius: 14px;
  --shadow: 0 10px 25px -15px rgb(13 43 46 / 30%), 0 2px 5px rgb(13 43 46 / 5%);
  --space: clamp(48px, 5.4vw, 78px);
  --e-global-color-primary: var(--ink);
  --e-global-color-secondary: var(--teal);
  --e-global-color-accent: var(--orange);
}
*, *::before, *::after { box-sizing: border-box }
html { scroll-padding-top: 18px }
body {
  margin: 0; color: var(--ink); background: #fff;
  font: 400 1rem/1.6 "Segoe UI", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto }
figure, ol, ul { margin: 0 }
a { color: var(--teal); text-underline-offset: .2em }
a:hover { color: var(--deep) }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid var(--orange); outline-offset: 4px;
}
h1, h2, h3, h4, h5, p { margin: 0 }
h1, h2, h3, h4 { font-family: inherit; color: inherit; font-weight: 650; text-wrap: pretty }
h1 { font-size: clamp(2.5rem, 3.75vw, 3.9rem); letter-spacing: -.052em; line-height: 1.04 }
h2 { font-size: clamp(1.85rem, 2.9vw, 2.8rem); letter-spacing: -.045em; line-height: 1.12 }
h3 { font-size: clamp(1.12rem, 1.55vw, 1.43rem); letter-spacing: -.029em; line-height: 1.26 }
h4 { font-size: 1.1rem; line-height: 1.35 }
p { color: var(--muted) }
.wrap, .site-header .container-fluid {
  width: min(100% - clamp(40px, 10vw, 160px), 1280px); max-width: none;
  margin-inline: auto; padding-inline: 0;
}
.surface { background: linear-gradient(150deg, var(--mist), #edf3f3 60%, #f9fbfa) }
.site-header { background: white; border-bottom: 1px solid var(--line) }
.site-header .navbar { min-height: 80px; gap: clamp(18px, 4vw, 70px) }
.site-header .navbar-brand { padding: 0; margin: 0 }
.navbar-brand img { display: block; width: 165px }
.site-header .navbar-nav { gap: clamp(10px, 1.4vw, 25px); margin-inline: auto }
.site-header .navbar-light .navbar-nav .nav-link {
  color: var(--ink); font-size: .94rem; font-weight: 550; padding: .7rem .2rem;
}
.site-header .nav-link[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 7px }
.last_list { display: flex; align-items: center; gap: .55rem; border: 1px solid #bfcecf; border-radius: 8px; padding: .52rem .8rem; background: white }
.last_list a { color: var(--ink); font-size: .86rem; font-weight: 650 }
.last_list a:first-child { color: var(--teal) }
.mast { background: linear-gradient(110deg,white 58%,#f3f7f7); border-bottom: 1px solid var(--line) }
.mast-grid { min-height: 365px; display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(18px,4vw,68px); align-items: center; padding-block: clamp(38px,4vw,64px) }
.page-index .mast-grid { min-height: 485px; grid-template-columns: 1fr 1fr }
.mast-copy { min-width: 0 }
.mast-copy h1 { margin: 15px 0 21px }
.text_highlight { color: var(--teal) }
.mast-copy > p { max-width: 60ch; font-size: clamp(1rem,1.23vw,1.15rem); line-height: 1.58; color: #405456 }
.hero-art { min-width: 0 }
.hero-art img { display: block; width: 100%; aspect-ratio: 500 / 320; object-fit: contain }
.page-index .hero-art img { aspect-ratio: 660 / 454 }
.hero_badge, .h6, .section-title > span:first-child, .article-title > span:first-child, .cta_eyebrow {
  display: block; font-family: inherit; font-size: .73rem; line-height: 1.5;
  font-weight: 700; text-transform: uppercase; letter-spacing: .125em; color: var(--teal);
}
.hero_badge_dot { display: inline-block; width: 23px; height: 3px; vertical-align: middle; margin-right: 9px; background: var(--orange) }
.btn_wrapper { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 22px }
.getstarted_btn, .get_started_btn, .readmore_btn, .back_home_btn, .appointment-btn {
  display: inline-flex; align-items: center; justify-content: center; line-height: 1.4; text-align: center;
  min-height: 46px; padding: 11px 19px; border: 1px solid transparent; border-radius: 7px;
  background: var(--orange); color: var(--deep); box-shadow: var(--shadow);
  font: 650 .96rem/1.4 "Segoe UI", system-ui, sans-serif; cursor: pointer;
}
.getstarted_btn:hover, .get_started_btn:hover, .readmore_btn:hover, .back_home_btn:hover, .appointment-btn:hover { background: #ffa843; color: var(--deep); text-decoration: none }
.aboutus_btn { font-weight: 650; padding: 10px 0; color: var(--ink) }
.aboutus_btn::after, .readmore_btn::after, .back_home_btn::after { content: "→"; margin-left: 8px }
.mast .breadcrumb { padding: 0; margin: 19px 0 0; display: flex; align-items: center; gap: 8px; background: none; font-size: .88rem }
.breadcrumb-item + .breadcrumb-item { padding: 0 }
.breadcrumb-item + .breadcrumb-item::before { content: none }
.breadcrumb .active, .breadcrumb i { color: var(--muted) }
.breadcrumb li a { color: var(--teal); text-decoration: underline }
.about-band, .enquiry { background: linear-gradient(112deg, var(--deep), var(--ink) 56%, #28555a); color: white }
.about-band { padding: 0 0 var(--space) }
.about-band p, .enquiry-copy p { color: #d8e6e6 }
.stats-grid { display: grid; grid-template-columns: repeat(4,1fr); padding-block: 28px; border-bottom: 1px solid #48696c }
.stat_strip_item { display: grid; gap: 2px; padding-left: clamp(12px,2.7vw,40px); border-left: 1px solid #48696c }
.stat_strip_item:first-child { border: 0; padding-left: 0 }
.stat_number { font-weight: 620; color: var(--orange); font-size: clamp(1.65rem,2.7vw,2.4rem); line-height: 1.1; letter-spacing: -.055em }
.stat_label { font-size: .9rem; color: #dfebeb }
.about-grid,.enquiry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(34px,6vw,88px); align-items: start }
.about-grid { padding-top: var(--space) }
.about-band .h6,.enquiry .cta_eyebrow { color: var(--peach) }
.about-intro h2 { margin: 13px 0 20px }
.about-detail h3 { font-size: 1.2rem; margin: 22px 0 8px !important }
.about-detail h3:first-child { margin-top: 0 !important }
.about-detail .readmore_btn { min-height: 35px; background: none; border: 0; box-shadow: none; color: white; padding: 0; text-decoration: underline !important; text-underline-offset: 5px }
.about-detail .readmore_btn::after { color: var(--orange) }
.catalog,.process-section,.faq-section,.enquiry,.story,.services-index,.offering-section,.pricing,.contact-section,.contact-intro { padding-block: var(--space) }
.catalog-intro { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(28px,7vw,98px) }
.catalog-heading h2,.section-title h2,.article-title h2 { margin-top: 10px }
.catalog-summary ul,.offering ul,.plan-card ul { padding: 0; list-style: none; display: grid; gap: 7px; margin-block: 15px }
.catalog-summary li,.offering li,.plan-card li { display: flex; gap: .65rem; align-items: baseline }
.catalog-summary li i,.offering li i,.plan-card li i { color: var(--teal) }
.catalog-summary .get_started_btn { background: transparent; border-color: #b4c7c7; color: var(--ink); box-shadow: none }
.catalog-summary .get_started_btn:hover { background: white }
.service-grid,.plan-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(12px,1.5vw,22px); margin-top: 35px }
.service-card,.plan-card,.process-card,.offering,.contact-card,.answer,.form-panel {
  background: white; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.service-card { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 18px 8px; padding: 15px; color: var(--ink); font-size: 1.1rem; font-weight: 650; line-height: 1.27; letter-spacing: -.025em }
.service-card:hover { text-decoration: none; border-color: #95afb1; color: var(--deep) }
.service-card img { width: 100%; grid-column: 1/-1; align-self: start }
.rise-arrow { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; background: var(--peach); font: 600 15px/1 system-ui }
.rise-arrow::before { content: "↗" }
.section-title { max-width: 780px; margin-bottom: 24px }
.section-title p,.contact-intro p,.story-prose p { margin-top: 14px }
.process-grid,.answer-grid,.contact-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px }
.process-card,.answer,.contact-card { position: relative; padding: 25px }
.process-card { display: grid; grid-template-columns: 1fr auto; gap: 12px }
.process_box_heading { font-weight: 650; font-size: 1.18rem; line-height: 1.25 }
.process_box_number { font-size: 1.6rem; line-height: 1; color: var(--teal); font-weight: 650; border-bottom: 3px solid var(--orange); padding-bottom: 4px }
.process_box_paragraph { grid-column: 1/-1 }
.faq-section .wrap { max-width: 940px }
.faq_title { margin-bottom: 28px }
.faq_accordion { border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: var(--shadow); overflow: hidden }
.faq_accordion .faq_card { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; margin: 0 }
.faq_card:last-child { border-bottom: 0 }
.faq_card_header { padding: 0; background: white; border: 0 }
.faq_btn { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; text-align: left; padding: 17px 23px; border: 0; border-radius: 0; color: var(--ink); font-weight: 650; white-space: normal }
.faq_btn:hover,.faq_btn:focus { color: var(--teal); background: var(--mist) }
.faq_btn[aria-expanded="true"] .faq_chevron { transform: rotate(180deg) }
.faq_chevron { font-size: .8em }
.faq_card_body { color: var(--muted); padding: 0 23px 20px; max-width: 86ch }
.enquiry-grid { align-items: center }
.enquiry-copy h2 { margin-block: 12px 18px }
.enquiry-copy > i { color: var(--orange); margin: 22px 0 3px }
.call_us { font-size: .85rem; color: #daeaeb }
.phone_num { display: inline-block; margin-top: 2px; font-size: 1.17rem; font-weight: 650 }
.enquiry-copy a:not(.get_started_btn) { color: white }
.form-panel { color: var(--ink); padding: clamp(22px,2.8vw,42px) }
.form-panel h3 { margin: 0 0 20px }
.form-panel .row { margin-inline: -6px }
.form-panel .row > div { padding-inline: 6px }
.form_style { width: 100%; max-width: 100%; padding: 11px 12px; margin: 0 0 12px; border: 1px solid #a7bcbe; border-radius: 6px; background: #fbfdfc; color: var(--ink); min-height: 45px; font: inherit }
textarea.form_style { resize: vertical; display: block }
.form_style::placeholder { color: #576b6d; opacity: 1 }
.form_button_wrapper { text-align: left !important }
.site-footer { padding-top: 48px; background: var(--deep); color: white; border-top: 1px solid #3c6063 }
.footer-grid { display: grid; grid-template-columns: 1.35fr .7fr .7fr 1.15fr; gap: clamp(20px,3vw,50px) }
.footer-grid h4 { margin-bottom: 13px }
.footer-grid p,.footer-grid a,.copyright,.copyright a { color: #d5e3e3 }
.footer-grid a:hover,.copyright a:hover { color: white }
.footer-grid ul { margin: 0; list-style: none; padding: 0; font-size: .93rem }
.footer-grid li { margin-bottom: 7px }
.footer-about img { display: block; width: 150px; margin-bottom: 17px }
.contact_col i { color: var(--orange); width: 21px }
.copyright { margin-top: 32px; border-top: 1px solid #36575a; padding: 18px 0; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: .83rem }
.copyright p { color: inherit }

/* Inner pages use the same typography, raised cards and illustration family. */
.story .wrap { display: grid; grid-template-columns: .8fr 1.2fr; gap: 30px clamp(30px,5vw,80px); align-items: start }
.article-title { position: sticky; top: 24px }
.story-prose p:first-child { margin-top: 0 }
.answer-grid { grid-column: 1/-1 }
.answer p { margin-top: 12px }
.story .about_box { grid-column: 1/-1; display: flex; align-items: baseline; background: var(--ink); color: white; border-radius: var(--radius); padding: 19px 25px }
.about_box .rating,.about_box .plus_sign { color: var(--orange); font-size: 2rem; font-weight: 650 }
.about_box .sub_p { margin: 0 0 0 10px; color: white }
.services-index .wrap > p { max-width: 86ch; font-size: 1.06rem }
.services-quick-nav { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px }
.services-quick-nav-btn { border-radius: 6px; padding: 7px 12px; border: 1px solid #b9cbcc; background: white; color: var(--ink); font-size: .9rem; font-weight: 550; text-decoration: none }
.services-quick-nav-btn:hover { background: var(--peach); text-decoration: none }
.offering-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; align-items: stretch }
.offering { display: flex; flex-direction: column; padding: clamp(18px,2vw,32px); gap: 19px }
.offering > img { width: 100%; height: clamp(105px,11vw,140px); object-fit: cover; border-radius: 8px }
.offering-copy { display: flex; flex-direction: column; flex: 1 }
.offering h2 { font-size: clamp(1.45rem,2vw,1.95rem); margin-bottom: 10px }
.offering .btn_wrapper { margin-top: auto; padding-top: 5px }
.offering .get_started_btn { background: var(--peach); color: var(--ink); box-shadow: none }
.offering .get_started_btn:hover { background: var(--orange) }
.pricing-note { padding: clamp(22px,2.5vw,36px); background: var(--mist); border-radius: var(--radius); border-left: 4px solid var(--orange) }
.pricing-note p { margin-top: 8px }
.plan-card { padding: clamp(17px,1.8vw,27px); display: flex; flex-direction: column; align-items: start; border-top: 4px solid var(--orange) }
.plan-card h3 { color: var(--teal); font-size: .86rem; letter-spacing: .09em }
.plan-card .formula-subtitle { margin-top: 10px; min-height: 3.3em }
.plan-card p:has(>strong) { color: var(--ink); margin-block: 8px 0 }
.plan-card p > strong { font-size: clamp(1.1rem,1.55vw,1.5rem); letter-spacing: -.045em }
.plan-card ul { flex: 1 }
.plan-card .btn_wrapper { margin-top: 12px }
.comparatif_section,.simulateur_section { padding-block: var(--space); background: var(--mist) }
.simulateur_section { background: white }
.comparatif_section .container,.simulateur_section .container { max-width: 1250px }
.comparatif_section h2,.simulateur_section h2 { font: 650 clamp(1.85rem,2.9vw,2.8rem)/1.12 "Segoe UI",system-ui,sans-serif; color: var(--ink); margin-top: 10px }
.comparatif_section .row + .row,.simulateur_section .container > .row + .row { margin-top: 30px }
.comparatif_card,.simulateur_wrapper,.simulateur_result_card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--line) }
.comparatif_card--embauche,.simulateur_result_card--embauche { border-top: 4px solid var(--teal) }
.comparatif_card--isuladmin,.simulateur_result_card--isuladmin { border-top: 4px solid var(--orange) }
.comparatif_card h3,.comparatif_total,.comparatif_stat_number,.simulateur_result_amount,.simulateur_eco_amount { font-family: inherit }
.comparatif_card h3,.simulateur_result_card .simulateur_result_amount { color: var(--ink) }
.comparatif_total--green { color: var(--deep); background: var(--peach) }
.comparatif_total--red { color: var(--ink); background: var(--mist) }
.comparatif_bandeau,.simulateur_economie { background: linear-gradient(120deg,var(--deep),var(--teal)); border-radius: var(--radius) }
.comparatif_stat_number,.simulateur_eco_amount { color: #ffae51 }
.comparatif_note,.comparatif_subtitle,.simulateur_result_label,.simulateur_result_detail,.simulateur_range_labels { color: var(--muted) }
.simulateur_input_group label strong { color: var(--ink); background: var(--peach) }
.simulateur_section .text-center > .getstarted_btn { margin-top: 24px }
.contact-intro .wrap { max-width: 880px }
.contact-grid { grid-template-columns: repeat(3,minmax(0,1fr)) }
.contact-card > i { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 10px; background: var(--peach); color: var(--ink); margin-bottom: 15px }
.contact-card p { margin-top: 7px; overflow-wrap: anywhere }
.contact-card a { font-weight: 600 }
.map-wrap { background: var(--mist); padding: 0 0 var(--space) }
.map-wrap iframe { display: block; width: min(calc(100% - 40px),1160px); margin-inline: auto; height: clamp(260px,31vw,425px); border: 1px solid var(--line); border-radius: var(--radius) }
.error-page { min-height: 100vh; display: grid; place-items: center; padding: 30px; background: linear-gradient(145deg,white,var(--mist)) }
.error_content { max-width: 550px; background: white; padding: clamp(25px,5vw,70px); border-radius: 18px; border: 1px solid var(--line); box-shadow: var(--shadow) }
.error_content img { width: 156px }
.error_span { display: flex; align-items: center; gap: .04em; margin: 30px 0 18px; color: var(--ink); font-size: clamp(5rem,10vw,9rem); font-weight: 650; line-height: 1 }
.error_span i { display: inline-block; width: .68em; height: .78em; border-radius: 50%; border: .09em solid var(--orange) }
.error_span i::before { content: none }
.error_content h4 { font-size: 1.6rem; margin-bottom: 12px }
@media (max-width: 991px) {
  .wrap,.site-header .container-fluid { width: calc(100% - 48px) }
  .site-header .navbar { gap: 0; min-height: 68px }
  .site-header .navbar-toggler { width: 42px; height: 40px; display: flex; flex-direction: column; gap: 4px; justify-content: center; align-items: center; padding: 0; border: 1px solid #b6c9ca; border-radius: 7px }
  .site-header .navbar-light .navbar-toggler-icon { width: 20px; height: 2px; background: var(--ink); border-radius: 2px }
  .navbar-collapse { padding: 0 }
  .site-header .navbar-nav { padding-top: 10px; gap: 0 }
  .last_list { display: inline-flex; margin: 6px 0 15px !important }
  .service-grid,.plan-grid { grid-template-columns: repeat(2,minmax(0,1fr)) }
  .footer-grid { grid-template-columns: 1fr 1fr }
  .hero-art { margin: auto 0 }
  .plan-card .formula-subtitle { min-height: auto }
}
@media (max-width: 749px) {
  body { font-size: 1rem }
  .wrap,.site-header .container-fluid { width: calc(100% - 38px) }
  .navbar-brand img { width: 144px }
  .mast-grid,.page-index .mast-grid { min-height: auto; padding-block: 36px 27px; grid-template-columns: 1fr; gap: 20px }
  h1 { font-size: clamp(2.1rem,7.8vw,3.4rem) }
  .mast-copy h1 { margin: 12px 0 14px }
  .hero-art { width: min(100%,520px); margin-inline: auto }
  .hero-art img { max-height: 235px }
  .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 19px 12px }
  .stat_strip_item:nth-child(3) { border: 0; padding: 0 }
  .about-grid,.enquiry-grid,.catalog-intro,.story .wrap { grid-template-columns: 1fr; gap: 23px }
  .about-detail h3 { margin-top: 16px !important }
  .article-title { position: static }
  .answer-grid,.process-grid,.contact-grid,.offering-grid { grid-template-columns: 1fr }
  .process-card,.contact-card,.answer { padding: 19px }
  .faq_btn { padding: 15px; font-size: .98rem }
  .faq_card_body { padding-inline: 15px }
  .enquiry .cta_eyebrow { margin-top: 0 }
  .enquiry .form-panel { padding: 18px }
  .offering-grid { gap: 15px }
  .offering > img { object-fit: contain; background: var(--mist); height: 107px }
  .footer-grid { gap: 24px }
  .copyright { flex-direction: column }
  .comparatif_card { height: auto; margin-bottom: 16px }
  .comparatif_section .row + .row,.simulateur_section .container > .row + .row { margin-top: 16px }
}
@media (max-width: 460px) {
  .service-grid { gap: 9px }
  .service-card { grid-template-columns: 1fr; padding: 10px; font-size: .96rem; gap: 10px; align-content: start }
  .rise-arrow { width: 20px; height: 20px }
  .plan-grid { grid-template-columns: 1fr }
  .footer-grid { grid-template-columns: 1fr 1fr }
  .footer-about,.contact_col { grid-column: 1/-1 }
  .comparatif_list li { gap: 8px }
  .comparatif_card,.simulateur_wrapper { padding: 19px 15px }
}
