/*
 * DeepDiveDigital internal content system.
 *
 * Hero h1 sizing and hero art remain page-specific. Shared labels and hero
 * descriptions follow the typography contract below.
 * It normalises repeated content headings and icon components after each
 * page's local stylesheet, while page-specific composition stays local.
 */

:root {
  --ddd-font-family: "Manrope", Arial, sans-serif;
  --ddd-label-size: 12px;
  --ddd-intro-divider-width: 2px;
  --ddd-label-dot-size: 8px;
  --ddd-button-size: 14px;
  --ddd-text-link-size: 13px;
  --ddd-caption-size: 10px;
  --ddd-product-link-size: 13px;
  --ddd-certificate-caption-size: 11px;
  --ddd-utility-caption-size: 8px;
  --ddd-body-size: 16px;
  --ddd-body-leading: 1.65;
  --ddd-card-copy-size: 14px;
  --ddd-card-copy-leading: 1.6;
  --ddd-card-title-large: 24px;
  --ddd-card-title-compact: 20px;
  --ddd-step-title: 20px;
  --ddd-step-copy-size: 14px;
  --ddd-price-point-title: 20px;
  --ddd-price-point-copy: 14px;
  --ddd-proof-caption-size: 14px;
  --ddd-case-title: 32px;
  --ddd-faq-question: 20px;
  --ddd-review-copy-size: 18px;
  --ddd-review-copy-leading: 1.65;
  --ddd-form-input-size: 16px;
  --ddd-form-label-size: 12px;
  --ddd-form-copy-size: 14px;
  --ddd-form-hint-size: 13px;
  --ddd-modal-title-size: 24px;
  --ddd-site-check-size: 18px;
  --ddd-hero-description-size: 18px;
  --ddd-hero-description-leading: 1.65;
  --ddd-content-title-primary: 72px;
  --ddd-content-title-compact: 64px;
  --ddd-content-title-price: 58px;
  --ddd-content-title-technical: 50px;
  --ddd-content-title-article: 36px;
  --ddd-content-title-legal: 27px;
  --ddd-format-icon-box: 82px;
  --ddd-format-icon-art: 56px;
  --ddd-step-icon-box: 68px;
  --ddd-step-icon-art: 46px;
}

/* Native controls have their own browser font and do not automatically use
 * the page font. Keep regular-page controls in the approved Manrope family.
 * Articles and Relax retain their independently approved typography. */
body:not(.relax):not(.article-page) :is(button, input, textarea, select, .button, .text-link) {
  font-family: var(--ddd-font-family) !important;
}
body:not(.relax):not(.article-page) .button {
  font-size: var(--ddd-button-size) !important;
}

/* One typography contract for every regular page, including Privacy.
 * Important declarations intentionally supersede legacy local overrides,
 * including low-landscape and page-specific paragraph rules. Relax is exempt.
 */
body:not(.relax) :is(.eyebrow, .kicker, .privacy-eyebrow, .services-kicker, .not-found-kicker) {
  font-family: var(--ddd-font-family) !important;
  font-size: var(--ddd-label-size) !important;
}

/* Explanatory dividers share one width at every breakpoint.
 * Opt-in markers avoid changing frames, diagrams and depth rulers. */
body:not(.relax) :is(p[data-intro-divider="existing"], p[data-intro-divider="new"], .certification-proof-note) {
  border-left-width: var(--ddd-intro-divider-width) !important;
}

/* Opt-in dot for span-backed page labels; ordinary kicker pseudo-dots retain
 * their approved rendering and do not receive a second marker. */
body:not(.relax) .ddd-label-dot > span:empty {
  box-sizing: border-box;
  width: var(--ddd-label-dot-size);
  height: var(--ddd-label-dot-size);
  flex: 0 0 var(--ddd-label-dot-size);
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 6px rgba(45,232,253,.09);
}

body:not(.relax) .hero-lead,
body:not(.relax) :is(.about-hero-copy, .portfolio-hero-copy, .contacts-hero-copy, .privacy-hero-copy, .trademark-hero-copy) > p:not(.eyebrow):not(.kicker) {
  font-family: var(--ddd-font-family) !important;
  font-size: var(--ddd-hero-description-size) !important;
  line-height: var(--ddd-hero-description-leading) !important;
}

@media (max-width: 760px) {
  :root {
    --ddd-hero-description-size: 16px;
    --ddd-hero-description-leading: 1.6;
  }
}

/* Nested About introductions use the body-text role without changing leading.
 * Route-step labels and price-option titles retain their own component family. */
body.about-page :is(.about-intro-copy, .about-route-copy) > p:not(.kicker):not(.eyebrow) {
  font-size: var(--ddd-body-size) !important;
}

/* Shared typography contract: apply roles, never a blanket main p/h3 reset.
 * Keep articles, legal prose, illustrations and approved blog-card copy on
 * their independent contracts. All spacing, colour and component geometry
 * remain owned by the page templates. */
body:not(.relax):not(.article-page) :is(
  .section-head, .section-heading, .section-intro, .process-head, .ai-head,
  .quick-audit-head, .seo-growth-head, .about-section-head,
  .services-directions-head, .portfolio-heading, .contact-heading,
  .office-radar-copy, .about-intro, .about-route, .scope-intro,
  .approach-copy, .dev-price-copy, .about-cta, .portfolio-cta,
  .contact-form-copy, .services-request-copy
) > p:not(.kicker):not(.eyebrow):not(.privacy-eyebrow):not(.services-kicker):not(.not-found-kicker),
body:not(.relax):not(.article-page) .services-directions-head > div > p,
body:not(.relax):not(.article-page) .services-request-card > div > p:not(.services-kicker),
body:not(.relax):not(.article-page) .film-head > p,
body:not(.relax):not(.article-page) .about-cta-card > div > p:not(.kicker),
body:not(.relax):not(.article-page) .audit-summary > div > p:not(.kicker),
body:not(.relax):not(.article-page) .consultation-card > div > p:not(.kicker) {
  font-size: var(--ddd-body-size) !important;
  line-height: var(--ddd-body-leading) !important;
}

body:not(.relax):not(.article-page) :is(
  .approach-copy, .strategy-input, .strategy-output, .scope-copy
) > ul > li {
  font-size: var(--ddd-body-size) !important;
  line-height: var(--ddd-body-leading) !important;
}

body:not(.relax):not(.article-page) :is(
  .service-card, .format-card, .approach-card, .scope-card,
  .capability-copy, .technology-copy
) > p,
body:not(.relax):not(.article-page) :is(.dev-case-info, .case-info) > p:not(.case-label),
body:not(.relax):not(.article-page) :is(
  .discovery-cards, .process-grid, .ai-grid
) article p {
  font-size: var(--ddd-card-copy-size) !important;
  line-height: var(--ddd-card-copy-leading) !important;
}

body:not(.relax):not(.article-page) :is(.price-points, .audit-levels, .price-card) li {
  font-size: var(--ddd-card-copy-size) !important;
  line-height: var(--ddd-card-copy-leading) !important;
}

body:not(.relax):not(.article-page) :is(.service-card, .approach-card, .capability-copy, .technology-copy) > h3,
body.service-hub-page .format-card > h3 {
  font-size: var(--ddd-card-title-large) !important;
  line-height: 1.25 !important;
}
body:not(.relax):not(.article-page):not(.service-hub-page) .format-card > h3 {
  font-size: var(--ddd-card-title-compact) !important;
  line-height: 1.25 !important;
}
body:not(.relax):not(.article-page) :is(.dev-steps, .process-grid) article h3,
body:not(.relax):not(.article-page) .scope-stage .scope-copy h3 {
  font-size: var(--ddd-step-title) !important;
  line-height: 1.3 !important;
}
body:not(.relax):not(.article-page) .dev-process .dev-steps article p,
body:not(.relax):not(.article-page) .scope-stage .scope-copy p {
  font-size: var(--ddd-step-copy-size) !important;
  line-height: 1.6 !important;
}
body:not(.relax):not(.article-page) :is(.dev-case-info, .case-info) h3 {
  font-size: var(--ddd-case-title) !important;
  line-height: 1.2 !important;
}
body:not(.relax):not(.article-page) .faq-list summary {
  --ddd-faq-question: 17px;
  font-size: var(--ddd-faq-question) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}
body:not(.relax):not(.article-page) .faq-list details > p {
  --ddd-body-size: 15px;
  font-size: var(--ddd-body-size) !important;
  line-height: var(--ddd-body-leading) !important;
}
body:not(.relax):not(.article-page) :is(.text-link, .clients-toggle) {
  font-size: var(--ddd-text-link-size) !important;
}

body:not(.relax):not(.article-page) .reviews .review-content blockquote {
  font-size: var(--ddd-review-copy-size) !important;
  line-height: var(--ddd-review-copy-leading) !important;
}
body:not(.relax):not(.article-page) .review-toggle {
  font-size: var(--ddd-button-size) !important;
}
body:not(.relax):not(.article-page) .technology-link {
  font-size: var(--ddd-product-link-size) !important;
}

/* Secondary captions are not section kickers, body copy or catalogue text. */
body:not(.relax):not(.article-page) :is(
  .vessel-top > span, .vessel-top > b, .vessel-data > span,
  .approach-route > span, .approach-route b, .technology-copy > span,
  .capability-copy > span, .depth-ticker span
) {
  font-size: var(--ddd-caption-size) !important;
}
body:not(.relax):not(.article-page) .certification-item span {
  font-size: var(--ddd-certificate-caption-size) !important;
}
body:not(.relax):not(.article-page) .hero-utility small {
  font-size: var(--ddd-utility-caption-size) !important;
}

/* Forms: retain field order, validation, status layout and consent behaviour. */
body:not(.relax):not(.article-page) :is(.audit-form, .contact-form) :is(
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]), textarea, select
) {
  font-size: var(--ddd-form-input-size) !important;
}
body:not(.relax):not(.article-page) :is(.audit-form, .contact-form) label.form-field:not(.consent) {
  font-size: var(--ddd-form-label-size) !important;
}
body:not(.relax):not(.article-page) .audit-form > p:not(.kicker):not(.form-status) {
  font-size: var(--ddd-form-copy-size) !important;
  line-height: 1.6 !important;
}
body:not(.relax):not(.article-page) :is(.audit-form, .contact-form) .field-hint {
  font-size: var(--ddd-form-hint-size) !important;
  line-height: 1.45 !important;
}
body:not(.relax):not(.article-page) .audit-modal .audit-form h3 {
  font-size: var(--ddd-modal-title-size) !important;
  line-height: 1.25 !important;
}
body:not(.relax):not(.article-page) .site-check-form input {
  font-size: var(--ddd-site-check-size) !important;
}

/* Freeze round label markers: long mobile eyebrows must not squash them. */
body:not(.relax):not(.article-page) .eyebrow > span:empty {
  box-sizing: border-box;
  width: 8px !important;
  height: 8px !important;
  flex: 0 0 8px !important;
  box-shadow: 0 0 0 6px rgba(45,232,253,.09) !important;
}

@media (max-width:760px) {
  body:not(.relax):not(.article-page) {
    --ddd-card-title-large: 22px;
    --ddd-step-title: 18px;
    --ddd-case-title: 26px;
    --ddd-faq-question: 18px;
    --ddd-site-check-size: 16px;
  }
}

/* Service overview secondary direction links share the approved text-link size. */
body:not(.relax) .hero-proof > div > span {
  font-size: var(--ddd-proof-caption-size) !important;
  line-height: 1.35 !important;
}
/* The SEO proof band is the shared reference. Rows grow for longer captions;
 * padding is never traded away to fit a fixed-height card. */
body:not(.relax) .hero-proof > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: auto !important;
  min-height: 132px !important;
  padding: 24px 28px !important;
  text-align: center;
}
@media (max-width:699px), (orientation:landscape) and (max-width:1000px) and (max-height:600px) {
  body:not(.relax) .hero-proof > div {
    min-height: 126px !important;
    padding: 20px 18px !important;
  }
}

body:not(.relax):not(.article-page) .direction-main-copy > a {
  font-size: var(--ddd-text-link-size) !important;
}

/* Shared typography for service price points and approved SEO/audit options. */
body:not(.relax):not(.article-page) :is(.price-points, .price-options[data-price-standard]) article h3 {
  font-size: var(--ddd-price-point-title) !important;
  line-height: 1.3 !important;
}
body:not(.relax):not(.article-page) :is(.price-points, .price-options[data-price-standard]) article p {
  font-size: var(--ddd-price-point-copy) !important;
  line-height: 1.6 !important;
  color: #aec5cf !important;
}

/* Approved mobile introductions and card descriptions; retain desktop layout. */
@media (max-width:699px), (orientation:landscape) and (max-width:1000px) and (max-height:600px) {
  body:not(.relax):not(.article-page) { --ddd-price-point-title: 18px; }
  body:not(.relax):not(.article-page) :is(.context-price-line, .social-price-line, .media-price-line) strong {
    font-size: var(--ddd-body-size) !important;
  }
  body:not(.relax):not(.article-page) :is(.about-intro-copy, .about-route-copy, .contact-card, .direction-main-copy) > p:not(.kicker):not(.eyebrow) {
    font-size: var(--ddd-body-size) !important;
    line-height: 1.6 !important;
  }
  body:not(.relax):not(.article-page) :is(.audit-directions, .audit-level-options) article > p {
    font-size: var(--ddd-body-size) !important;
    line-height: 1.6 !important;
  }
  body:not(.relax):not(.article-page) .project-development .project-info > h3 + p {
    font-size: var(--ddd-body-size) !important;
    line-height: 1.6 !important;
  }
  body:not(.relax):not(.article-page) .value-grid article > h3 {
    font-size: var(--ddd-card-title-large) !important;
    line-height: 1.25 !important;
  }
  body:not(.relax):not(.article-page) .value-grid article > p {
    font-size: var(--ddd-body-size) !important;
    line-height: 1.6 !important;
  }
  body:not(.relax):not(.article-page) .route-steps article h3 {
    font-size: 20px !important;
    line-height: 1.3 !important;
  }
  body:not(.relax):not(.article-page) .route-steps article p {
    font-size: var(--ddd-step-copy-size) !important;
    line-height: 1.6 !important;
  }
}

/* Primary internal section headings. */
body .section-head h2,
body .reviews .section-head h2,
body .section-heading h2,
body .process-head h2,
body .cases-head h2,
body .cases-heading h2,
body .faq-grid > div:first-child > h2,
body .about-intro h2,
body .about-route h2,
body .about-section-head h2,
body .film-head h2,
body .contact-heading h2,
body .office-radar-copy h2,
body .services-directions-head h2,
body .portfolio-heading h2,
body .blog .section-head h2,
body .section-intro h2,
body .quick-audit-head h2,
body .seo-growth-head h2,
body .seo-results-head h2,
/* SEO scope is a primary section, not a price heading. */
body.seo-page .scope-intro h2 {
  font-size: var(--ddd-content-title-primary);
}

/* Compact and conversion-focused sections. */
body .approach-copy h2,
body .consultation h2,
body .audit-summary h2,
body .audit-result-grid h2,
html.concept-deep body .audit-summary h2,
body .about-cta h2,
body .services-request h2,
body .portfolio-cta h2,
body .contact-form-copy h2,
body .technologies .section-head h2,
body.reviews-page .reviews-cta h2,
body.blog-page .blog-cta h2,
body .ai-head h2 {
  font-size: var(--ddd-content-title-compact);
}

/* Price, scope and additional-content headings. */
body .dev-price-copy h2,
body .scope-intro h2,
body .price-card h2,
body .article-related .section-head h2,
body .trademark-proof-copy h2 {
  font-size: var(--ddd-content-title-price);
}

/* Dense technical labels and article hierarchy. */
body .certification-head h2 {
  font-size: var(--ddd-content-title-technical);
}

body .article-body h2 {
  font-size: var(--ddd-content-title-article);
}

html.concept-deep body.article-page .article-body h2 {
  font-size: var(--ddd-content-title-article);
}

body .legal-aside h2 {
  font-size: var(--ddd-content-title-legal);
}

/* Service pages carry a high-specificity concept skin on mobile. Keep the
   shared hierarchy authoritative without using !important. */
html.concept-deep body .section-heading h2,
html.concept-deep body .process-head h2,
html.concept-deep body .cases-head h2,
html.concept-deep body .cases-heading h2,
html.concept-deep body .faq-grid > div:first-child > h2,
html.concept-deep body .section-intro h2,
html.concept-deep body .quick-audit-head h2,
html.concept-deep body .seo-growth-head h2,
html.concept-deep body .portfolio-heading h2,
html.concept-deep body.blog-page .blog-latest .section-head h2,
html.concept-deep body.seo-page .scope-intro h2 {
  font-size: var(--ddd-content-title-primary);
}

html.concept-deep body .audit-summary h2,
html.concept-deep body .ai-head h2,
html.concept-deep body .audit-result-grid h2,
html.concept-deep body.reviews-page .reviews-cta h2,
html.concept-deep body.blog-page .blog-cta h2 {
  font-size: var(--ddd-content-title-compact);
}

html.concept-deep body .dev-price-copy h2,
html.concept-deep body .scope-intro h2,
html.concept-deep body .price-card h2 {
  font-size: var(--ddd-content-title-price);
}

/* Repeated direction-card icons. Images and SVGs share one optical frame. */
body:not(.service-hub-page) .format-icon {
  width: var(--ddd-format-icon-box);
  height: var(--ddd-format-icon-box);
}

html.concept-deep body .context-formats .format-icon,
html.concept-deep body.automation-page:not(.service-hub-page) .format-card .format-icon {
  width: var(--ddd-format-icon-box);
  height: var(--ddd-format-icon-box);
}

body:not(.service-hub-page) .format-icon > :is(svg, img) {
  width: var(--ddd-format-icon-art);
  height: var(--ddd-format-icon-art);
  object-fit: contain;
}

html.concept-deep body .context-formats .format-icon > :is(svg, img),
html.concept-deep body.automation-page:not(.service-hub-page) .format-card .format-icon > :is(svg, img) {
  width: var(--ddd-format-icon-art);
  height: var(--ddd-format-icon-art);
  object-fit: contain;
}

/* Repeated process-step icons. */
body .step-icon {
  width: var(--ddd-step-icon-box);
  height: var(--ddd-step-icon-box);
}

body .step-icon > :is(svg, img) {
  width: var(--ddd-step-icon-art);
  height: var(--ddd-step-icon-art);
  object-fit: contain;
}

/* Optical corrections: same frame, deliberately different inner scale. */
body .content-icon--sonar > :is(svg, img),
body .format-icon--sonar > :is(svg, img) {
  transform: scale(1.12);
}

body .content-icon--light > :is(svg, img),
body .format-icon--light > :is(svg, img) {
  transform: scale(1.06);
}

body .content-icon--dense > :is(svg, img),
body .format-icon--dense > :is(svg, img) {
  transform: scale(.95);
}

/* Desktop case carousels keep one complete central project while revealing
   the adjacent cards as a clear cue that the track can be navigated. */
@media (min-width: 761px) {
  body .dev-cases .case-viewport {
    --ddd-case-card-width: min(1180px, calc(100vw - 48px));
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    overflow: hidden;
    border-radius: 0;
  }

  body .dev-cases .case-track {
    width: 100%;
    gap: 22px;
    padding: 10px max(24px, calc((100vw - var(--ddd-case-card-width)) / 2)) 32px;
    scroll-padding-inline: max(24px, calc((100vw - var(--ddd-case-card-width)) / 2));
    box-sizing: border-box;
  }

  body .dev-cases .dev-case-card {
    width: var(--ddd-case-card-width);
    min-width: var(--ddd-case-card-width);
    max-width: var(--ddd-case-card-width);
    flex: 0 0 var(--ddd-case-card-width);
    /* Explicit zero minima avoid Safari's intrinsic grid sizing inside the
       horizontal flex track, which otherwise leaves unused space on the right. */
    grid-template-columns: minmax(0, .38fr) minmax(0, .62fr);
  }

  body .dev-cases .dev-case-card > :is(.dev-case-info, .dev-case-shot) {
    min-width: 0;
  }

  body .dev-cases .dev-case-info h3 {
    overflow-wrap: anywhere;
  }
}

@media (min-width: 761px) and (max-width: 1050px) {
  :root {
    --ddd-content-title-primary: 56px;
    --ddd-content-title-compact: 50px;
    --ddd-content-title-price: 46px;
    --ddd-content-title-technical: 42px;
    --ddd-content-title-article: 34px;
    --ddd-content-title-legal: 25px;
    --ddd-format-icon-box: 76px;
    --ddd-format-icon-art: 52px;
    --ddd-step-icon-box: 58px;
    --ddd-step-icon-art: 39px;
  }
}

@media (max-width: 760px) {
  :root {
    --ddd-content-title-primary: 46px;
    --ddd-content-title-compact: 42px;
    --ddd-content-title-price: 42px;
    --ddd-content-title-technical: 37px;
    --ddd-content-title-article: 32px;
    --ddd-content-title-legal: 24px;
    --ddd-format-icon-box: 72px;
    --ddd-format-icon-art: 49px;
    --ddd-step-icon-box: 48px;
    --ddd-step-icon-art: 33px;
  }
}

/* Local review: one carousel-control contract for cases and reviews. */
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]{
 position:relative;display:grid;place-items:center;box-sizing:border-box;flex:0 0 auto;
 width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:1px solid #bdd8de;
 border-radius:50%;background:#fff;color:#143c4c;font-size:0;line-height:0;
 box-shadow:none;transform:none;cursor:pointer;-webkit-tap-highlight-color:transparent;
 transition:background-color .16s,border-color .16s,color .16s,transform .12s;
}
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]::before{
 content:"";position:absolute;left:50%;top:50%;width:20px;height:20px;background:currentColor;
 -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16m-7-7 7 7-7 7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%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'%3E%3Cpath d='M4 12h16m-7-7 7 7-7 7' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
 transform:translate(-50%,-50%);
}
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label^="Предыдущ"]::before{transform:translate(-50%,-50%) scaleX(-1)}
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]>svg{display:none}
@media(hover:hover) and (pointer:fine){
 .carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]:enabled:hover{color:#06172c;background:#2de8fd;border-color:#2de8fd;box-shadow:none;transform:none}
}
@media(hover:none),(pointer:coarse){
 .carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]:hover{color:#143c4c;background:#fff;border-color:#bdd8de;box-shadow:none;transform:none}
}
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]:enabled:active{color:#06172c;background:#2de8fd;border-color:#2de8fd;box-shadow:none;transform:scale(.96)}
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]:focus-visible{outline:2px solid #168da3;outline-offset:3px}
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]:disabled{color:#143c4c;background:#fff;border-color:#bdd8de;opacity:.35;box-shadow:none;transform:none;cursor:default}
@media(max-width:760px){
 .carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]{width:44px;height:44px;min-width:44px;min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 .carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label]{transition:none}
}

/* Hold completed-click colour for half a second; navigation itself remains immediate. */
.carousel-controls-preview :is(.case-controls,.review-controls)>button[aria-label].carousel-control-feedback{
 color:#06172c;background:#2de8fd;border-color:#2de8fd;box-shadow:none;opacity:1;
}