/* GENERATED from assets/css/ds-service.css by tools/build-ltr-css.js. Do not edit. */
/* ==========================================================================
   Linkawy redesign: service page template (page-templates/service-page.php).
   Kit ServicePage: dark hero (title + accent + buttons | form card), then the
   page content on white, then the contact section (dark) and Footer E.
   Style only: markup and text are unchanged. A per-page hero background set in
   the editor is overridden here so every service hero sits on the dark surface.
   ========================================================================== */

/* ---------- Hero (dark) ---------- */
.service-hero{background:var(--dark)!important;color:var(--fg-on-dark-2);padding:72px 0 var(--space-section-sm)}
.service-hero::before,.service-hero::after{display:none}
.service-hero .container.service-hero-inner{max-width:calc(var(--content-max) + 2 * var(--gutter));padding:0 var(--gutter);gap:48px 72px}
.service-hero .breadcrumbs a{color:var(--fg-on-dark-3)}
.service-hero .breadcrumbs a:hover,.service-hero .breadcrumb-current{color:var(--orange)}
.service-hero .breadcrumb-separator{color:var(--fg-on-dark-3)}
.service-hero-title{font-size:var(--fs-display);line-height:var(--lh-display);letter-spacing:var(--tracking-display);font-weight:700;color:var(--white);margin:0 0 20px}
.service-hero-subtitle{font-size:18px;line-height:var(--lh-body);color:var(--fg-on-dark-2);margin:0 0 32px}
.service-hero-buttons{gap:12px}
.service-hero-btn-primary{height:56px;min-height:56px;padding:0 30px;border:1px solid transparent;border-radius:var(--radius-pill);
  background:var(--gradient-primary);color:var(--white);font-size:16px;font-weight:700;transition:box-shadow var(--dur-base) var(--ease-out)}
.service-hero-btn-primary:hover{background:var(--gradient-primary);color:var(--white);border-color:transparent;box-shadow:var(--shadow-exceptional);transform:none}
.service-hero-btn-secondary{height:56px;padding:0 30px;border:1px solid var(--dark-border);background:transparent;color:var(--white);font-weight:600}
.service-hero-btn-secondary:hover{background:rgba(255,255,255,.04);border-color:var(--fg-on-dark-3);color:var(--white)}
.service-hero-media .service-hero-image{border-radius:var(--radius-card);box-shadow:none}

/* ---------- Hero form card: dark card, DS pill fields ---------- */
.service-hero-form-card{border-radius:var(--radius-card);padding:32px;box-shadow:none;border:1px solid transparent;
  background:linear-gradient(var(--dark-surface),var(--dark-surface)) padding-box,var(--dark-card-edge) border-box}
.service-hero-form-card .sh-label{font-size:var(--fs-small);font-weight:500;color:var(--fg-on-dark-1)}
.service-hero-form-card .sh-field .sh-input-wrapper,.service-hero-form-card .sh-phone-wrapper{min-height:52px;border:1px solid var(--dark-border);
  border-radius:var(--radius-pill);background:var(--dark-surface);overflow:hidden}
.service-hero-form-card .sh-phone-input-wrap{border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important}
.service-hero-form-card .sh-field .sh-input-wrapper:focus-within,.service-hero-form-card .sh-phone-wrapper:focus-within{
  border-color:var(--orange);box-shadow:0 0 0 3px var(--highlight-mark);background:var(--dark-surface)}
.service-hero-form-card .sh-input-icon{color:var(--fg-on-dark-3)}
.service-hero-form-card .service-hero-form-input{height:auto;padding:0 8px;border:0;border-radius:0;background:transparent;color:var(--fg-on-dark-1);font-size:15px}
.service-hero-form-card .service-hero-form-input:focus{box-shadow:none;background:transparent}
.service-hero-form-card .service-hero-form-input::placeholder{color:var(--fg-on-dark-3)}
.service-hero-form-card .sh-phone-wrapper .phone-country-btn{height:auto;border:0;border-radius:0;background:transparent;color:var(--fg-on-dark-1);border-left:1px solid var(--dark-border)}
.service-hero-form-card .sh-phone-wrapper:focus-within .phone-country-btn{background:transparent}
.sh-submit-btn{min-height:56px;border-radius:var(--radius-pill);background:var(--gradient-primary);font-size:16px;font-weight:700}
.sh-submit-btn:hover:not(:disabled){background:var(--gradient-primary);transform:none;box-shadow:var(--shadow-exceptional)}
.sh-submit-btn:active:not(:disabled){background:var(--orange-deep);transform:scale(.98)}
.sh-trust-bar{border-top-color:var(--dark-border)}
.sh-trust-item{font-size:var(--fs-small);color:var(--fg-on-dark-2)}
.sh-trust-item svg{color:var(--orange)}
.service-hero-form-card .form-success-overlay{border-radius:var(--radius-card);background:var(--dark-surface)}
.service-hero-form-card .form-success-title{color:var(--fg-on-dark-1)}
.service-hero-form-card .form-success-desc{color:var(--fg-on-dark-2)}
@media (max-width:900px){.service-hero{padding-top:48px}}
@media (max-width:768px){.service-hero-title{font-size:var(--fs-display)}.service-hero-form-card{padding:24px 20px}}

/* ==========================================================================
   Service page content (Gutenberg) — sections migrated to semantic classes
   (lk-svc-*; see linkawy-tools/work/svc/migrate.py). The blocks no longer carry
   colours / borders / radius / font sizes / padding, so everything below works
   without !important. Sections are full width; their content sits in a centred
   1200px container made by the side padding (16px mobile, 24px from tablet).
   ========================================================================== */
.page-template-service-page .page-content-section{background:var(--white);padding:0;overflow:visible}
.page-template-service-page .page-content-section::before{display:none}
.page-template-service-page .page-content-section .container{max-width:none;padding:0}
.page-template-service-page .page-content.linkawy-content{--svc-pad:16px;--svc-gutter:max(var(--svc-pad),calc((100% - var(--content-max)) / 2));
  max-width:none;margin:0;padding:0}
@media (min-width:768px){.page-template-service-page .page-content.linkawy-content{--svc-pad:24px}}

/* Gaps between sections come from the sections themselves */
.page-template-service-page .page-content > .wp-block-spacer,
.page-template-service-page .page-content > p:empty{display:none}
/* Anything at the top level that is not a section (e.g. the backlink packages heading) sits in the container */
.page-template-service-page .page-content > :not(.lk-svc-section):not(.faq-block):not(.wp-block-spacer){
  box-sizing:border-box;max-width:calc(var(--content-max) + 2 * var(--svc-pad));margin-inline:auto;padding-inline:var(--svc-pad)}

/* ---------- Sections: full width, straight, container via padding ---------- */
.page-template-service-page .lk-svc-section{box-sizing:border-box;width:100%;max-width:none;margin:0;border-radius:0;
  padding-block:var(--space-section-sm);padding-inline:var(--svc-gutter);
  --text-heading:var(--fg-on-light-1);--text-body:var(--fg-on-light-2);--text-muted:var(--fg-on-light-3)}
.page-template-service-page .lk-svc-white{background:var(--white)}
.page-template-service-page .lk-svc-cream{background:var(--cream)}
.page-template-service-page .lk-svc-dark-surface{background:var(--dark);
  --text-heading:var(--fg-on-dark-1);--text-body:var(--fg-on-dark-2);--text-muted:var(--fg-on-dark-3)}
.page-template-service-page .lk-svc-section.is-layout-constrained > *{max-width:760px}

/* Type inside sections */
.page-template-service-page .lk-svc-section h2{font-size:var(--fs-section);line-height:var(--lh-section);letter-spacing:var(--tracking-section);font-weight:700;color:var(--text-heading)}
.page-template-service-page .lk-svc-section h3{font-size:var(--fs-card);line-height:var(--lh-card);letter-spacing:var(--tracking-card);font-weight:600;color:var(--text-heading)}
.page-template-service-page .lk-svc-section p,.page-template-service-page .lk-svc-section li{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-body)}
.page-template-service-page .lk-svc-section a:not(.wp-block-button__link){color:var(--orange)}
/* List bullets: Lucide check-check (stroke 2.25, brand orange) */
.page-template-service-page .lk-svc-section ul li::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF6207' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 7 17l-5-5'/%3E%3Cpath d='m22 10-7.5 7.5L13 16'/%3E%3C/svg%3E") no-repeat center/contain;width:1.15em;height:1.15em;top:.3em}
.page-template-service-page .lk-svc-section img{border-radius:var(--radius-card)}

/* ---------- Cards ---------- */
.page-template-service-page .lk-svc-card,.page-template-service-page .lk-svc-callout,.page-template-service-page .lk-svc-step{
  box-sizing:border-box;padding:28px;border-radius:var(--radius-card);background:var(--white);border:1px solid var(--border-light)}
/* The one highlight card on a light section: dark */
.page-template-service-page .lk-svc-card--highlight{background:var(--dark);border-color:var(--dark);
  --text-heading:var(--fg-on-dark-1);--text-body:var(--fg-on-dark-2)}
/* Callouts ("when do you need it"): the orange start-side accent of the original */
.page-template-service-page .lk-svc-callout{border-inline-start:2px solid var(--orange)}
/* Icon tile (linkawy/icon) */
/* Centred above the card title, as the original icons were */
.page-template-service-page .wp-block-linkawy-icon.lk-tile{--tile-size:56px;display:flex;margin:0 auto 20px}
.page-template-service-page .wp-block-linkawy-icon .lk-icon{width:24px;height:24px}
/* Steps: the "01." heading keeps its original look — orange number, centred, no background */
.page-template-service-page h3.lk-svc-step-num{display:block;margin:0 0 10px;padding:0;background:none;border:0;
  color:var(--orange);font-size:36px;line-height:1.2;font-weight:600;text-align:center;font-variant-numeric:tabular-nums}

/* ---------- Dark sections (media + list) ---------- */
.page-template-service-page .lk-svc-dark-surface .wp-block-media-text{gap:40px}
.page-template-service-page .lk-svc-dark-surface .wp-block-media-text__content{padding:0}
.page-template-service-page .lk-svc-dark-surface li{color:var(--fg-on-dark-1)}

/* ---------- CTA (dark) + buttons ---------- */
.page-template-service-page .lk-svc-cta{text-align:center}
.page-template-service-page .page-content .wp-block-button .wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;
  border-radius:var(--radius-pill);border:1px solid transparent;font-size:15px;font-weight:700;text-decoration:none;transform:none;
  transition:box-shadow var(--dur-base) var(--ease-out),border-color var(--dur-fast),background var(--dur-fast)}
/* Primary: the gradient pill (same weight as the legacy :not(.is-style-outline) rules, loaded later) */
.page-template-service-page .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link{background:var(--gradient-primary);color:var(--white)}
.page-template-service-page .page-content .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover{background:var(--gradient-primary);color:var(--white);box-shadow:var(--shadow-exceptional);transform:none}
/* Outline: on dark = white text + dark border; on light = dark text + light border */
.page-template-service-page .page-content .wp-block-button.is-style-outline .wp-block-button__link{background:transparent;color:var(--white);border-color:var(--dark-border)}
.page-template-service-page .page-content .wp-block-button.is-style-outline .wp-block-button__link:hover{background:rgba(255,255,255,.04);color:var(--white);border-color:var(--fg-on-dark-3);transform:none}
.page-template-service-page .lk-svc-white .wp-block-button.is-style-outline .wp-block-button__link,
.page-template-service-page .lk-svc-cream .wp-block-button.is-style-outline .wp-block-button__link{color:var(--fg-on-light-1);border-color:var(--border-light)}

/* ---------- Pricing (backlinks) ---------- */
.page-template-service-page .lk-svc-pricing{background:transparent;padding-block:24px;padding-inline:var(--svc-gutter);margin:0}
.page-template-service-page .lk-svc-pricing > .lk-svc-card:last-child{box-shadow:var(--shadow-exceptional)}

/* ---------- FAQ = the home page FAQ (old design): two independent columns of rows split by #e8e8e8 lines,
   "+" turns into an orange "x". linkawy/faq blocks and the store page's core/details; main-ar.js splits the
   items into two .lk-faq-col columns so opening one never stretches its neighbour. ---------- */
.page-template-service-page .page-content.linkawy-content > .faq-block,.page-template-service-page .linkawy-content .lk-svc-faq{box-sizing:border-box;margin:0;padding:7.5rem var(--svc-gutter) 8.5rem;background:#fff}
.page-template-service-page .linkawy-content .faq-block .faq-title,.page-template-service-page .linkawy-content .lk-svc-faq > h2{text-align:center;font-size:2.6rem;font-weight:800;color:#111;line-height:1.3;letter-spacing:0;margin:0 0 5rem!important;padding:0;border:0}
.page-template-service-page .linkawy-content .faq-block .faq-container,.page-template-service-page .linkawy-content .lk-svc-faq .lk-faq-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 3.5rem;max-width:var(--content-max);margin:0 auto;border-top:0}
.page-template-service-page .linkawy-content .lk-faq-col{display:flex;flex-direction:column;min-width:0}
.page-template-service-page .linkawy-content .faq-block .faq-item,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details{border:0;border-bottom:1px solid #e8e8e8;border-radius:0;background:transparent;margin:0!important;padding:0}
.page-template-service-page .linkawy-content .lk-faq-col > :first-child{border-top:1px solid #e8e8e8}
.page-template-service-page .linkawy-content .faq-block h2.faq-question,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:2.2rem 0;margin:0;font-size:1.05rem;font-weight:600;line-height:1.5;color:#222;cursor:pointer;list-style:none;transition:color .2s ease;-webkit-user-select:none;user-select:none}
.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details summary::-webkit-details-marker{display:none}
.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details summary strong{font-weight:inherit}
.page-template-service-page .linkawy-content .faq-block h2.faq-question:hover,.page-template-service-page .linkawy-content .faq-block .faq-item.is-open h2.faq-question,
.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details summary:hover,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details[open] summary{color:var(--orange)}
.page-template-service-page .linkawy-content .faq-block h2.faq-question::after,.page-template-service-page .linkawy-content .faq-block h2.faq-question:hover::after,
.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details summary::after{content:'+';flex-shrink:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;font-weight:300;line-height:1;color:#999;transition:transform .3s ease,color .3s ease}
.page-template-service-page .linkawy-content .faq-block .faq-item.is-open h2.faq-question::after,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details[open] summary::after{color:var(--orange);transform:rotate(-45deg)}
.page-template-service-page .linkawy-content .faq-block .faq-answer-content,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details > :not(summary){padding:.2rem 0 1.85rem;margin:0!important;font-size:.95rem;line-height:1.8;color:#666}
@media (max-width:768px){
  .page-template-service-page .page-content.linkawy-content > .faq-block,.page-template-service-page .linkawy-content .lk-svc-faq{padding-block:5rem 5.5rem}
  .page-template-service-page .linkawy-content .faq-block .faq-title,.page-template-service-page .linkawy-content .lk-svc-faq > h2{font-size:1.8rem;margin-bottom:3rem!important}
  .page-template-service-page .linkawy-content .faq-block .faq-container,.page-template-service-page .linkawy-content .lk-svc-faq .lk-faq-cols{grid-template-columns:1fr;gap:0}
  .page-template-service-page .linkawy-content .lk-faq-col + .lk-faq-col > :first-child{border-top:0}
  .page-template-service-page .linkawy-content .faq-block h2.faq-question,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details summary{padding:1.85rem 0}
}
@media (max-width:480px){
  .page-template-service-page .page-content.linkawy-content > .faq-block,.page-template-service-page .linkawy-content .lk-svc-faq{padding-block:3.5rem 4rem}
  .page-template-service-page .linkawy-content .faq-block .faq-title,.page-template-service-page .linkawy-content .lk-svc-faq > h2{font-size:1.5rem;margin-bottom:2.5rem!important}
  .page-template-service-page .linkawy-content .faq-block h2.faq-question,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details summary{padding:1.25rem 0;font-size:.95rem}
  .page-template-service-page .linkawy-content .faq-block .faq-answer-content,.page-template-service-page .linkawy-content .lk-svc-faq .wp-block-details > :not(summary){font-size:.9rem;padding-bottom:1.5rem}
}

@media (max-width:767px){
  .page-template-service-page .lk-svc-section{padding-block:56px}
  .page-template-service-page .lk-svc-card,.page-template-service-page .lk-svc-callout,.page-template-service-page .lk-svc-step{padding:22px}
}

/* Glass header: the dark service hero runs under the sticky header (content position unchanged) */
.page-template-service-page .service-hero{margin-top:-80px;padding-top:calc(72px + 80px)}
@media (max-width:900px){.page-template-service-page .service-hero{padding-top:calc(48px + 80px)}}
@media (max-width:768px){.page-template-service-page .service-hero{margin-top:-68px;padding-top:calc(48px + 68px)}}
