/* Dr.Site reusable components — v0.2.29.
 * Source of truth for repeated UI, loaded after page styles.
 * Includes legacy class aliases because Gutenberg stores existing page HTML in DB.
 * Avoid blanket .wp-block-group min-height, as it breaks responsive layout.
 */
:root {
  --ds-icon-size: 50px;
  --ds-icon-glyph-size: 26px;
  --ds-icon-bg: var(--ds-cyan-pale);
  --ds-icon-color: var(--ds-cyan);
  --ds-section-gap: clamp(38px, 4.4vw, 58px);
  --ds-copy-size: 15px;
  --ds-copy-line: 1.55;
}

/* Single shared benefit/feature row; alias previous page names without deleting edited blocks. */
:is(.ds-feature-list,.ds-maint-benefits,.ds-mkt-benefits,.ds-contact-reasons,.ds-icon-list) {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:12px;
  align-content:center;
}
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item) {
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
  min-height:0;
  padding:8px 0 8px 66px;
  flex-shrink:0;
}
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item)::before {
  content:"";
  position:absolute;
  top:50%;left:0;
  transform:translateY(-50%);
  width:var(--ds-icon-size);height:var(--ds-icon-size);
  border-radius:14px;
  background:var(--ds-icon-bg);
}
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item)::after {
  content:"";
  position:absolute;
  top:50%;left:12px;
  transform:translateY(-50%);
  width:var(--ds-icon-glyph-size);height:var(--ds-icon-glyph-size);
  background:var(--ds-icon-color);
  -webkit-mask: center/contain no-repeat var(--ds-icon, url('../icons/target.svg'));
  mask: center/contain no-repeat var(--ds-icon, url('../icons/target.svg'));
}
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item) > .wp-block-group { min-width:0; }
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item) h4,
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item) h3 {
  margin:0 0 3px;
  font-family:inherit;
  font-size:16px;
  line-height:1.25;
  letter-spacing:-.012em;
  font-weight:700;
  color:var(--ds-ink);
}
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item) p {
  margin:0;
  font-size:13.5px;
  line-height:1.42;
  font-weight:400;
  color:var(--ds-muted);
}
/* Per-row icons are the only allowed variations. The frame remains identical. */
.ds-feature--target, .ds-mkt-benefit--camera { --ds-icon:url('../icons/target.svg'); }
.ds-feature--search, .ds-mkt-benefit--split { --ds-icon:url('../icons/search.svg'); }
.ds-feature--shield, .ds-maint-benefit--shield, .ds-mkt-benefit--shield { --ds-icon:url('../icons/shield.svg'); }
.ds-feature--bolt { --ds-icon:url('../icons/bolt.svg'); }
.ds-feature--users, .ds-maint-benefit--consult, .ds-mkt-benefit--users { --ds-icon:url('../icons/users.svg'); }
.ds-maint-benefit--speed { --ds-icon:url('../icons/speed.svg'); }
.ds-maint-benefit--lock { --ds-icon:url('../icons/lock.svg'); }
.ds-contact-reason--proposal { --ds-icon:url('../icons/dev-file.svg'); }
.ds-contact-reason--team { --ds-icon:url('../icons/users.svg'); }
.ds-contact-reason--shield { --ds-icon:url('../icons/shield.svg'); }
.ds-contact-reason:not(.ds-contact-reason--proposal):not(.ds-contact-reason--team):not(.ds-contact-reason--shield) { --ds-icon:url('../icons/dev-message.svg'); }

/* Consistent sales-critical UI: headings, actions and urgent strip. */
:is(.ds-why,.ds-maint-why,.ds-mkt-why,.ds-about-principles) .ds-kicker {margin-bottom:10px;}
:is(.ds-why,.ds-maint-why,.ds-mkt-why) h2 {line-height:1.1;letter-spacing:-.03em;}
:is(.ds-why,.ds-maint-why,.ds-mkt-why) :is(.ds-feature-list,.ds-maint-benefits,.ds-mkt-benefits) { gap:12px; }
:is(.ds-about-page,.ds-maint-page,.ds-dev-page,.ds-mkt-page) .ds-urgent {
  margin:0;
  background:var(--ds-danger-pale);
}
:is(.ds-about-page,.ds-maint-page,.ds-dev-page,.ds-mkt-page) .ds-urgent .ds-urgent__inner {
  width:min(calc(100% - 2 * var(--ds-gutter)),var(--ds-wide));
  max-width:var(--ds-wide);
  margin-inline:auto;
}
:is(.ds-about-page,.ds-maint-page,.ds-dev-page,.ds-mkt-page) .ds-urgent .ds-danger-button .wp-block-button__link {
  background:var(--ds-danger);
  border-color:var(--ds-danger);
  color:#fff;
}
/* Remove extra gap introduced by core block flow, but only inside shared benefit lists. */
:is(.ds-feature-list,.ds-maint-benefits,.ds-mkt-benefits,.ds-contact-reasons,.ds-icon-list) > *,
:is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item) > * {margin-block-start:0;margin-block-end:0;}
/* Page hero minimum rhythm. Proportions adapt to text instead of forcing a fixed picture height. */
.ds-dev-page .ds-dev-hero__grid {grid-template-columns:minmax(0,51%) minmax(0,49%);min-height:500px;}
.ds-dev-page .ds-dev-hero__copy {padding:38px 18px 40px 0;}
.ds-dev-page .ds-dev-hero h1 {font-size:clamp(37px,3.15vw,45px);line-height:1.10;margin:0 0 20px;}
.ds-dev-page .ds-dev-hero__lead {margin:0 0 21px!important;line-height:1.52;}
.ds-dev-page .ds-dev-hero__meta {margin-top:18px!important;}
.ds-dev-page .ds-dev-hero__art {max-width:100%;}
/* Do not give paragraph groups in any benefit row arbitrary heights. */
:where(.ds-icon-list,.ds-feature-list,.ds-maint-benefits,.ds-mkt-benefits,.ds-contact-reasons) .wp-block-group {min-height:0;}
@media(max-width:900px){
  :is(.ds-feature-list,.ds-maint-benefits,.ds-mkt-benefits,.ds-contact-reasons,.ds-icon-list) {grid-template-columns:1fr;gap:10px;}
  .ds-dev-page .ds-dev-hero__grid {grid-template-columns:1fr;min-height:0;}
  .ds-dev-page .ds-dev-hero__copy {padding:29px 0 12px;}
  .ds-dev-page .ds-dev-hero h1 {font-size:clamp(34px,5.4vw,44px);}
}
@media(max-width:680px){
  :root {--ds-icon-size:46px;--ds-icon-glyph-size:24px;}
  :is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item) {padding:7px 0 7px 62px;min-height:0;}
  :is(.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason,.ds-icon-item)::after {left:11px;}
  .ds-dev-page .ds-dev-hero__copy {padding:26px 0 6px;}
  .ds-dev-page .ds-dev-hero h1 {font-size:clamp(30px,8vw,39px);line-height:1.11;margin-bottom:18px;}
}


/* ==========================================================================
   Dr.Site design system v0.2.29 — shared anatomy, no per-page surprises
   Source of truth: theme.json tokens + theme.css vars + THIS stylesheet.
   ========================================================================= */
:root {
  --ds-badge-box:50px;
  --ds-badge-symbol:26px;
  --ds-badge-radius:14px;
  --ds-card-border:var(--ds-border);
  --ds-card-radius:12px;
  --ds-section-padding:clamp(36px,4.4vw,58px);
}

/* Standard benefit LIST: rounded square, mono cyan, natural height. */
:is(.ds-icon-list,.ds-feature-list,.ds-maint-benefits,.ds-mkt-benefits,.ds-contact-reasons)
  > :is(.ds-icon-item,.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason) {
  min-height:0;
  padding-block:8px;
}
:is(.ds-icon-item,.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason)::before {
  width:var(--ds-icon-size);
  height:var(--ds-icon-size);
  border:0;
  border-radius:var(--ds-badge-radius);
  background:var(--ds-icon-bg);
}
:is(.ds-icon-item,.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason)::after {
  width:var(--ds-icon-glyph-size);
  height:var(--ds-icon-glyph-size);
  background:var(--ds-icon-color);
}

/* Standard SERVICE/CATEGORY card badge. Cards may have distinct layout,
   but never a random badge shape / color or mixed icon weights. */
:is(.ds-dev-path,.ds-mkt-service,.ds-about-principle,.ds-about-case,.ds-maint-service-card,.ds-contact-channel)::before {
  width:var(--ds-badge-box);
  height:var(--ds-badge-box);
  border-radius:var(--ds-badge-radius);
  background:var(--ds-cyan-pale);
  border:0;
}
:is(.ds-dev-path,.ds-mkt-service,.ds-about-principle,.ds-about-case,.ds-maint-service-card,.ds-contact-channel)::after {
  width:var(--ds-badge-symbol);
  height:var(--ds-badge-symbol);
  background:var(--ds-cyan);
}
/* Icon offset from each card's upper-left badge origin. */
.ds-dev-path::before {top:19px;left:18px}
.ds-dev-path::after {top:31px;left:30px}
.ds-mkt-service::before {top:18px;left:17px}
.ds-mkt-service::after {top:30px;left:29px}
.ds-about-principle::before {top:12px;left:15px}
.ds-about-principle::after {top:24px;left:27px}
.ds-about-case::before {top:14px;left:14px}
.ds-about-case::after {top:26px;left:26px}
.ds-maint-service-card::before {top:21px;left:15px}
.ds-maint-service-card::after {top:33px;left:27px}
.ds-contact-channel::before {top:12px;left:15px;transform:none}
.ds-contact-channel::after {top:24px;left:27px;transform:none}

/* The shared geometry must not clip the card copy underneath. */
.ds-about-principle {padding-top:76px}
.ds-about-case {padding-top:80px}
.ds-mkt-service {padding-top:86px}
.ds-contact-channel {padding-top:76px}

/* State a visual ROLE for circles: metrics and numbered process steps only.
   Do not change these circular badges into square cards. */
:is(.ds-stats > div,.ds-about-metric,.ds-mkt-result) :is(strong,.ds-about-metric__value,.ds-mkt-result__number) {
  color:var(--ds-ink);
}

/* Contact — one purposeful form CTA; calmer alternate surface eliminates
   continuous white space without adding an ornamental content section. */
.ds-contact-page .ds-contact-main {
  background:linear-gradient(180deg,#f5fbfd 0%,#fff 100%);
  padding-top:32px;
  padding-bottom:42px;
}
.ds-contact-page .ds-contact-form-card {
  background:#fff;
  border:1px solid var(--ds-card-border);
  box-shadow:none;
  margin-top:0 !important;
}
.ds-contact-page .ds-contact-right {padding-top:7px}
.ds-contact-page .ds-contact-channel {box-shadow:0 5px 18px rgba(7,37,66,.03)}
.ds-contact-page .ds-contact-urgent {
  width:100%;
  margin:0;
  background:var(--ds-danger-pale);
}
.ds-contact-page .ds-contact-urgent .ds-urgent__inner {
  width:min(calc(100% - 2 * var(--ds-gutter)),var(--ds-wide));
  margin-inline:auto;
}
.ds-contact-page .ds-contact-urgent .ds-danger-button .wp-block-button__link {
  color:#fff;
  background:var(--ds-danger);
  border-color:var(--ds-danger);
}
/* HTML id is on the form section, not duplicated for an extra form. */
.ds-contact-page #evaluare {scroll-margin-top:84px}

/* Development: core flow styles formerly set margin-block-end:0 on every
   group, overriding the intended gap below the intro. Explicit page scope
   fixes the cause while preserving responsive natural card heights. */
.ds-dev-page .ds-dev-choices__heading {
  margin-bottom:clamp(24px,2.6vw,34px) !important;
  align-items:center;
}
.ds-dev-page .ds-dev-choices__heading > :last-child {min-width:0}
.ds-dev-page .ds-dev-paths {margin-top:0 !important}
.ds-dev-page .ds-dev-path__link,
.ds-dev-page .ds-dev-path__link a {
  color:var(--ds-ink) !important;
}
.ds-dev-page .ds-dev-path__link a:hover {color:var(--ds-cyan-dark) !important}

/* No second set of saturated blues for body/link typography. Use one
   ink/muted scale and reserve cyan for actions/icons. */
:is(.ds-dev-page,.ds-mkt-page,.ds-maint-page,.ds-about-page,.ds-contact-page) p:not(.ds-kicker):not(.ds-eyebrow) {
  text-decoration-color:var(--ds-cyan);
}
:is(.ds-dev-page,.ds-mkt-page,.ds-maint-page,.ds-about-page,.ds-contact-page)
  :is(.ds-icon-item,.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason) p {
  color:var(--ds-muted);
}

@media(max-width:900px) {
  .ds-contact-page .ds-contact-main {padding-top:24px}
  .ds-contact-page #evaluare {scroll-margin-top:74px}
}
@media(max-width:680px) {
  /* Compact benefits only on phones; retain breathing room on desktop. */
  :is(.ds-icon-list,.ds-feature-list,.ds-maint-benefits,.ds-mkt-benefits,.ds-contact-reasons)
    > :is(.ds-icon-item,.ds-feature,.ds-maint-benefit,.ds-mkt-benefit,.ds-contact-reason) {
    padding-block:0;
  }
  :root {--ds-badge-box:46px;--ds-badge-symbol:24px}
  .ds-about-principle {padding-top:72px}
  .ds-about-case {padding-top:75px}
  .ds-contact-page .ds-contact-main {padding-top:20px}
  .ds-contact-page .ds-contact-urgent .ds-urgent__inner {gap:13px}
  .ds-contact-page .ds-contact-urgent .wp-block-buttons,
  .ds-contact-page .ds-contact-urgent .wp-block-button,
  .ds-contact-page .ds-contact-urgent .wp-block-button__link {width:100%;min-width:0}
  .ds-dev-page .ds-dev-choices__heading {margin-bottom:24px !important}
  /* Mobile categories already display icon to the left, not above. */
  .ds-dev-path::before {top:17px;left:15px}
  .ds-dev-path::after {top:28px;left:26px}
  .ds-maint-service-card::before {top:18px;left:16px}
  .ds-maint-service-card::after {top:29px;left:27px}
  .ds-about-principle::before {top:14px;left:12px}
  .ds-about-principle::after {top:25px;left:23px}
}
@media(max-width:380px) {
  .ds-dev-page .ds-dev-choices__heading {margin-bottom:23px !important}
}

/* About mobile: at <380px the principle tile becomes a horizontal row, so
   the badge must move next to copy rather than reserving space above it. */
@media(max-width:380px) {
  .ds-about-principle {padding:15px 14px 15px 76px;min-height:0}
  .ds-about-principle::before {top:15px;left:12px}
  .ds-about-principle::after {top:26px;left:23px}
}

/* v0.2.33 — Header action matches primary Dr.Site cyan on navy.
   Consistent with Hero, and distinct from the red emergency pathway. */
.ds-header__cta .wp-block-button__link {
  background:var(--ds-cyan);
  border-color:var(--ds-cyan);
  color:var(--ds-navy);
  font-weight:700;
  text-transform:none;
  letter-spacing:0;
}
.ds-header__cta .wp-block-button__link:hover {
  background:var(--ds-cyan-dark);
  border-color:var(--ds-cyan-dark);
}
.ds-header__cta .wp-block-button__link:focus-visible {
  outline:3px solid #fff;
  outline-offset:3px;
}

/* v0.2.35 — shared customer proof: one visual component across Home,
   Maintenance, and About, including legacy Gutenberg card class names. */
:is(.ds-home .ds-testimonials,.ds-maint-page .ds-maint-proof .ds-testimonials,.ds-about-page .ds-about-testimonials__grid) {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;
  gap:16px;margin-top:22px!important;
}
:is(.ds-home .ds-testimonial,.ds-maint-page .ds-maint-proof .ds-testimonial,.ds-about-page .ds-about-review) {
  display:flex;flex-direction:column;min-height:0;height:100%;
  padding:23px 22px 21px;border:1px solid var(--ds-border);
  border-radius:12px;background:#fff;box-shadow:0 12px 28px rgba(6,31,53,.075);
}
:is(.ds-home .ds-testimonial,.ds-maint-page .ds-maint-proof .ds-testimonial) .ds-quote,
.ds-about-page .ds-about-review__mark {
  font-size:43px;line-height:.8;font-weight:800;color:var(--ds-cyan)!important;
  margin:0 0 15px!important;
}
:is(.ds-home .ds-testimonial,.ds-maint-page .ds-maint-proof .ds-testimonial) > p:not(.ds-quote):not(:last-child),
.ds-about-page .ds-about-review__text {
  font-size:14px;line-height:1.55;color:#405b6f!important;margin:0 0 14px!important;
}
:is(.ds-home .ds-testimonial,.ds-maint-page .ds-maint-proof .ds-testimonial) > p:last-child,
.ds-about-page .ds-about-review__author {margin-top:auto!important;}

@media(max-width:900px){
  :is(.ds-home .ds-testimonials,.ds-maint-page .ds-maint-proof .ds-testimonials,.ds-about-page .ds-about-testimonials__grid) {gap:13px;}
}
@media(max-width:680px){
  :is(.ds-home .ds-testimonials,.ds-maint-page .ds-maint-proof .ds-testimonials,.ds-about-page .ds-about-testimonials__grid) {
    grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:13px;
  }
  :is(.ds-home .ds-testimonial,.ds-maint-page .ds-maint-proof .ds-testimonial,.ds-about-page .ds-about-review){
    min-height:0;padding:20px 19px 19px;
  }
  /* Contact channels use a horizontal row card on mobile: badge centered
     relative to the text block, never abandoned above its content. */
  .ds-contact-page .ds-contact-channel {min-height:104px;padding:16px 15px 16px 80px;display:flex;flex-direction:column;justify-content:center}
  .ds-contact-page .ds-contact-channel::before {top:50%;left:15px;transform:translateY(-50%)}
  .ds-contact-page .ds-contact-channel::after {top:50%;left:27px;transform:translateY(-50%)}
  .ds-contact-page .ds-contact-channel p:nth-of-type(2){margin-top:5px}
}