/*
Theme Name: Алые паруса — мобильная версия
Description: Точная реализация утверждённого мобильного интерфейса для сайта «Алые паруса».
Template: suffusion
Version: 0.1.0
Text Domain: suffusion-alye-parusa-mobile
*/

:root { --ap-red:#a51d1d; --ap-bright-red:#ef0506; --ap-paper:#f6f5f2; --ap-ink:#2d2b2a; --ap-line:#c8c3bc; --ap-muted:#6e6862; }
.ap-mobile-only { display:none; }

@media screen and (max-width: 767px) {
  html, body { background:#504f4d url('../../uploads/2010/09/bgnd_main1.gif') repeat; }
  body.alye-parusa-mobile { color:var(--ap-ink); font:16px/1.52 Georgia, 'Times New Roman', serif; }
  .ap-desktop-only, #widgets-above-header, #header-container, #nav, #nav-top, #sidebar-shell-1, #sidebar-shell-2, #sidebar-container, #sidebar-wrap, #cred, #footer, #wrapper > .dbx-group { display:none !important; }
  #wrapper, #container, #main-col, #content { width:100% !important; min-width:0 !important; max-width:none !important; float:none !important; margin:0 !important; padding:0 !important; left:auto !important; right:auto !important; background:var(--ap-paper) !important; }
  #wrapper { max-width:430px !important; margin:0 auto !important; overflow:hidden; border:0 !important; box-shadow:0 0 0 1px #b5afa8, 0 0 34px rgba(0,0,0,.28); }
  #container { overflow:visible !important; }
  .ap-mobile-only { display:block; }
  .ap-masthead { min-height:86px; padding:14px 17px 12px; display:flex; align-items:center; justify-content:space-between; background:linear-gradient(#fff,#ece9e4); border-bottom:1px solid #c9c3bc; }
  .ap-brand { display:flex; gap:9px; align-items:center; color:var(--ap-ink); text-decoration:none; }
  .ap-logo-mark { width:37px; height:44px; flex:none; }
  .ap-brand strong { display:block; font-size:22px; line-height:1.05; letter-spacing:-.02em; }
  .ap-brand small { display:block; margin-top:3px; color:#756d65; font:11px Arial,sans-serif; }
  .ap-menu-toggle { border:1px solid #a9a29a; background:#f7f6f3; color:#4b4541; padding:8px 9px; font:12px Arial,sans-serif; cursor:pointer; }
  .ap-menu-toggle span { color:var(--ap-red); font-size:16px; margin-left:5px; }
  .ap-menu-panel { padding:3px 17px 11px; background:#ece9e4; border-bottom:1px solid var(--ap-line); }
  .ap-menu-panel[hidden] { display:none; }
  .ap-menu-panel ul { padding:0; margin:0; list-style:none; }
  .ap-menu-panel a { display:block; padding:10px 5px; border-bottom:1px dotted #aaa19a; color:var(--ap-red); text-decoration:none; }
  .ap-old-rule { height:6px; background:linear-gradient(to bottom,#ed0507 0 2px,#eee 2px 4px,#8f8b85 4px 5px,#eee 5px); }
  .ap-mobile-home { display:block; background:var(--ap-paper); }
  .ap-intro { padding:27px 23px 31px; background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(238,235,229,.83)); }
  .ap-eyebrow, .ap-breadcrumbs { margin:0 0 8px; color:var(--ap-muted); font:11px Arial,sans-serif; letter-spacing:.04em; text-transform:uppercase; }
  .ap-intro h1, .ap-mobile-single h1 { margin:0; color:#761717; font-size:34px; line-height:1.05; font-weight:normal; }
  .ap-intro p:not(.ap-eyebrow) { margin:13px 0 21px; color:#514b46; font-size:17px; }
  .ap-red-button { display:inline-block; padding:11px 15px; color:#fff; background:linear-gradient(#f31c1d,#d40001); border:1px solid #ab0000; box-shadow:inset 0 1px rgba(255,255,255,.35); font:14px Arial,sans-serif; text-decoration:none; }
  .ap-chapter { padding:25px 17px 28px; border-top:1px solid var(--ap-line); }
  .ap-chapter h2, .ap-mobile-single h2 { margin:0 0 13px; color:#6e1717; font-size:22px; line-height:1.2; font-weight:normal; }
  .ap-chapter h2 span { display:inline-block; border-bottom:3px solid var(--ap-bright-red); padding-bottom:4px; }
  .ap-section-lead { margin:0 0 17px; color:#665f59; font-size:15px; }
  .ap-tour-list { border-top:1px solid #d4d0ca; }
  .ap-tour-card { display:grid; grid-template-columns:78px 1fr 19px; gap:12px; align-items:center; padding:10px 0; border-bottom:1px solid #d4d0ca; color:var(--ap-ink); text-decoration:none; }
  .ap-tour-card img { width:78px; height:61px; object-fit:cover; border:1px solid #a8a098; padding:2px; background:#fff; }
  .ap-tour-card strong { display:block; color:#811919; font-size:16px; line-height:1.18; }
  .ap-tour-card small { display:block; margin-top:4px; color:#716962; font:12px Arial,sans-serif; }
  .ap-arrow { color:var(--ap-bright-red); font:32px/1 Arial,sans-serif; }
  .ap-text-link, .ap-plain-link { color:#8a1717; text-decoration:underline; text-underline-offset:3px; }
  .ap-text-link { display:block; margin-top:17px; }
  .ap-pale { background:#eceae5; }
  .ap-link-grid { margin:0; padding:0; border-top:1px solid #cec8c1; list-style:none; }
  .ap-link-grid a { display:flex; justify-content:space-between; padding:12px 3px; border-bottom:1px solid #cec8c1; color:#721818; text-decoration:none; }
  .ap-link-grid span { color:var(--ap-bright-red); font-size:23px; line-height:.75; }
  .ap-contact-box { margin:23px 17px; padding:17px 16px; background:#fff; border:1px solid #beb7af; box-shadow:2px 2px 0 #d5d1cc; }
  .ap-contact-box p { margin:0; color:#655e58; font-size:14px; }
  .ap-contact-title { font-size:17px !important; color:#561717 !important; }
  .ap-phone { display:block; margin:3px 0 8px; color:#b00000; font:bold 24px Arial,sans-serif; text-decoration:none; }
  .ap-mobile-footer { padding:16px; background:#45413e; color:#d9d4ce; font:11px Arial,sans-serif; text-align:center; }
  .ap-mobile-single { padding:24px 18px 94px; background:var(--ap-paper); }
  .ap-mobile-single .entry-title { margin-bottom:17px; }
  .ap-mobile-single .wp-post-image, .ap-mobile-single .ap-hero-image { width:100%; height:auto; max-height:340px; object-fit:cover; border:1px solid #aea69e; padding:3px; background:#fff; }
  .ap-booking { margin:18px 0; padding:13px 14px; border-left:5px solid var(--ap-bright-red); background:#ebe8e1; color:#6c1818; }
  .ap-booking strong { display:block; font-weight:normal; }
  .ap-booking a { display:block; margin-top:2px; color:#9b0000; font:bold 20px Arial,sans-serif; text-decoration:none; }
  .ap-mobile-single .entry, .ap-mobile-single .entry p { font-size:17px; }
  .ap-mobile-single .entry p { text-align:left !important; }
  .ap-mobile-single .entry img { max-width:100%; height:auto; }
  .ap-mobile-single .entry table { display:block; max-width:100%; overflow-x:auto; white-space:normal; }
  .ap-mobile-single .gallery, .ap-mobile-single .ngg-galleryoverview { display:flex; gap:7px; overflow:auto; padding-bottom:5px; }
  .ap-mobile-single .gallery img, .ap-mobile-single .ngg-galleryoverview img { width:105px !important; height:105px !important; object-fit:cover; border:1px solid #aaa198; padding:2px; background:#fff; }
  .ap-bottom-call { position:fixed; z-index:40; bottom:0; left:50%; transform:translateX(-50%); width:min(100%,430px); display:grid; grid-template-columns:1fr 1fr; border-top:1px solid #a7a19a; background:#eeeae5; }
  .ap-bottom-call a { padding:12px 8px; color:#6c1717; font:14px Arial,sans-serif; text-align:center; text-decoration:none; }
  .ap-bottom-call a + a { border-left:1px solid #bbb4ad; }
  .ap-masthead-single { min-height:70px; padding-left:8px; }
  .ap-masthead-single .ap-logo-mark { width:32px; height:38px; }
  .ap-masthead-single .ap-brand strong { font-size:18px; }
  .ap-back { color:#861717; font:42px/1 Arial,sans-serif; text-decoration:none; }
}

@media screen and (max-width: 360px) {
  .ap-intro h1, .ap-mobile-single h1 { font-size:30px; }
  .ap-tour-card { grid-template-columns:67px 1fr 15px; gap:9px; }
  .ap-tour-card img { width:67px; height:55px; }
  .ap-tour-card strong { font-size:14px; }
}
