/*
  Direction C polish for standard content pages (legal, FAQ, contact, generic).
  Everything is scoped to .mlpa-branded-page / .mlpa-page-head / .mlpa-doc, which
  are only emitted for non-app pages (see mlpa_theme_is_branded_page()), so the
  petsitter-parity commerce / dashboard / funnel surfaces are untouched.
  Explicit 16px bases + em so the parity 62.5% root can't rescale this.
*/

/* ---- Direction C type system for ALL content surfaces ----
   petsitter renders body + headings in Lato, which reads dated next to the
   homepage (Darker Grotesque display + Hanken Grotesk body). This adopts the SAME
   two-typeface system site-wide: Hanken for body/UI text, Darker Grotesque for
   headings. !important is needed to beat petsitter's element-level font rules.
   (Front page never loads this file, so its bespoke type is untouched.) */
body, p, li, dd, dt, td, th, blockquote, figcaption, label, small,
input, textarea, select, button{
    font-family:"Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
h1, h2, h3, h4, h5, h6,
.entry-title, .widget-title, .panel-title, .panel-title a, .page-title, legend{
    font-family:"Darker Grotesque", system-ui, sans-serif !important;
    font-weight:800 !important;
    letter-spacing:-.01em;
}

body.mlpa-branded-page{ background:#fbf7ec; }
body.mlpa-branded-page .page-content{ background:transparent; padding-block:clamp(28px,5vw,52px); }

/* ---- Branded page header band ---- */
.mlpa-page-head{ font-size:16px; background:
        radial-gradient(60% 90% at 92% 0%, rgba(63,138,128,.10), transparent 60%),
        linear-gradient(180deg,#faf6ea,#f2ecdd);
    border-bottom:1px solid #e2ddca; }
.mlpa-page-head__in{ max-width:1000px; margin:0 auto; padding:clamp(30px,5vw,58px) clamp(20px,5vw,40px) clamp(24px,4vw,40px); }
.mlpa-page-head__crumb{ display:flex; align-items:center; gap:.55em; font-family:"Hanken Grotesk",system-ui,sans-serif; font-size:.78em; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#2f6f66; margin:0 0 .8em; }
.mlpa-page-head__crumb a{ color:inherit; text-decoration:none; }
.mlpa-page-head__crumb a:hover{ color:#cc7a2b; }
.mlpa-page-head__crumb .is-current{ color:#847f6f; }
.mlpa-page-head h1{ margin:0; font-family:"Darker Grotesque",system-ui,sans-serif; font-weight:900; font-size:clamp(2.3em,5.5vw,3.6em); line-height:.92; letter-spacing:-.01em; color:#2a2b1f; }

/* ---- Reading column (the .entry-content lives inside .mlpa-doc) ---- */
.mlpa-doc{ font-size:16px; max-width:760px; margin-inline:auto; font-family:"Hanken Grotesk",system-ui,sans-serif; color:#3a3a2e; line-height:1.7; }
.mlpa-doc .entry-content > :first-child{ margin-top:0; }
.mlpa-doc h1,.mlpa-doc h2,.mlpa-doc h3,.mlpa-doc h4{ font-family:"Darker Grotesque",system-ui,sans-serif; font-weight:900; line-height:1.04; letter-spacing:-.01em; color:#2a2b1f; margin:1.7em 0 .5em; }
.mlpa-doc h2{ font-size:1.75em; }
.mlpa-doc h3{ font-size:1.4em; }
.mlpa-doc h4{ font-size:1.15em; }
.mlpa-doc p{ margin:0 0 1.15em; }
.mlpa-doc a{ color:#2f6f66; text-decoration:underline; text-underline-offset:2px; }
.mlpa-doc a:hover{ color:#cc7a2b; }
.mlpa-doc strong{ color:#2a2b1f; }
.mlpa-doc ul,.mlpa-doc ol{ margin:0 0 1.15em 1.35em; padding:0; }
.mlpa-doc li{ margin:.35em 0; }
.mlpa-doc img{ height:auto; border-radius:12px; }
.mlpa-doc blockquote{ margin:1.3em 0; padding:.7em 1.2em; border-left:4px solid #3f8a80; background:#d9ebe6; border-radius:0 10px 10px 0; }
.mlpa-doc blockquote p:last-child{ margin-bottom:0; }
.mlpa-doc hr{ border:0; border-top:1px solid #e2ddca; margin:2.2em 0; }
.mlpa-doc table{ width:100%; border-collapse:collapse; margin:1.4em 0; font-size:.95em; }
.mlpa-doc th,.mlpa-doc td{ border:1px solid #e2ddca; padding:.6em .85em; text-align:left; vertical-align:top; }
.mlpa-doc th{ background:#f2ecdd; font-family:"Darker Grotesque",system-ui,sans-serif; font-weight:800; }

/* Buttons inside prose → Direction C red pill */
.mlpa-doc .button,
.mlpa-doc a.button,
.mlpa-doc .btn,
.mlpa-doc .wp-block-button__link{ display:inline-flex; align-items:center; gap:.5em; background:linear-gradient(180deg,#e89145,#cc7a2b); color:#fff; font-family:"Darker Grotesque",system-ui,sans-serif; font-weight:900; font-size:1.1em; line-height:1; padding:.6em 1.25em; border-radius:10px; text-decoration:none; border:0; box-shadow:0 12px 22px -12px rgba(232,145,69,.7); transition:transform .15s ease; }
.mlpa-doc .button:hover,
.mlpa-doc a.button:hover,
.mlpa-doc .btn:hover,
.mlpa-doc .wp-block-button__link:hover{ transform:translateY(-1px); color:#fff; }

@media (max-width:600px){
    .mlpa-doc{ font-size:15px; }
}

/* Contact Form 7 fields on branded pages (e.g. /opt-out) → Direction C controls */
.mlpa-branded-page .wpcf7{ font-size:16px; margin-top:6px; }
.mlpa-branded-page .wpcf7 label{ display:block; font-family:"Hanken Grotesk",system-ui,sans-serif; font-weight:700; color:#2a2b1f; margin-bottom:16px; }
.mlpa-branded-page .wpcf7 label .optional,
.mlpa-branded-page .wpcf7 label small{ color:#847f6f; font-weight:500; }
.mlpa-branded-page .wpcf7-form-control:not(.wpcf7-submit):not([type="checkbox"]):not([type="radio"]):not([type="acceptance"]){
    display:block; width:100%; box-sizing:border-box; margin-top:7px;
    font-family:"Hanken Grotesk",system-ui,sans-serif; font-size:1em; color:#2a2b1f;
    background:#fff; border:1px solid #e2ddca; border-radius:12px; padding:.75em .95em;
    transition:border-color .15s ease, box-shadow .15s ease;
}
.mlpa-branded-page .wpcf7 textarea.wpcf7-form-control{ min-height:150px; resize:vertical; }
.mlpa-branded-page .wpcf7 select.wpcf7-form-control{
    -webkit-appearance:none; appearance:none; cursor:pointer; padding-right:2.6em;
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232f6f66' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat:no-repeat; background-position:right 14px center;
}
.mlpa-branded-page .wpcf7-form-control:not(.wpcf7-submit):focus{
    outline:0; border-color:#3f8a80; box-shadow:0 0 0 3px rgba(63,138,128,.18);
}
.mlpa-branded-page .wpcf7-submit{
    -webkit-appearance:none; appearance:none; cursor:pointer;
    font-family:"Darker Grotesque",system-ui,sans-serif; font-weight:900; font-size:1.25em; line-height:1.1;
    color:#fff; background:linear-gradient(180deg,#e89145,#cc7a2b); border:0; border-radius:12px;
    padding:.55em 1.6em; margin-top:6px; box-shadow:0 14px 26px -14px rgba(232,145,69,.7);
    transition:transform .15s ease;
}
.mlpa-branded-page .wpcf7-submit:hover{ transform:translateY(-1px); }

/* clean-login form → centered Direction C card (login/reset pages) */
.cleanlogin-form{ max-width:440px; margin:clamp(26px,5vw,50px) auto; background:#fff; border:1px solid #e2ddca; border-radius:16px; padding:clamp(24px,4vw,36px); box-shadow:0 24px 50px -26px rgba(50,50,20,.4); }
.cleanlogin-form h1,.cleanlogin-form h2{ font-family:"Darker Grotesque",system-ui,sans-serif; font-weight:900; margin:0 0 .5em; }
.cleanlogin-form-bottom{ max-width:440px; margin:0 auto; text-align:center; }
/* Log in submit — colour/shape from buttons.css (red primary); here just full-width. */
.cleanlogin-form input[type=submit]{ display:block; width:100%; box-sizing:border-box; margin:6px 0 0; font-size:1.3rem; }
.cleanlogin-form .cleanlogin-remember{ margin-top:12px; color:#726d5f; }

/* "Trouble signing in?" was an unstyled native <details><summary> lost at the
   bottom — surface it as a visible, centered teal disclosure. */
.entry-content details{ max-width:440px; margin:18px auto 0; text-align:center; }
.entry-content details > summary{
    display:inline-flex; align-items:center; gap:.4em; cursor:pointer; list-style:none;
    font-family:"Hanken Grotesk",system-ui,sans-serif; font-weight:700; font-size:1.05em;
    color:#2a2b1f; padding:.55em 1em; border:2px solid rgba(42,43,31,.2); border-radius:999px; background:#fbf7ec;
    transition:border-color .15s ease, color .15s ease;
}
.entry-content details > summary:hover{ border-color:#3f8a80; color:#2f6f66; }
.entry-content details > summary::-webkit-details-marker{ display:none; }
.entry-content details > summary::after{ content:"\f107"; font-family:FontAwesome; font-weight:normal; }
.entry-content details[open] > summary::after{ content:"\f106"; }
.entry-content details[open]{ background:#fff; border:1px solid #e2ddca; border-radius:16px; padding:clamp(18px,3vw,26px); box-shadow:0 20px 44px -28px rgba(50,50,20,.35); }
.entry-content details[open] > summary{ margin-bottom:14px; }