/*
Theme Name: Artems Towing
Theme URI: https://www.artemstowing.org/
Author: MyAIO
Author URI: https://myaio.com/
Description: Custom Elementor-ready theme for Artems Towing (24/7 towing, Auburn, WA). Logo-blue industrial design. After activating, go to Appearance > Artems Setup to import all 33 Elementor container pages, menus, logo and global colors in one click. Every page stays fully editable in Elementor.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: artems-towing
*/

:root{
  --at-black:#090A0C; --at-steel:#13171C; --at-steel2:#1C2229;
  --at-blue:#1F5FA8; --at-blue-d:#174A85; --at-cyan:#35AED6; --at-cyan-d:#2795BC;
  --at-silver:#ECEEF1; --at-text:#55595F; --at-white:#fff;
  --at-head:'Oswald',sans-serif; --at-body:'Inter',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--at-body);color:var(--at-text);background:#fff;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--at-blue)}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.skip-link:focus{position:fixed;top:8px;left:8px;z-index:100000;width:auto;height:auto;clip:auto;background:#fff;color:#000;padding:10px 16px}

/* ---------- hazard stripe ---------- */
.at-hazard{height:10px;background:repeating-linear-gradient(-45deg,var(--at-cyan) 0 10px,var(--at-black) 10px 20px)}

/* ---------- top bar ---------- */
.at-topbar{background:var(--at-blue);color:#fff;font:600 14px/1 var(--at-body)}
.at-topbar .at-wrap{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:10px 20px}
.at-topbar span{display:inline-flex;align-items:center;gap:8px;margin-right:24px}
.at-topbar .at-wrap a{color:#fff;text-decoration:none;font-weight:700}
.at-topbar .at-wrap a:hover{color:var(--at-cyan)}
.at-ico{width:15px;height:15px;fill:currentColor;flex:none}
.at-topbar .at-ico{fill:var(--at-cyan)}

/* ---------- main header ---------- */
.at-wrap{max-width:1280px;margin:0 auto}
.at-header{background:var(--at-black);position:sticky;top:0;z-index:999}
.admin-bar .at-header{top:32px}
.at-header .at-wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 20px}
.at-logo img,.at-logo .custom-logo{display:block;width:auto;max-height:64px}
.at-logo-text{font:700 26px/1 var(--at-head);color:#fff;text-transform:uppercase;text-decoration:none}
.at-nav{flex:1;display:flex;justify-content:flex-end}
.at-nav ul{list-style:none;margin:0;padding:0}
.at-nav>ul{display:flex;gap:4px}
.at-nav li{position:relative}
.at-header .at-nav a{display:block;color:#fff;text-decoration:none;font:500 17px/1 var(--at-head);text-transform:uppercase;letter-spacing:1.2px;padding:12px 14px;border-bottom:3px solid transparent;transition:color .2s,border-color .2s}
.at-header .at-nav a:hover,.at-header .at-nav .current-menu-item>a,.at-header .at-nav .current-menu-ancestor>a{color:var(--at-cyan);border-bottom-color:var(--at-cyan)}
.at-nav .menu-item-has-children>a::after{content:"";display:inline-block;margin-left:7px;border:5px solid transparent;border-top-color:currentColor;transform:translateY(2px)}
.at-nav .sub-menu{position:absolute;top:100%;left:0;min-width:270px;background:var(--at-steel);border-top:3px solid var(--at-cyan);box-shadow:0 18px 40px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(10px);transition:all .2s;max-height:70vh;overflow:auto}
.at-nav li:hover>.sub-menu,.at-nav li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.at-header .at-nav .sub-menu a{font-size:15px;letter-spacing:.6px;padding:12px 18px;border-bottom:1px solid #232a32;text-transform:none;font-family:var(--at-body);font-weight:500}
.at-header .at-nav .sub-menu a:hover{background:var(--at-steel2)}
a.at-btn{display:inline-flex;align-items:center;gap:10px;background:var(--at-cyan);color:#000!important;text-decoration:none;font:600 17px/1 var(--at-head);text-transform:uppercase;letter-spacing:.8px;padding:15px 22px;border-radius:2px;transition:transform .2s,background .2s;white-space:nowrap}
a.at-btn:hover{background:var(--at-cyan-d);transform:translateY(-3px)}
.at-btn .at-ico{width:16px;height:16px}
.at-header button.at-burger{display:none;background:none!important;border:0!important;box-shadow:none!important;cursor:pointer;padding:8px!important;border-radius:0}
.at-burger span{display:block;width:28px;height:3px;background:#fff;margin:5px 0;transition:.25s}
.at-burger[aria-expanded=true] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.at-burger[aria-expanded=true] span:nth-child(2){opacity:0}
.at-burger[aria-expanded=true] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ---------- floating call + mobile bar ---------- */
a.at-fab{position:fixed;right:26px;bottom:26px;z-index:9999;width:68px;height:68px;border-radius:50%;background:var(--at-blue);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,0,0,.35);animation:at-pulse 1.8s infinite;transition:background .2s,transform .2s}
a.at-fab:hover{background:var(--at-cyan);transform:scale(1.08)}
.at-fab .at-ico{width:28px;height:28px;fill:#fff}
@keyframes at-pulse{0%{box-shadow:0 0 0 0 rgba(53,174,214,.6)}70%{box-shadow:0 0 0 20px rgba(53,174,214,0)}100%{box-shadow:0 0 0 0 rgba(53,174,214,0)}}
a.at-callbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:9999;background:var(--at-cyan);color:#000;text-align:center;text-decoration:none;font:700 18px/1 var(--at-head);text-transform:uppercase;letter-spacing:.8px;padding:17px 10px}
.at-callbar .at-ico{width:17px;height:17px;vertical-align:-2px;margin-right:8px}

/* ---------- footer ---------- */
.at-footer{background:var(--at-steel);color:#B9BEC5;font-size:15px}
.at-footer .at-cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px;padding:72px 20px 48px}
.at-footer .at-cols h4{font:600 22px/1.1 var(--at-head);color:var(--at-cyan);text-transform:uppercase;letter-spacing:.5px;margin:0 0 18px}
.at-footer ul{list-style:none;margin:0;padding:0}
.at-footer li{margin:0 0 8px}
.at-footer .at-cols a:not(.at-btn){color:#C9CCD1;text-decoration:none}
.at-footer .at-cols a:not(.at-btn):hover{color:var(--at-cyan)}
.at-footer li a::before{content:"›";color:var(--at-blue);margin-right:8px;font-weight:700}
.at-footer p{line-height:1.65;margin:16px 0 22px}
.at-footer .at-logo img{max-height:80px}
.at-footer .at-copy{background:var(--at-black);color:#7D838B;font-size:13px;text-align:center;padding:18px 20px}

/* ---------- basic content (non-Elementor pages / posts) ---------- */
.at-content{max-width:860px;margin:0 auto;padding:80px 20px;line-height:1.7}
.at-content h1,.at-content h2,.at-content h3{font-family:var(--at-head);color:#0B0B0C;text-transform:uppercase;line-height:1.1}
.at-content h1{font-size:52px;margin:0 0 24px}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .at-header button.at-burger{display:block}
  .at-header a.at-btn{display:none}
  .at-nav{position:absolute;left:0;right:0;top:100%;background:var(--at-steel);display:none;max-height:calc(100vh - 90px);overflow:auto;border-top:3px solid var(--at-cyan)}
  .at-nav.is-open{display:block}
  .at-nav>ul{flex-direction:column;gap:0}
  .at-header .at-nav a{padding:16px 20px;border-bottom:1px solid #232a32}
  .at-nav .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;display:none;max-height:none;background:var(--at-black)}
  .at-nav li.is-open>.sub-menu{display:block}
  .at-header .at-nav .sub-menu a{padding-left:36px}
  .at-footer .at-cols{grid-template-columns:1fr 1fr}
  .at-topbar .at-hide-t{display:none}
}
@media (max-width:767px){
  .at-topbar{display:none}
  a.at-fab{display:none}
  a.at-callbar{display:block}
  body{padding-bottom:54px}
  .at-footer .at-cols{grid-template-columns:1fr;padding:56px 16px 40px}
  .at-header .at-wrap{padding:10px 16px}
  .at-logo img,.at-logo .custom-logo{max-height:52px}
}
@media (max-width:782px){.admin-bar .at-header{top:0}}
