/* ===========================================================================
   Elementor layer: structure guards, the section tones, and the widget
   vocabulary (kicker / title / lede / body / buttons / lists / frames / FAQ)
   every page is written in.

   The PHP fallback templates emit Elementor-shaped markup inside `.elementor`,
   so every rule here serves the builder page and the fallback alike.

   Specificity: Elementor's kit styles headings, text and buttons at (0,3,0)
   and, inside the editor iframe, loads AFTER the theme. `body .elementor …`
   reaches (0,3,1): enough to beat the kit, not enough to beat the owner's own
   per-widget style controls at (0,4,0). No !important here — it would
   silently break those controls.

   Elementor 4 ("optimized markup") drops `.elementor-widget-container`, so no
   rule below depends on it: measures and alignment sit on the heading, the
   paragraphs and the button wrapper, which exist in both versions.
   =========================================================================== */

/* --------------------------------------------------------------- structure */

/* Sections and columns stay `relative`: the editor gives every section an
   absolutely-positioned .elementor-background-overlay, and releasing those to
   the .elementor wrapper stacks invisible sheets over the page. */
body .elementor .elementor-section{position:relative}
body .elementor .elementor-column{position:relative}
body .elementor .elementor-section.elementor-section-boxed > .elementor-container{
  max-width:var(--container);padding-inline:var(--gutter);position:relative;z-index:2;
}
body .elementor .elementor-section.elementor-section-full_width > .elementor-container{max-width:none}
body .elementor .elementor-column > .elementor-widget-wrap{padding:0;align-content:flex-start}
body .elementor .elementor-widget:not(:last-child){margin-bottom:1.25rem}
/* Widgets are flex items (min-width:auto): without this, the intrinsic width
   of anything wide inside one propagates up and blows the column out on phones. */
body .elementor .elementor-widget,body .elementor .elementor-column{min-width:0}
/* The text-editor wrapper exists only in the editor; on the live page the
   HTML is the widget's direct child. Never put layout on the widget itself. */
body .elementor .elementor-widget-text-editor{display:block}

body .elementor .col-middle > .elementor-widget-wrap{align-content:center;height:100%}

/* gutters between side-by-side columns; the container gives back what the
   columns take, so outer edges line up with every other band */
body .elementor .cols-gap > .elementor-container > .elementor-column{padding-inline:calc(var(--dl-gap) / 2)}
body .elementor .elementor-section.cols-gap > .elementor-container{padding-inline:calc(var(--gutter) - var(--dl-gap) / 2)}
body .elementor .cols-gap-lg > .elementor-container > .elementor-column{padding-inline:clamp(1rem, 2.6vw, 3rem)}
body .elementor .elementor-section.cols-gap-lg > .elementor-container{padding-inline:calc(var(--gutter) - clamp(1rem, 2.6vw, 3rem))}

/* Elementor stacks columns at 767. Two-column story sections are cramped
   between 768 and 1024, so these stack at Elementor's tablet breakpoint too. */
@media (max-width:1024px){
  body .elementor .stack-tablet > .elementor-container{flex-wrap:wrap}
  body .elementor .stack-tablet > .elementor-container > .elementor-column{width:100%}
  body .elementor .stack-tablet > .elementor-container > .elementor-column + .elementor-column{margin-top:2.75rem}
}
@media (max-width:767px){
  body .elementor .elementor-section > .elementor-container > .elementor-column + .elementor-column{margin-top:2rem}
  body .elementor .cols-gap > .elementor-container > .elementor-column{padding-inline:0}
  body .elementor .elementor-section.cols-gap > .elementor-container{padding-inline:var(--gutter)}
  body .elementor .cols-gap-lg > .elementor-container > .elementor-column{padding-inline:0}
  body .elementor .elementor-section.cols-gap-lg > .elementor-container{padding-inline:var(--gutter)}
}

/* ------------------------------------------------------------------ tones */

body .elementor .sec{padding-block:var(--section-y)}
body .elementor .sec-tight{padding-block:var(--section-y-tight)}
body .elementor .sec-flush-top{padding-top:0}

body .elementor .sec-paper{background-color:var(--paper);background-image:var(--dl-grid-light);color:var(--text)}
body .elementor .sec-foam{background-color:var(--foam);color:var(--text)}
body .elementor .sec-stout{background:var(--glow-navy),var(--dl-grid-dark),var(--stout);color:var(--on-dark)}
body .elementor .sec-navy{background:radial-gradient(60% 80% at 0% 0%,rgba(254,194,43,.10),rgba(254,194,43,0) 60%),var(--dl-grid-dark),var(--navy-2);color:var(--on-dark)}

/* the foam head: where a light band meets a dark one below it, the light
   band's own colour pours over the top edge of the dark one like the head on
   a pint. Drawn on the dark band, so it follows whichever band comes first. */
body .elementor :is(.sec-paper,.sec-foam,.dl-el-pourband) + :is(.sec-stout,.sec-navy){isolation:isolate}
body .elementor :is(.sec-paper,.sec-foam) + :is(.sec-stout,.sec-navy)::before{
  content:"";position:absolute;left:0;right:0;top:-1px;height:96px;z-index:0;pointer-events:none;
  background:var(--foam-paper) 0 0 / 1200px 96px repeat-x;
}
body .elementor .sec-foam + :is(.sec-stout,.sec-navy)::before{background-image:var(--foam-cream)}
body .elementor :is(.sec-paper,.sec-foam) + :is(.sec-stout,.sec-navy).sec{padding-top:calc(var(--section-y) + 30px)}
/* dark into light: a clean edge with a thin gold draft line */
body .elementor :is(.sec-stout,.sec-navy) + :is(.sec-paper,.sec-foam){box-shadow:inset 0 3px 0 var(--gold)}
/* two dark bands meeting */
body .elementor .sec-stout + .sec-navy,body .elementor .sec-navy + .sec-stout{box-shadow:inset 0 1px 0 var(--line-dark-strong)}
/* a band that runs on into a flush-top band of the same tone reads as one */
body .elementor .sec-stout + .sec-stout.sec-flush-top,
body .elementor .sec-navy + .sec-navy.sec-flush-top{box-shadow:none}
body .elementor .sec-stout + .sec-stout.sec-flush-top{background:var(--dl-grid-dark),var(--stout)}

/* ------------------------------------------------------------- typography */

body .elementor .elementor-widget-heading .elementor-heading-title{
  font-family:var(--font-display);font-weight:800;line-height:var(--lh-display);letter-spacing:-.005em;
  text-transform:none;color:var(--text);margin:0;
}
body .elementor .elementor-widget-heading .elementor-heading-title a{color:inherit;text-decoration:none}
/* (0,3,1): the kit sets text-widget colour AND font family (Roboto by default) */
body .elementor .elementor-widget.elementor-widget-text-editor{
  color:var(--text-2);font-family:var(--font-text);font-size:var(--fs-body);font-weight:400;line-height:1.75;
}
body .elementor .elementor-widget-text-editor p{text-wrap:pretty}
body .elementor .elementor-widget-text-editor p:last-child{margin-bottom:0}
body .elementor .elementor-widget-text-editor a{color:var(--navy);font-weight:500}
body .elementor .elementor-widget-text-editor a:hover{color:var(--navy-hi)}
body .elementor .elementor-widget-text-editor strong{color:var(--text);font-weight:600}

/* kicker: mono caps after a gold draft line */
body .elementor .kicker .elementor-heading-title{
  display:inline-flex;align-items:center;gap:.75rem;
  font-family:var(--font-mono);font-size:var(--fs-kicker);font-weight:600;line-height:1.4;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-ink);
}
body .elementor .kicker .elementor-heading-title::before{content:"";width:26px;height:2px;flex:none;background:var(--gold)}
body .elementor .elementor-widget.kicker{margin-bottom:1rem}
body .elementor .center.kicker .elementor-heading-title::after{content:"";width:26px;height:2px;flex:none;background:var(--gold)}

/* display titles: condensed caps; <em> is the gold half of the line */
body .elementor .title .elementor-heading-title{font-size:var(--fs-h2);text-transform:uppercase;max-width:20ch;text-wrap:balance}
body .elementor .title .elementor-heading-title em{font-style:normal;color:var(--navy);
  background:linear-gradient(transparent 62%,rgba(254,194,43,.55) 62%,rgba(254,194,43,.55) 90%,transparent 90%)}
body .elementor .title-page .elementor-heading-title{font-size:var(--fs-h1);line-height:.95;max-width:18ch}
body .elementor .title-md .elementor-heading-title{font-size:clamp(1.9rem, 1.4rem + 1.8vw, 2.9rem)}
body .elementor .elementor-widget.title{margin-bottom:1.2rem}

body .elementor .lede{font-family:var(--font-text);font-size:var(--fs-lede);font-weight:400;line-height:1.55;color:var(--text)}
body .elementor .lede p{max-width:52ch}
body .elementor .body p{max-width:min(64ch,100%)}
body .elementor .body-lg{font-size:clamp(1.05rem, 1rem + .25vw, 1.2rem)}
body .elementor .elementor-widget.lede{margin-bottom:2rem}
body .elementor .caption{font-size:.86rem;color:var(--muted)}
body .elementor .caption p{max-width:44ch}

body .elementor .center{text-align:center}
body .elementor .center .elementor-heading-title{margin-inline:auto}
body .elementor .center p{margin-inline:auto}
body .elementor .center .elementor-button-wrapper{text-align:center}
body .elementor .kicker.center{text-align:center}
body .elementor .kicker.center .elementor-heading-title{justify-content:center}

/* ------------------------------------------------------- tones: dark grounds */

body .elementor :is(.sec-stout,.sec-navy,.hero,.page-hero) .elementor-heading-title{color:var(--white)}
body .elementor :is(.sec-stout,.sec-navy,.hero,.page-hero) .kicker .elementor-heading-title{color:var(--gold)}
body .elementor :is(.sec-stout,.sec-navy,.hero,.page-hero) .title .elementor-heading-title em{color:var(--gold);background:none}
body .elementor :is(.sec-stout,.sec-navy,.hero,.page-hero) .elementor-widget-text-editor{color:var(--on-dark-2)}
body .elementor :is(.sec-stout,.sec-navy,.hero,.page-hero) .lede{color:var(--on-dark)}
body .elementor :is(.sec-stout,.sec-navy) .elementor-widget-text-editor strong{color:var(--white)}
body .elementor :is(.sec-stout,.sec-navy,.page-hero) .elementor-widget-text-editor a{color:var(--gold-hi)}
body .elementor :is(.sec-stout,.sec-navy) .caption{color:var(--on-dark-3)}

/* ----------------------------------------------------------------- buttons */

body .elementor .elementor-widget-button .elementor-button{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:54px;padding:.8rem 1.5rem;
  border:2px solid var(--gold);border-radius:var(--r-sm);
  background:var(--gold);color:var(--stout);
  font-family:var(--font-display);font-size:1.08rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;
  text-decoration:none;position:relative;overflow:hidden;isolation:isolate;
  box-shadow:var(--shadow-gold);
  transition:transform .2s var(--ease),background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease);
}
/* the fill rises like a pour on hover */
body .elementor .elementor-widget-button .elementor-button::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--gold-hi);
  transform:translateY(101%);transition:transform .35s var(--ease);
}
body .elementor .elementor-widget-button .elementor-button:hover{color:var(--stout);transform:translateY(-2px)}
body .elementor .elementor-widget-button .elementor-button:hover::before{transform:none}
body .elementor .elementor-button .elementor-button-text{display:inline-flex;align-items:center;gap:.55rem}
body .elementor .btnw-arrow .elementor-button .elementor-button-text::after{
  content:"";width:1.05em;height:1.05em;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
  transition:transform .2s var(--ease);
}
body .elementor .btnw-arrow .elementor-button:hover .elementor-button-text::after{transform:translateX(3px)}

body .elementor .btnw-gold .elementor-button{background:var(--gold);border-color:var(--gold);color:var(--stout)}
body .elementor .btnw-ghost-light .elementor-button{background:transparent;border-color:rgba(236,237,248,.45);color:var(--white);box-shadow:none}
body .elementor .btnw-ghost-light .elementor-button::before{background:rgba(255,255,255,.1)}
body .elementor .btnw-ghost-light .elementor-button:hover{border-color:var(--gold);color:var(--white)}
body .elementor .btnw-navy .elementor-button{background:var(--navy);border-color:var(--navy);color:var(--white);box-shadow:0 16px 34px -20px rgba(42,46,124,.8)}
body .elementor .btnw-navy .elementor-button::before{background:var(--stout)}
body .elementor .btnw-navy .elementor-button:hover{color:var(--white);border-color:var(--stout)}
body .elementor .btnw-ghost-navy .elementor-button{background:transparent;border-color:rgba(15,17,51,.55);color:var(--stout);box-shadow:none}
body .elementor .btnw-ghost-navy .elementor-button::before{background:rgba(255,255,255,.3)}
body .elementor .btnw-ghost-navy .elementor-button:hover{border-color:var(--stout);color:var(--stout)}
body .elementor .btnw-link .elementor-button{
  min-height:0;padding:.4rem 0;background:transparent;border:0;box-shadow:none;border-radius:0;
  color:var(--navy);font-size:1rem;
}
body .elementor .btnw-link .elementor-button::before{content:none}
body .elementor .btnw-link .elementor-button .elementor-button-text::after{
  content:"";width:1.4em;height:2px;background:var(--gold);-webkit-mask:none;mask:none;transition:width .25s var(--ease);
}
body .elementor .btnw-link .elementor-button:hover{background:transparent;color:var(--navy-hi);transform:none}
body .elementor .btnw-link .elementor-button:hover .elementor-button-text::after{width:2.2em}
body .elementor :is(.sec-stout,.sec-navy,.hero) .btnw-link .elementor-button{color:var(--gold)}
body .elementor :is(.sec-stout,.sec-navy,.hero) .btnw-link .elementor-button:hover{color:var(--white)}
body .elementor .btnw-sm .elementor-button{min-height:46px;padding:.6rem 1.1rem;font-size:.98rem}

/* Side-by-side buttons: widgets meant to share a row. */
body .elementor .elementor-widget.btnw{width:auto;max-width:100%;margin:0 .7rem .7rem 0}
body .elementor .elementor-widget.btnw:last-child{margin-right:0}
body .elementor .center.btnw{margin-inline:.35rem}
@media (max-width:600px){
  body .elementor .elementor-widget.btnw:not(.btnw-link){width:100%;margin-right:0}
  body .elementor .elementor-widget.btnw:not(.btnw-link) .elementor-button{width:100%}
}

/* ------------------------------------------------------------------- lists */

/* `ticks`: a list with gold check marks. The kit colours the <i> directly, so
   the mark is drawn on the icon box itself and the glyph is hidden. */
body .elementor .ticks .elementor-icon-list-items{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
body .elementor .ticks-2 .elementor-icon-list-items{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1.6rem}
@media (max-width:600px){ body .elementor .ticks-2 .elementor-icon-list-items{grid-template-columns:1fr} }
body .elementor .ticks .elementor-icon-list-item{display:flex;align-items:flex-start;gap:.8rem;font-size:var(--fs-body);line-height:1.45}
body .elementor .ticks .elementor-icon-list-icon{
  flex:none;width:22px;height:22px;margin-top:.05em;border-radius:50%;background:var(--gold);
  -webkit-mask:none;mask:none;position:relative;
}
body .elementor .ticks .elementor-icon-list-icon::after{
  content:"";position:absolute;inset:5px;background:var(--stout);
  -webkit-mask:url("../img/ic/check.svg") center / contain no-repeat;mask:url("../img/ic/check.svg") center / contain no-repeat;
}
body .elementor .ticks .elementor-icon-list-icon i,
body .elementor .ticks .elementor-icon-list-icon svg{display:none}
body .elementor .ticks .elementor-icon-list-text{color:var(--text);font-family:var(--font-text);font-weight:500}
body .elementor :is(.sec-stout,.sec-navy,.page-hero) .ticks .elementor-icon-list-text{color:var(--on-dark)}
body .elementor .elementor-widget.ticks{margin-bottom:2rem}

/* `pills`: the same widget as a row of chips */
body .elementor .pills .elementor-icon-list-items{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
body .elementor .center.pills .elementor-icon-list-items{justify-content:center}
body .elementor .pills .elementor-icon-list-item{
  display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .9rem;border-radius:var(--pill);
  border:1px solid var(--line-strong);background:var(--paper);
  font-family:var(--font-text);font-size:.88rem;font-weight:500;color:var(--text);
}
body .elementor .pills .elementor-icon-list-item > a{display:inline-flex;align-items:center;gap:.5rem;color:inherit;text-decoration:none}
body .elementor .pills .elementor-icon-list-icon{width:7px;height:7px;flex:none;border-radius:50%;background:var(--gold-lo)}
body .elementor .pills .elementor-icon-list-icon i,
body .elementor .pills .elementor-icon-list-icon svg{display:none}
body .elementor .pills .elementor-icon-list-text{color:inherit}
body .elementor :is(.sec-stout,.sec-navy,.hero,.page-hero) .pills .elementor-icon-list-item{background:rgba(255,255,255,.06);border-color:var(--line-dark-strong);color:var(--on-dark)}
body .elementor :is(.sec-stout,.sec-navy,.hero,.page-hero) .pills .elementor-icon-list-icon{background:var(--gold)}
body .elementor .pills .elementor-icon-list-item:has(a:hover){border-color:var(--gold);background:rgba(254,194,43,.12)}
body .elementor .pills-lg .elementor-icon-list-item{padding:.7rem 1.3rem;font-family:var(--font-display);font-size:1.25rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}

/* `svc-links`: a list of links to services, arrow-led */
body .elementor .svc-links .elementor-icon-list-items{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
body .elementor .svc-links .elementor-icon-list-item a{display:flex;align-items:center;gap:.7rem;padding:.55rem 0;border-bottom:1px solid var(--line);color:var(--text);text-decoration:none;font-weight:500}
body .elementor .svc-links .elementor-icon-list-icon{width:18px;height:18px;flex:none;background:var(--gold-lo);
  -webkit-mask:url("../img/ic/arrow.svg") center / contain no-repeat;mask:url("../img/ic/arrow.svg") center / contain no-repeat;transition:transform .2s var(--ease)}
body .elementor .svc-links .elementor-icon-list-icon i,body .elementor .svc-links .elementor-icon-list-icon svg{display:none}
body .elementor .svc-links .elementor-icon-list-item a:hover{color:var(--navy)}
body .elementor .svc-links .elementor-icon-list-item a:hover .elementor-icon-list-icon{transform:translateX(4px)}
body .elementor :is(.sec-stout,.sec-navy) .svc-links .elementor-icon-list-item a{color:var(--on-dark);border-color:var(--line-dark)}
body .elementor :is(.sec-stout,.sec-navy) .svc-links .elementor-icon-list-item a:hover{color:var(--gold)}
body .elementor :is(.sec-stout,.sec-navy) .svc-links .elementor-icon-list-icon{background:var(--gold)}

/* ------------------------------------------------------------------ images */

body .elementor .elementor-widget-image img{display:block;max-width:100%;height:auto}

/* frame: a photograph with a gold corner bracket, like a spec drawing's crop mark.
   Prefixed `body .elementor` because Elementor's frontend resets
   `.elementor img{border-radius:0;box-shadow:none}` at equal weight. */
body .elementor .frame{position:relative;isolation:isolate}
body .elementor .frame img{width:100%;aspect-ratio:4 / 3;object-fit:cover;border-radius:var(--r);box-shadow:var(--shadow-2)}
body .elementor .frame::before,body .elementor .frame::after{content:"";position:absolute;width:64px;height:64px;pointer-events:none;z-index:1}
body .elementor .frame::before{left:-12px;top:-12px;border-left:4px solid var(--gold);border-top:4px solid var(--gold);border-radius:6px 0 0 0}
body .elementor .frame::after{right:-12px;bottom:-12px;border-right:4px solid var(--gold);border-bottom:4px solid var(--gold);border-radius:0 0 6px 0}
body .elementor .cert-photo img{aspect-ratio:4 / 5}
@media (hover:hover){
  body .elementor .frame-tilt img{transform:perspective(1200px) rotateY(-4deg);transition:transform .6s var(--ease)}
  body .elementor .frame-tilt:hover img{transform:none}
}
@media (max-width:767px){
  body .elementor .frame::before{left:-6px;top:-6px;width:44px;height:44px}
  body .elementor .frame::after{right:-6px;bottom:-6px;width:44px;height:44px}
}

/* ------------------------------------------------------------------- FAQ */

/* Elementor's Toggle widget. Elementor's own script shows a panel by setting
   display:block on it; the theme's fallback pages open them through
   .is-open (main.js). Panels are hidden only under html.js — fail open. */
body .elementor .faq .elementor-toggle{display:grid;gap:.7rem}
body .elementor .faq .elementor-toggle-item{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-1);overflow:hidden;transition:border-color .2s var(--ease)}
body .elementor .faq .elementor-toggle-item:hover{border-color:var(--line-strong)}
body .elementor .faq .elementor-tab-title{
  display:flex;align-items:center;gap:1rem;padding:1.15rem 1.3rem;cursor:pointer;border:0;
  font-family:var(--font-display);font-size:1.32rem;font-weight:700;line-height:1.15;color:var(--text);
}
body .elementor .faq .elementor-tab-title a,body .elementor .faq .elementor-toggle-title{color:inherit;text-decoration:none;flex:1;order:1}
body .elementor .faq .elementor-toggle-icon{
  order:2;flex:none;width:34px;height:34px;border-radius:50%;background:var(--mist);position:relative;
  display:inline-grid;place-items:center;transition:background-color .2s var(--ease),transform .3s var(--ease);
}
body .elementor .faq .elementor-toggle-icon i,body .elementor .faq .elementor-toggle-icon svg{display:none}
body .elementor .faq .elementor-toggle-icon::before,body .elementor .faq .elementor-toggle-icon::after{
  content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--navy);transition:transform .3s var(--ease);
}
body .elementor .faq .elementor-toggle-icon::after{transform:rotate(90deg)}
body .elementor .faq .elementor-tab-title.elementor-active .elementor-toggle-icon,
body .elementor .faq .is-open .elementor-toggle-icon{background:var(--gold)}
body .elementor .faq .elementor-tab-title.elementor-active .elementor-toggle-icon::after,
body .elementor .faq .is-open .elementor-toggle-icon::after{transform:rotate(0)}
body .elementor .faq .elementor-tab-content{padding:0 1.3rem 1.25rem;border:0;color:var(--text-2);font-size:1rem;line-height:1.7}
body .elementor .faq .elementor-tab-content p{margin:0;max-width:62ch}
html.js body:not(.elementor-editor-active) .dl-page .faq .elementor-toggle-item:not(.is-open) .elementor-tab-content{display:none}

/* --------------------------------------------------------- shortcode slots */

body .elementor .elementor-widget-shortcode{width:100%}
body .elementor .plugmatrix-form-embed{width:100%}
