/* Plumber Quote & Contact — frontend */

/* Fonts are loaded dynamically by the plugin (Google) or site-wide by the
   Brand Kit (@font-face). Families come from the --pc-font-* variables. */

.pc-wrap{
    background:var(--pc-section-bg);
    color:var(--pc-text);
    font-family:var(--pc-font-body, system-ui, -apple-system, sans-serif) !important;
    font-size:calc(1rem * var(--pc-body-size,1)) !important;
    padding:clamp(2.5rem,6vw,5rem) clamp(1rem,5vw,2rem);
    box-sizing:border-box;
    line-height:var(--pc-body-lh,1.6) !important;
    letter-spacing:var(--pc-body-ls,normal) !important;
}
.pc-wrap *,.pc-wrap *::before,.pc-wrap *::after{box-sizing:border-box;}

.pc-eyebrow{
    display:inline-block;
    font-family:var(--pc-font-body, system-ui, -apple-system, sans-serif) !important;
    font-weight:600;
    font-size:calc(.8rem * var(--pc-body-size,1)) !important;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--pc-accent);
    background:color-mix(in srgb,var(--pc-accent) 12%,transparent);
    padding:.35rem .75rem;
    border-radius:999px;
    margin-bottom:1rem;
}
.pc-heading{
    font-family:var(--pc-font-heading, system-ui, -apple-system, sans-serif) !important;
    font-weight:700;
    color:var(--pc-heading);
    font-size:calc(clamp(1.7rem,3.6vw,2.6rem) * var(--pc-heading-size,1)) !important;
    line-height:var(--pc-heading-lh,1.15) !important;
    letter-spacing:var(--pc-heading-ls,normal) !important;
    margin:0 0 .75rem;
}

/* Body font on text elements that themes love to override */
.pc-subhead,
.pc-field label,
.pc-consent span,
.pc-details li {
    font-family:var(--pc-font-body, system-ui, -apple-system, sans-serif) !important;
}

.pc-subhead{
    font-size:calc(clamp(1rem,1.4vw,1.12rem) * var(--pc-body-size,1)) !important;
    max-width:38ch;
    margin:0 0 1.5rem;
    color:var(--pc-text);
}

/* ---- Card ---- */
.pc-card{
    background:var(--pc-card-bg);
    border-radius:calc(var(--pc-radius) + 4px);
    padding:clamp(1.5rem,3vw,2.25rem);
    box-shadow:0 18px 50px -24px rgba(13,27,42,.35),0 2px 6px rgba(13,27,42,.05);
    border:1px solid color-mix(in srgb,var(--pc-input-border) 60%,transparent);
}

/* ---- Form ---- */
.pc-form{margin:0;display:flex;flex-direction:column;height:100%;}
/* The message field stretches to fill spare height, pushing the button (and
   consent line, if shown) to the bottom of the card. When the card is only as
   tall as its content — e.g. the quote section — there is no spare height to
   absorb, so the form looks exactly as before. */
.pc-field--grow{flex:1 1 auto;display:flex;flex-direction:column;}
.pc-field--grow textarea{flex:1 1 auto;}
.pc-row{display:flex;gap:1rem;flex-wrap:wrap;}
.pc-row .pc-field{flex:1 1 calc(50% - .5rem);min-width:160px;}
.pc-field{margin-bottom:1.05rem;}
.pc-field label,.pc-consent span{
    display:block;
    font-family:var(--pc-font-field, var(--pc-font-body, system-ui, -apple-system, sans-serif)) !important;
    font-weight:600;
    font-size:calc(.9rem * var(--pc-field-size,1)) !important;
    letter-spacing:var(--pc-field-ls,normal) !important;
    color:var(--pc-label,var(--pc-heading));
    margin-bottom:.4rem;
}
.pc-field input,
.pc-field textarea,
.pc-select select{
    width:100%;
    font-family:var(--pc-font-field, var(--pc-font-body, system-ui, -apple-system, sans-serif)) !important;
    font-size:calc(1rem * var(--pc-field-size,1)) !important;
    line-height:var(--pc-field-lh,1.5) !important;
    letter-spacing:var(--pc-field-ls,normal) !important;
    color:var(--pc-input-text);
    background-color:var(--pc-input-bg);
    background-image:none;
    border:1.5px solid var(--pc-input-border);
    border-radius:var(--pc-radius);
    padding:.8rem .95rem;
    height:auto;
    transition:border-color .15s ease,box-shadow .15s ease;
    -webkit-appearance:none;-moz-appearance:none;appearance:none;
}
.pc-field textarea{resize:vertical;min-height:110px;}

/* Select: defeat theme height/font/arrow so the text is never clipped. */
.pc-select select{
    height:auto !important;
    min-height:3.35rem;
    line-height:1.5 !important;
    padding-right:2.75rem;
    background-image:none !important;
    text-overflow:ellipsis;
}
.pc-select select::-ms-expand{display:none;}
.pc-field input:focus,
.pc-field textarea:focus,
.pc-select select:focus{
    outline:none;
    border-color:var(--pc-accent);
    box-shadow:0 0 0 3px color-mix(in srgb,var(--pc-accent) 22%,transparent);
}
.pc-field input::placeholder,
.pc-field textarea::placeholder{color:var(--pc-placeholder, color-mix(in srgb,var(--pc-input-text) 45%,transparent)) !important;}

/* Custom select arrow */
.pc-select{position:relative;}
.pc-select::after{
    content:"";
    position:absolute;right:1rem;top:50%;
    width:.55rem;height:.55rem;
    border-right:2px solid var(--pc-text);
    border-bottom:2px solid var(--pc-text);
    transform:translateY(-65%) rotate(45deg);
    pointer-events:none;
}

/* Consent */
.pc-consent{
    display:flex;align-items:flex-start;gap:.6rem;
    margin:.25rem 0 1.1rem;cursor:pointer;
}
.pc-consent input{margin-top:.2rem;flex:0 0 auto;accent-color:var(--pc-accent);}
.pc-consent span{margin:0;font-family:var(--pc-font-field, var(--pc-font-body, system-ui, -apple-system, sans-serif)) !important;font-weight:500;font-size:calc(.9rem * var(--pc-field-size,1)) !important;letter-spacing:var(--pc-field-ls,normal) !important;color:var(--pc-text);}

/* Honeypot */
.pc-hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden;}

/* Button */
.pc-btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
    width:100%;
    font-family:var(--pc-font-button, system-ui, -apple-system, sans-serif) !important;
    font-weight:600;font-size:calc(1.05rem * var(--pc-button-size,1)) !important;
    letter-spacing:var(--pc-button-ls,normal) !important;
    line-height:var(--pc-button-lh,normal) !important;
    color:var(--pc-btn-text);
    background:var(--pc-accent);
    border:none;
    border-radius:var(--pc-radius);
    padding:.95rem 1.5rem;
    cursor:pointer;
    transition:background .15s ease,transform .08s ease,box-shadow .15s ease;
    box-shadow:0 10px 24px -10px color-mix(in srgb,var(--pc-accent) 80%,transparent);
}
.pc-btn:hover{background:var(--pc-accent-hover);}
.pc-btn:active{transform:translateY(1px);}
.pc-btn:focus-visible{outline:3px solid color-mix(in srgb,var(--pc-accent) 45%,transparent);outline-offset:2px;}
.pc-btn[disabled]{opacity:.75;cursor:not-allowed;}

.pc-spinner{display:none;width:1.05rem;height:1.05rem;border:2.5px solid color-mix(in srgb,var(--pc-btn-text) 45%,transparent);border-top-color:var(--pc-btn-text);border-radius:50%;animation:pc-spin .7s linear infinite;}
.pc-form.is-sending .pc-spinner{display:inline-block;}
@keyframes pc-spin{to{transform:rotate(360deg);}}

/* Feedback */
.pc-feedback{margin-top:1rem;border-radius:var(--pc-radius);font-size:.95rem;display:none;padding:.85rem 1rem;}
.pc-feedback.is-ok{display:block;background:color-mix(in srgb,#19a974 14%,transparent);color:#0b6b48;border:1px solid color-mix(in srgb,#19a974 35%,transparent);}
.pc-feedback.is-err{display:block;background:color-mix(in srgb,#e5484d 12%,transparent);color:#a81d22;border:1px solid color-mix(in srgb,#e5484d 35%,transparent);}

/* ---- Quote section layout ---- */
.pc-quote-inner{
    max-width:1100px;margin:0 auto;
    display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;
}
.pc-quote.pc-has-bg{background-size:cover;background-position:center;}
.pc-quote.pc-has-bg .pc-eyebrow{background:rgba(255,255,255,.15);color:#fff;}
.pc-quote.pc-has-bg .pc-heading{color:#fff;}
.pc-quote.pc-has-bg .pc-subhead{color:rgba(255,255,255,.9);}

/* ---- Contact section layout ---- */
.pc-contact-inner{
    max-width:1100px;margin:0 auto;
    display:grid;grid-template-columns:0.85fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:stretch;
}
/* Keep the form card the same height as the info/map column. */
.pc-contact-inner>.pc-card{height:100%;}
.pc-details{list-style:none;margin:1.75rem 0 0;padding:0;}
.pc-details li{display:flex;align-items:flex-start;gap:.9rem;margin-bottom:1.1rem;font-size:1rem;}
.pc-details a{color:var(--pc-text);text-decoration:none;}
.pc-details a:hover{color:var(--pc-accent);}
.pc-ico{
    flex:0 0 auto;display:grid;place-items:center;
    width:2.6rem;height:2.6rem;border-radius:50%;
    background:color-mix(in srgb,var(--pc-accent) 12%,transparent);
    color:var(--pc-accent);
}
.pc-map{margin-top:1.5rem;border-radius:var(--pc-radius);overflow:hidden;border:1px solid var(--pc-input-border);}
.pc-map iframe{display:block;width:100%;height:240px;border:0;}

/* ---- Responsive ---- */
@media (max-width:820px){
    .pc-quote-inner,.pc-contact-inner{grid-template-columns:1fr;}
    .pc-quote-copy{text-align:center;}
    .pc-quote-copy .pc-subhead{margin-left:auto;margin-right:auto;}
}
@media (max-width:520px){
    .pc-row .pc-field{flex:1 1 100%;}
    .pc-card{padding:1.35rem;}
}

@media (prefers-reduced-motion:reduce){
    .pc-spinner{animation:none;}
    .pc-btn{transition:none;}
}


/* Card background image + colour overlay */
.pc-card{position:relative;}
.pc-card>*{position:relative;z-index:1;}
.pc-card--bg{
    background-image:var(--pc-card-img);
    background-size:cover;
    background-position:center;
}
.pc-card--overlay::before{
    content:"";
    position:absolute;
    inset:0;
    background:var(--pc-card-overlay);
    border-radius:inherit;
    z-index:0;
    pointer-events:none;
}

/* Service area heading + embedded map */
.pc-map-label{
    font-family:var(--pc-font-heading, system-ui, -apple-system, sans-serif) !important;
    color:var(--pc-heading);
    font-size:calc(1.15rem * var(--pc-heading-size,1));
    font-weight:700;
    letter-spacing:var(--pc-heading-ls,normal);
    margin:1.75rem 0 .65rem;
}
.pc-map--embed{
    border-radius:var(--pc-radius);
    overflow:hidden;
    border:1px solid var(--pc-input-border);
}
.pc-map--embed iframe,
.pc-map--embed img{display:block;width:100%;max-width:100%;border:0;}
.pc-map--embed iframe{min-height:240px;}