/* amaxologio.gr · am-templates.css · load order: am-tokens, am-base, am-components, am-templates */
/* ---------- 16. HERO, HUB HEADER ---------- */
.am-hero{padding-block:24px 48px;background:var(--am-bg)}
.am-hero__grid{display:grid;gap:20px;grid-template-columns:minmax(0,1fr)}
.am-hero__text h1{margin:8px 0 8px}
.am-hero__text p{margin:0!important;font-size:18px}
.am-hero__media{order:4}
@container (min-width:1024px){
  .am-hero{padding-block:32px 64px}
  .am-hero__media{order:0;grid-area:1/1}
  .am-hero__text{grid-area:1/1;align-self:center;justify-self:start;width:36%;margin-left:40px;padding:32px;border-radius:12px;background:var(--am-scrim);color:#FFFFFF;z-index:1}
  .am-hero__text h1{font-size:44px!important;line-height:1.1!important;color:#FFFFFF}
  .am-hero__text .am-hero__tag{color:#FFD27A}
  .am-hero__media{position:relative}
  .am-hero__media .am-img__cap{position:absolute;left:12px;top:12px;max-width:60%;background:var(--am-scrim);color:#FFFFFF;padding:4px 10px;border-radius:6px}
  .am-hero__search{grid-area:2/1;justify-self:center;width:min(820px,100%);margin-top:-56px;z-index:2}
  .am-hero__quick{grid-area:3/1;width:min(1000px,100%);justify-self:center;margin-top:8px}
}
.am-hubhead{display:grid;gap:20px;grid-template-columns:minmax(0,1fr);margin-top:16px}
@container (min-width:768px){
  .am-hubhead .am-img__ph{grid-area:1/1}
  .am-hubhead__text{grid-area:1/1;align-self:center;justify-self:start;max-width:40%;margin-left:32px;padding:28px 32px;border-radius:12px;background:var(--am-scrim);color:#FFFFFF;z-index:1}
  .am-hubhead__text h1{color:#FFFFFF;margin:0!important}
}

/* ---------- 17. FOOTER ---------- */
.am-footer{background:var(--am-surface);border-top:1px solid var(--am-border);padding-block:48px 32px;font-size:15px;line-height:1.5;color:var(--am-text)}
.am-footer__top{display:grid;gap:32px;grid-template-columns:minmax(0,1fr)}
@container (min-width:768px){.am-footer__top{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:1024px){.am-footer__top{grid-template-columns:1.2fr 1fr 1fr 1fr}}
.am-footer h2{font-size:15px!important;line-height:1.4!important;font-weight:700;margin:0 0 10px!important}
.am-footer ul{list-style:none;margin:0!important;padding:0!important;display:grid;gap:0}
.am-footer li{margin:0!important}
.am-footer a{color:var(--am-text)!important;text-decoration:none!important;display:inline-flex;align-items:center;min-height:36px}
.am-footer a:hover{text-decoration:underline!important}
.am-footer__brand p{margin:12px 0 0!important;color:var(--am-text-muted);max-width:34ch}
.am-footer__bottom{border-top:1px solid var(--am-border);margin-top:32px;padding-top:20px;display:flex;flex-wrap:wrap;gap:0 20px}
.am-footer__legal{margin-top:16px!important;color:var(--am-text-muted)}

/* ---------- 18. DESIGN-SYSTEM PAGE ---------- */
.am-ds-top{border-bottom:1px solid var(--am-border);background:var(--am-surface)}
.am-ds-top__in{display:flex;flex-wrap:wrap;align-items:center;gap:16px 40px;padding-block:32px}
.am-ds-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;padding-block:32px 96px}
@container (min-width:1024px){.am-ds-layout{grid-template-columns:220px minmax(0,1fr)}}
.am-ds-nav{display:none}
@container (min-width:1024px){.am-ds-nav{display:block;position:sticky;top:24px;align-self:start}}
.am-ds-main{min-width:0}
.am-ds-sec{padding-bottom:56px;margin-bottom:8px;border-bottom:1px solid var(--am-border)}
.am-ds-sec>h2:first-child{margin-top:40px}
.am-ds-sw{display:inline-grid;place-items:center;width:56px;height:36px;border-radius:8px;border:1px solid var(--am-border);font-weight:700}
.am-ds-rules{display:grid;gap:12px;grid-template-columns:minmax(0,1fr);margin-top:24px}
@container (min-width:768px){.am-ds-rules{grid-template-columns:repeat(2,minmax(0,1fr))}}
.am-ds-rule{padding:14px 16px;border:1px solid var(--am-border);border-radius:12px;font-size:15px;line-height:1.5;background:var(--am-bg)}
.am-ds-type{border-top:1px solid var(--am-border)}
.am-ds-typerow{display:grid;gap:6px 24px;grid-template-columns:minmax(0,1fr);padding:18px 0;border-bottom:1px solid var(--am-border);align-items:baseline}
@container (min-width:768px){.am-ds-typerow{grid-template-columns:260px minmax(0,1fr)}}
.am-ds-typemeta{font-size:13px;line-height:1.4;color:var(--am-text-muted);font-family:ui-monospace,Menlo,monospace}
.am-ds-cols{display:grid;gap:32px;grid-template-columns:minmax(0,1fr)}
@container (min-width:768px){.am-ds-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:1024px){.am-ds-cols--wide{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}}
.am-ds-grid4{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
@container (min-width:768px){.am-ds-grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:1200px){.am-ds-grid4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.am-ds-grid3,.am-ds-cards{display:grid;gap:24px;grid-template-columns:minmax(0,1fr)}
@container (min-width:768px){.am-ds-grid3,.am-ds-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.am-ds-cap{display:block;font-size:13px;font-weight:600;color:var(--am-text-muted);margin:0 0 8px;font-family:ui-monospace,Menlo,monospace}
.am-field>.am-ds-cap{margin:6px 0 0}
.am-ds-space{list-style:none;margin:0!important;padding:0!important;display:grid;gap:6px}
.am-ds-space li{display:flex;align-items:center;gap:12px;margin:0!important;font-size:15px}
.am-ds-space li>span{display:block;height:16px;background:var(--am-brand);border-radius:2px;flex:none}
.am-ds-shape{display:grid;place-items:center;text-align:center;width:120px;height:96px;border:1px solid var(--am-border-strong);font-weight:600;font-size:15px;line-height:1.3;background:var(--am-bg)}
.am-ds-logo{padding:28px;border:1px solid var(--am-border);border-radius:12px;background:var(--am-bg)}
.am-ds-logo--header{background:var(--am-header-bg);color:var(--am-header-text);border-color:transparent}
.am-ds-icons{list-style:none;margin:0!important;padding:0!important;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.am-ds-icons li{display:flex;align-items:center;gap:10px;margin:0!important;padding:10px 12px;border:1px solid var(--am-border);border-radius:8px;font-size:15px}
.am-ds-icons .am-i{width:24px;height:24px;color:var(--am-brand)}
.am-ds-states{overflow-x:auto;border:1px solid var(--am-border);border-radius:12px;padding:8px 16px}
.am-ds-statehead,.am-ds-staterow{display:grid;grid-template-columns:150px repeat(6,minmax(170px,1fr));gap:16px;align-items:center;min-width:1180px}
.am-ds-statehead{font-size:13px;font-weight:600;color:var(--am-text-muted);padding:8px 0;font-family:ui-monospace,Menlo,monospace}
.am-ds-staterow{padding:14px 0;border-top:1px solid var(--am-border)}
.am-ds-staterow .am-btn{justify-self:start}
.am-ds-statelabel{font-weight:600;font-size:15px}
.am-ds-searchgrid{display:grid;gap:24px 32px;grid-template-columns:minmax(0,1fr)}
@container (min-width:900px){.am-ds-searchgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.am-ds-shells{display:grid;gap:24px;grid-template-columns:minmax(0,1fr);align-items:start}
@container (min-width:1200px){.am-ds-shells{grid-template-columns:repeat(2,minmax(0,1fr))}}
.am-ds-empty{display:grid;place-items:center;min-height:68px;border:1px dashed var(--am-border);border-radius:12px;color:var(--am-text-muted);font-size:15px;padding:12px;text-align:center}
.am-ds-phone{width:360px;max-width:100%;border:1px solid var(--am-border);border-radius:16px;padding:12px;background:var(--am-bg)}

/* ---------- 19. MOBILE FRAME (390 artboards) ---------- */
.am-mframe{width:390px;background:#FFFFFF}

/* ---------- 20. PRINT ---------- */
.am-print-url{display:none}
@media print{
  .am-header,.am-infobar,.am-footer,.am-ad,.am-aside,.am-share,.am-demo,.am-stickybar,.am-tocchip,.am-progress,.am-feedback,.am-crumbs,.am-result__actions{display:none!important}
  .am-print-url{display:block;font-size:12pt;color:#4F5B67;margin-bottom:12pt}
  .am-root{font-size:11pt;background:#FFFFFF;color:#000000}
  .am-layout{display:block}
  .am-result,.am-quick,.am-table-wrap{break-inside:avoid}
}