/*
Theme Name: Texas Cost Estimating
Theme URI: https://texascostestimating.com
Author: Texas Cost Estimating
Author URI: https://texascostestimating.com
Description: Custom WordPress theme for Texas Cost Estimating — construction cost estimation, quantity takeoff and bid support services across Texas.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: tce
*/

/* ==========================================================================
   0. TOKENS
   ========================================================================== */
:root{
  --black:#0b0c0d;
  --ink:#141517;
  --charcoal:#232529;
  --steel:#3a3d43;
  --gray:#6b6e75;
  --silver-dark:#9a9da4;
  --silver:#c3c6cc;
  --silver-light:#e3e5e8;
  --off-white:#f4f5f6;
  --white:#ffffff;
  --accent:#b7bdc6; /* brushed steel accent used sparingly for lines/glow */

  --font-display:'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-body:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:'IBM Plex Mono', 'Courier New', monospace;

  --radius:2px;
  --shadow-sm:0 2px 10px rgba(11,12,13,.08);
  --shadow-md:0 12px 30px rgba(11,12,13,.16);
  --shadow-lg:0 24px 60px rgba(11,12,13,.28);
  --container:1220px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ==========================================================================
   1. RESET
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
button{font-family:inherit;cursor:pointer;}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;letter-spacing:.01em;line-height:1.08;margin:0 0 .5em;color:var(--black);text-transform:uppercase;}
p{line-height:1.7;color:var(--gray);margin:0 0 1em;}
.container{max-width:var(--container);margin:0 auto;padding:0 24px;}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
}

/* ==========================================================================
   2. BLUEPRINT GRID SIGNATURE (used behind dark sections)
   ========================================================================== */
.blueprint-bg{
  position:relative;
  background-color:var(--black);
  background-image:
    linear-gradient(rgba(195,198,204,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(195,198,204,.06) 1px, transparent 1px);
  background-size:42px 42px;
}
.blueprint-bg::before{
  content:"";
  position:absolute;inset:0;
  background:radial-gradient(ellipse at 20% 0%, rgba(195,198,204,.14), transparent 55%),
             radial-gradient(ellipse at 90% 100%, rgba(195,198,204,.08), transparent 45%);
  pointer-events:none;
}
.corner-mark{position:absolute;width:26px;height:26px;border:2px solid var(--silver);opacity:.55;}
.corner-mark.tl{top:18px;left:18px;border-right:0;border-bottom:0;}
.corner-mark.tr{top:18px;right:18px;border-left:0;border-bottom:0;}
.corner-mark.bl{bottom:18px;left:18px;border-right:0;border-top:0;}
.corner-mark.br{bottom:18px;right:18px;border-left:0;border-top:0;}

/* Steel beam divider with rivets */
.beam-divider{position:relative;height:14px;background:linear-gradient(180deg,var(--silver-light),var(--silver) 45%,var(--silver-dark));box-shadow:inset 0 2px 4px rgba(255,255,255,.6), inset 0 -3px 6px rgba(0,0,0,.35);}
.beam-divider::after{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle 3px, var(--charcoal) 98%, transparent 100%);
  background-size:48px 14px;background-position:24px 7px;background-repeat:repeat-x;
  opacity:.5;
}

/* ==========================================================================
   3. BUTTONS
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-display);
  font-size:15px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;
  padding:14px 28px;border-radius:var(--radius);border:1px solid transparent;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
  white-space:nowrap;
}
.btn-steel{
  background:linear-gradient(180deg,#e7e9eb,#b9bcc2 55%,#9a9da4);
  color:var(--black);
  box-shadow:var(--shadow-sm);
}
.btn-steel:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.btn-outline{
  background:transparent;border-color:rgba(255,255,255,.35);color:var(--white);
}
.btn-outline:hover{background:rgba(255,255,255,.08);border-color:var(--white);transform:translateY(-2px);}
.btn-dark{background:var(--black);color:var(--white);}
.btn-dark:hover{background:var(--charcoal);transform:translateY(-2px);}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;}

/* ==========================================================================
   4. HEADER
   ========================================================================== */

.announcement-bar{
    background:#ffffff;
    color:#444444;
    overflow:hidden;
    white-space:nowrap;
    padding:10px 0;
}

.announcement-track{
    display:inline-block;
    white-space:nowrap;
    animation: ticker 25s linear infinite;
    font-size:15px;
    font-weight:600;
}

@keyframes ticker{
    0%{
        transform:translateX(100%);
    }
    100%{
        transform:translateX(-100%);
    }
}

/* ====================================
   HEADER
==================================== */

.site-header{
    background:#0b0f14 !important;
    border-bottom:1px solid #20242b;
}

.header-inner{
    min-height:100px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

/* ====================================
   LOGO
==================================== */

.site-branding img,
.custom-logo{
    max-height:85px !important;
    width:auto !important;
}

/* ====================================
   MENU
==================================== */

.primary-nav{
    flex:1;
    display:flex;
    justify-content:center;
}

.primary-nav ul{
    display:flex;
    align-items:center;
    gap:65px !important;
}

.primary-nav li{
    position:relative;
}

.primary-nav a{
    color:#ffffff !important;
    font-size:18px !important;
    font-weight:600 !important;
    text-decoration:none;
}

/* ====================================
   DROPDOWN
==================================== */

.primary-nav .sub-menu{
    display:block !important;
    position:absolute !important;
    top:100% !important;
    left:0 !important;
    min-width:280px;
    background:#161b22;
    z-index:9999;
}

.primary-nav .sub-menu li{
    display:block !important;
    width:100%;
}

.primary-nav .sub-menu a{
    display:block !important;
    width:100%;
    padding:14px 20px !important;
}
.primary-nav li.menu-item-has-children > a{
    display:inline-flex !important;
    align-items:center !important;
}

.primary-nav li.menu-item-has-children > a::after{
    margin-left:6px;
    top:0;
}

/* ====================================
   PHONE
==================================== */

.header-phone{
    color:#ffffff !important;
    font-size:18px;
    font-weight:700;
}

/* ====================================
   BUTTON
==================================== */

.btn-steel{
    background:#f1f1f1 !important;
    color:#111 !important;
    padding:16px 32px !important;
    font-size:15px !important;
    font-weight:700 !important;
    border-radius:4px;
}

/* ====================================
   REMOVE SMALL DOT
==================================== */

.menu-toggle{
    display:none !important;
}

/* ====================================
   MOBILE
==================================== */

@media(max-width:991px){

    .announcement-inner{
        flex-direction:column;
        text-align:center;
    }

    .primary-nav{
        display:none;
    }

    .header-inner{
        min-height:80px;
    }

    .site-branding img{
        max-height:60px !important;
    }
}
@media (max-width:960px){
  .primary-nav{position:fixed;top:82px;left:0;right:0;bottom:0;background:var(--black);transform:translateX(100%);transition:transform .35s var(--ease);overflow:auto;}
  .primary-nav.is-open{transform:translateX(0);}
  .primary-nav ul{flex-direction:column;align-items:stretch;padding:20px;gap:6px;}
  .primary-nav a{padding:16px;font-size:18px;}
  .header-phone{display:none;}
  .menu-toggle{display:flex;}
}

/* ==========================================================================
   5. HERO
   ========================================================================== */
.hero{position:relative;padding:120px 0 100px;color:var(--white);overflow:hidden;}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--silver);padding:8px 14px;border:1px solid rgba(195,198,204,.35);border-radius:20px;
  margin-bottom:28px;
}
.hero-eyebrow::before{content:"";width:7px;height:7px;background:var(--silver);border-radius:50%;box-shadow:0 0 0 4px rgba(195,198,204,.18);}
.hero h1{font-size:clamp(38px,5.4vw,68px);max-width:920px;color:var(--white);}
.hero h1 em{font-style:normal;color:var(--silver);}
.hero-sub{font-size:18px;max-width:640px;color:var(--silver-light);margin-bottom:36px;}
.hero-strip{margin-top:56px;display:flex;flex-wrap:wrap;gap:0;border-top:1px solid rgba(195,198,204,.2);}
.hero-strip .item{flex:1 1 200px;padding:20px 24px 0;border-right:1px solid rgba(195,198,204,.15);}
.hero-strip .item:last-child{border-right:0;}
.hero-strip .num{font-family:var(--font-mono);font-size:26px;color:var(--white);}
.hero-strip .label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--silver-dark);margin-top:4px;}

/* ==========================================================================
   6. SECTION SCAFFOLDING
   ========================================================================== */
.section{padding:100px 0;}
.section-alt{background:var(--off-white);}
.section-dark{background:var(--black);color:var(--white);}
.section-dark p{color:var(--silver);}
.section-dark h2, .section-dark h3{color:var(--white);}
.eyebrow{
  font-family:var(--font-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gray);
  display:flex;align-items:center;gap:10px;margin-bottom:14px;
}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--silver-dark);}
.section-dark .eyebrow{color:var(--silver);}
.section-head{max-width:760px;margin-bottom:56px;}
.section-head h2{font-size:clamp(28px,3.6vw,44px);}
.section-head p{font-size:17px;}

/* ==========================================================================
   7. GRIDS / CARDS
   ========================================================================== */
.grid{display:grid;gap:26px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:960px){.grid-2,.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

.card{
  background:var(--white);border:1px solid var(--silver-light);border-radius:var(--radius);
  padding:32px 28px;transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
  position:relative;
}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--silver);}
.card .icon{
  width:52px;height:52px;border-radius:var(--radius);
  background:linear-gradient(145deg,var(--charcoal),var(--black));
  display:flex;align-items:center;justify-content:center;margin-bottom:20px;
  border:1px solid var(--steel);
}
.card .icon svg{width:24px;height:24px;stroke:var(--silver-light);}
.card h3{font-size:19px;margin-bottom:10px;}
.card p{font-size:15px;margin:0;}

.card-dark{background:var(--charcoal);border:1px solid rgba(195,198,204,.14);color:var(--white);}
.card-dark p{color:var(--silver);}
.card-dark h3{color:var(--white);}

/* service pill list */
.pill-grid{display:flex;flex-wrap:wrap;gap:10px;}
.pill{
  font-family:var(--font-mono);font-size:12.5px;letter-spacing:.03em;
  padding:9px 16px;border:1px solid var(--silver-light);border-radius:20px;color:var(--charcoal);
  transition:background .2s,color .2s,border-color .2s;
}
.pill:hover{background:var(--black);color:var(--white);border-color:var(--black);}

/* number counter row */
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid rgba(195,198,204,.18);border-radius:var(--radius);overflow:hidden;}
.stat{padding:34px 20px;text-align:center;border-right:1px solid rgba(195,198,204,.18);}
.stat:last-child{border-right:0;}
.stat .n{font-family:var(--font-mono);font-size:34px;color:var(--white);}
.stat .l{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-dark);margin-top:6px;}
@media (max-width:768px){.stat-row{grid-template-columns:repeat(2,1fr);}.stat{border-bottom:1px solid rgba(195,198,204,.18);}}

/* process steps */
.step-row{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;counter-reset:step;}
.step{position:relative;padding-top:10px;}
.step::before{
  counter-increment:step;content:"0" counter(step);
  font-family:var(--font-mono);font-size:44px;color:var(--silver-light);
  display:block;margin-bottom:10px;
}
.section-dark .step::before{color:var(--steel);}
@media (max-width:900px){.step-row{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.step-row{grid-template-columns:1fr;}}

/* trade / dense list */
.trade-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--silver-light);border:1px solid var(--silver-light);}
.trade-list .t-item{background:var(--white);padding:22px 24px;}
.trade-list .t-item h4{font-family:var(--font-display);font-size:16px;text-transform:uppercase;margin:0 0 6px;color:var(--black);}
.trade-list .t-item p{font-size:14px;margin:0;}
@media (max-width:900px){.trade-list{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.trade-list{grid-template-columns:1fr;}}

/* cities */
.city-cloud{display:flex;flex-wrap:wrap;gap:10px;}
.city-cloud span{font-family:var(--font-mono);font-size:13px;color:var(--silver-light);padding:8px 14px;border:1px solid rgba(195,198,204,.25);border-radius:20px;}

/* FAQ */
.faq{border-top:1px solid var(--silver-light);}
.faq-item{border-bottom:1px solid var(--silver-light);}
.faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;
  background:none;border:0;padding:22px 4px;text-align:left;
  font-family:var(--font-display);font-size:18px;text-transform:none;letter-spacing:0;color:var(--black);
}
.faq-q .plus{font-family:var(--font-mono);font-size:20px;color:var(--silver-dark);transition:transform .3s var(--ease);flex-shrink:0;}
.faq-item.is-open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease);}
.faq-a p{padding:0 4px 22px;margin:0;}

/* process / CTA banner */
.cta-banner{
  background:linear-gradient(120deg,var(--black) 0%, var(--charcoal) 100%);
  border-radius:var(--radius);padding:64px 56px;color:var(--white);
  display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;
  position:relative;overflow:hidden;
}
.cta-banner::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border:1px solid rgba(195,198,204,.2);border-radius:50%;}
.cta-banner h2{color:var(--white);margin-bottom:8px;}
.cta-banner p{color:var(--silver);margin:0;}

/* two-col text/media */
.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
@media (max-width:900px){.split{grid-template-columns:1fr;gap:36px;}}
.media-frame{
  position:relative;border-radius:var(--radius);overflow:hidden;
  background:linear-gradient(150deg,var(--charcoal),var(--black));
  aspect-ratio:4/3;border:1px solid var(--steel);
  display:flex;align-items:center;justify-content:center;
}
.media-frame .grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(195,198,204,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(195,198,204,.08) 1px,transparent 1px);background-size:30px 30px;}
.media-frame .mark{font-family:var(--font-mono);color:var(--silver);font-size:13px;letter-spacing:.15em;text-transform:uppercase;position:relative;z-index:1;text-align:center;padding:20px;}

/* testimonial */
.quote-block{border-left:3px solid var(--silver-dark);padding-left:26px;}
.quote-block p{font-size:19px;color:var(--charcoal);font-family:var(--font-display);text-transform:none;letter-spacing:0;font-weight:500;}
.quote-block cite{font-family:var(--font-mono);font-size:12.5px;color:var(--gray);letter-spacing:.08em;text-transform:uppercase;font-style:normal;}

/* ==========================================================================
   8. FOOTER
   ========================================================================== */
.site-footer{background:var(--black);color:var(--silver);padding-top:80px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:60px;border-bottom:1px solid rgba(195,198,204,.15);}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr;}}
.footer-grid h4{color:var(--white);font-size:14px;letter-spacing:.1em;margin-bottom:18px;}
.footer-grid ul li{margin-bottom:10px;}
.footer-grid a{font-size:14px;color:var(--silver-dark);transition:color .2s;}
.footer-grid a:hover{color:var(--white);}
.footer-brand .site-title{margin-bottom:12px;}
.footer-brand p{font-size:14px;color:var(--silver-dark);max-width:320px;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;flex-wrap:wrap;gap:10px;}
.footer-bottom p{margin:0;font-size:12.5px;color:var(--steel);}
.footer-bottom .legal a{font-size:12.5px;color:var(--steel);margin-left:18px;}

/* ==========================================================================
   9. FORM
   ========================================================================== */
.tce-form{display:grid;gap:16px;}
.tce-form .row-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media (max-width:560px){.tce-form .row-2{grid-template-columns:1fr;}}
.tce-form input, .tce-form select, .tce-form textarea{
  width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(195,198,204,.25);
  color:var(--white);padding:14px 16px;border-radius:var(--radius);font-family:var(--font-body);font-size:14px;
}
.tce-form input::placeholder, .tce-form textarea::placeholder{color:var(--silver-dark);}
.tce-form textarea{min-height:120px;resize:vertical;}
.tce-form label{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--silver-dark);margin-bottom:6px;display:block;}

/* ==========================================================================
   10. REVEAL / SCROLL ANIMATION
   ========================================================================== */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease), transform .7s var(--ease);}
.reveal.is-visible{opacity:1;transform:translateY(0);}
.reveal-delay-1{transition-delay:.1s;}
.reveal-delay-2{transition-delay:.2s;}
.reveal-delay-3{transition-delay:.3s;}

/* ==========================================================================
   11. ENTRY CONTENT (generic pages: services/trades/locations/about/etc.)
   ========================================================================== */
.entry-content{color:var(--gray);font-size:16px;}
.entry-content h2{font-size:clamp(24px,3vw,32px);margin-top:1.6em;}
.entry-content h2:first-child{margin-top:0;}
.entry-content h3{font-size:20px;margin-top:1.4em;}
.entry-content p{margin-bottom:1.2em;}
.entry-content ul{margin:0 0 1.4em;}
.entry-content ul li{position:relative;padding-left:26px;margin-bottom:10px;color:var(--gray);}
.entry-content ul li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;background:var(--silver-dark);}
.entry-content strong{color:var(--black);}
.entry-content a{color:var(--charcoal);text-decoration:underline;text-decoration-color:var(--silver);text-underline-offset:3px;}
.entry-content table{width:100%;border-collapse:collapse;margin-bottom:1.6em;}
.entry-content table th, .entry-content table td{border:1px solid var(--silver-light);padding:12px 14px;text-align:left;font-size:14.5px;}
.entry-content table th{background:var(--off-white);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.04em;font-size:13px;}
.entry-content blockquote{border-left:3px solid var(--silver-dark);padding-left:22px;margin:1.6em 0;font-style:normal;color:var(--charcoal);font-size:17px;}
.entry-content .lead{font-size:19px;color:var(--charcoal);}
.entry-content hr{border:0;border-top:1px solid var(--silver-light);margin:2.4em 0;}

/* Content-embedded card grid (used for hub pages authored via content:encoded) */
.entry-content .grid{margin:1.6em 0 2em;}
.entry-content .card p{font-size:14.5px;}
.entry-content .card h3{font-size:17px;}

/* ==========================================================================
   12. DROPDOWN / MEGA NAV
   ========================================================================== */
.primary-nav ul.menu, .primary-nav > ul{display:flex;align-items:center;gap:2px;}
.primary-nav li.menu-item-has-children{position:relative;}
.primary-nav li.menu-item-has-children > a::after{content:"";display:inline-block;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-left:7px;opacity:.7;}
.primary-nav .sub-menu{
  list-style:none;margin:0;padding:10px;position:absolute;top:100%;left:0;
  min-width:230px;background:var(--ink);border:1px solid rgba(195,198,204,.18);
  box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
  z-index:50;
}
.primary-nav li.menu-item-has-children:hover > .sub-menu,
.primary-nav li.menu-item-has-children:focus-within > .sub-menu{opacity:1;visibility:visible;transform:translateY(0);}
.primary-nav .sub-menu a{padding:10px 12px;font-size:13.5px;letter-spacing:.02em;border-radius:2px;}
.primary-nav .sub-menu a::after{display:none;}
.primary-nav .sub-menu .view-all a{color:var(--silver);border-top:1px solid rgba(195,198,204,.15);margin-top:6px;padding-top:14px;}
@media (max-width:960px){
  .primary-nav .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;background:rgba(255,255,255,.03);display:none;margin:4px 0 8px 12px;}
  .primary-nav li.menu-item-has-children.is-open .sub-menu{display:block;}
  .primary-nav li.menu-item-has-children > a::after{float:right;margin-top:8px;}
}
.skip-link{position:absolute;left:-999px;top:auto;background:var(--black);color:var(--white);padding:12px 18px;z-index:2000;}
.skip-link:focus{left:12px;top:12px;}

/* Focus visibility */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:2px solid var(--silver);outline-offset:2px;
}