@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Outfit:wght@300;400;500;600;700&display=swap');
.agako-root{background:var(--paper);color:var(--ink);font-family:Outfit,system-ui,sans-serif;}

.agako-root{
  --ink:#1a1612; --ink-soft:#3d342c; --muted:#7a7168;
  --paper:#f6f1ea; --paper-2:#efe6d9; --card:#fffdf9;
  --gold:#b68a4a; --gold-d:#8d6830; --line:#e4d8c6;
  --ok:#2f6b4f; --warn:#8a4b1f; --err:#8b2e2e;
  --shadow:0 18px 50px rgba(26,22,18,.10);
}
.agako-root *{box-sizing:border-box} 
.agako-root img{max-width:100%;display:block}
.agako-root button,.agako-root input,.agako-root select,.agako-root textarea{font:inherit}
.agako-root .wrap{max-width:1240px;margin:0 auto;padding:0 22px 80px}
.agako-root header.hero{background:linear-gradient(180deg,#fbf7f1 0%,#f3ebe1 100%);color:var(--ink);padding:28px 0 32px;border-bottom:3px solid var(--gold)}
.agako-root .hero-inner{max-width:1240px;margin:0 auto;padding:0 22px;display:flex;justify-content:space-between;gap:20px;align-items:flex-end}
.agako-root .brand{margin:0;line-height:1}
.agako-root .brand-logo{display:block;height:auto;width:min(420px,72vw);max-width:100%}
.agako-root .hero .eyebrow{margin:0 0 10px;letter-spacing:.32em;text-transform:uppercase;font-size:11px;color:var(--gold-d);font-family:Montserrat,sans-serif;font-weight:600}
.agako-root .hero .tag{font-family:Montserrat,sans-serif;font-size:16px;color:var(--ink-soft);margin:16px 0 0;letter-spacing:.04em;font-weight:400;line-height:1.55;max-width:36em}
.agako-root .hero-copy{display:flex;flex-direction:column;align-items:flex-start}
.agako-root .hero-meta{text-align:right;font-size:13px;color:var(--muted);line-height:1.7;font-family:Montserrat,sans-serif}
.agako-root .step-dot{cursor:pointer;width:28px;height:28px;border-radius:50%;border:1px solid #cbb99a;color:var(--ink-soft);display:grid;place-items:center;font-size:12px;background:#fff}
@media(max-width:720px){
  .agako-root .hero-inner{flex-direction:column;align-items:flex-start}
  .agako-root .hero-meta{text-align:left}
  .agako-root .brand-logo{width:min(320px,86vw)}
}
.agako-root .steps{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0 0}
.agako-root .step-dot.on{background:var(--gold);color:#1c1814;border-color:var(--gold);font-weight:700}
.agako-root .layout{display:grid;grid-template-columns:1fr 340px;gap:26px;margin-top:28px}
@media(max-width:980px){.agako-root .layout{grid-template-columns:1fr}}
.agako-root .panel{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow)}
.agako-root h2{font-family:"Cormorant Garamond",serif;font-size:32px;margin:0 0 10px;line-height:1.15;letter-spacing:.01em}
.agako-root .lead{color:var(--muted);margin:0 0 22px;line-height:1.75;max-width:68ch}
.agako-root .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.agako-root .card{border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:pointer;background:#fff;transition:.2s}
.agako-root .card:hover{transform:translateY(-2px);border-color:var(--gold)}
.agako-root .card.sel{border:2px solid var(--gold);box-shadow:0 0 0 3px rgba(182,138,74,.18)}
.agako-root .card img{height:128px;width:100%;object-fit:cover}
.agako-root .card .meta{padding:12px 12px 14px}
.agako-root .card .meta b{display:block;font-size:15px}
.agako-root .card .meta small{color:var(--muted)}
.agako-root .desc{background:var(--paper-2);border-radius:12px;padding:14px 16px;margin:16px 0 6px;color:var(--ink-soft);line-height:1.65}
.agako-root .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:640px){.agako-root .row{grid-template-columns:1fr}}
.agako-root label.f{display:block;font-size:13px;color:var(--muted);margin:0 0 6px}
.agako-root input,.agako-root select,.agako-root textarea{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:11px 12px}
.agako-root .checks{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:640px){.agako-root .checks{grid-template-columns:1fr}}
.agako-root .check{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;gap:8px;align-items:flex-start;background:#fff}
.agako-root .check input{width:auto;margin-top:3px}
.agako-root .nav{display:flex;justify-content:space-between;gap:10px;margin-top:22px}
.agako-root .btn,.agako-root .btn.g,.agako-root .btn.ghost{
  border:1px solid #373f4d;
  border-radius:999px;
  padding:12px 20px;
  cursor:pointer;
  font-weight:600;
  background:#373f4d;
  color:#fff;
}
.agako-root .btn:hover,.agako-root .btn.g:hover,.agako-root .btn.ghost:hover{
  background:#6b7280;
  color:#fff;
  border-color:#6b7280;
}
.agako-root .side{position:sticky;top:16px;align-self:start}
.agako-root .side h3{font-family:"Cormorant Garamond",serif;margin:0 0 10px;font-size:26px}
.agako-root .kv{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:14px}
.agako-root .total{font-size:22px;font-weight:700;margin-top:12px;display:flex;justify-content:space-between}
.agako-root .note{font-size:12px;color:var(--muted);margin-top:10px;line-height:1.45}
.agako-root .badge{display:inline-block;background:#efe2c8;color:#6b4e1e;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:600}
.agako-root .warnbox{background:#f8ece3;border:1px solid #e4c3a4;padding:12px 14px;border-radius:10px;color:var(--warn);margin:8px 0 16px}
.agako-root .notebox{background:#f7f1e8;border:1px solid #e2d4c0;padding:16px 18px;border-radius:12px;color:#4a4036;margin:8px 0 16px;line-height:1.55;font-size:14px}
.agako-root .notebox b{font-weight:600;color:#2c241c;letter-spacing:.01em}
.agako-root .okbox{background:#eaf4ee;border:1px solid #c7ddcf;padding:14px;border-radius:12px}
.agako-root .hidden{display:none!important}
.agako-root footer{margin-top:40px;color:var(--muted);font-size:13px;text-align:center;line-height:1.6}
.agako-root .quote{background:#fff;border:1px solid var(--line);padding:28px;border-radius:14px}
.agako-root .quote h1{font-family:"Cormorant Garamond",serif;margin:0}
.agako-root table.q{width:100%;border-collapse:collapse;margin:14px 0}
.agako-root table.q td,.agako-root table.q th{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;font-size:14px}
.agako-root .legal{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:20px 0 8px}
.agako-root .legal h4{margin:0 0 8px;font-family:"Cormorant Garamond",serif;font-size:22px}
.agako-root .legal p{margin:0 0 12px;color:var(--ink-soft);font-size:13px;line-height:1.65}
.agako-root .legal label{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--ink-soft);line-height:1.55;margin:10px 0 0}
.agako-root .legal input{width:auto;margin-top:3px}
#aga-print-sheet{display:none}
@media print{
  @page{size:A4;margin:12mm}
  html,body{background:#fff!important}
  body *{visibility:hidden!important}
  #aga-print-sheet,#aga-print-sheet *{visibility:visible!important}
  #aga-print-sheet{display:block!important;position:absolute;left:0;top:0;width:100%;background:#fff}
  header,footer,nav,.elementor-location-header,.elementor-location-footer,
  .site-header,.site-footer,#wpadminbar,.no-print{display:none!important}
}

.agako-root .check{display:flex;align-items:center;gap:10px}
.agako-root .ex-thumb{width:52px;height:52px;object-fit:cover;border-radius:8px;border:1px solid var(--line);flex-shrink:0}

.agako-root .color-filter{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 16px}
.agako-root .chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;cursor:pointer;font-size:13px;color:var(--ink)}
.agako-root .chip.on{border-color:var(--gold);background:#f7f0e4;font-weight:600}

.agako-root .card small{display:block}

/* v1.8 – megmunkálási árak és magyarázatok */
.agako-root .check{position:relative;align-items:center;min-height:66px;padding:12px 14px}
.agako-root .check-copy{display:flex;flex-direction:column;gap:4px;line-height:1.25;flex:1}
.agako-root .check-copy b{font-weight:600}
.agako-root .check-price{display:block;font-size:13px;color:#8a7a68;font-weight:500}
.agako-root .ag-info{position:relative;flex:0 0 24px;width:24px;height:24px;border:1px solid #cdbfae!important;border-radius:50%!important;background:#fff!important;color:#6d6256!important;padding:0!important;font:600 13px/22px Arial,sans-serif!important;text-align:center;cursor:pointer;box-shadow:none!important}
.agako-root .ag-tip{display:none;position:absolute;z-index:9999;right:-8px;bottom:32px;width:min(300px,75vw);padding:12px 14px;background:#252525;color:#fff;border-radius:8px;font:400 13px/1.45 Arial,sans-serif;text-align:left;letter-spacing:0;text-transform:none;box-shadow:0 8px 25px rgba(0,0,0,.18)}
.agako-root .ag-info:hover .ag-tip,.agako-root .ag-info:focus .ag-tip,.agako-root .info-open>.ag-info .ag-tip,.agako-root .ag-label-info.info-open .ag-tip{display:block}
.agako-root .ag-label-info{display:flex!important;align-items:center;gap:8px}
.agako-root .install-note{margin-top:18px;padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:#faf8f4;color:#6d6256;font-size:13px;line-height:1.55}
.agako-root .install-note b{display:block;color:#292725;margin-bottom:3px;font-size:14px}
.agako-root .install-note p{margin:0}
@media(max-width:640px){.agako-root .ag-tip{position:fixed!important;left:16px!important;right:16px!important;bottom:24px!important;width:auto!important;max-width:calc(100vw - 32px)!important;max-height:45vh!important;overflow-y:auto!important;box-sizing:border-box!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;font-size:14px!important;line-height:1.5!important;padding:16px 18px!important;z-index:100000!important}.agako-root .check{min-height:72px}.agako-root .check-price{font-size:12.5px}}

/* 1.2: concise labelled progress, keyboard focus, readable mobile layout. */
.agako-root .steps{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
.agako-root button.step-dot{display:flex;align-items:center;gap:7px;width:auto;height:auto;min-height:42px;border:1px solid var(--line);border-radius:6px;padding:8px 10px;background:#fff;color:#555;font:inherit;box-shadow:none}
.agako-root .step-dot span{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#ede9e1;font-size:12px}
.agako-root .step-dot small{font-size:12px;letter-spacing:0;font-weight:500}
.agako-root .step-dot.current{border-color:#39414d;color:#252d37;background:#f5f4f0}
.agako-root .step-dot.current span{background:#39414d;color:#fff}
.agako-root .step-dot:disabled{opacity:.48;cursor:default}
.agako-root .card:focus-visible,.agako-root button:focus-visible,.agako-root input:focus-visible,.agako-root select:focus-visible,.agako-root textarea:focus-visible{outline:3px solid #8d6830;outline-offset:3px}
.agako-root .card.sel{border:2px solid #8d6830}
.agako-root .card .meta small{line-height:1.5}
.agako-root .agako-pending{padding:10px;background:#fff4dc;border-left:3px solid #b68a4a;color:#62471c}
.agako-root .legal a{text-decoration:underline;color:inherit}
.agako-root .okbox{line-height:1.7;overflow-wrap:anywhere}
.agako-root .lead{max-width:66ch;line-height:1.7}
.agako-root .brand-logo{max-width:220px}
.agako-root .hero-meta{font-size:12px;line-height:1.6}
@media(max-width:700px){
 .agako-root .steps{gap:6px}.agako-root button.step-dot{flex:1 0 28%;padding:6px;justify-content:center}.agako-root .step-dot small{font-size:10px}
 .agako-root .hero-meta{display:none}.agako-root .panel{padding:20px 16px}.agako-root .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.agako-root .checks{grid-template-columns:1fr}.agako-root .row{grid-template-columns:1fr}.agako-root .nav .btn{min-height:48px}.agako-root .quote{overflow-x:auto}
}

/* 1.2.1: desktop explanations wrap inside one complete background box. */
@media(min-width:641px){
 .agako-root .ag-tip{
  box-sizing:border-box!important;
  width:300px!important;
  max-width:calc(100vw - 32px)!important;
  height:auto!important;
  min-height:0!important;
  max-height:55vh!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  text-indent:0!important;
  background:#252525!important;
  color:#fff!important;
  font:400 14px/1.55 Arial,sans-serif!important;
  padding:14px 16px!important;
  text-align:left!important;
 }
 .agako-root .ag-info{overflow:visible!important}
 .agako-root .check{overflow:visible}
}
