/* Page styles for contact.html — extracted by design system refactor */
/* All tokens from /assets/css/styles.css apply. */

/* ── Contact page-specific styles only ── */

  /* CONTACT LAYOUT */
  .contact-wrap{max-width:1200px;margin:0 auto;padding:5rem var(--cp);display:grid;grid-template-columns:1fr 360px;gap:4rem;align-items:start}
  
  /* FORM */
  .form-card{background:#fff;border:1px solid #e8eaed;padding:3rem;border-radius: var(--r-xl)}
  .form-card h2{font-family:'Google Sans Display',sans-serif;font-size:1.4rem;font-weight: var(--fw-normal);color:#202124;margin-bottom:.25rem}
  .form-card .sub{font-size:.875rem;color:#5f6368;margin-bottom:2rem}
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:1rem}
  .form-group{margin-bottom:1rem;display:flex;flex-direction:column;gap:.6rem}
  .form-group label{font-size:.8rem;font-weight: var(--fw-medium);color:#3c4043}
  .form-group input,.form-group select,.form-group textarea{
    padding:.65rem .9rem;
    border:1px solid #dadce0;
    border-radius: var(--r-full);
    font-size:.875rem;
    font-family:inherit;
    color:#202124;
    background:#fff;
    outline:none;
    transition: border-color var(--t-fast), box-shadow var(--t-fast);
    width:100%
  }
  .form-group textarea{border-radius: var(--r-xl);resize:vertical;min-height:140px}
  .form-group select{border-radius: var(--r-full);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235f6368' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem}
  .form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#1a73e8;box-shadow:0 0 0 3px rgba(26,115,232,.12)}
  .consent-block{background:#f8f9fa;border:1px solid #e8eaed;border-radius: var(--r-lg);padding:1.5rem;margin:1.25rem 0;font-size:.8rem;color:#5f6368;line-height: var(--lh-normal)}
  .consent-check{display:flex;align-items:flex-start;gap:.5rem;margin-top:.75rem;cursor:pointer}
  .consent-check input[type=checkbox]{width:16px;height:16px;margin-top:2px;flex-shrink:0;accent-color:#1a73e8}
  .consent-check span{font-size:.8rem;color:#3c4043}
  .btn-submit{width:100%;padding:1rem;background:#fdc010;color:var(--c-dark);font-size:.9rem;font-weight: var(--fw-semibold);border:none;border-radius: var(--r-full);cursor:pointer;transition: background var(--t-fast);margin-top:.5rem}
  .btn-submit:hover{background:#e5b000}

  /* SIDEBAR */
  .contact-sidebar{display:flex;flex-direction:column;gap:2rem}
  .info-card{padding:2rem;border:1px solid #e8eaed;border-radius: var(--r-xl)}
  .info-card h3{font-family:'Google Sans',sans-serif;font-size:.95rem;font-weight: var(--fw-semibold);color:#202124;margin-bottom:1rem}
  .info-item{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem}
  .info-item:last-child{margin-bottom:0}
  .info-icon{width:48px;height:48px;border-radius: var(--r-md);background:#f1f3f4;display:flex;align-items:center;justify-content:center;color:#3c4043;flex-shrink:0}
  .info-label{font-size:.75rem;font-weight: var(--fw-medium);color:#5f6368;text-transform:uppercase;letter-spacing: var(--ls-tight);margin-bottom:.15rem}
  .info-val{font-size:.875rem;color:#202124}
  .info-val a{color:#1a73e8;text-decoration:none}
  .info-val a:hover{text-decoration:underline}

  .products-list{display:flex;flex-direction:column;gap:.6rem}
  .product-pill{display:flex;align-items:center;gap:.5rem;padding:.85rem 1.25rem;border:1px solid #e8eaed;border-radius: var(--r-full);font-size:.8rem;font-weight: var(--fw-medium);color:#3c4043;text-decoration:none;transition: border-color var(--t-fast), color var(--t-fast)}
  .product-pill:hover{border-color:#1a73e8;color:#1a73e8}
  .product-pill .dot{width:8px;height:8px;border-radius:50%}
  .dot-blue{background:#1a73e8}
  .dot-green{background:#34a853}
  .dot-purple{background:#9334e6}

  .social-row{display:flex;gap:1rem;flex-wrap:wrap}
  .social-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;border:1px solid #e8eaed;border-radius: var(--r-full);font-size:.8rem;font-weight: var(--fw-medium);color:#3c4043;text-decoration:none;transition: border-color var(--t-fast), color var(--t-fast)}
  .social-btn:hover{border-color:#1a73e8;color:#1a73e8}
  .social-btn svg{flex-shrink:0}

  /* Responsive overrides for contact-specific layout → responsive.css handles global */
  @media(max-width:992px){
    .contact-wrap{grid-template-columns:1fr;gap:2rem}
    .form-row{grid-template-columns:1fr}
  }