/* Quel robot pour mon jardin ? Identité Agreen « Bande de tonte ». Tout est limité à .ag-cr : le même fichier sert sur hub.agreen.lu (body.ag-cr) et dans la page du site Odoo (div.ag-cr). */

.ag-cr{
  --sapin:#12382b;--gazon:#1e6e45;--gazon-fonce:#155535;--tonte:#d7e4cf;--tonte-pale:#e7eee2;--pre:#eef2ea;--balise:#f2c230;
  --doux:#566a5f;--ligne:#d4ddd1;--ligne-forte:#b9c8b5;--rouge:#b23a2f;
  --bandes:repeating-linear-gradient(118deg,#1e6e45 0 22px,#2a7d50 22px 44px);
  --display:'Bricolage Grotesque','Atkinson Hyperlegible Next',system-ui,sans-serif;
  --body:'Atkinson Hyperlegible Next','Atkinson Hyperlegible',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-family:var(--body);color:var(--sapin);background:var(--pre)
}
.ag-cr,.ag-cr *{box-sizing:border-box}
.ag-cr{min-height:100vh;background:var(--pre);line-height:1.5;-webkit-font-smoothing:antialiased;padding-bottom:env(safe-area-inset-bottom)}
.ag-cr button,.ag-cr input,.ag-cr select,.ag-cr textarea{font:inherit;color:inherit}
.ag-cr h1,.ag-cr h2,.ag-cr h3{font-family:var(--display);font-optical-sizing:auto;letter-spacing:-.015em;text-wrap:balance}
.ag-cr :focus-visible{outline:3px solid var(--balise);outline-offset:2px}
.ag-cr .hidden{display:none!important}
.ag-cr [hidden]{display:none!important}
.ag-cr .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ag-cr .muted{color:var(--doux)}
.ag-cr .small{font-size:.88rem}

.ag-cr .site-top{border-top:5px solid transparent;border-image:var(--bandes) 1}
.ag-cr .site-top-inner{max-width:980px;margin:0 auto;padding:.8rem 1rem}
.ag-cr .brand{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--display);font-weight:800;font-size:1.25rem;letter-spacing:-.03em;color:inherit;text-decoration:none}
.ag-cr .site-mark{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--sapin);color:#fff;font-size:1.05rem}

.ag-cr .wrap{max-width:980px;margin:0 auto;padding:clamp(.5rem,3vw,1.4rem) 1rem 3rem}
.ag-cr .page-header{margin-bottom:1.2rem}
.ag-cr .page-header h1{font-size:clamp(2rem,6.5vw,3.2rem);font-weight:750;line-height:1.02;letter-spacing:-.035em;margin:0;max-width:17ch}
.ag-cr .page-header p{color:var(--doux);margin:.7rem 0 0;max-width:58ch;font-size:clamp(1rem,2.4vw,1.1rem)}

.ag-cr .steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem;padding:0;margin:0 0 1rem;font-size:.85rem;font-weight:700;color:var(--doux)}
.ag-cr .steps li{padding-top:.5rem;border-top:5px solid var(--ligne)}
.ag-cr .steps li.active,.ag-cr .steps li.done{color:var(--sapin);border-top-color:var(--gazon)}
.ag-cr .steps li.done{border-image:var(--bandes) 1}

.ag-cr .ag-card{background:#fff;border:1px solid var(--ligne);border-radius:16px;padding:clamp(1.1rem,4vw,1.8rem);margin-bottom:1rem}
.ag-cr .ag-card h2{font-size:clamp(1.3rem,3.6vw,1.6rem);margin:0 0 .8rem;line-height:1.15}

.ag-cr .ag-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:48px;padding:.65rem 1.15rem;border-radius:12px;border:0;font-weight:700;cursor:pointer;text-decoration:none}
.ag-cr .ag-btn-primary{background:var(--gazon);color:#fff}
.ag-cr .ag-btn-primary:hover{background:var(--gazon-fonce)}
.ag-cr .ag-btn-primary:disabled{opacity:.6;cursor:wait}
.ag-cr .ag-btn-ghost{background:var(--tonte-pale);color:var(--sapin)}
.ag-cr .ag-btn-ghost:hover{background:var(--tonte)}

.ag-cr input[type=text],.ag-cr input[type=tel],.ag-cr input[type=number],.ag-cr textarea{width:100%;min-height:48px;padding:.65rem .8rem;border:1.5px solid var(--ligne-forte);border-radius:12px;background:#fff}
.ag-cr textarea{resize:vertical}
.ag-cr label{display:grid;gap:.35rem;font-weight:700;font-size:.95rem}

.ag-cr .address-form{display:flex;gap:.5rem;margin-bottom:.6rem}
.ag-cr .address-form input{flex:1;font-size:1.05rem}
.ag-cr .address-results{list-style:none;margin:0 0 .6rem;padding:0;display:grid;gap:.35rem}
.ag-cr .address-results button{width:100%;text-align:left;padding:.7rem .85rem;border:1.5px solid var(--ligne);border-radius:12px;background:#fff;cursor:pointer;min-height:48px}
.ag-cr .address-results button:hover{border-color:var(--gazon);background:var(--tonte-pale)}

.ag-cr .ag-card-map{padding-bottom:1.2rem}
.ag-cr .map-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;flex-wrap:wrap;margin-bottom:.8rem}
.ag-cr .map-head h2{margin-bottom:.3rem}
.ag-cr .map-head p{margin:0;max-width:52ch}
.ag-cr .area-box{background:var(--sapin);color:#fff;border-radius:14px;padding:.6rem 1rem;min-width:170px}
.ag-cr .area-label{display:block;font-size:.8rem;opacity:.8}
.ag-cr .area-box strong{font-family:var(--display);font-size:1.9rem;line-height:1.1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.ag-cr .map{height:min(62vh,560px);min-height:340px;border-radius:12px;overflow:hidden;background:#cfd8cb;cursor:crosshair}
.ag-cr .map .leaflet-container{font-family:var(--body)}
.ag-cr .vertex{width:18px!important;height:18px!important;margin:-9px 0 0 -9px!important;border-radius:50%;background:var(--balise);border:3px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.45)}
.ag-cr .vertex.inactive{background:#fff;border-color:var(--balise)}
.ag-cr .map-tools{display:flex;flex-wrap:wrap;gap:.5rem;margin:.8rem 0}
.ag-cr .zones-list{list-style:none;padding:0;margin:0 0 .6rem;display:flex;flex-wrap:wrap;gap:.4rem}
.ag-cr .zones-list li{background:var(--tonte-pale);border-radius:999px;padding:.3rem .8rem;font-size:.88rem;font-weight:700}
.ag-cr .zones-list li.current{background:var(--balise)}
.ag-cr .manual{margin:.4rem 0 .2rem}
.ag-cr .manual summary{cursor:pointer;font-weight:700;color:var(--gazon);padding:.4rem 0}
.ag-cr .manual label{max-width:260px;margin-top:.4rem}

.ag-cr .step-actions{display:flex;justify-content:space-between;gap:.6rem;flex-wrap:wrap;margin-top:1.2rem}

.ag-cr .garden-form fieldset{border:0;padding:0;margin:0 0 1.3rem}
.ag-cr .garden-form legend{font-weight:800;font-family:var(--display);font-size:1.08rem;margin-bottom:.55rem}
.ag-cr .choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.5rem}
.ag-cr .choice{display:flex;gap:.55rem;align-items:flex-start;padding:.75rem .85rem;border:1.5px solid var(--ligne);border-radius:12px;cursor:pointer;font-weight:400;min-height:52px}
.ag-cr .choice input{margin-top:.2rem;accent-color:var(--gazon)}
.ag-cr .choice span{display:grid;gap:.1rem}
.ag-cr .choice small{color:var(--doux);font-size:.84rem;line-height:1.3}
.ag-cr .choice:has(input:checked){border-color:var(--gazon);background:var(--tonte-pale)}
.ag-cr .check{display:flex;gap:.55rem;align-items:center;font-weight:400}
.ag-cr .check input{width:20px;height:20px;accent-color:var(--gazon)}

.ag-cr .result-head{border-top:5px solid transparent;border-image:var(--bandes) 1}
.ag-cr .result-head p{margin:0}
.ag-cr .results{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-bottom:.6rem}
.ag-cr .robot{background:#fff;border:1px solid var(--ligne);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.ag-cr .robot.best{border:2px solid var(--gazon)}
.ag-cr .robot-photo{position:relative;aspect-ratio:4/3;background:#f6f8f4;overflow:hidden}
.ag-cr .robot-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:.8rem}
.ag-cr .robot-body{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.ag-cr .robot-badge{align-self:flex-start;background:var(--balise);color:var(--sapin);font-weight:800;font-size:.8rem;border-radius:999px;padding:.15rem .65rem}
.ag-cr .robot h3{margin:0;font-size:1.25rem;line-height:1.15}
.ag-cr .robot-price{font-family:var(--display);font-weight:800;font-size:1.45rem;letter-spacing:-.02em}
.ag-cr .robot-specs{display:flex;flex-wrap:wrap;gap:.35rem;padding:0;margin:0;list-style:none}
.ag-cr .robot-specs li{background:var(--tonte-pale);border-radius:8px;padding:.2rem .55rem;font-size:.84rem;font-weight:700}
.ag-cr .robot-why{margin:0;padding-left:1.1rem;font-size:.92rem;color:var(--doux)}
.ag-cr .robot-actions{margin-top:auto;display:grid;gap:.45rem}
.ag-cr .robot-actions a{text-align:center;color:var(--gazon);font-weight:700;font-size:.92rem}
.ag-cr .price-note{margin:0 0 1rem}
.ag-cr .empty{background:#fff;border:1px dashed var(--ligne-forte);border-radius:16px;padding:1.4rem}

.ag-cr .visit-form .field-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-bottom:.8rem}
.ag-cr .chosen{background:var(--tonte-pale);border-radius:12px;padding:.6rem .85rem;font-weight:700}
.ag-cr .honeypot{position:absolute;left:-9999px;height:0;overflow:hidden}
.ag-cr .success{border-top:5px solid transparent;border-image:var(--bandes) 1}

.ag-cr .ag-toast{position:fixed;left:50%;bottom:calc(1rem + env(safe-area-inset-bottom));transform:translate(-50%,150%);background:var(--sapin);color:#fff;padding:.75rem 1.1rem;border-radius:12px;font-weight:700;max-width:calc(100% - 2rem);transition:transform .25s;z-index:2000}
.ag-cr .ag-toast.active{transform:translate(-50%,0)}
.ag-cr .ag-toast.error{background:var(--rouge)}
.ag-cr .site-foot{max-width:980px;margin:0 auto;padding:1rem 1rem 2rem;color:var(--doux);font-size:.88rem}
.ag-cr .site-foot a{color:inherit}

@media (max-width:560px){
  .ag-cr .address-form{flex-direction:column}
  .ag-cr .visit-form .field-row{grid-template-columns:1fr}
  .ag-cr .area-box{width:100%}
  .ag-cr .step-actions .ag-btn{flex:1 1 auto}
}
@media (prefers-reduced-motion:reduce){.ag-cr .ag-toast{transition:none}}

.ag-cr .address-results button{display:grid;gap:.1rem}
.ag-cr .address-results button strong{font-weight:700}
.ag-cr .address-results button span{color:var(--doux);font-size:.88rem}
.ag-cr .address-results .not-listed{background:var(--tonte-pale);border-style:dashed;font-weight:700;color:var(--gazon)}
.ag-cr .address-results .not-listed span{font-weight:400}
.ag-cr .robot-count{position:absolute;right:.7rem;top:.7rem;background:var(--sapin);color:#fff;font-weight:800;font-size:.85rem;border-radius:999px;padding:.2rem .7rem}
.ag-cr .robot-price small{display:block;font-family:var(--body);font-size:.85rem;font-weight:400;letter-spacing:0}

html.embedded body,html.embedded .ag-cr{min-height:0;background:transparent}
.embedded .ag-cr .site-top,.embedded .ag-cr .site-foot{display:none}
.embedded .ag-cr .wrap{padding-top:.5rem}
.embedded .ag-cr .map{height:520px;min-height:0}
@media (max-width:560px){.embedded .ag-cr .map{height:420px}}
html.embedded{background:transparent}