/* ==========================================================================
   "All tile" theme — the site default (html.theme-tile on every page).
   Tile is the material of the whole site: a handmade cream tile floor,
   glazed ceramic cards and buttons, mosaic seams between sections and
   tile walls for the footer and final call to action.
   Everything is scoped to html.theme-tile so the default design is untouched.
   ========================================================================== */
.theme-tile{
  --tile-cream:#f8f0e1;
  --tile-cream-2:#f3e7d1;
  --grout:#e3d3b4;
  --grout-dark:#cdb68b;
  --glaze-hi:rgba(255,255,255,.85);
  --glaze-lo:rgba(110,72,24,.14);
  --tile-r:6px;
  --bevel:inset 0 2px 0 var(--glaze-hi),inset 0 -3px 0 var(--glaze-lo),inset 2px 0 0 rgba(255,255,255,.5),inset -2px 0 0 rgba(110,72,24,.07);
  --lift:0 2px 0 var(--grout-dark),0 10px 20px rgba(70,46,12,.10);
}

/* ---------- the floor: a very subtle repeating encaustic tile ---------- */
.theme-tile body,.theme-tile main{
  background-color:var(--tile-cream);
  background-image:url("assets/stone-slabs.svg?v=1");
  background-size:720px 480px;
}
.theme-tile .services,.theme-tile .reviews,.theme-tile .areas,.theme-tile .tools-band,.theme-tile .content-section.alt,.theme-tile .trust-strip{
  background-color:#fbf6ec;
  background-image:url("assets/stone-slabs.svg?v=1");
  background-size:720px 480px;
}
.theme-tile .faq,.theme-tile .estimate-section,.theme-tile .hard-moves,.theme-tile .hire-smart,.theme-tile .intro,.theme-tile .content-section,.theme-tile .local-band{background-color:transparent}

/* ---------- quiet seams: a single stone-colored hairline between sections ---------- */
.theme-tile main>section{position:relative}
.theme-tile main>section+section{border-top:1px solid #e6d8bd}
.theme-tile .sitehead::after{display:none}
.theme-tile .sitehead{border-bottom:1px solid #e6d8bd}

/* ---------- header + utility ---------- */
.theme-tile .utility{background-color:#063f63;background-image:url("assets/marble-veins-blue.svg?v=1"),radial-gradient(ellipse at 20% 25%,rgba(120,190,235,.10),transparent 55%);background-size:900px 600px,auto}
.theme-tile .sitehead{background:rgba(250,243,230,.97)}
.theme-tile .main-nav a:hover{background:#f1e4cb}
.theme-tile .mega{background:var(--tile-cream);border-radius:0;box-shadow:var(--lift)}

/* ---------- glazed ceramic surfaces ---------- */
.theme-tile .service-card,.theme-tile .area-card,.theme-tile .hard-grid li,.theme-tile .smart-grid li,.theme-tile .review-card:not(.featured),
.theme-tile .tool-card,.theme-tile .estimate-tool,.theme-tile .side-card,
.theme-tile .process-card,.theme-tile .related-card,.theme-tile .intro-review,.theme-tile .next-steps-card,.theme-tile .phase,.theme-tile .inner-hero-grid>div:first-child{
  border-radius:var(--tile-r);
  border:1px solid var(--grout-dark);
  background:linear-gradient(150deg,#fffdf8 0%,#fbf4e6 60%,#f6ead4 100%);
  box-shadow:var(--bevel),var(--lift);
}
/* quote form, contact boxes and final CTA keep their ceramic mosaic backdrop */
.theme-tile .service-card{overflow:hidden}
.theme-tile .service-art{border-bottom:6px solid #fbf4e6;box-shadow:0 1px 0 var(--grout-dark)}
.theme-tile .area-card:hover,.theme-tile .service-card:hover,.theme-tile .related-card:hover{transform:translateY(-2px);box-shadow:var(--bevel),0 4px 0 var(--grout-dark),0 16px 28px rgba(70,46,12,.14)}

/* deep-glaze tiles for emphasis */
.theme-tile .review-card.featured,.theme-tile .local-band-grid{
  border-radius:var(--tile-r);border:1px solid #03304b;
  background:linear-gradient(150deg,#0a5d91,#063f63 70%);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.18),inset 0 -3px 0 rgba(0,0,0,.25),0 2px 0 #03304b,0 12px 24px rgba(3,40,64,.25);
}

/* trust strip: four tiles */
.theme-tile .trust-grid{gap:12px;padding-block:22px}
.theme-tile .trust-grid>div,.theme-tile .trust-grid>div:first-child{padding:18px 20px;border:1px solid var(--grout-dark);border-radius:var(--tile-r);background:linear-gradient(150deg,#fffdf8,#f6ead4);box-shadow:var(--bevel),0 2px 0 var(--grout-dark)}

/* eyebrows become little tile chips */
.theme-tile .eyebrow{display:inline-block;padding:6px 10px 5px;border-radius:4px;background:#fff8ea;border:1px solid var(--grout);box-shadow:inset 0 -2px 0 var(--glaze-lo)}
.theme-tile .eyebrow.light{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);box-shadow:none}
.theme-tile .inner-hero .eyebrow{background:#fff3df}

/* ---------- buttons + fields as glazed tiles ---------- */
.theme-tile .button{border-radius:var(--tile-r);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),inset 0 -3px 0 rgba(120,40,0,.25),0 3px 0 #a63b0b,0 10px 18px rgba(166,59,11,.18)}
.theme-tile .button-outline{background:linear-gradient(150deg,#fffdf8,#f3e7d1);border-color:var(--grout-dark);box-shadow:var(--bevel),0 2px 0 var(--grout-dark)}
.theme-tile .button-cream{border-radius:var(--tile-r)}
.theme-tile .field input,.theme-tile .field select,.theme-tile .estimate-tool input:not([type=checkbox]),.theme-tile .estimate-tool select,.theme-tile .tool-form select,.theme-tile .tool-form input[type=number]{
  border-radius:5px;border-color:#d7c6a4;background-color:#fffdf8;box-shadow:inset 0 2px 3px rgba(110,72,24,.08)}
.theme-tile .hard-icon,.theme-tile .smart-grid li>span,.theme-tile .call-icon,.theme-tile .next-steps-card b{border-radius:5px;box-shadow:inset 0 2px 0 rgba(255,255,255,.2),inset 0 -2px 0 rgba(0,0,0,.25)}

/* FAQ rows as a column of tiles */
.theme-tile .accordion{border:0;display:grid;gap:10px}
.theme-tile .accordion details{padding:0 18px;border:1px solid var(--grout-dark);border-radius:var(--tile-r);background:linear-gradient(150deg,#fffdf8,#f8eedc);box-shadow:var(--bevel),0 2px 0 var(--grout-dark)}
.theme-tile .accordion summary{padding:18px 0}

/* ---------- tile walls ---------- */
.theme-tile .story-copy{background-color:#063f63;background-image:url("assets/marble-veins-blue.svg?v=1"),radial-gradient(ellipse at 20% 25%,rgba(120,190,235,.10),transparent 55%);background-size:900px 600px,auto}
.theme-tile .final-cta{
  background-color:#c8642b;
  background-image:
    url("assets/marble-veins.svg?v=1"),
    radial-gradient(ellipse at 22% 28%,rgba(255,236,210,.16),transparent 55%),
    radial-gradient(ellipse at 80% 75%,rgba(120,40,0,.12),transparent 60%),
    linear-gradient(110deg,#b9541f,#d06c30 55%,#dc8a3a);
  background-size:900px 600px,auto,auto,auto;
}
.theme-tile footer{position:relative;background-color:#05314d;background-image:url("assets/marble-veins-blue.svg?v=1"),radial-gradient(ellipse at 20% 25%,rgba(120,190,235,.10),transparent 55%);background-size:900px 600px,auto}
.theme-tile .footer-brand img{border-radius:var(--tile-r);box-shadow:var(--bevel)}
.theme-tile .mobile-actions{background:rgba(250,243,230,.97)}

/* photo prints keep their paper look; ornaments stay as they are */
.theme-tile .crew-photo,.theme-tile .print{border-radius:3px}


/* ==========================================================================
   Huge blocks: every section is one carved stone block; mortar shows between
   them; cards are inlaid into the block instead of floating above it.
   ========================================================================== */
.theme-tile{--mortar:#d8c6a3;--block-gap:10px;--block-r:8px}
.theme-tile body{background:var(--mortar)}
.theme-tile main{background:none;padding:var(--block-gap) 0 0}
.theme-tile main>section{
  margin:0 var(--block-gap) var(--block-gap);
  border-radius:var(--block-r);
  border-top:0!important;
  overflow:hidden;
  background-color:#f8f0e1;
  background-image:url("assets/stone-slabs.svg?v=1");
  background-size:720px 480px;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.75),inset 0 -3px 0 rgba(110,72,24,.12),inset 2px 0 0 rgba(255,255,255,.35),inset -2px 0 0 rgba(110,72,24,.06),0 1px 0 rgba(255,255,255,.35);
}
/* stone tone varies block to block, like real cut stone */
.theme-tile main>section:nth-of-type(3n+2){background-color:#f1e5ce}
.theme-tile main>section:nth-of-type(3n){background-color:#fbf5ea}
/* sections that were transparent (and showed the mortar) get the stone tones too */
.theme-tile main>section:is(.faq,.estimate-section,.hard-moves,.hire-smart,.content-section,.local-band){background-color:#f8f0e1}
.theme-tile main>section:is(.faq,.estimate-section,.hard-moves,.hire-smart,.content-section,.local-band):nth-of-type(3n+2){background-color:#f1e5ce}
.theme-tile main>section:is(.faq,.estimate-section,.hard-moves,.hire-smart,.content-section,.local-band):nth-of-type(3n){background-color:#fbf5ea}
/* blocks with their own surface keep it */
.theme-tile main>.hero{background-color:#3c97d6;background-image:none}
.theme-tile main>.story{background:var(--navy)}
.theme-tile main>.final-cta{background-color:#c8642b}
.theme-tile main>.intro{overflow:visible}            /* quote card rises over the hero block */
.theme-tile main>.hero{overflow:hidden}
.theme-tile footer{margin:0 var(--block-gap) var(--block-gap);border-radius:var(--block-r);overflow:hidden;box-shadow:inset 0 2px 0 rgba(255,255,255,.12),inset 0 -3px 0 rgba(0,0,0,.25)}
.theme-tile footer::before{display:none}
.theme-tile .link-band{border:0}

/* inlay: cards sit in the block, not above it */
.theme-tile .service-card,.theme-tile .area-card,.theme-tile .hard-grid li,.theme-tile .smart-grid li,.theme-tile .review-card:not(.featured),
.theme-tile .tool-card,.theme-tile .estimate-tool,.theme-tile .process-card,.theme-tile .related-card,.theme-tile .intro-review,.theme-tile .next-steps-card,
.theme-tile .phase,.theme-tile .trust-grid>div,.theme-tile .trust-grid>div:first-child,.theme-tile .accordion details{
  background:rgba(255,253,247,.62);
  border:1px solid rgba(160,128,78,.28);
  box-shadow:inset 0 1px 2px rgba(110,72,24,.10),inset 0 -1px 0 rgba(255,255,255,.6);
}
.theme-tile .area-card:hover,.theme-tile .service-card:hover,.theme-tile .related-card:hover{transform:none;background:rgba(255,253,247,.85);box-shadow:inset 0 1px 2px rgba(110,72,24,.10),0 0 0 1px rgba(160,128,78,.35)}
.theme-tile .service-art{border-bottom:1px solid rgba(160,128,78,.28);box-shadow:none}
.theme-tile .review-card.featured,.theme-tile .local-band-grid{box-shadow:inset 0 2px 4px rgba(0,0,0,.25)}
.theme-tile .side-card{box-shadow:inset 0 1px 2px rgba(110,72,24,.10);background:rgba(255,253,247,.7);border:1px solid rgba(160,128,78,.28)}

@media (max-width:720px){
  .theme-tile{--block-gap:6px;--block-r:6px}
}