/* Aptel GSM — style.css
   Alap stílusok + komponensek a főoldalhoz. */

:root{
  --gutter: 48px;      /* szekciók oldalsó margója */
  --card-pad: 48px;    /* nagy promó-kártyák belső margója */
}

body{margin:0;background:#EFF5FE;font-family:'Space Grotesk',sans-serif;color:#17233D;-webkit-font-smoothing:antialiased; overflow-x:hidden;}
h1,h2,h3{font-family:'Space Grotesk',sans-serif;margin:0;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;display:block;}
button{font-family:inherit;}
table{max-width:100%;}

.nav-link{color:#425066;font-weight:600;font-size:13.5px;transition:color .15s ease;white-space:nowrap;}
.nav-link:hover{color:#0B1830;}

.side-link{display:flex;align-items:center;color:#425066;font-weight:600;font-size:14.5px;padding:11px 12px;border-radius:10px;transition:background .15s ease,color .15s ease;}
.side-link:hover{background:#EAF2FD;color:#0B1830;}

.btn-primary{background:#1C5FD6;color:#FFFFFF;transition:background .15s ease,transform .15s ease;border:none;cursor:pointer;}
.btn-primary:hover{background:#154BAE;transform:translateY(-1px);}

.btn-outline{background:transparent;color:#0B1830;border:1.5px solid #C9D6EC;transition:background .15s ease,color .15s ease;cursor:pointer;}
.btn-outline:hover{background:#EAF2FD;border-color:#1C5FD6;}

.cat-card{transition:transform .18s ease,box-shadow .18s ease;}
.cat-card:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(18,25,43,0.08);}

.prod-card{transition:transform .18s ease,box-shadow .18s ease;}
.prod-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(18,25,43,0.10);}

.deal-card{transition:transform .18s ease,box-shadow .18s ease;}
.deal-card:hover{transform:translateY(-4px);}

/* ---- Mobile nav ---- */
.menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;}
.menu-toggle svg{display:block;}

.mobile-nav{
  display:none;
  flex-direction:column;
  gap:4px;
  background:#FFFFFF;
  border-bottom:1px solid #ECECEA;
  padding:8px 24px 18px;
}
.mobile-nav a{
  padding:12px 6px;
  font-weight:600;
  font-size:15.5px;
  color:#0B1830;
  border-bottom:1px solid #F3F3F1;
}
.mobile-nav.open{display:flex;}

/* ---- Inquiry modal ---- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(18,25,43,0.55);
  display:none; align-items:center; justify-content:center;
  padding:20px; z-index:1000;
}
.modal-overlay.open{display:flex;}
.modal-box{
  background:#FFFFFF; border-radius:20px; padding:36px;
  width:100%; max-width:440px; box-sizing:border-box;
  position:relative; max-height:90vh; overflow-y:auto;
}
.modal-close{
  position:absolute; top:16px; right:16px; background:none; border:none;
  cursor:pointer; padding:6px; color:#8A8D8F;
}
.modal-box h3{font-size:22px; color:#0B1830; margin-bottom:6px;}
.modal-sub{font-size:14px; color:#8A8D8F; margin:0 0 20px;}
.form-field{display:flex; flex-direction:column; gap:6px; margin-bottom:14px;}
.form-field label{font-size:12.5px; font-weight:700; color:#565A5C;}
.form-field input, .form-field textarea, .form-field select{
  padding:12px 14px; border-radius:10px; border:1.5px solid #E4E4E1;
  font-size:14.5px; font-family:inherit; box-sizing:border-box; resize:vertical;
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{outline:none; border-color:#1C5FD6;}
.form-field select{background:#fff; color:inherit;}
.promo-3 > div{padding:clamp(24px,2.6vw,40px) !important;}
.promo-3 h2{font-size:24px !important;}
@media (max-width:1320px){
  .promo-3{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .promo-3 > div:nth-child(3){grid-column:1 / -1;}
}
.legal-text h2:not(.legal-title){font-size:19px; color:#0B1830; margin:30px 0 10px; letter-spacing:-0.005em;}
.legal-text p{margin:0 0 14px; font-size:15.5px; line-height:1.75; color:#3E4145;}
.legal-text ul{margin:0 0 16px; padding-left:22px; display:flex; flex-direction:column; gap:6px;}
.legal-text li{font-size:15.5px; line-height:1.65; color:#3E4145;}
.legal-text strong{color:#0B1830;}
.check-grid{display:flex; flex-wrap:wrap; gap:10px;}
.check-item{display:flex; align-items:center; gap:8px; padding:10px 14px; border:1.5px solid #E4E4E1; border-radius:10px; background:#fff; font-size:14px; font-weight:600; color:#0B1830; cursor:pointer;}
.check-item input{width:auto; margin:0; accent-color:#1C5FD6;}
.form-msg{font-size:13.5px; margin-top:10px; display:none;}
.form-msg.success{display:block; color:#1B7A3B;}
.form-msg.error{display:block; color:#C23B4C;}
.hp-field{position:absolute; left:-9999px; opacity:0;}

@media (max-width: 980px){
  :root{ --gutter: 24px; --card-pad: 28px; }
  .product-detail-grid{grid-template-columns:1fr !important;}
  .hide-mobile{display:none !important;}
  .menu-toggle{display:inline-flex !important;}

  .app-shell{flex-direction:column !important;}
  .sidebar{
    width:100% !important; height:auto !important; position:relative !important;
    border-right:none !important; border-bottom:1px solid #EDF1F8;
    flex-direction:row !important; align-items:center !important; justify-content:space-between !important;
    gap:0 !important; padding:14px var(--gutter) !important;
  }
  .sidebar-nav, .sidebar-foot{display:none !important;}
  .menu-toggle-row{display:flex !important; gap:16px; align-items:center;}

  .hero-grid{grid-template-columns:1fr !important; gap:32px !important;}
  .hero-image-wrap{justify-content:center !important;}
  .bb-grid{grid-template-columns:1fr !important;}
  .about-grid{grid-template-columns:1fr !important; gap:28px !important;}
  .about-photo{position:static !important; order:-1;}
  .about-banner{height:min(var(--about-h, 380px), 62vw) !important;}
  .cat-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .prod-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .deal-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .promo-grid{grid-template-columns:1fr !important;}
  .contact-grid{grid-template-columns:1fr !important;}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .footer-grid > div:first-child{grid-column:1 / -1 !important;}
  .brand-row{flex-wrap:wrap !important; gap:28px !important;}
  .deal-corner-img{width:90px !important; height:90px !important;}

  .page-h1{font-size:32px !important; line-height:1.18 !important;}
  .section-h2{font-size:24px !important;}
  .modal-box{padding:24px !important;}

  .admin-table{min-width:600px;}
  .admin-topbar{flex-wrap:wrap; gap:12px !important; padding:12px 16px !important;}
  .admin-nav-scroll{width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:2px;}
  .admin-grid{grid-template-columns:1fr !important;}
}

@media (max-width: 640px){
  :root{ --gutter: 18px; --card-pad: 22px; }
  .cat-grid, .prod-grid, .deal-grid{grid-template-columns:1fr !important;}
  .footer-grid{grid-template-columns:1fr !important;}
  .footer-grid > div:first-child{grid-column:auto !important;}
  .page-h1{font-size:27px !important;}
  .section-h2{font-size:21px !important;}
  .brand-row{gap:20px 28px !important;}
}



/* Rólunk mondták — Google-értékelés stílusú kártyasor */
.rv-wrap{position:relative;}
.rv-track{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:4px 2px 12px;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.rv-track::-webkit-scrollbar{display:none;}
.rv-card{flex:0 0 calc((100% - 44px)/3);min-width:290px;scroll-snap-align:start;background:#FFFFFF;border:1px solid #EDF1F8;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(28,95,214,.06);}
.rv-body{padding:28px 28px 22px;display:flex;flex-direction:column;gap:12px;flex:1;}
.rv-title{margin:0;font-family:'Space Grotesk',sans-serif;font-size:19px;font-weight:700;color:#0B1830;letter-spacing:-.01em;}
.rv-stars{display:flex;align-items:center;gap:3px;}
.rv-label{margin-left:8px;font-size:13px;font-weight:600;color:#6B7280;}
.rv-text{margin:0;font-size:14.5px;line-height:1.65;color:#3E4145;}
.rv-foot{background:#F4F8FE;padding:16px 28px;display:flex;align-items:center;gap:12px;border-top:1px solid #EDF1F8;}
.rv-avatar{width:44px;height:44px;border-radius:999px;object-fit:cover;flex-shrink:0;background:#EDF1F8;}
.rv-avatar-ph{display:flex;align-items:center;justify-content:center;font-weight:700;color:#1C5FD6;font-size:16px;}
.rv-who{display:flex;flex-direction:column;min-width:0;}
.rv-name{font-size:14px;font-weight:700;color:#0B1830;}
.rv-handle{font-size:12.5px;color:#8A8D8F;}
.rv-nav{display:flex;gap:10px;justify-content:flex-end;margin-top:14px;}
.rv-btn{width:42px;height:42px;border-radius:999px;border:1px solid #D6E3FA;background:#fff;color:#1C5FD6;font-size:18px;cursor:pointer;}
.rv-btn:hover{background:#EAF2FD;}
@media (max-width:900px){.rv-card{flex-basis:78%;}}

/* Fejlesztői sáv (legalul) */
.dev-bar{width:100%;box-sizing:border-box;padding:11px var(--gutter);background:#0B1830;text-align:center;font-size:12px;letter-spacing:.02em;color:#8A9BB8;}
.dev-bar a{color:#BBD3F7;font-weight:600;border-bottom:1px solid transparent;transition:color .15s,border-color .15s;}
.dev-bar a:hover{color:#FFFFFF;border-bottom-color:#6FA4F2;}

/* Kövess minket sáv */
.social-band{width:100%;max-width:1280px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:32px 36px;border-radius:24px;background:linear-gradient(135deg,#EAF2FD 0%,#DCE9FB 100%);border:1px solid #D6E3FA;}
.social-btns{display:flex;gap:14px;flex-wrap:wrap;}
.social-btn{display:flex;align-items:center;gap:12px;background:#FFFFFF;border:1px solid #D6E3FA;border-radius:999px;padding:9px 24px 9px 9px;box-shadow:0 6px 18px rgba(28,95,214,.08);transition:transform .15s,box-shadow .15s;}
.social-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(28,95,214,.16);}
.social-ico{width:44px;height:44px;border-radius:999px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.social-lbl{display:flex;flex-direction:column;line-height:1.25;}
.social-lbl strong{font-size:15px;color:#0B1830;}
.social-lbl small{font-size:12.5px;color:#64738D;}
@media (max-width:700px){.social-band{padding:24px 20px;}.social-btns{width:100%;}.social-btn{flex:1 1 100%;}}

/* Lábléc térkép */
.footer-map{width:100%;height:210px;border-radius:16px;overflow:hidden;border:1px solid #D6E3FA;background:#EAF2FD;margin-top:4px;}
.footer-map iframe{width:100%;height:100%;border:0;display:block;}
@media (max-width:700px){.footer-map{height:240px;}}

/* Termék-galéria */
.prod-thumbs{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;}
.prod-thumb{width:72px;height:72px;padding:0;border-radius:12px;overflow:hidden;border:2px solid #EDF1F8;background:#EAF2FD;cursor:pointer;opacity:.75;transition:opacity .15s,border-color .15s;}
.prod-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.prod-thumb:hover{opacity:1;}
.prod-thumb.active{border-color:#1C5FD6;opacity:1;}