/*
Theme Name: Good Standing & Co.
Theme URI: https://goodstandingandco.com
Author: Good Standing & Co.
Description: Custom theme for Good Standing & Co., a Michigan mobile-notary and mortgage-licensing-compliance business.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: goodstanding
*/

* { box-sizing: border-box; }
body { margin: 0; }
::selection { background: #B0894F; color: #F7F6F2; }
html { scroll-behavior: smooth; }
img { max-width: 100%; }

/* ===== Responsive nav ===== */
.nav-links{display:flex; align-items:center; gap:28px;}
.nav-drop{position:relative;}
.nav-menu{position:absolute; top:100%; left:50%; transform:translateX(-50%) translateY(-6px); min-width:230px; padding:8px; border-radius:3px; display:flex; flex-direction:column; gap:2px; z-index:60; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .16s ease, transform .16s ease; box-shadow:0 18px 36px rgba(16,32,26,.14);}
.nav-drop:hover .nav-menu, .nav-drop:focus-within .nav-menu{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); pointer-events:auto;}
.nav-menu a:hover{background:#EFEEEA;}
.nav-drop-dark .nav-menu a:hover{background:#16281f; color:#EFEEEA !important;}
.nav-burger{display:none; position:absolute; right:6vw; top:50%; transform:translateY(-50%); background:none; border:none; font-size:24px; line-height:1; cursor:pointer; padding:8px; z-index:80; min-width:44px; min-height:44px;}
.nav-mobile-panel{display:none; position:fixed; inset:0; z-index:70; overflow-y:auto; padding:88px 6vw 40px;}
.nav-mobile-panel.open{display:block;}
.nav-mobile-panel a{display:block; padding:16px 4px; text-decoration:none; font-family:'IBM Plex Mono',monospace; font-size:14px; letter-spacing:1px; text-transform:uppercase; border-bottom:1px solid rgba(125,138,124,0.3); min-height:44px;}

/* Notary / Who We Are rows: label navigates, caret toggles an overlaid flyout (doesn't push the rest of the list down) */
.nav-mobile-row{position:relative; display:flex; align-items:stretch; border-bottom:1px solid rgba(125,138,124,0.3);}
.nav-mobile-panel a.nav-mobile-link{flex:1; display:flex; align-items:center; padding:16px 4px; border-bottom:none; min-height:44px;}
.nav-mobile-caret-btn{background:none; border:none; padding:0 14px; margin:0; cursor:pointer; font-size:16px; line-height:1; min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center;}
.nav-mobile-sub{position:absolute; top:100%; left:0; right:0; z-index:75; display:none; flex-direction:column; gap:2px; padding:8px; border-radius:3px; margin-top:2px; box-shadow:0 18px 36px rgba(16,32,26,.14); max-height:60vh; overflow-y:auto;}
.nav-mobile-sub.open{display:flex;}
.nav-mobile-panel .nav-mobile-sub a{padding:12px 14px; border-radius:2px; min-height:auto;}
.nav-mobile-book{display:block; margin-top:20px; text-align:center; text-decoration:none; font-family:'IBM Plex Mono',monospace; font-size:13px; letter-spacing:2px; text-transform:uppercase; padding:16px; border-radius:2px; min-height:44px;}
@media (max-width: 880px){
  .nav-links{display:none;}
  .nav-burger{display:block;}
}

/* honeypot field — off-screen, not display:none, so it still traps naive bots */
.gsc-hp{position:absolute; left:-9999px; top:-9999px;}

.gsc-btn-primary{transition:background .2s ease;}
.gsc-btn-primary:hover{background:#204536;}

/* Calendly embed: widget is width-responsive by default; give it a bit more
   height on small screens so the calendar/time-slot steps aren't cramped. */
@media (max-width: 600px){
  .gsc-calendly-embed .calendly-inline-widget{ height:900px !important; }
}

/* Mobile: two-up image/text grids were cramming photos into a sliver of
   width and cropping them awkwardly. Stack to one column and drop the
   photos on the notary page; the about-page portrait just gets shorter. */
@media (max-width: 880px){
  .gsc-notary-hero-grid, .gsc-notary-how-grid{ grid-template-columns:1fr !important; }
  .gsc-hide-mobile-img{ display:none !important; }
  .gsc-about-grid{ grid-template-columns:1fr !important; }
  .gsc-about-portrait{ min-height:320px !important; }
}
