/* Calculatrice.com — page d’accueil v1, 16 août 2026.
   Même famille de composants que /math/, composition propre à la home OCCS. */

body.cr-home-page{
  --home-orange:#ffa300;
  --home-orange-dark:#8a4b00;
  --home-orange-soft:#fff0c9;
  --home-bg:#f3f5fb;
  --home-card:#fff;
  --home-text:#172033;
  --home-muted:#64748b;
  --home-border:#dde4f0;
  background:var(--home-bg)!important;
  overflow-x:clip;
}
body.cr-home-page .cr-wrap{
  width:80vw!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:16px!important;
  padding-right:16px!important;
}
body.cr-home-page .home-main{padding:0 0 38px!important;}
body.cr-home-page .cr-toc{z-index:35!important;}
body.cr-home-page .cr-home-count{
  flex:0 0 auto;
  margin:0;
  padding:5px 10px;
  border:1px solid #f3c66d;
  border-radius:999px;
  background:#fff4d8;
  color:#764800;
  font-size:12px;
  font-weight:900;
  line-height:1.35;
  white-space:nowrap;
}
body.cr-home-page #calculatrice,
body.cr-home-page #populaires,
body.cr-home-page #categories,
body.cr-home-page #choisir,
body.cr-home-page #methode,
body.cr-home-page #occs,
body.cr-home-page #faq{scroll-margin-top:100px;}
body.cr-home-page .cr-noscript{margin:1rem auto;padding:.85rem 1rem;border-radius:14px;background:#111827;color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.12);}
body.cr-home-page .cr-calc-head-right{display:flex;flex-direction:column;align-items:flex-end;gap:.35rem;margin-left:.5rem;}
body.cr-home-page .cr-calc-mini-action{border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:.32rem .58rem;font-size:.78rem;line-height:1;cursor:pointer;white-space:nowrap;}
body.cr-home-page .cr-calc-mini-action:hover{background:rgba(255,255,255,.14);}

/* Hero : moteur réellement utilisable, dans la même coque que /math/. */
body.cr-home-page .home-hero{padding:30px 0 34px!important;}
body.cr-home-page .home-hero .cr-hero-grid{
  grid-template-columns:minmax(0,1.12fr) minmax(390px,500px)!important;
  gap:42px!important;
  align-items:center!important;
}
body.cr-home-page .home-hero .cr-hero-copy{max-width:760px!important;}
body.cr-home-page .home-hero h1{
  max-width:760px;
  font-size:clamp(42px,4.7vw,67px)!important;
  line-height:1!important;
  letter-spacing:-.06em!important;
}
body.cr-home-page .home-hero .cr-hero-lead{max-width:70ch!important;font-size:17px!important;line-height:1.68!important;}
body.cr-home-page .home-hero .cr-hero-answer{max-width:70ch!important;margin-top:14px!important;padding:12px 14px!important;font-size:14px!important;line-height:1.66!important;}
body.cr-home-page .home-hero .cr-calc-card{width:100%;max-width:500px;justify-self:end;}
body.cr-home-page .home-hero .cr-calc-card-inner{padding:14px;}
body.cr-home-page .home-hero .cr-calc-screen{min-height:105px;}
body.cr-home-page .home-hero .cr-calc-key{min-height:47px;border-radius:14px;}
body.cr-home-page .home-hero .cr-calc-examples{margin-top:10px;}
body.cr-home-page .home-hero-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
body.cr-home-page .home-hero-links a{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:6px 11px;
  border:1px solid rgba(255,255,255,.34);
  border-radius:999px;
  background:rgba(18,24,39,.16);
  color:#fff!important;
  font-size:12px;
  font-weight:850;
  text-decoration:none!important;
}
body.cr-home-page .home-hero-links a:hover{background:rgba(18,24,39,.26);}

/* Repères et panneaux : densité proche de la home Statistiques.com. */
body.cr-home-page .home-proof-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:18px!important;
  margin-bottom:6px!important;
  padding:0!important;
  overflow:hidden;
  border:1px solid var(--home-border);
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 18px rgba(15,23,42,.05);
}
body.cr-home-page .home-proof-strip div{padding:12px 16px;min-width:0;}
body.cr-home-page .home-proof-strip div + div{border-left:1px solid var(--home-border);}
body.cr-home-page .home-proof-strip strong{display:block;color:#172033;font-size:20px;line-height:1.05;font-weight:950;letter-spacing:-.035em;}
body.cr-home-page .home-proof-strip span{display:block;margin-top:4px;color:var(--home-muted);font-size:12px;font-weight:750;}
body.cr-home-page .home-section{padding:18px 0;}
body.cr-home-page .home-panel{
  padding:18px;
  border:1px solid var(--home-border);
  border-radius:16px;
  background:var(--home-card);
  box-shadow:0 10px 24px rgba(15,23,42,.055);
}
body.cr-home-page .home-panel-warm{background:radial-gradient(circle at top right,#fff3d8 0,#fff 34%);}
body.cr-home-page .home-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:16px;}
body.cr-home-page .home-section-head > div{max-width:900px;}
body.cr-home-page .home-kicker{display:block;margin-bottom:4px;color:var(--home-orange-dark);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;}
body.cr-home-page .home-section-head h2,
body.cr-home-page .home-method-main > h2,
body.cr-home-page .home-occs-panel h2{margin:0;color:var(--home-text)!important;font-size:26px!important;line-height:1.16!important;letter-spacing:-.04em!important;}
body.cr-home-page .home-section-head p,
body.cr-home-page .home-method-main > p,
body.cr-home-page .home-occs-panel p{margin:7px 0 0;color:var(--home-muted);font-size:14px;line-height:1.68;}
body.cr-home-page .home-head-link{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;padding:7px 11px;border-radius:999px;background:var(--home-orange-soft);color:var(--home-orange-dark)!important;font-size:12px;font-weight:900;text-decoration:none!important;white-space:nowrap;}
body.cr-home-page .home-head-link:hover{background:#ffe2a0;}

/* Calculatrices prioritaires. */
body.cr-home-page .home-popular-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
body.cr-home-page .home-popular-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:220px;
  padding:14px;
  overflow:hidden;
  border:1px solid var(--home-border);
  border-top:4px solid var(--home-orange);
  border-radius:13px;
  background:#fff;
  color:var(--home-text)!important;
  box-shadow:0 8px 18px rgba(15,23,42,.045);
  text-decoration:none!important;
  transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease;
}
body.cr-home-page .home-popular-card:hover{transform:translateY(-2px);border-color:#ffa300;box-shadow:0 14px 28px rgba(15,23,42,.09);}
body.cr-home-page .home-popular-featured{background:linear-gradient(145deg,#fff8e7,#fff);}
body.cr-home-page .home-card-label{display:block;color:var(--home-orange-dark);font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;}
body.cr-home-page .home-card-symbol{
  position:absolute;
  top:12px;
  right:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:12px;
  background:var(--home-orange-soft);
  color:var(--home-orange-dark);
  font-size:13px;
  font-weight:950;
}
body.cr-home-page .home-popular-card h3{margin:30px 48px 6px 0;color:var(--home-text);font-size:16px;line-height:1.25;letter-spacing:-.02em;}
body.cr-home-page .home-popular-card p{margin:0 0 12px;color:var(--home-muted);font-size:12px;line-height:1.55;}
body.cr-home-page .home-card-action{display:block;margin-top:auto;color:var(--home-orange-dark);font-size:11px;font-weight:900;}
body.cr-home-page .home-card-action::after{content:" ›";}
body.cr-home-page .home-more-links{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:12px;padding:10px 12px;border:1px solid #f2d39b;border-radius:12px;background:#fff8e8;color:#5d6676;font-size:12px;}
body.cr-home-page .home-more-links strong{color:var(--home-text);}
body.cr-home-page .home-more-links a{padding:3px 8px;border-radius:999px;background:#fff;color:var(--home-orange-dark)!important;font-weight:850;text-decoration:none!important;}
body.cr-home-page .home-ad{margin-top:10px!important;margin-bottom:10px!important;min-height:180px;}
body.cr-home-page .home-ad-late{margin-top:18px!important;}

/* Les dix catégories. */
body.cr-home-page .home-category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
body.cr-home-page .home-category-card{display:grid;grid-template-columns:132px minmax(0,1fr);min-height:210px;overflow:hidden;border:1px solid var(--home-border);border-radius:14px;background:#fff;box-shadow:0 8px 18px rgba(15,23,42,.04);}
body.cr-home-page .home-category-image{display:block;min-height:100%;overflow:hidden;background:#202838;}
body.cr-home-page .home-category-image img{display:block;width:100%;height:100%;min-height:210px;object-fit:cover;object-position:center;transition:transform .3s ease;}
body.cr-home-page .home-category-card:hover .home-category-image img{transform:scale(1.025);}
body.cr-home-page .home-category-body{display:flex;flex-direction:column;min-width:0;padding:13px;}
body.cr-home-page .home-category-body h3{margin:6px 0 5px;color:var(--home-text);font-size:17px;line-height:1.2;}
body.cr-home-page .home-category-body h3 a{color:var(--home-text)!important;text-decoration:none!important;}
body.cr-home-page .home-category-body p{margin:0 0 10px;color:var(--home-muted);font-size:12px;line-height:1.5;}
body.cr-home-page .home-category-links{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;}
body.cr-home-page .home-category-links a{display:inline-flex;padding:4px 7px;border-radius:999px;background:var(--home-orange-soft);color:var(--home-orange-dark)!important;font-size:10px;font-weight:850;text-decoration:none!important;}

/* Choix de la bonne calculatrice. */
body.cr-home-page .home-choice-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
body.cr-home-page .home-choice-card{display:block;overflow:hidden;border:1px solid var(--home-border);border-radius:14px;background:#fff;color:var(--home-text)!important;text-decoration:none!important;box-shadow:0 8px 18px rgba(15,23,42,.045);transition:transform .14s ease,box-shadow .14s ease;}
body.cr-home-page .home-choice-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(15,23,42,.09);}
body.cr-home-page .home-choice-card > img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;background:#202838;}
body.cr-home-page .home-choice-card > div{padding:13px;}
body.cr-home-page .home-choice-card h3{margin:5px 0;color:var(--home-text);font-size:17px;line-height:1.23;}
body.cr-home-page .home-choice-card p{margin:0 0 12px;color:var(--home-muted);font-size:12px;line-height:1.5;}

/* Entrées à valeur et méthode éditoriale. */
body.cr-home-page .home-value-panel{background:linear-gradient(135deg,#fff9ec,#fff 48%,#f9fbff);}
body.cr-home-page .home-value-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
body.cr-home-page .home-value-grid article{position:relative;padding:14px;border:1px solid var(--home-border);border-radius:14px;background:#fff;}
body.cr-home-page .home-value-number{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;background:var(--home-orange-soft);color:var(--home-orange-dark);font-size:11px;font-weight:950;}
body.cr-home-page .home-value-grid h3{margin:12px 0 6px;color:var(--home-text);font-size:16px;line-height:1.25;}
body.cr-home-page .home-value-grid p{margin:0 0 12px;color:var(--home-muted);font-size:12px;line-height:1.55;}
body.cr-home-page .home-value-grid article > div{display:flex;flex-wrap:wrap;gap:5px;}
body.cr-home-page .home-value-grid article > div a{padding:4px 7px;border-radius:999px;background:#f5f7fb;color:var(--home-orange-dark)!important;font-size:10px;font-weight:850;text-decoration:none!important;}
body.cr-home-page .home-method-panel{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr);gap:18px;align-items:stretch;background:linear-gradient(145deg,#fff,#fff8e8);}
body.cr-home-page .home-method-main > p{max-width:76ch;}
body.cr-home-page .home-method-steps{display:grid;gap:8px;margin-top:16px;}
body.cr-home-page .home-method-steps article{display:grid;grid-template-columns:38px minmax(0,1fr);gap:11px;align-items:start;padding:11px;border:1px solid var(--home-border);border-radius:12px;background:#fff;}
body.cr-home-page .home-method-steps article > span{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:var(--home-orange);color:#2b1900;font-size:13px;font-weight:950;}
body.cr-home-page .home-method-steps h3{margin:0 0 3px;color:var(--home-text);font-size:14px;line-height:1.3;}
body.cr-home-page .home-method-steps p{margin:0;color:var(--home-muted);font-size:12px;line-height:1.5;}
body.cr-home-page .home-trust-card{padding:17px;border-radius:16px;background:linear-gradient(180deg,#222b3b,#121827);color:#fff;box-shadow:0 16px 32px rgba(15,23,42,.16);}
body.cr-home-page .home-trust-badge{display:inline-flex;padding:5px 9px;border-radius:999px;background:var(--home-orange);color:#2b1900;font-size:10px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;}
body.cr-home-page .home-trust-card h3{margin:14px 0 8px;color:#fff;font-size:19px;line-height:1.2;}
body.cr-home-page .home-trust-card ul{margin:0;padding:0;list-style:none;}
body.cr-home-page .home-trust-card li{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.12);color:#cbd5e1;font-size:12px;line-height:1.55;}
body.cr-home-page .home-trust-card li strong{color:#fff;}
body.cr-home-page .home-trust-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px;}
body.cr-home-page .home-trust-links a{padding:5px 8px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.08);color:#fff!important;font-size:10px;font-weight:850;text-decoration:none!important;}

/* Appartenance OCCS, visible sans prendre la place de l’outil. */
body.cr-home-page .home-occs-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(440px,.9fr);gap:22px;align-items:center;padding:20px;border:1px solid #f0d18e;border-radius:16px;background:linear-gradient(135deg,#fff8e7,#fff);box-shadow:0 10px 24px rgba(15,23,42,.055);}
body.cr-home-page .home-occs-sites{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
body.cr-home-page .home-occs-sites a{display:block;padding:11px;border:1px solid var(--home-border);border-left:4px solid currentColor;border-radius:11px;background:#fff;text-decoration:none!important;}
body.cr-home-page .home-occs-sites strong{display:block;font-size:13px;line-height:1.2;}
body.cr-home-page .home-occs-sites span{display:block;margin-top:3px;color:var(--home-muted);font-size:10px;}
body.cr-home-page .home-occs-outils{color:#00a033!important;}
body.cr-home-page .home-occs-calculatrice{color:#d87800!important;background:#fff9ec!important;}
body.cr-home-page .home-occs-convertisseur{color:#e02020!important;}
body.cr-home-page .home-occs-statistiques{color:#0091ff!important;}
body.cr-home-page .home-faq-list{margin-top:4px;}
body.cr-home-page .home-faq-note{margin:12px 0 0;padding:10px 12px;border:1px solid #f1d7a2;border-radius:12px;background:#fff8e8;color:#5e6674;font-size:11px;line-height:1.55;}
body.cr-home-page .home-faq-list kbd,
body.cr-home-page .home-faq-list code{padding:2px 5px;border:1px solid #dfe5ee;border-radius:5px;background:#f5f7fb;color:#343c4d;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;}

@media (max-width:1280px){
  body.cr-home-page .home-popular-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  body.cr-home-page .home-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  body.cr-home-page .home-choice-grid,
  body.cr-home-page .home-value-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:1120px){
  body.cr-home-page .home-hero .cr-hero-grid{grid-template-columns:1fr!important;gap:24px!important;}
  body.cr-home-page .home-hero .cr-calc-card{max-width:720px;justify-self:start;}
  body.cr-home-page .home-method-panel,
  body.cr-home-page .home-occs-panel{grid-template-columns:1fr;}
}
@media (max-width:900px){
  body.cr-home-page .cr-wrap{width:100%!important;max-width:var(--cr-max)!important;}
  body.cr-home-page .home-popular-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  body.cr-home-page .home-category-card{grid-template-columns:115px minmax(0,1fr);}
  body.cr-home-page .home-category-image img{min-height:220px;}
  body.cr-home-page .home-section-head{display:block;}
  body.cr-home-page .home-head-link{margin-top:10px;}
}
@media (max-width:680px){
  body.cr-home-page .cr-home-count{font-size:11px;padding:4px 8px;}
  body.cr-home-page .home-hero h1{font-size:36px!important;}
  body.cr-home-page .home-hero .cr-hero-lead{font-size:15px!important;}
  body.cr-home-page .home-proof-strip{grid-template-columns:1fr 1fr;margin-top:12px!important;}
  body.cr-home-page .home-proof-strip div:nth-child(3){border-left:0;border-top:1px solid var(--home-border);}
  body.cr-home-page .home-proof-strip div:nth-child(4){border-top:1px solid var(--home-border);}
  body.cr-home-page .home-section{padding:10px 0;}
  body.cr-home-page .home-panel{padding:13px;border-radius:14px;}
  body.cr-home-page .home-section-head h2,
  body.cr-home-page .home-method-main > h2,
  body.cr-home-page .home-occs-panel h2{font-size:22px!important;}
  body.cr-home-page .home-popular-grid,
  body.cr-home-page .home-category-grid,
  body.cr-home-page .home-choice-grid,
  body.cr-home-page .home-value-grid{grid-template-columns:1fr;}
  body.cr-home-page .home-popular-card{min-height:190px;}
  body.cr-home-page .home-category-card{grid-template-columns:108px minmax(0,1fr);min-height:220px;}
  body.cr-home-page .home-category-image img{min-height:220px;}
  body.cr-home-page .home-occs-sites{grid-template-columns:1fr;}
  body.cr-home-page .home-ad{min-height:120px;}
}
@media (max-width:430px){
  body.cr-home-page .home-hero h1{font-size:32px!important;}
  body.cr-home-page .home-hero .cr-calc-card{padding:11px;border-radius:22px;}
  body.cr-home-page .home-hero .cr-calc-card-inner{padding:11px;border-radius:18px;}
  body.cr-home-page .home-hero .cr-calc-key{min-height:45px;border-radius:12px;font-size:16px;}
  body.cr-home-page .home-hero .cr-calc-examples{grid-template-columns:1fr;}
  body.cr-home-page .home-category-card{grid-template-columns:1fr;}
  body.cr-home-page .home-category-image img{height:150px;min-height:150px;object-position:center 45%;}
}
@media (prefers-reduced-motion:reduce){
  body.cr-home-page .home-popular-card,
  body.cr-home-page .home-choice-card,
  body.cr-home-page .home-category-image img{transition:none!important;}
}