/* Shared visual styles for ООО «МедТиС» */
:root { --ink:#102a3b; --muted:#5c707b; --teal:#007d85; --aqua:#c9eff0; --paper:#f8fbfb; --line:#dce8e9; --font:'Manrope',Arial,sans-serif; --display:'Onest',Arial,sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:#fff; font-family:var(--font); font-size:16px; line-height:1.65; } a { color:inherit; text-decoration:none; } .container { width:min(1120px, calc(100% - 48px)); margin:auto; }
.site-header { background:#fff; border-bottom:1px solid #edf2f2; } .header-inner { height:84px; display:flex; align-items:center; gap:45px; } .logo, .footer-logo { display:inline-flex; align-items:center; gap:10px; font:700 24px/1 var(--display); letter-spacing:-1px; } .logo > span:last-child span, .footer-logo span { color:var(--teal); }.logo-mark { width:32px; height:32px; display:inline-block; position:relative; overflow:hidden; border-radius:11px 11px 11px 3px; background:linear-gradient(145deg,#006e76,#07949b); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); }.logo-mark::before,.logo-mark::after { content:""; position:absolute; display:block; width:7px; height:20px; top:6px; border-radius:8px; transform:rotate(-35deg); }.logo-mark::before { left:9px; background:#fff; }.logo-mark::after { left:18px; background:#aee8e8; }.logo-mark i,.logo-mark b { display:none; }.main-nav { display:flex; gap:28px; margin-left:auto; font-size:14px; font-weight:700; }.main-nav a { padding:29px 0 25px; border-bottom:3px solid transparent; }.main-nav a:hover,.main-nav .is-current { color:var(--teal); border-color:var(--teal); }.header-phone { font-size:14px; font-weight:800; }
.hero { overflow:hidden; background:linear-gradient(120deg,#effafb 0%,#effafb 51%,#e1f4f4 100%); }.hero-grid { min-height:577px; display:grid; grid-template-columns:1.12fr .88fr; align-items:center; }.eyebrow { color:var(--teal); text-transform:uppercase; letter-spacing:1.3px; font-size:11px; font-weight:800; margin:0 0 16px; }.hero h1,.page-heading h1 { font:700 clamp(38px,5vw,68px)/1.08 var(--display); letter-spacing:-2.7px; margin:0; }.lead { max-width:555px; color:#405a67; margin:28px 0 34px; font-size:17px; }.button { display:inline-flex; align-items:center; gap:16px; border-radius:3px; padding:15px 21px; background:var(--teal); color:#fff; font-size:14px; font-weight:800; transition:.2s; }.button:hover { background:#00666d; transform:translateY(-2px); }.button span { font-size:20px; line-height:12px; }.hero-visual { height:100%; min-height:460px; position:relative; }.halo { position:absolute; border-radius:50%; border:1px solid rgba(0,125,133,.14); }.halo-one { width:440px;height:440px;right:-30px;top:67px; }.halo-two { width:345px;height:345px;right:16px;top:114px; }.device-card { position:absolute; z-index:1; width:245px; height:310px; left:50%; top:112px; transform:translateX(-50%) rotate(5deg); padding:17px; background:#fff; box-shadow:0 23px 45px rgba(13,74,78,.18); border-radius:9px; }.device-head { display:flex; gap:5px; }.device-head span { width:7px;height:7px;background:#d4e5e5;border-radius:50%; }.device-screen { height:210px;margin-top:17px;position:relative;overflow:hidden;border-radius:4px;background:linear-gradient(135deg,#163949,#1f5d65); }.pulse { position:absolute; width:150px;height:150px;border:1px solid rgba(202,255,255,.65);border-radius:50%;top:30px;left:48px; }.screen-line { position:absolute;height:3px;background:#7be0da;border-radius:3px; }.l1 { width:77px;left:20px;top:63px; transform:rotate(21deg); }.l2 { width:74px;left:88px;top:83px;transform:rotate(-40deg); }.l3 { width:49px;left:144px;top:58px;transform:rotate(23deg); }.device-base { width:65px;height:11px;background:#e4eeee;margin:19px auto 0;border-radius:7px; }.visual-label { position:absolute; z-index:2; padding:10px 13px; background:#fff; color:var(--ink); box-shadow:0 9px 20px rgba(13,74,78,.09);font-size:11px;font-weight:800;border-radius:3px; }.label-one { top:150px;right:-4px; }.label-two { left:8px;bottom:113px; }
.section { padding:110px 0; }.section-intro { display:grid;grid-template-columns:1fr 1.3fr;gap:28px 80px;align-items:start; }.section-intro .eyebrow { grid-column:1; }.section-intro h2 { grid-column:1;grid-row:2; }.section-intro > p:last-child { grid-column:2;grid-row:2;color:var(--muted);margin:0;padding-top:6px;max-width:530px; }.section h2,.cta h2,.details-card h2 { font:700 clamp(30px,3.3vw,46px)/1.15 var(--display);letter-spacing:-1.6px;margin:0; }.benefits-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:70px; }.benefit-card { min-height:230px;border:1px solid var(--line);padding:26px 28px;background:#fff; }.card-number { color:var(--teal);font-size:12px;font-weight:800; }.benefit-card h3 { margin:35px 0 10px;font:700 21px/1.25 var(--display);letter-spacing:-.5px; }.benefit-card p { color:var(--muted);font-size:14px;line-height:1.6;margin:0; }.section-tint { background:var(--paper); }.supply-layout { display:grid;grid-template-columns:1fr 1fr;gap:80px; }.supply-list > div { display:grid;grid-template-columns:48px 1fr;border-top:1px solid #c9d9da;padding:18px 0; }.supply-list > div:last-child { border-bottom:1px solid #c9d9da; }.supply-list span { color:var(--teal);font-size:12px;font-weight:800; }.supply-list p { margin:0;font:600 17px/1.4 var(--display);letter-spacing:-.3px; }.cta-section { background:var(--teal);color:#fff;padding:65px 0; }.cta { display:flex;align-items:center;justify-content:space-between;gap:30px; }.cta .eyebrow { color:#b9ebec; }.button-light { background:#fff;color:var(--teal);white-space:nowrap; }.button-light:hover { background:#e6f7f7; }.site-footer { background:#102c3a;color:#c3d2d7;padding:46px 0 34px; }.footer-inner { display:grid;grid-template-columns:1fr auto;gap:35px; }.footer-logo { color:#fff; }.footer-logo + p { font-size:13px;line-height:1.55;margin:13px 0 0; }.footer-links { display:flex;gap:27px;align-items:start;font-size:13px;font-weight:700; }.footer-links a:hover { color:#fff; }.copyright { grid-column:1 / -1;border-top:1px solid rgba(255,255,255,.13);margin:0;padding-top:23px;font-size:11px; }
.page-main { min-height:calc(100vh - 285px); }.page-heading { background:var(--paper);padding:85px 0 78px; }.page-heading h1 { font-size:clamp(38px,5vw,60px); }.page-heading > .container > p:last-child { color:var(--muted);margin:18px 0 0;font-size:17px; }.contacts-section { padding:85px 0 110px; }.contacts-grid { display:grid;grid-template-columns:.8fr 1.2fr;gap:70px; }.contact-label { text-transform:uppercase;color:var(--teal);letter-spacing:1.1px;font-size:11px;font-weight:800;margin:0 0 8px; }.contact-primary > a { display:block;font:700 clamp(22px,2.5vw,33px)/1.25 var(--display);letter-spacing:-1px;margin-bottom:38px; }.contact-primary > a:hover,.privacy-content a { color:var(--teal); }.details-card { padding:38px 40px;background:#f0f8f8; }.details-card h2 { font-size:27px;max-width:550px;margin-bottom:34px; }.details-card dl { margin:0; }.details-card dl div { border-top:1px solid #cfe0e0;padding:15px 0;display:grid;grid-template-columns:190px 1fr;gap:16px; }.details-card dt { color:var(--muted);font-size:13px; }.details-card dd { margin:0;font-size:14px;font-weight:600; }.compact { padding-bottom:55px; }.privacy-content { max-width:850px;padding-top:65px;padding-bottom:100px; }.privacy-content > p:first-child { color:var(--muted);font-size:17px; }.privacy-content h2 { font:700 24px/1.3 var(--display);letter-spacing:-.5px;margin:42px 0 13px; }.privacy-content p { margin:0 0 16px;color:#3e5663; }
@media (max-width:760px) { .container { width:min(100% - 36px,1120px); }.header-inner { height:72px;gap:18px; }.header-phone { display:none; }.main-nav { margin-left:auto;gap:16px;font-size:12px; }.main-nav a { padding:24px 0 21px; }.hero-grid { min-height:auto;grid-template-columns:1fr; }.hero-copy { padding:68px 0 28px; }.hero h1 { letter-spacing:-1.8px; }.lead { font-size:15px;margin:21px 0 28px; }.hero-visual { min-height:320px; }.halo-one { width:310px;height:310px;top:0;right:7px; }.halo-two { width:250px;height:250px;top:31px;right:38px; }.device-card { transform:translateX(-50%) rotate(5deg) scale(.79);top:5px; }.label-one { top:45px;right:0; }.label-two { left:0;bottom:38px; }.section { padding:70px 0; }.section-intro,.supply-layout,.contacts-grid { grid-template-columns:1fr;gap:20px; }.section-intro h2,.section-intro > p:last-child { grid-column:auto;grid-row:auto; }.section-intro > p:last-child { padding:0;font-size:15px; }.benefits-grid { grid-template-columns:1fr;gap:12px;margin-top:38px; }.benefit-card { min-height:auto;padding:22px; }.benefit-card h3 { margin:20px 0 7px; }.supply-layout { gap:38px; }.supply-list p { font-size:15px; }.cta { display:block; }.cta h2 { font-size:34px; }.cta .button { margin-top:28px; }.footer-inner { grid-template-columns:1fr;gap:25px; }.footer-links { flex-direction:column;gap:8px; }.page-heading { padding:62px 0; }.page-heading > .container > p:last-child { font-size:15px; }.contacts-section { padding:55px 0 70px; }.contact-primary > a { font-size:25px;margin-bottom:28px; }.details-card { padding:28px 22px; }.details-card h2 { font-size:24px; }.details-card dl div { grid-template-columns:1fr;gap:3px; }.privacy-content { padding-top:45px;padding-bottom:65px; }.privacy-content h2 { font-size:21px;margin-top:34px; } }