/* MediaChip sketch 02: warm surfaces and a small, consistent icon system. */
:root{
  --ink:#302d2c;
  --muted:#716b68;
  --soft:#f4eee8;
  --line:#e9dfd7;
  --paper:#fffcf9;
  --cream:#faf6f0;
  --blush:#fff1ed;
  --telegram:#229ed9;
  --whatsapp:#20b55c;
  --max:#6c48d9;
}

body{color:var(--ink);background:#fbf8f4}

.home-page{background:radial-gradient(circle at 73% 160px,#fff1eb 0,transparent 38%),#fbf8f4}

.header{background:#fffcf8ed;border-color:var(--line)}

.header-inner{height:88px}

.desktop-nav a{color:#5b5552}

.desktop-nav a:hover,.desktop-nav a[aria-current=page]{color:var(--red)}

.header-contact{color:#342f2c}

.hero{padding-top:70px;padding-bottom:62px}

.hero-copy h1{max-width:620px}

.hero-description{max-width:545px}

.hero-visual{box-shadow:0 24px 60px #3f251b1e}

.floating-note{border:1px solid #f1e4dc;box-shadow:0 16px 45px #2e211b1c}

.outline-check{border-color:#e1d3ca;background:#fffaf6}

.brand-strip{background:#fffaf5;border:1px solid var(--line);border-radius:16px;padding:22px 28px;margin-bottom:0}

.brand-strip b{color:#55504e}

.repair-section{background:#f1ebe4;margin-top:48px}

.repair-section .container{position:relative}

.device-grid{gap:16px}

.device-card{background:#fffcf9;border-color:#e4d8ce;box-shadow:0 12px 30px #4e34270b}

.device-card:hover{border-color:#d9ada4;box-shadow:0 18px 34px #4e342719}

.device-card.active{background:#fff8f4;box-shadow:inset 0 0 0 1px var(--red),0 16px 28px #93423610}

.device-symbol{width:64px;height:68px;display:grid;place-items:center;margin:7px 0 22px;color:#665f5b}

.device-symbol svg{width:61px;height:61px}

.device-card.active .device-symbol{color:var(--red)}

.card-arrow{background:#f5ede8}

.service-panel{border-color:#e4d8ce;background:#fffcf9}

.service-list button{border-color:#eee4dd}

.process-section{padding-top:86px;padding-bottom:76px}

.process-section .eyebrow{color:#b3534b}

.care-section{background:#fffaf5;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:72px 0 75px}

.care-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:30px}

.care-heading>div{max-width:570px}

.care-heading .eyebrow{color:#a9564c;margin-bottom:14px}

.care-heading h2{max-width:620px}

.care-heading>p{max-width:365px;color:var(--muted);font-size:14px;line-height:1.75}

.care-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

.care-card{position:relative;min-height:255px;background:#f8f1ea;border:1px solid #eadbd0;border-radius:17px;padding:25px 26px 28px}

.care-card:nth-child(2){background:#f8f4ee}

.care-card:nth-child(3){background:#f8f0ed}

.care-icon{display:grid;place-items:center;width:49px;height:49px;border-radius:13px;background:#fffaf6;color:#b8574a}

.care-icon svg{width:27px;height:27px}

.care-index{position:absolute;top:30px;right:27px;color:#b19a90;font-size:11px;letter-spacing:.5px}

.care-card h3{font-size:19px;letter-spacing:-.4px;margin-top:37px}

.care-card p{font-size:14px;color:var(--muted);line-height:1.7;margin-top:10px;max-width:350px}

.faq-section{border-top:0;padding-top:80px;padding-bottom:84px}

.contact-section{background:#302b2a;box-shadow:0 22px 42px #2f25231a}

.contact-section .button-white{background:#fffcf8}

.contact-section .button-white:hover{background:#fff0e9}

.footer{background:transparent}

.contacts-page .contacts-intro{padding-top:58px}

.contacts-page .method-card{border-color:#e5dcd4;box-shadow:0 12px 30px #4e342708;background:#fffcf9}

.contacts-page .method-card:hover{transform:translateY(-4px)}

.contacts-page .phone-method{background:#302c2b;border-color:#302c2b;color:#fff}

.contacts-page .phone-method:hover{background:#3d3533}

.method-icon{width:50px;height:50px;border-radius:15px;background:#eee5de}

.method-icon svg{width:26px;height:26px}

.phone-method .method-icon{color:#fff;background:#ffffff1e}

.contacts-page .telegram-method .method-icon{background:var(--telegram);color:#fff}

.contacts-page .whatsapp-method .method-icon{background:var(--whatsapp);color:#fff}

.contacts-page .max-method .method-icon{background:linear-gradient(145deg,#4878ea,#8750dc);color:#fff}

.contacts-page .telegram-method{background:#f5fafe}

.contacts-page .whatsapp-method{background:#f5faf5}

.contacts-page .max-method{background:#f9f6ff}

.contacts-page .telegram-method:hover{background:#eaf7ff;border-color:var(--telegram)}

.contacts-page .whatsapp-method:hover{background:#eaf9ef;border-color:var(--whatsapp)}

.contacts-page .max-method:hover{background:#f2ecff;border-color:var(--max)}

.contacts-page .telegram-method:hover .method-icon,
.contacts-page .whatsapp-method:hover .method-icon,
.contacts-page .max-method:hover .method-icon{color:#fff}

.contacts-page .telegram-method .method-action{color:#0876a8}

.contacts-page .whatsapp-method .method-action{color:#157e43}

.contacts-page .max-method .method-action{color:#6038c7}

.before-contact{border-color:var(--line)}

.location-section{border-top:0}

.map-links a{background:#fffaf5;border-color:var(--line)}

.map-frame{background:#f1ece6;border-color:#e5d8ce}

.maintenance-page{background:radial-gradient(circle at 80% 30%,#fff0e9 0,transparent 35%),#fbf8f4}

.maintenance-page .maintenance-header,.maintenance-page .maintenance-footer{border-color:var(--line)}

.maintenance-page .status-tag{background:#fffaf6;border-color:#e6d9d0;color:#7d6760}

.maintenance-page .pin-form{background:#fffcf9;border-color:#e8dbd1}

.maintenance-page .social-links{flex-wrap:wrap;gap:12px 18px}

.maintenance-page .social-links a{display:inline-flex;align-items:center;gap:6px}

.maintenance-page .social-links svg{width:18px;height:18px}

.maintenance-page .social-links a[href*="t.me"] svg{color:var(--telegram)}

.maintenance-page .social-links a[href*="wa.me"] svg{color:var(--whatsapp)}

.maintenance-page .social-links a[href*="max.ru"] svg{color:var(--max)}

@media(max-width:1000px){
  .care-heading{align-items:start;flex-direction:column;gap:12px}

  .care-heading>p{max-width:650px}

  .care-card{padding:22px}

}

@media(max-width:600px){
  .header-inner{height:76px}

  .hero{padding-top:39px;padding-bottom:38px}

  .brand-strip{border-radius:13px;padding:18px 12px}

  .repair-section{margin-top:35px}

  .device-symbol{position:absolute;left:20px;top:35px;width:55px;height:60px;margin:0}

  .device-symbol svg{width:49px;height:55px}

  .care-section{padding:49px 0 54px}

  .care-heading h2{font-size:29px}

  .care-grid{grid-template-columns:1fr;gap:12px}

  .care-card{min-height:0;padding:20px 22px 22px}

  .care-card h3{margin-top:22px}

  .care-icon{width:46px;height:46px}

  .faq-section{padding-top:54px;padding-bottom:57px}

  .contacts-page .method-card{min-height:0}

}

@media(prefers-reduced-motion:reduce){.contacts-page .method-card:hover{transform:none}
}



.map-frame{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.6fr);height:370px;background:#f8f0e9}

.map-address-card{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;padding:31px;background:radial-gradient(circle at 82% 25%,#fff5ee 0,transparent 45%),linear-gradient(135deg,#f6e9df,#f1e5dc);border-right:1px solid #e6d7cc}

.map-address-card::before{content:"";position:absolute;inset:0;opacity:.35;background:linear-gradient(24deg,transparent 44%,#e3cbbd 45% 46%,transparent 47%),linear-gradient(142deg,transparent 32%,#e3cbbd 33% 34%,transparent 35%);background-size:130px 130px,160px 160px;pointer-events:none}

.map-address-card>*{position:relative}

.map-pin{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:#fffaf5;color:var(--red);box-shadow:0 12px 25px #9b6a4d22;margin-bottom:auto}

.map-pin svg{width:34px;height:34px}

.map-card-label{font-size:10px;letter-spacing:1.5px;color:#93796b;margin-top:26px}

.map-address-card strong{font-size:22px;line-height:1.32;letter-spacing:-.5px;margin-top:11px;max-width:340px}

.map-card-hours{font-size:13px;color:#72655e;margin-top:15px}

.map-frame iframe{height:100%;background:#f7f3ee}

@media(max-width:600px){.map-frame{display:block;height:auto}
.map-address-card{min-height:250px;border-right:0;border-bottom:1px solid #e6d7cc}
.map-frame iframe{height:300px}
}


.contacts-intro .intro-note{display:block;margin-top:12px;color:#82756e}

.contacts-page .telegram-method:focus-visible{outline-color:#229ed9}

.contacts-page .whatsapp-method:focus-visible{outline-color:#20b55c}

.contacts-page .max-method:focus-visible{outline-color:#6c48d9}


/* Sketch 03: a brighter, airier direction. */
:root{--ink:#302a29;--muted:#6b6562;--soft:#fff8f3;--line:#eadfd8;--paper:#fffefd;--cream:#fffaf6;--blush:#fff1ec}

body,.home-page{background:#fffdfb}

.home-page{background-image:radial-gradient(circle at 82% 13%,#fff6f1 0,transparent 30%)}

.header{background:#fffefbf2}

.hero-visual{background:#f7ede5;box-shadow:0 20px 52px #794b3620}

.workshop-photo{object-position:center 58%}

.photo-shade{background:linear-gradient(180deg,#fff8efb8 0%,transparent 24%,transparent 57%,#fffaf2ed 100%)}

.photo-top,.photo-bottom{color:#332c29;text-shadow:0 1px 3px #fff9}

.photo-top{font-weight:700}

.photo-bottom p{font-weight:600}

.floating-note{box-shadow:0 12px 34px #8b624422}

.brand-strip{background:#fff;border-color:#eee3dc}

.repair-section{background:#fff8f3}

.device-card,.service-panel{background:#fff;border-color:#ebdfd7}

.device-card.active{background:#fffaf7}

.care-section{background:#fffdf9}

.care-card,.care-card:nth-child(2),.care-card:nth-child(3){background:#fff7f2;border-color:#f0e3dc}

.care-card:nth-child(2){background:#f8faf6}

.care-card:nth-child(3){background:#fff9f0}

.contact-section{background:linear-gradient(125deg,#fff1e9,#fff9f5);color:var(--ink);border:1px solid #f0d9ce;box-shadow:0 18px 45px #8d543018}

.contact-section .eyebrow,.contact-placeholder .small-label{color:#a34b45}

.contact-section>div>p:last-child,.contact-placeholder>span:not(.small-label){color:#6b5c56}

.contact-placeholder{border-left-color:#ead0c5}

.contact-section .button-white{background:#e50925;color:#fff}

.contact-section .button-white:hover{background:#c80722}

.contact-section a:not(.button):hover{color:#bf162b}

.contacts-page{background:#fffdfb}

.contacts-page .method-card{background:#fff;border-color:#eee3db}

.contacts-page .phone-method,.contacts-page .phone-method:hover{background:#fff3ee;border-color:#efcfc3;color:var(--ink)}

.contacts-page .phone-method:hover{box-shadow:0 14px 30px #bf7b5520}

.phone-method .method-icon{background:#e50925;color:#fff}

.phone-method .small-label{color:#a14c43}

.phone-method .method-description{color:var(--muted)}

.phone-method .method-action{border-color:#ead4ca;color:#b91c31}

.phone-method .method-top>span:last-child{color:#b91c31}

.map-address-card{background:radial-gradient(circle at 80% 25%,#fffaf6 0,transparent 46%),linear-gradient(135deg,#fff4e8,#fdf6ef)}

.maintenance-page{background:#fffdfb}

.maintenance-page .pause-art{background:#fff3eb;color:var(--ink);border:1px solid #efdbd0;background-image:linear-gradient(#d56b4920 1px,transparent 1px),linear-gradient(90deg,#d56b4920 1px,transparent 1px);background-size:35px 35px}

.maintenance-page .pause-top,.maintenance-page .pause-bottom{color:#79675e}

.maintenance-page .pause-bottom b{color:#302a29}

.maintenance-page .pause-symbol i{box-shadow:0 10px 32px #e5092526}

@media(max-width:600px){.contact-placeholder{border-left:0;border-top-color:#ead0c5}
}

/* Neutral public palette and service pages */
:root{--ink:#222a32;--muted:#626d78;--soft:#f2f5f7;--line:#e0e5e9;--paper:#fff;--cream:#f8f9fb}

body,.home-page,.contacts-page,.repair-page{background:#fafbfc;color:var(--ink);background-image:none}

.header{background:#ffffffeb}

.brand-strip,.device-card,.service-panel,.care-card,.care-card:nth-child(2),.care-card:nth-child(3),.contacts-page .method-card{background:#fff;border-color:#e2e6ea}

.repair-section,.care-section{background:#f2f5f7}

.device-card:hover,.problem-card:hover{border-color:#d9aeb6;box-shadow:0 15px 35px #29323d14}

.contact-section{background:#343d47;color:#fff;border:1px solid #343d47;box-shadow:0 20px 45px #29323d22}

.contact-section .eyebrow,.contact-placeholder .small-label{color:#ff9ba8}

.contact-section>div>p:last-child,.contact-placeholder>span:not(.small-label){color:#d7dee4}

.contact-placeholder{border-left-color:#687580}

.contact-section .button-white{background:#fff;color:#222a32}

.contact-section .button-white:hover{background:#e9eff3;color:#222a32}

.contacts-page .phone-method,.contacts-page .phone-method:hover{background:#fff4f5;border-color:#f1d8dc}

.map-frame,.map-frame iframe{background:#eef2f5}

.map-address-card{background:linear-gradient(135deg,#f0f3f5,#e6ebef);border-color:#dce3e8}

.map-pin{background:#fff}

.maintenance-page{background:#fafbfc}

.repair-intro{display:grid;grid-template-columns:1.35fr .65fr;gap:40px;align-items:center;padding:35px 0 75px}

.repair-intro h1{font-size:clamp(36px,5vw,66px);line-height:1.07;letter-spacing:-.05em;max-width:760px;margin:18px 0 24px}

.repair-intro p:not(.eyebrow){font-size:18px;line-height:1.6;color:var(--muted);max-width:640px}

.repair-intro .hero-actions{margin-top:28px}

.repair-intro-art{height:310px;border-radius:var(--radius);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;background:#eef2f5;border:1px solid #dfe5e9;color:#ca1832}

.repair-intro-art svg{width:120px;height:120px}

.repair-intro-art span{font-size:11px;color:#75808a;letter-spacing:.14em;font-weight:700}

.repair-problems{padding:65px 0 80px;border-top:1px solid var(--line)}

.problem-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:32px}

.problem-card{border:1px solid #e0e6ea;border-radius:17px;background:#fff;padding:25px 27px;text-align:left;display:flex;flex-direction:column;align-items:flex-start;min-height:205px;color:var(--ink);transition:box-shadow .2s,border-color .2s,transform .2s}

.problem-card:hover{transform:translateY(-3px)}

.problem-index{font-size:11px;font-weight:700;letter-spacing:.13em;color:var(--red);margin-bottom:18px}

.problem-card strong{font-size:21px;letter-spacing:-.03em;line-height:1.2}

.problem-description{font-size:13px;color:var(--muted);line-height:1.55;margin:10px 0 17px}

.problem-arrow{color:var(--red);font-weight:700;font-size:12px;margin-top:auto}

.repair-next{display:flex;justify-content:space-between;gap:30px;align-items:end;padding:36px 40px;border-radius:var(--radius);background:#343d47;color:#fff}

.repair-next h2{font-size:clamp(27px,3vw,39px);letter-spacing:-.04em;margin:12px 0}

.repair-next p:not(.eyebrow){color:#d3dbe1;max-width:570px}

.repair-next>div:last-child{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}

.repair-social{display:inline-flex;align-items:center;padding:12px 14px;border-radius:9px;background:#fff;font-weight:700;font-size:12px}

.repair-social.telegram-link{color:#168ac4}

.repair-social.whatsapp-link{color:#178b4a}

.related-repairs{padding:60px 0 75px}

.related-repairs>div{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:16px}

.related-repairs a{padding:22px 25px;border:1px solid var(--line);background:#fff;border-radius:12px;font-size:20px;font-weight:700;display:flex;justify-content:space-between}

.related-repairs a span{color:var(--red)}

.contacts-page .telegram-method .method-icon{background:#e8f6fd;color:#168ac4}

.contacts-page .whatsapp-method .method-icon{background:#e9f8ee;color:#178b4a}

.contacts-page .max-method .method-icon{background:#f0edfc;color:#6546bc}

.contacts-page .telegram-method:hover,.contacts-page .telegram-method .method-action{color:#168ac4}

.contacts-page .whatsapp-method:hover,.contacts-page .whatsapp-method .method-action{color:#178b4a}

.contacts-page .max-method:hover,.contacts-page .max-method .method-action{color:#6546bc}

@media(max-width:760px){.repair-intro{grid-template-columns:1fr;gap:24px;padding-bottom:46px}
.repair-intro-art{height:170px;flex-direction:row}
.repair-intro-art svg{width:75px;height:75px}
.repair-problems{padding:48px 0}
.problem-grid{grid-template-columns:1fr}
.problem-card{min-height:0}
.repair-next{align-items:start;flex-direction:column;padding:28px}
.repair-next>div:last-child{justify-content:start}
.related-repairs{padding:45px 0}
.related-repairs>div{grid-template-columns:1fr}
}

@media(max-width:600px){.contact-placeholder{border-left:0;border-top-color:#687580}
.repair-intro p:not(.eyebrow){font-size:16px}
}