/* =========================================================
   DROPHO WEB V26 — FINAL MOBILE REBUILD
   Base desktop remains styles.css (V22).
   This file is loaded LAST and owns the responsive behavior.
   ========================================================= */

/* ---------- Requested text contrast, all screen sizes ---------- */
/* Minimalista: dark fill + white contour + shadow, exactly as requested. */
body[data-theme="minimal"] .health-copy strong,
body[data-theme="minimal"] .campaign-copy strong{
  color:#111315 !important;
  -webkit-text-stroke:1.15px rgba(255,255,255,.96) !important;
  paint-order:stroke fill !important;
  text-shadow:0 2px 3px rgba(255,255,255,.72),0 7px 18px rgba(0,0,0,.34) !important;
}

/* Editorial: warm dark lettering with a light contour so it survives mixed photography. */
body[data-theme="editorial"] .tourism-visual strong,
body[data-theme="editorial"] .property-copy strong,
body[data-theme="editorial"] .health-copy strong,
body[data-theme="editorial"] .campaign-copy strong{
  color:#3b2118 !important;
  -webkit-text-stroke:1px rgba(255,244,231,.92) !important;
  paint-order:stroke fill !important;
  text-shadow:0 7px 18px rgba(0,0,0,.24) !important;
}

/* Experimental: light lettering, dark edge. */
body[data-theme="experimental"] .property-copy strong,
body[data-theme="experimental"] .health-copy strong{
  color:#f7f1ff !important;
  -webkit-text-stroke:.8px rgba(19,9,31,.88) !important;
  paint-order:stroke fill !important;
  text-shadow:0 0 18px rgba(114,246,239,.15),0 8px 18px rgba(0,0,0,.34) !important;
}

/* Comercial: navy lettering + white contour. */
body[data-theme="commercial"] .tourism-visual strong,
body[data-theme="commercial"] .property-copy strong,
body[data-theme="commercial"] .health-copy strong,
body[data-theme="commercial"] .campaign-copy strong{
  color:#0b2239 !important;
  -webkit-text-stroke:1px rgba(255,255,255,.94) !important;
  paint-order:stroke fill !important;
  text-shadow:0 7px 18px rgba(0,0,0,.18) !important;
}

/* Header CONTACT always has contrast. */
body[data-theme="minimal"] .nav-cta,
body[data-theme="editorial"] .nav-cta,
body[data-theme="commercial"] .nav-cta{
  color:#111 !important;
  border-color:rgba(17,17,17,.28) !important;
  background:rgba(255,255,255,.42) !important;
}
body[data-theme="corporate"] .nav-cta,
body[data-theme="experimental"] .nav-cta{
  color:#fff !important;
  border-color:rgba(255,255,255,.24) !important;
  background:rgba(0,0,0,.16) !important;
}

/* Editorial service chooser: two columns on desktop/tablet as requested. */
body[data-theme="editorial"] .service-cloud{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:9px !important;
}
body[data-theme="editorial"] .service-button{
  min-height:62px !important;
  padding:10px 36px 10px 10px !important;
}
body[data-theme="editorial"] .service-button>strong{
  font-size:11px !important;
  line-height:1.08 !important;
}

/* =========================================================
   PHONE / NARROW VIEWPORT — rebuilt as a separate composition
   ========================================================= */
@media screen and (max-width:900px){
  html,body{width:100%;max-width:100%;overflow-x:hidden !important;}
  body{min-width:0 !important;}

  /* HEADER */
  .site-header,
  body[data-theme="minimal"] .site-header,
  body[data-theme="corporate"] .site-header,
  body[data-theme="editorial"] .site-header,
  body[data-theme="experimental"] .site-header,
  body[data-theme="commercial"] .site-header{
    height:76px !important;
    padding:0 18px !important;
  }
  .brand img{width:190px !important;max-width:57vw !important;max-height:48px !important;}
  .nav{display:none !important;}
  .menu-btn{display:block !important;width:44px !important;height:44px !important;}
  body[data-theme="minimal"] .menu-btn span,
  body[data-theme="editorial"] .menu-btn span,
  body[data-theme="commercial"] .menu-btn span{background:#151515 !important;}
  body[data-theme="corporate"] .menu-btn span,
  body[data-theme="experimental"] .menu-btn span{background:#fff !important;}

  .mobile-nav{top:76px !important;}
  body[data-theme="minimal"] .mobile-nav,
  body[data-theme="editorial"] .mobile-nav,
  body[data-theme="commercial"] .mobile-nav{
    background:rgba(246,243,236,.98) !important;
  }
  body[data-theme="minimal"] .mobile-nav a,
  body[data-theme="editorial"] .mobile-nav a,
  body[data-theme="commercial"] .mobile-nav a{color:#151515 !important;border-color:rgba(0,0,0,.08) !important;}

  /* THEME SELECTOR — in normal flow, sticky only while scrolling. */
  .theme-dock,
  body[data-theme="minimal"] .theme-dock,
  body[data-theme="corporate"] .theme-dock,
  body[data-theme="editorial"] .theme-dock,
  body[data-theme="experimental"] .theme-dock,
  body[data-theme="commercial"] .theme-dock{
    position:sticky !important;
    top:76px !important;
    left:auto !important;right:auto !important;
    transform:none !important;
    width:calc(100% - 20px) !important;
    max-width:none !important;
    margin:76px 10px 0 !important;
    padding:7px 8px !important;
    border-radius:17px !important;
    z-index:120 !important;
  }
  .theme-dock-label{display:none !important;}
  .theme-dock-scroll{
    width:100% !important;
    display:flex !important;
    align-items:center !important;
    gap:5px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding:1px 2px 3px !important;
    scrollbar-width:none !important;
  }
  .theme-dock-scroll::-webkit-scrollbar{display:none !important;}
  .theme-chip{
    flex:0 0 auto !important;
    min-width:max-content !important;
    padding:8px 9px !important;
    font-size:6.4px !important;
    line-height:1 !important;
    letter-spacing:.07em !important;
    white-space:nowrap !important;
  }
  .theme-chip i{width:6px !important;height:6px !important;}

  /* HERO — one preview only. No giant floating phone/small-browser pile. */
  .hero,
  body[data-theme="minimal"] .hero,
  body[data-theme="editorial"] .hero,
  body[data-theme="commercial"] .hero{
    padding-top:0 !important;
    min-height:0 !important;
    overflow:hidden !important;
  }
  .hero-grid,
  body[data-theme="minimal"] .hero-grid,
  body[data-theme="editorial"] .hero-grid,
  body[data-theme="commercial"] .hero-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
    min-height:0 !important;
    padding:34px 18px 42px !important;
  }
  .hero-copy{width:100% !important;}
  .hero h1,
  body[data-theme="minimal"] .hero h1,
  body[data-theme="corporate"] .hero h1,
  body[data-theme="editorial"] .hero h1,
  body[data-theme="commercial"] .hero h1{
    font-size:clamp(43px,12vw,58px) !important;
    line-height:.93 !important;
    letter-spacing:-.055em !important;
  }
  /* Specific repair requested: Experimental "se sienten propios". */
  body[data-theme="experimental"] .hero h1{
    font-size:clamp(39px,10.7vw,52px) !important;
    line-height:.94 !important;
    letter-spacing:-.04em !important;
    font-weight:800 !important;
    text-transform:none !important;
  }
  body[data-theme="experimental"] .hero h1 span{
    color:#72eee9 !important;
    -webkit-text-stroke:0 !important;
    text-shadow:0 0 14px rgba(114,246,239,.12) !important;
    font-weight:650 !important;
  }
  .hero-lead{font-size:14px !important;line-height:1.58 !important;margin:22px 0 0 !important;max-width:100% !important;}
  .hero-actions{display:grid !important;grid-template-columns:1fr !important;gap:9px !important;margin-top:22px !important;}
  .hero-actions .btn-primary,.hero-actions .btn-ghost{width:100% !important;justify-content:space-between !important;padding:14px 16px !important;}

  .hero-stage,
  body[data-theme="minimal"] .hero-stage,
  body[data-theme="corporate"] .hero-stage,
  body[data-theme="editorial"] .hero-stage,
  body[data-theme="experimental"] .hero-stage,
  body[data-theme="commercial"] .hero-stage{
    width:100% !important;
    height:235px !important;
    margin:0 !important;
    transform:none !important;
    animation:none !important;
  }
  .phone,.phone-left,.browser-small,.hero-tag,.orb{display:none !important;}
  .browser-main,
  body[data-theme="minimal"] .browser-main,
  body[data-theme="corporate"] .browser-main,
  body[data-theme="editorial"] .browser-main,
  body[data-theme="experimental"] .browser-main,
  body[data-theme="commercial"] .browser-main{
    display:block !important;
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:225px !important;
    transform:none !important;
    border-radius:10px !important;
  }
  .browser-bar{height:24px !important;}
  .browser-screen{height:calc(100% - 24px) !important;}
  .theme-corporate{padding:13px !important;}
  .fake-top{font-size:5px !important;gap:8px !important;}
  .fake-top b{font-size:8px !important;}
  .fake-hero-lines{left:13px !important;top:58px !important;}
  .fake-hero-lines strong{font-size:18px !important;}
  .fake-hero-lines small{font-size:5px !important;}
  .fake-photo-grid{right:10px !important;top:40px !important;width:44% !important;height:72% !important;gap:4px !important;}
  .hero-marquee{height:38px !important;font-size:6px !important;}

  /* GLOBAL SECTION SPACING */
  .section{padding:70px 18px !important;}
  .section-head{display:grid !important;grid-template-columns:1fr !important;gap:14px !important;margin-bottom:28px !important;}
  .section-head h2,.style-copy h2,.services-head h2,.contact h2{
    font-size:clamp(37px,10vw,48px) !important;
    line-height:.98 !important;
    letter-spacing:-.045em !important;
  }
  .section-head>p,.style-copy>p:last-of-type{font-size:12px !important;line-height:1.58 !important;margin-top:0 !important;}
  body[data-theme="commercial"] .showroom .section-head h2{
    font-size:clamp(38px,10.5vw,50px) !important;
    line-height:.98 !important;
  }

  /* SHOWROOM — true single column on ALL themes; fixes commercial "bars". */
  .showcase-grid,
  body[data-theme="minimal"] .showcase-grid,
  body[data-theme="corporate"] .showcase-grid,
  body[data-theme="editorial"] .showcase-grid,
  body[data-theme="experimental"] .showcase-grid,
  body[data-theme="commercial"] .showcase-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:16px !important;
    width:100% !important;
    background:none !important;
    border:0 !important;
  }
  .show-card,
  .show-card:nth-child(n),
  body[data-theme="minimal"] .show-card:nth-child(n),
  body[data-theme="corporate"] .show-card:nth-child(n),
  body[data-theme="editorial"] .show-card:nth-child(n),
  body[data-theme="experimental"] .show-card:nth-child(n),
  body[data-theme="commercial"] .show-card:nth-child(n){
    display:flex !important;
    flex-direction:column !important;
    grid-column:1 / -1 !important;
    width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    height:auto !important;
    margin:0 !important;
    transform:none !important;
    overflow:hidden !important;
  }
  .mini-site,
  body[data-theme="commercial"] .mini-site{
    flex:none !important;
    width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    height:280px !important;
    overflow:hidden !important;
  }
  .show-info,
  body[data-theme="commercial"] .show-info{
    flex:none !important;
    min-height:84px !important;
    padding:15px 16px 16px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:flex-start !important;
    gap:6px !important;
  }
  .show-info h3,
  body[data-theme="editorial"] .show-info h3,
  body[data-theme="commercial"] .show-info h3{font-size:21px !important;line-height:1.06 !important;}
  .show-info p{font-size:8px !important;line-height:1.4 !important;text-align:left !important;}
  .card-number{top:12px !important;left:14px !important;right:auto !important;font-size:7px !important;}
  body[data-theme="commercial"] .card-number{left:auto !important;right:12px !important;}

  /* 01 corporate */
  .corporate-mini{padding:16px !important;}
  .mini-nav{gap:7px !important;font-size:5px !important;}
  .mini-nav b{font-size:8px !important;}
  .mini-corporate-hero{left:16px !important;top:82px !important;right:16px !important;}
  .mini-corporate-hero strong{font-size:27px !important;line-height:.95 !important;}
  .mini-stats{right:12px !important;bottom:11px !important;gap:10px !important;}
  .mini-stats span{font-size:13px !important;}

  /* 02 tourism */
  .tourism-visual{height:78% !important;padding:20px 16px !important;}
  .tourism-visual strong,
  body[data-theme="editorial"] .tourism-visual strong,
  body[data-theme="commercial"] .tourism-visual strong{
    font-size:30px !important;
    line-height:.96 !important;
  }
  .tourism-visual button{font-size:5px !important;padding:7px 9px !important;}

  /* 03 real estate — Altura 132 */
  .realestate-top{height:38px !important;padding:0 12px !important;gap:8px !important;font-size:5px !important;}
  .realestate-top b{font-size:8px !important;}
  .property-canvas{inset:38px 0 34px !important;}
  .property-shape{width:56% !important;height:110% !important;right:-2% !important;top:-5% !important;}
  .property-copy{left:14px !important;right:14px !important;bottom:14px !important;max-width:62% !important;}
  .property-copy strong,
  body[data-theme="editorial"] .property-copy strong,
  body[data-theme="experimental"] .property-copy strong,
  body[data-theme="commercial"] .property-copy strong{
    font-size:27px !important;
    line-height:.96 !important;
    letter-spacing:-.045em !important;
    white-space:normal !important;
  }
  .property-copy p{font-size:6.5px !important;line-height:1.3 !important;max-width:145px !important;}
  .property-data{height:34px !important;padding:0 12px !important;gap:14px !important;font-size:5.5px !important;}

  /* 04 creative */
  .creative-word{left:16px !important;top:58px !important;font-size:38px !important;line-height:.9 !important;}
  .creative-rings{width:118px !important;height:118px !important;right:10px !important;top:38px !important;}
  .creative-caption{left:16px !important;bottom:18px !important;font-size:6px !important;}

  /* 05 ecommerce */
  .shop-mini{padding:15px !important;}
  .shop-top{font-size:6px !important;}
  .shop-products{gap:5px !important;margin-top:22px !important;}
  .shop-products i{height:150px !important;}
  .shop-title{font-size:20px !important;margin-top:10px !important;}

  /* 06 health — Cuidado que se siente cercano */
  .health-copy{
    left:14px !important;
    top:22px !important;
    right:auto !important;
    width:60% !important;
    max-width:60% !important;
    padding:9px 10px !important;
    border-radius:9px !important;
    background:rgba(244,247,245,.74) !important;
    -webkit-backdrop-filter:blur(4px) !important;
    backdrop-filter:blur(4px) !important;
  }
  body[data-theme="experimental"] .health-copy{background:rgba(18,10,29,.66) !important;}
  .health-copy small{font-size:5px !important;}
  .health-copy strong,
  body[data-theme="editorial"] .health-copy strong,
  body[data-theme="experimental"] .health-copy strong,
  body[data-theme="commercial"] .health-copy strong{
    font-size:23px !important;
    line-height:1.0 !important;
    letter-spacing:-.045em !important;
    margin-top:6px !important;
  }
  .health-copy button{margin-top:10px !important;padding:7px 9px !important;font-size:5px !important;}
  .health-orbit{width:76px !important;height:76px !important;right:12px !important;bottom:12px !important;opacity:.34 !important;}

  /* 07 gastronomy — shrink the huge plate and the huge Origen word. */
  .food-copy{left:16px !important;top:42px !important;right:16px !important;max-width:68% !important;}
  .food-copy small{font-size:5px !important;}
  .food-copy strong{font-size:34px !important;line-height:.92 !important;margin-top:5px !important;}
  .food-copy p{font-size:6.5px !important;line-height:1.3 !important;max-width:150px !important;}
  .food-plate{
    width:84px !important;
    height:84px !important;
    right:12px !important;
    top:18px !important;
    bottom:auto !important;
    opacity:.78 !important;
    box-shadow:0 12px 28px rgba(0,0,0,.25) !important;
  }
  .food-plate i{width:22px !important;height:22px !important;left:31px !important;top:31px !important;}

  /* 08 landing — title no longer covers the whole car. */
  .campaign-copy{left:15px !important;bottom:18px !important;right:auto !important;width:68% !important;max-width:68% !important;}
  .campaign-copy span{font-size:5px !important;}
  .campaign-copy strong,
  body[data-theme="editorial"] .campaign-copy strong,
  body[data-theme="commercial"] .campaign-copy strong{
    font-size:27px !important;
    line-height:.94 !important;
    letter-spacing:-.045em !important;
    margin-top:7px !important;
    white-space:normal !important;
  }
  .campaign-copy button{margin-top:10px !important;padding:8px 10px !important;font-size:5px !important;}
  .campaign-lines{opacity:.20 !important;}

  /* Reassert requested text contrast at phone size. */
  body[data-theme="minimal"] .health-copy strong,
  body[data-theme="minimal"] .campaign-copy strong{
    color:#111315 !important;
    -webkit-text-stroke:1px rgba(255,255,255,.98) !important;
  }
  body[data-theme="editorial"] .tourism-visual strong,
  body[data-theme="editorial"] .property-copy strong,
  body[data-theme="editorial"] .health-copy strong,
  body[data-theme="editorial"] .campaign-copy strong{
    color:#3b2118 !important;
    -webkit-text-stroke:.85px rgba(255,244,231,.96) !important;
  }
  body[data-theme="experimental"] .property-copy strong,
  body[data-theme="experimental"] .health-copy strong{
    color:#f7f1ff !important;
    -webkit-text-stroke:.65px rgba(19,9,31,.94) !important;
  }
  body[data-theme="commercial"] .tourism-visual strong,
  body[data-theme="commercial"] .property-copy strong,
  body[data-theme="commercial"] .health-copy strong,
  body[data-theme="commercial"] .campaign-copy strong{
    color:#0b2239 !important;
    -webkit-text-stroke:.85px rgba(255,255,255,.96) !important;
  }

  /* STYLE LAB — mobile composition, no text/image collision. */
  .style-lab{display:block !important;}
  .style-copy{width:100% !important;}
  .style-tabs{display:grid !important;grid-template-columns:1fr 1fr !important;max-width:none !important;margin-top:22px !important;}
  .style-tab{min-height:42px !important;padding:10px 8px !important;font-size:7px !important;text-align:center !important;}
  .style-tab:nth-child(5){grid-column:1 / -1 !important;}
  .style-preview-wrap{margin-top:24px !important;}
  .style-preview{width:100% !important;height:365px !important;}
  .style-browser-bar{height:26px !important;}
  .style-demo{height:calc(100% - 26px) !important;padding:14px !important;}
  .style-demo-nav{gap:7px !important;font-size:4.5px !important;}
  .style-demo-copy{left:14px !important;top:24% !important;width:52% !important;max-width:52% !important;}
  .style-demo-copy small{font-size:5px !important;}
  .style-demo-copy h3,
  .style-preview[data-style="editorial"] .style-demo-copy h3,
  .style-preview[data-style="commercial"] .style-demo-copy h3{
    font-size:24px !important;
    line-height:.96 !important;
    margin:9px 0 !important;
  }
  .style-demo-copy p{font-size:6.5px !important;line-height:1.38 !important;}
  .style-demo-copy button{font-size:5px !important;padding:7px 8px !important;margin-top:8px !important;}
  .style-demo-art{right:12px !important;bottom:15px !important;width:39% !important;height:49% !important;border-radius:12px !important;}

  /* IMAGE RIBBON */
  .photo-ribbon{height:300px !important;grid-template-columns:repeat(5,230px) !important;gap:8px !important;overflow-x:auto !important;}
  .photo-card{min-width:230px !important;}

  /* SERVICES — chooser first, 2 columns, preview below. */
  .services-experience,
  body[data-theme="editorial"] .services-experience{
    display:flex !important;
    flex-direction:column !important;
    gap:14px !important;
    margin-top:28px !important;
  }
  .service-cloud,
  body[data-theme="editorial"] .service-cloud{
    order:1 !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
    width:100% !important;
  }
  .service-stage,
  body[data-theme="editorial"] .service-stage,
  body[data-theme="experimental"] .service-stage,
  body[data-theme="commercial"] .service-stage{
    order:2 !important;
    position:relative !important;
    top:auto !important;
    width:100% !important;
    min-height:430px !important;
    transform:none !important;
  }
  .service-button,
  body[data-theme="editorial"] .service-button,
  body[data-theme="experimental"] .service-button,
  body[data-theme="commercial"] .service-button{
    min-height:52px !important;
    padding:8px 27px 8px 9px !important;
    transform:none !important;
  }
  .service-button>span,body[data-theme="editorial"] .service-button>span{font-size:5.7px !important;}
  .service-button>strong,body[data-theme="editorial"] .service-button>strong{font-size:6.1px !important;line-height:1.14 !important;}
  .service-button>i{right:8px !important;width:14px !important;height:14px !important;}
  .service-stage-bar{height:44px !important;padding:0 12px !important;}
  .service-stage-visual{height:258px !important;}
  .service-stage-copy{grid-template-columns:1fr !important;gap:8px !important;padding:14px !important;}
  .service-stage-copy h3{font-size:23px !important;}
  .service-stage-copy p{font-size:7.4px !important;line-height:1.5 !important;}
  .service-stage-hint{display:none !important;}

  /* Scale service graphics themselves, not the whole card. */
  .sv-ui{width:92% !important;height:205px !important;grid-template-columns:75px 1fr !important;}
  .sv-code{width:92% !important;height:205px !important;}
  .sv-responsive{transform:scale(.68) !important;}
  .sv-search,.sv-video,.sv-map-shell,.sv-analytics,.sv-maintenance{width:92% !important;transform:scale(.82) !important;}
  .sv-gallery{width:94% !important;height:200px !important;}
  .sv-photo{width:94% !important;height:205px !important;}
  .sv-integration{transform:scale(.72) !important;}
  .sv-deploy{transform:scale(.66) !important;}

  /* CONTACT / FOOTER */
  .contact{grid-template-columns:1fr !important;gap:34px !important;min-height:520px !important;}
  .contact-actions a{font-size:9px !important;line-height:1.4 !important;}
  .footer{height:auto !important;min-height:120px !important;padding:24px 18px !important;}
}

@media screen and (max-width:480px){
  .site-header{padding:0 14px !important;}
  .brand img{width:174px !important;}
  .theme-dock{width:calc(100% - 12px) !important;margin-left:6px !important;margin-right:6px !important;}
  .theme-chip{font-size:6px !important;padding:7px 8px !important;}
  .hero-grid{padding-left:14px !important;padding-right:14px !important;}
  .section{padding-left:14px !important;padding-right:14px !important;}
  .hero h1{font-size:clamp(40px,11.5vw,50px) !important;}
  body[data-theme="experimental"] .hero h1{font-size:clamp(37px,10.3vw,47px) !important;}
  .mini-site{height:255px !important;}
  .health-copy strong,
  body[data-theme="editorial"] .health-copy strong,
  body[data-theme="experimental"] .health-copy strong,
  body[data-theme="commercial"] .health-copy strong{font-size:21px !important;}
  .campaign-copy strong,
  body[data-theme="editorial"] .campaign-copy strong,
  body[data-theme="commercial"] .campaign-copy strong{font-size:24px !important;}
  .property-copy strong,
  body[data-theme="editorial"] .property-copy strong,
  body[data-theme="experimental"] .property-copy strong,
  body[data-theme="commercial"] .property-copy strong{font-size:24px !important;}
  .food-copy strong{font-size:31px !important;}
  .food-plate{width:74px !important;height:74px !important;}
  .food-plate i{width:20px !important;height:20px !important;left:27px !important;top:27px !important;}
  .style-preview{height:345px !important;}
  .style-demo-copy h3,
  .style-preview[data-style="editorial"] .style-demo-copy h3,
  .style-preview[data-style="commercial"] .style-demo-copy h3{font-size:22px !important;}
  .service-button{min-height:50px !important;}
}


/* V27 — único cambio: modo Comercial retirado. Ajuste del selector a 4 modos. */
@media(max-width:1100px){
  .style-tabs{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
}
@media(max-width:760px){
  .style-tabs{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .style-tab:nth-child(5){grid-column:auto !important;}
}