*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
    --gold: #F5B800;
    --black: #0D0D0D;
    --dark: #111111;
    --dark2: #1A1A1A;
    --warm-white: #F4F1EC;
    --gray: #888880;
  }
  html { scroll-behavior: smooth; }
  body { font-family: 'Barlow', sans-serif; background: var(--black); color: var(--warm-white); overflow-x: hidden; }

  /* NAV */
  nav {
    position: fixed; top: 0; left: 0; right: 0; z-index: 100;
    padding: 24px 60px; display: flex; align-items: center; justify-content: space-between;
    background: rgba(13,13,13,0.94); backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(245,184,0,0.12);
  }
  .nav-logo img { height: 44px; filter: brightness(0) invert(1); }
  .nav-links { display: flex; gap: 36px; list-style: none; }
  .nav-links a {
    font-family: 'Barlow Condensed', sans-serif; font-weight: 600; font-size: 13px;
    letter-spacing: 2px; text-transform: uppercase;
    color: rgba(244,241,236,0.7); text-decoration: none; transition: color 0.2s;
  }
  .nav-links a:hover, .nav-links a.active { color: var(--gold); }
  .nav-cta {
    font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 13px;
    letter-spacing: 2px; text-transform: uppercase;
    background: var(--gold); color: var(--black); border: none; padding: 12px 28px; cursor: pointer;
    transition: background 0.2s;
  }
  .nav-cta:hover { background: #ffd233; }

  /* PAGE HERO */
  .page-hero {
    padding: 160px 60px 80px;
    background: var(--dark);
    position: relative; overflow: hidden;
    border-bottom: 1px solid rgba(245,184,0,0.08);
  }
  .page-hero::before {
    content: '';
    position: absolute; top: 0; right: 0; bottom: 0; width: 40%;
    background: radial-gradient(ellipse at 80% 50%, rgba(245,184,0,0.05) 0%, transparent 70%);
    pointer-events: none;
  }
  .page-tag {
    font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 700;
    letter-spacing: 4px; text-transform: uppercase; color: var(--gold);
    display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
  }
  .page-tag::before { content: ''; display: block; width: 24px; height: 1px; background: var(--gold); }
  .page-title {
    font-family: 'Barlow Condensed', sans-serif; font-size: clamp(52px, 7vw, 96px);
    font-weight: 900; text-transform: uppercase; line-height: 0.92;
  }
  .page-title .gold { color: var(--gold); }
  .page-subtitle {
    margin-top: 20px; font-size: 16px; color: rgba(244,241,236,0.5); font-weight: 300;
    max-width: 480px; line-height: 1.7;
  }

  /* MAIN LAYOUT */
  .page-body { display: grid; grid-template-columns: 1fr 1.4fr; gap: 0; min-height: calc(100vh - 340px); }

  /* LEFT SIDEBAR */
  .sidebar {
    background: var(--dark); padding: 72px 60px; border-right: 1px solid rgba(245,184,0,0.08);
    position: sticky; top: 89px; height: fit-content;
  }
  .sidebar-title {
    font-family: 'Barlow Condensed', sans-serif; font-size: 20px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 1px; margin-bottom: 32px;
    padding-bottom: 20px; border-bottom: 1px solid rgba(245,184,0,0.1);
  }
  .step-list { display: flex; flex-direction: column; gap: 0; }
  .step-item {
    display: flex; gap: 20px; padding: 20px 0;
    border-bottom: 1px solid rgba(244,241,236,0.05);
    cursor: pointer; transition: opacity 0.2s;
  }
  .step-item:last-child { border-bottom: none; }
  .step-num {
    font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 700;
    letter-spacing: 2px; color: var(--gold); padding-top: 2px; min-width: 28px;
    opacity: 0.5; transition: opacity 0.2s;
  }
  .step-item.active .step-num { opacity: 1; }
  .step-info-title {
    font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.5px;
    color: rgba(244,241,236,0.4); transition: color 0.2s;
  }
  .step-item.active .step-info-title { color: var(--warm-white); }
  .step-info-desc { font-size: 12px; color: rgba(244,241,236,0.25); margin-top: 3px; }

  /* Progress bar */
  .progress-wrap { margin-top: 48px; }
  .progress-label {
    display: flex; justify-content: space-between;
    font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
    color: rgba(244,241,236,0.3); margin-bottom: 10px;
  }
  .progress-bar { height: 2px; background: rgba(244,241,236,0.08); position: relative; }
  .progress-fill {
    height: 100%; background: var(--gold); transition: width 0.5s ease;
    position: absolute; top: 0; left: 0;
  }

  /* Contact info */
  .sidebar-contact { margin-top: 48px; display: flex; flex-direction: column; gap: 16px; }
  a.contact-row, .contact-row { display: flex; align-items: center; gap: 12px; font-size: 13px; color: rgba(244,241,236,0.5) !important; text-decoration: none; transition: color .2s; }
  a.contact-row:hover { color: var(--gold) !important; }
  .contact-row svg { width: 14px; height: 14px; stroke: var(--gold); fill: none; stroke-width: 1.5; flex-shrink: 0; }

  /* FORM AREA */
  .form-area { padding: 72px 80px; }

  /* Steps */
  .form-step { display: none; }
  .form-step.active { display: block; }
  .step-heading {
    font-family: 'Barlow Condensed', sans-serif; font-size: 32px; font-weight: 900;
    text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px;
  }
  .step-heading .gold { color: var(--gold); }
  .step-desc { font-size: 14px; color: rgba(244,241,236,0.4); margin-bottom: 40px; }

  .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
  .form-grid.single { grid-template-columns: 1fr; }
  .form-group { display: flex; flex-direction: column; }
  .form-label {
    font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 700;
    letter-spacing: 3px; text-transform: uppercase; color: var(--gold);
    padding: 14px 20px 0; background: var(--dark2);
  }
  .form-input, .form-textarea, .form-select {
    background: var(--dark2); border: none; border-bottom: 2px solid transparent;
    padding: 8px 20px 16px; font-family: 'Barlow', sans-serif; font-size: 15px;
    color: var(--warm-white); outline: none; width: 100%; transition: border-color 0.2s;
  }
  .form-input::placeholder, .form-textarea::placeholder { color: rgba(244,241,236,0.2); }
  .form-input:focus, .form-textarea:focus, .form-select:focus { border-bottom-color: var(--gold); }
  .form-input.error { border-bottom-color: #ff4444; }
  .form-textarea { resize: none; height: 140px; }
  .form-select { appearance: none; cursor: pointer; color: rgba(244,241,236,0.6); }
  .form-select.chosen { color: var(--warm-white); }
  .form-select option { background: var(--dark2); color: var(--warm-white); }

  /* Service picker */
  .service-picker { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; margin-top: 0; }
  .service-option {
    background: var(--dark2); padding: 24px 20px; cursor: pointer;
    border: 2px solid transparent; transition: all 0.2s;
    display: flex; flex-direction: column; gap: 8px;
  }
  .service-option:hover { background: #1e1e1e; border-color: rgba(245,184,0,0.3); }
  .service-option.selected { border-color: var(--gold); background: rgba(245,184,0,0.06); }
  .service-option-num { font-size: 10px; color: var(--gold); font-family: 'Barlow Condensed', sans-serif; letter-spacing: 2px; font-weight: 700; opacity: 0.6; }
  .service-option-name { font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; }
  .service-option-check { width: 18px; height: 18px; border: 1px solid rgba(244,241,236,0.15); border-radius: 50%; margin-top: 4px; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
  .service-option.selected .service-option-check { background: var(--gold); border-color: var(--gold); }
  .service-option.selected .service-option-check::after { content: '✓'; font-size: 10px; color: var(--black); font-weight: 800; }

  /* Date/size fields */
  .size-options { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; }
  .size-option {
    background: var(--dark2); padding: 20px 16px; cursor: pointer; text-align: center;
    border: 2px solid transparent; transition: all 0.2s;
  }
  .size-option:hover { background: #1e1e1e; }
  .size-option.selected { border-color: var(--gold); background: rgba(245,184,0,0.06); }
  .size-option-label { font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 700; text-transform: uppercase; }
  .size-option-sub { font-size: 11px; color: var(--gray); margin-top: 4px; }

  /* Nav buttons */
  .form-nav { display: flex; gap: 12px; margin-top: 40px; align-items: center; }
  .btn-next {
    font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: 13px;
    letter-spacing: 2.5px; text-transform: uppercase;
    background: var(--gold); color: var(--black); border: none; padding: 18px 40px;
    cursor: pointer; display: flex; align-items: center; gap: 10px; transition: background 0.2s, transform 0.15s;
  }
  .btn-next:hover { background: #ffd233; transform: translateY(-2px); }
  .btn-next svg { width: 14px; height: 14px; stroke: var(--black); fill: none; stroke-width: 2.5; }
  .btn-back {
    font-family: 'Barlow Condensed', sans-serif; font-weight: 600; font-size: 13px;
    letter-spacing: 2px; text-transform: uppercase;
    background: transparent; color: rgba(244,241,236,0.4); border: 1px solid rgba(244,241,236,0.15);
    padding: 18px 28px; cursor: pointer; display: flex; align-items: center; gap: 8px; transition: all 0.2s;
  }
  .btn-back:hover { color: var(--warm-white); border-color: rgba(244,241,236,0.3); }
  .btn-back svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; }
  .error-msg { font-size: 12px; color: #ff6b6b; margin-top: 8px; display: none; }
  .error-msg.show { display: block; }

  /* SUCCESS */
  .success-screen {
    display: none; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; padding: 80px 40px; min-height: 500px;
  }
  .success-screen.show { display: flex; }
  .success-circle {
    width: 100px; height: 100px; border: 2px solid var(--gold); border-radius: 50%;
    display: flex; align-items: center; justify-content: center; margin-bottom: 32px;
    animation: scaleIn 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
  }
  @keyframes scaleIn { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }
  .success-circle svg { width: 40px; height: 40px; stroke: var(--gold); fill: none; stroke-width: 1.5; }
  .success-title { font-family: 'Barlow Condensed', sans-serif; font-size: 48px; font-weight: 900; text-transform: uppercase; }
  .success-sub { font-size: 15px; color: rgba(244,241,236,0.5); margin-top: 12px; max-width: 360px; line-height: 1.7; }
  .success-back {
    margin-top: 40px; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 13px;
    letter-spacing: 2px; text-transform: uppercase; background: transparent; color: var(--gold);
    border: 1px solid rgba(245,184,0,0.4); padding: 14px 32px; cursor: pointer; text-decoration: none;
    transition: all 0.2s; display: inline-block;
  }
  .success-back:hover { background: rgba(245,184,0,0.08); }

  footer { background: #080808; padding: 40px 60px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid rgba(245,184,0,0.08); }
  footer img { height: 32px; filter: brightness(0) invert(1); opacity: 0.5; }
  .footer-copy { font-size: 12px; color: var(--gray); }

  .hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; z-index:101; flex-shrink:0; }
  .hamburger span { display:block; width:24px; height:2px; background:var(--warm-white); transition:all 0.3s; }
  .hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
  .hamburger.open span:nth-child(2) { opacity:0; }
  .hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
  @media (max-width:900px){
    nav{padding:16px 20px;}
    .nav-links{display:none;position:fixed;top:73px;left:0;right:0;background:rgba(13,13,13,0.98);backdrop-filter:blur(16px);flex-direction:column;gap:0;padding:8px 0;border-bottom:1px solid rgba(245,184,0,0.12);z-index:99;}
    .nav-links.open{display:flex;}
    .nav-links li{border-bottom:1px solid rgba(244,241,236,0.05);}
    .nav-links a{display:block;padding:16px 24px;font-size:16px;}
    .nav-cta{display:none;}
    .hamburger{display:flex;}
    .page-hero{padding:100px 20px 48px;}
    .page-body{grid-template-columns:1fr;}
    .sidebar{position:relative;top:0;padding:28px 20px 24px;border-right:none;border-bottom:1px solid rgba(245,184,0,0.08);}
    .sidebar-title{margin-bottom:16px;}
    /* Kompakt, egymás melletti lépések mobilon */
    .step-list{flex-direction:row;gap:6px;}
    .step-item{flex:1;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:12px 4px;border-bottom:none;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);border-top:2px solid transparent;transition:border-color .25s,background .25s;}
    .step-item.active{background:rgba(245,184,0,0.06);border-top-color:var(--gold);}
    .step-num{font-size:18px;margin:0;min-width:auto;padding-top:0;}
    .step-info-title{font-size:11px;letter-spacing:1px;line-height:1.15;}
    .step-info-desc{display:none;}
    .progress-wrap{margin-top:20px;}
    .sidebar-contact{display:none;}
    .form-area{padding:40px 20px;}
    .form-grid{grid-template-columns:1fr;}
    .service-picker{grid-template-columns:1fr 1fr;}
    .size-options{grid-template-columns:1fr 1fr;}
    .form-nav{flex-direction:column;}
    .btn-next,.btn-back{width:100%;justify-content:center;}
    footer{padding:32px 20px;flex-direction:column;gap:12px;text-align:center;}
  }


  a { color: #B87400; } a:hover { color: #F5B800; }
  .nav-cta { color: #080808 !important; }
  .section-tag, .page-tag, .hero-tag { color: #F5B800 !important; }

  nav { background: rgba(13,13,13,0) !important; backdrop-filter: blur(0px);
    border-bottom: none;
    transition: padding .35s, background .35s, box-shadow .35s !important; }
  nav.scrolled { background: rgba(13,13,13,0.94) !important; border-bottom: 1px solid rgba(245,184,0,0.12); box-shadow: 0 8px 30px rgba(0,0,0,0.4);
    padding-top: 14px !important; padding-bottom: 14px !important; }
  .nav-logo img { filter: brightness(0) invert(1) !important; }
  .nav-links a { color: rgba(244,241,236,0.7); }
  .nav-links a:hover, .nav-links a.active { color: #F5B800; }

  .btn-next { color: #080808 !important; }
  footer .footer-copy { color: rgba(246,242,234,0.4) !important; }


  .site-footer { background: #0A0A0A; border-top: 1px solid rgba(245,184,0,0.1); padding: 64px 60px 0; }
  .sf-top { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1.3fr; gap: 48px; padding-bottom: 44px; border-bottom: 1px solid rgba(244,241,236,0.07); }
  .sf-brand img { height: 44px; filter: brightness(0) invert(1); margin-bottom: 20px; }
  .sf-about { font-size: 14px; line-height: 1.8; color: rgba(244,241,236,0.45); max-width: 340px; font-weight: 300; }
  .sf-social { display: flex; gap: 10px; margin-top: 22px; }
  .sf-social a { width: 38px; height: 38px; border: 1px solid rgba(244,241,236,0.14); display: flex; align-items: center; justify-content: center; transition: all .2s; }
  .sf-social a:hover { border-color: #F5B800; background: rgba(245,184,0,0.08); }
  .sf-social svg { width: 16px; height: 16px; stroke: rgba(244,241,236,0.6); fill: none; stroke-width: 1.6; }
  .sf-social a:hover svg { stroke: #F5B800; }
  .sf-col-title { font-family: 'Barlow Condensed', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: #F5B800; margin-bottom: 20px; }
  .sf-links { list-style: none; display: flex; flex-direction: column; gap: 12px; }
  .sf-links a { font-size: 14px; color: rgba(244,241,236,0.55); text-decoration: none; transition: color .2s; }
  .sf-links a:hover { color: #F5B800; }
  .sf-contact-item { display: flex; gap: 11px; align-items: flex-start; font-size: 14px; color: rgba(244,241,236,0.55); margin-bottom: 15px; }
  .sf-contact-item svg { width: 15px; height: 15px; stroke: #F5B800; fill: none; stroke-width: 1.6; flex-shrink: 0; margin-top: 3px; }
  .sf-bottom { display: flex; justify-content: space-between; align-items: center; padding: 22px 0; flex-wrap: wrap; gap: 16px; }
  .sf-copy { font-size: 12px; color: rgba(244,241,236,0.3); }
  .sf-bottom-right { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
  .sf-legal { font-size: 12px; color: rgba(244,241,236,0.3); text-decoration: none; }
  .sf-legal:hover { color: #F5B800; }
  .sf-admin { font-family: 'Barlow Condensed', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: rgba(244,241,236,0.4); text-decoration: none; border: 1px solid rgba(244,241,236,0.15); padding: 8px 15px; display: inline-flex; align-items: center; gap: 8px; transition: all .2s; }
  .sf-admin:hover { border-color: #F5B800; color: #F5B800; }
  .sf-admin svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 1.8; }
  @media (max-width: 900px) { .site-footer { padding: 48px 20px 0; } .sf-top { grid-template-columns: 1fr 1fr; gap: 32px; } .sf-brand { grid-column: 1 / -1; } .sf-bottom { flex-direction: column; text-align: center; } }
/* Címmezők: irányítószám / település / utca egy sorban */
.form-grid.addr-grid { grid-template-columns: 130px 1fr 1.4fr; }
@media (max-width:900px) { .form-grid.addr-grid { grid-template-columns: 1fr; } }
