/* Divi bridge for FSB Welding & Fabrication (prototype structure, 27 Oct 2026; built from the Tree Problem No Problem bridge).
   The whole prototype stylesheet (site.css) ships in this theme and convert.py keeps the prototype's structure
   (converter.theme_css = "prototype"). Divi wraps every module in extra boxes and gives sections, headings, lists and links
   its own defaults; this file, printed BEFORE site.css (and after Divi's inline CSS), makes Divi's boxes invisible or neutral
   so the prototype rules apply unchanged. Add a rule here only for a Divi default you can SEE leaking (tools/why.py).

   Conventions set by convert.py:
     .sk-t   transparent structure (the row and column Divi needs around every section's content)
     .sk-b   a Divi section/group that stands for a prototype element (kept as a real box, reset to a plain block)
     .sk-i   neutral wrapper around inline-start Text content (stops WordPress wpautop adding <p>)
   Selectors use :where(.sk) so they weigh the same as a one-class rule; later rules in site.css win ties. */

/* ---------- 1. Divi's structure and module wrappers do not generate boxes ---------- */
.sk .sk-t,
.sk .sk-t > .et_pb_column,
.sk .et_pb_text,
.sk .et_pb_text_inner,
.sk .et_pb_code,
.sk .et_pb_code_inner,
.sk .sk-b .et_pb_image,
.sk .sk-b .et_pb_image_wrap,
.sk .sk-i { display: contents; }
/* the Theme Builder header/footer wrappers: the prototype's own fixed <header class="d-head"> works as in the draft */
.sk .et-l--header, .sk .et-l--header > .et_builder_inner_content,
.sk .et-l--footer, .sk .et-l--footer > .et_builder_inner_content { display: contents; }
.sk #page-container, .sk #et-boc, .sk #et-main-area { overflow: visible; }

/* ---------- 2. sections and groups that carry prototype classes: plain blocks ---------- */
:where(.sk) .sk-b {
  display: block; flex-direction: row; flex-wrap: nowrap; align-items: normal; justify-content: normal;
  column-gap: 0; row-gap: 0; --horizontal-gap: 0px; --vertical-gap: 0px;
  width: auto; max-width: none; min-height: 0; margin: 0; padding: 0; border: 0;
  background-color: transparent; text-align: inherit; position: static;
}
:where(.sk) .sk-b { margin-bottom: 0 !important; } /* Divi's module gap; the generated .m.css copies of the prototype margins load after this */
:where(.sk li).sk-b { display: list-item; list-style: none; }
:where(.sk) .et_pb_text, :where(.sk) .et_pb_code { line-height: inherit; font-size: inherit; font-weight: inherit; color: inherit; text-align: inherit; }
/* Divi prints each text module's own "text-align: start"; two classes win in either order of the cold/warm cache. */
.sk .et_pb_text, .sk .et_pb_code { text-align: inherit; }
/* new sections Ryan adds are transparent (the paper page shows through); a background set in the builder still wins */
:where(.sk) .et_pb_section { background-color: transparent; }

/* ---------- 3. Divi's global element defaults (its reset and theme CSS) back to what the draft had (browser defaults) ---------- */
html, .sk #page-container, .sk #et-main-area, .sk #main-content { background: #f4f4f1; }
:where(.sk) h1, :where(.sk) h2, :where(.sk) h3, :where(.sk) h4, :where(.sk) h5, :where(.sk) h6 { padding: 0; color: inherit; font-weight: 700; line-height: inherit; }
:where(.sk) h1 { font-size: 2em; margin: .67em 0; }
:where(.sk) h2 { font-size: 1.5em; margin: .83em 0; }
:where(.sk) h3 { font-size: 1.17em; margin: 1em 0; }
:where(.sk) h4 { font-size: 1em; margin: 1.33em 0; }
:where(.sk) h5 { font-size: .83em; margin: 1.67em 0; }
:where(.sk) h6 { font-size: .67em; margin: 2.33em 0; }
:where(.sk) p { padding: 0; }
:where(.sk) a { text-decoration: underline; } /* Divi: a { text-decoration: none }; the draft relies on the browser's underline */
:where(.sk) small { font-size: smaller; }
:where(.sk) sup, :where(.sk) sub { font-size: smaller; }
:where(.sk) blockquote { margin: 1em 40px; padding: 0; border: 0; font-style: normal; }
:where(.sk) figure { margin: 1em 40px; }
:where(.sk) dd { margin-left: 40px; }
:where(.sk) ul, :where(.sk) ol { margin: 1em 0; padding-left: 40px; }
:where(.sk) img { max-width: 100%; height: auto; }
/* Divi: .entry-content ul { list-style-type: disc; padding: 0 0 23px 1em; line-height: 26px } outweighs the prototype's one-class list
   rules; build_theme.py writes !important copies of the prototype's list padding/line-height/list-style. */
:where(.sk) .entry-content ul, :where(.sk) .entry-content ol { padding: 0 0 0 40px; line-height: inherit; list-style-position: outside; } /* Divi: inside */
:where(.sk) input, :where(.sk) textarea, :where(.sk) select, :where(.sk) button { -webkit-appearance: none; appearance: none; }
:where(.sk) button { font: inherit; }

/* ---------- 4. things Divi adds around the page ---------- */
.sk .et_builder_inner_content { z-index: auto; }
.sk.et_fixed_nav.et_show_nav #page-container { padding-top: 0 !important; }
.sk #main-content .container::before { display: none; }
.skip { position: absolute; left: -9999px; top: 8px; z-index: 99999; background: #0b0d10; color: #fff; padding: 8px 14px; }
.skip:focus { left: 8px; }
/* the weld canvases site.js adds between sections sit above Divi's section boxes */
.sk .d-weld, .sk .d-steps__weld { position: relative; }

/* ---------- 5. the quote form: Divi's Contact Form module (class d-form) inside the draft's white form card (.d-formcard) ----------
   Divi puts the label and the input side by side in a field box (the draft nests the input in the label), so the spacing moves
   to the field box. The drawings upload is not part of Divi's form (no file field): see the page notes. */
.sk .d-form .et_pb_contact { margin: 0; padding: 0; }
.sk .d-form .et_pb_contact_form { display: grid; grid-template-columns: 1fr 1fr; column-gap: 22px; row-gap: 0; margin: 0; padding: 0; }
.sk .d-form .et_pb_contact_form > * { grid-column: 1 / -1; }
.sk .d-form .et_pb_contact_form > .et_pb_contact_field.et_flex_column_12_24 { grid-column: auto; }
.sk .d-form .et_pb_contact_field { display: block; width: auto; max-width: none; margin: 0 0 20px !important; padding: 0; position: relative; }
.sk .d-form .et_pb_contact_form_label { display: block; font: 600 13px/1.3 "Barlow Condensed", "Arial Narrow", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #58616b; margin: 0 !important; padding: 0; }
.sk .d-form .et_pb_contact_field .input { display: block; width: 100%; margin: 8px 0 0; font: 400 17px/1.4 "Barlow", system-ui, sans-serif; padding: 14px; border: 1px solid rgba(12, 16, 21, .22); border-radius: 0; background: #f4f4f1; color: #1b2128; box-shadow: none; }
.sk .d-form .et_pb_contact_field .input:focus { outline: 0; border-color: #ff6a1a; box-shadow: 0 0 0 3px rgba(255, 106, 26, .18); background: #fff; color: #1b2128; }
.sk .d-form .et_pb_contact_field textarea.input { min-height: 130px; resize: vertical; }
.sk .d-form .et_pb_contact_field select.input { -webkit-appearance: none; appearance: none; padding-right: 40px;
  background-image: linear-gradient(45deg, transparent 50%, #c2470e 50%), linear-gradient(135deg, #c2470e 50%, transparent 50%);
  background-position: calc(100% - 20px) 52%, calc(100% - 14px) 52%; background-size: 6px 6px; background-repeat: no-repeat; }
.sk .d-form .et_pb_contact_field[data-type="select"]::after { display: none; }
.sk .d-form .et_pb_contact_field .input::placeholder { color: #98a1aa; opacity: 1; }
.sk .d-form .et_contact_bottom_container { display: block; float: none; width: 100%; margin: 6px 0 0; text-align: left; }
.sk .d-form .et_pb_button_wrapper { display: block; text-align: left; } /* Divi's module CSS right-aligns it */
.sk .d-form .et_pb_contact_submit,
.sk .d-form .et_pb_contact_submit:hover { display: inline-flex; align-items: center; justify-content: center; gap: 12px; margin: 0; border: 0; border-radius: 0;
  /* the draft's arrow icon: Divi's submit button can't hold an SVG, so it is drawn as a background */
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a0b02' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") no-repeat right 24px center / 20px 20px, linear-gradient(180deg, #ff8a3a, #ff5c0b);
  color: #1a0b02; font: 700 17px/1 "Barlow Condensed", "Arial Narrow", sans-serif !important;
  letter-spacing: .08em; text-transform: uppercase; padding: 18px 56px 18px 26px !important; cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); transition: filter .25s, transform .25s; }
.sk .d-form .et_pb_contact_submit:hover { filter: brightness(1.1) drop-shadow(0 0 16px rgba(255, 106, 26, .45)); transform: translateY(-1px); }
.sk .d-form .et_pb_contact_submit::after, .sk .d-form .et_pb_contact_submit::before { display: none; }
.sk .d-form .et-pb-contact-message { font: 500 16px/1.5 "Barlow", system-ui, sans-serif; color: #1b2128; }
.sk .d-form .et-pb-contact-message:empty { display: none; }
.sk .d-form .et-pb-contact-message ul { margin: 0 0 14px; padding-left: 20px; }
.sk .d-form .et_contact_error { border-color: #c0392b !important; }
@media (max-width: 640px) {
  .sk .d-form .et_pb_contact_form { grid-template-columns: 1fr; }
  .sk .d-form .et_pb_contact_submit { width: 100%; }
}

/* ---------- 5b. the quote form is Contact Form 7 (Ryan, 27 Oct 2026: real drawings uploads); its template mirrors the draft's form,
   so site.css styles the labels and fields. These rules cover what Contact Form 7 adds: wrapper spans, tips, the submit input. */
.sk .wpcf7 { margin: 0; }
.sk .wpcf7 .hidden-fields-container { display: none; }
.sk .d-form .wpcf7-form-control-wrap { display: block; position: relative; }
/* the file input covers the whole drop box (.d-file is the positioned box); site.css's ".d-file span" must not style these spans */
.sk .d-file .wpcf7-form-control-wrap { display: inline; position: static; margin: 0; padding: 0; border: 0; background: none; }
.sk .d-file .wpcf7-form-control-wrap input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 2; }
.sk .d-file .d-file__ic { grid-row: span 2; width: 28px; height: 28px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c2470e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='17 8 12 3 7 8'/%3E%3Cline x1='12' x2='12' y1='3' y2='15'/%3E%3C/svg%3E") center / 28px 28px no-repeat; }
.sk .d-form .wpcf7-not-valid { border-color: #c0392b !important; }
.sk .d-form .wpcf7-not-valid-tip, .sk .d-file .wpcf7-not-valid-tip { display: block; margin: 7px 0 0; padding: 0; border: 0; background: none;
  font: 500 14px/1.35 "Barlow", system-ui, sans-serif; letter-spacing: 0; text-transform: none; color: #c0392b; }
/* the submit is an <input>, so site.css's field rule (.fsb .d-form input:not(...):not(...), specificity 0,4,1, loaded later) would make it a
   full-width text box: these submit selectors are stronger (0,5,1) and reset the width */
.sk.fsb .d-form input.wpcf7-submit[type="submit"] { display: inline-block; width: auto; margin: 26px 0 0; border: 0; border-radius: 0; cursor: pointer;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a0b02' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") no-repeat right 24px center / 20px 20px, linear-gradient(180deg, #ff8a3a, #ff5c0b);
  color: #1a0b02; font: 700 17px/1 "Barlow Condensed", "Arial Narrow", sans-serif; letter-spacing: .08em; text-transform: uppercase; padding: 18px 56px 18px 26px;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); transition: filter .25s, transform .25s; }
.sk.fsb .d-form input.wpcf7-submit[type="submit"]:hover,
.sk.fsb .d-form input.wpcf7-submit[type="submit"]:focus-visible { filter: brightness(1.1) drop-shadow(0 0 16px rgba(255, 106, 26, .45)); transform: translateY(-1px); }
.sk.fsb .d-form input.wpcf7-submit[type="submit"]:disabled { opacity: .6; cursor: progress; }
.sk .d-form .wpcf7-spinner { margin: 0 0 0 14px; vertical-align: middle; }
.sk .wpcf7 form .wpcf7-response-output { margin: 18px 0 0; padding: 12px 16px; border: 2px solid #ff6a1a; font: 500 15.5px/1.45 "Barlow", system-ui, sans-serif; color: #1b2128; }
.sk .wpcf7 form.sent .wpcf7-response-output { border-color: #2e7d32; }
.sk .wpcf7 form.invalid .wpcf7-response-output, .sk .wpcf7 form.unaccepted .wpcf7-response-output, .sk .wpcf7 form.failed .wpcf7-response-output,
.sk .wpcf7 form.spam .wpcf7-response-output, .sk .wpcf7 form.aborted .wpcf7-response-output { border-color: #c0392b; }
@media (max-width: 640px) {
  .sk.fsb .d-form input.wpcf7-submit[type="submit"] { width: 100%; }
}

/* ---------- 6. rules written with a child or sibling combinator meet Divi's module wrappers ---------- */
/* Each Text module wraps one prototype element, so "p + p" and "parent > *" no longer meet; these are the same rules one level down. */
.sk .et_pb_text:has(.d-p) + .et_pb_text .d-p { margin-top: 1em; }                       /* .d-p + .d-p */
[data-motion="on"] .sk :is(.d-hero__in, .d-phero__in) > .et_pb_text > .et_pb_text_inner > * { animation: d-rise .9s cubic-bezier(.2, .7, .2, 1) both; }
[data-motion="on"] .sk :is(.d-hero__in, .d-phero__in) > .et_pb_text:nth-child(2) > .et_pb_text_inner > * { animation-delay: .1s; }
[data-motion="on"] .sk :is(.d-hero__in, .d-phero__in) > .et_pb_text:nth-child(3) > .et_pb_text_inner > * { animation-delay: .2s; }
[data-motion="on"] .sk :is(.d-hero__in, .d-phero__in) > :nth-child(4) { animation-delay: .3s; }
[data-motion="on"] .sk :is(.d-cards, .d-tiles, .d-guides) > .et_pb_text:nth-child(2) .rv { transition-delay: .08s; }
[data-motion="on"] .sk :is(.d-cards, .d-tiles, .d-guides) > .et_pb_text:nth-child(3) .rv { transition-delay: .16s; }
[data-motion="on"] .sk .d-cards > .et_pb_text:nth-child(4) .rv { transition-delay: .24s; }