/* =======================================
   TABLET ADAPTATION (768px - 1023px)
   Preserve desktop aesthetics, optimize for touch
   ======================================= */
  
@media (min-width: 768px) and (max-width: 1366px) {

      /* === BODY & GLOBAL === */
      body {
        font-size: 15px;
        padding-top: calc(var(--qb-h) + 20px);
      }
    
      /* === HEADER === */
      .header {
        padding: 12px 32px;
      }
    
      .Logo-header img {
        max-width: 85px;
        max-height: 85px;
      }
    
      .DEV {
        margin-right: 60px;
      }
    
      .DEV h3 {
        font-size: 18px;
      }
    
      /* === QUICKBAR === */
      .quickbar {
        top: calc(env(safe-area-inset-top, 0px) + 24px);
        height: 52px;
        padding: 0.2px;
        gap: 8px;
      }
    
      .quickbar .qb-item {
        min-width: 42px;
        height: calc(52px - 1px);
        padding: 0 12px;
      }
    
      .quickbar .qb-item ion-icon {
        width: 20px;
        height: 20px;
        padding: 8px;
      }
    
      /* === HERO SECTION === */
      .hero {
        height: 75vh;
        padding-top: 100px;
      }
    
      .hero-content {
        max-width: 600px;
        padding-right: 270px;
        padding-bottom: 80px;
  
      }
    
      .hero-content h1 {
        font-size: 26px;
      }
    
      .hero-content h1 span {
        font-size: 26px;
      }
    
      .hero-content p {
        font-size: 15px;
      }
    
      .typewriter-wrapper {
        font-size: 18px;
      }
    
      #torus {
        width: 85vw;
        height: 85vh;
        transform: translateX(340px);
      }
    
      /* === SEO MARQUEE === */
      .seo-marquee {
        padding: 10px 0;
        transform: translateY(35px);
      }
    
      .seo-item {
        font-size: 13px;
        margin: 0 25px;
      }
    
      /* === STEPS SECTION === */
      .steps {
        margin-top: 300px;
      }
    
      .steps-div {
        margin-left: 60px;
        margin-right: 60px;
      }
    
      .steps-div h2 {
        font-size: 28px;
      }
    
      .step-bar {
        margin: 35px 0 18px;
        gap: 18px;
      }
    
      .step-icon {
        width: 38px;
        height: 38px;
      }
    
      .step-icon img {
        width: 50px;
        height: 50px;
      }
    
      .grid {
        grid-template-columns: repeat(2, minmax(280px, 1fr));
        gap: 18px;
        margin-top: 35px;
      }
    
      .card {
        padding: 18px;
      }
    
      .card .step-number img {
        width: 45px;
        height: 45px;
      }
    
      /* === SERVICES BLOCK === */
      .services-block {
        padding: 55px 32px;
        border-radius: 25px;
      }
    
      .services-block h2 {
        font-size: 28px;
      }
    
      .services-grid {
        grid-template-columns: repeat(2, minmax(300px, 1fr));
        gap: 25px;
        margin-top: 35px;
      }
    
      .service-card {
        padding: 22px;
      }
    
      .service-header h3 {
        font-size: 20px;
      }
    
      .service-icon {
        width: 40px;
        height: 40px;
      }
    
      .service-list {
        max-height: 320px;
      }
    
      .service-item {
        padding: 14px 0;
      }
    
      .title {
        font-size: 15px;
      }
    
      .desc {
        font-size: 11px;
        margin-left: 48px;
      }
    
      .apply-btn {
        padding: 11px 18px;
        font-size: 14px;
      }
    
      /* === PACKAGES SECTION === */
      section:not(.hero, .three-D-form, .steps, .band-cases) {
        padding: 55px 32px;
        margin-top: 320px;
      }
    
      .services-scroll-block {
        padding: 70px 32px;
      }
    
      .services-scroll-block h2 {
        font-size: 28px;
        margin-bottom: 35px;
      }
    
      .scroll-wrapper {
        padding: 0 20px;
      }
    
      .scroll-container {
        gap: 16px;
        padding: 18px 10px;
      }
    
      .scroll-card {
        min-width: 300px;
        max-width: 300px;
        padding: 26px 22px;
        border-radius: 40px;
      }
    
      .scroll-card .service-header h3 {
        font-size: 19px;
      }
    
      .scrollable-service-list {
        max-height: 550px;
      }
    
      .scroll-card .service-item {
        padding: 13px 0;
      }
    
      .scroll-card .title {
        font-size: 14px;
      }
    
      .scroll-card .desc {
        font-size: 11px;
        margin-left: 45px;
      }
    
      .scroll-card .HOT {
        font-size: 11px;
      }
    
      .scroll-card .HOT span {
        font-size: 10px;
      }
    
      .pref {
        font-size: 9px;
        transform: translateY(85px);
      }
    
      .card-footer {
        padding: 4px;
        margin-top: 8px;
      }
    
      .price {
        font-size: 1.1rem;
      }
    
      .price-old {
        font-size: 0.85rem;
      }
    
      .request-btn {
        padding: 9px 22px;
        font-size: 14px;
      }
    
      .scroll-arrow {
        padding: 9px 14px;
        font-size: 1.8rem;
      }
    
      .scroll-arrow.left {
        left: -45px;
      }
    
      .scroll-arrow.right {
        right: -45px;
      }
    
      /* === CASES SECTION === */
      .content-wrapper-text {
        margin-top: 420px;
        margin-bottom: -2%;
      }
    
      .content-wrapper-text h2 {
        font-size: 28px;
      }
    
      .band-cases {
        padding: 40px 32px;
        gap: auto;
        margin-right: clamp(120px, 5vw, 120px);
        justify-content: center;
        align-items: center;
        text-align: center;
      }
    
      .band {
        padding: 24px;
        border-radius: 18px;
      }
    
      .band-head .band-title {
        font-size: 22px;
      }
    
      .band-head .band-sub {
        font-size: 18px;
        transform: translateX(clamp(60px, 5vw, 60px));
        justify-content: center;
        align-items: center;
        text-align: center;
        
      }
      .band-underline{
        transform: translateX(clamp(-30px, 3vw, -10px));
      }
    
      .band-media img {
        border-radius: 14px;
      }
    
      /* === WHY US SECTION === */
      .why-us-section {
        padding: 3.5rem 32px;
      }
    
      .section-title {
        font-size: 28px;
        margin-top: 80px;
        margin-bottom: 1.8rem;
      }
    
      .cards-grid {
        grid-template-columns: repeat(2, minmax(280px, 1fr));
        gap: 1.8rem;
        margin-top: 45px;
      }
    
      .glow-card {
        padding: 1.8rem;
      }
    
      .card-icon1 {
        width: 70px;
      }
    
      .glow-card h3 {
        font-size: 1.15rem;
      }
    
      .glow-card p {
        font-size: 0.9rem;
      }
    
      /* === 3D FORM SECTION === */
      .three-D-form {
        padding: 75px 60px;
      }
    
      .content-wrapper {
        gap: 35px;
        margin-bottom: 80px;
        transform: translateX(clamp(60px, 1vw, 60px));
      }
    
      model-viewer {
        width: 45%;
        max-width: 450px;
        height: 450px;
        margin-top: 120px;
        margin-right: 120px;
      }
    
      .form-wrapper {
        min-width: 350px;
        max-width: 450px;
        padding: 45px;
        margin-right: 80px;
      }
    
      .form-wrapper h2 {
        font-size: 26px;
        margin-bottom: 28px;
      }
    
      .form-wrapper form {
        gap: 18px;
      }
    
      .form-wrapper label {
        font-size: 14px;
      }
    
      .form-wrapper input,
      .form-wrapper select {
        padding: 13px;
        font-size: 15px;
      }
    
      .form-wrapper button {
        padding: 15px;
        font-size: 15px;
      }
    
      .g-recaptcha {
        margin-left: 65px;
      }
    
      /* === FOOTER === */
      .footer {
        padding: 50px 40px 15px !important;
      }
    
      .footer-container {
        grid-template-columns: repeat(3, minmax(200px, 1fr));
        gap: 30px;
        margin-bottom: 35px;
      }
    
      .footer-col img {
        width: 110px !important;
        transform: translateY(22px) !important;
      }
    
      .footer-tagline {
        font-size: 15px;
        transform: translateY(-90px) !important;
      }
    
      .footer-col2 {
        transform: translateX(120px);
      }
    
      .footer-col {
        transform: translateX(120px) !important;
      }
    
      .footer h4 {
        font-size: 15px;
        margin-bottom: 14px;
      }
    
      .footer ul li {
        margin-bottom: 9px;
      }
    
      .footer ul li a {
        font-size: 13px;
      }
    
      .footer-contact {
        transform: translateX(-60px) !important;
      }
    
      .btn-contact {
        padding: 10px 45px !important;
        font-size: 13px;
      }
    
      .footer-icons a {
        font-size: 20px;
        margin-left: 10px;
        transform: translateX(-40px) !important;
      }
    
      .footer-bottom {
        padding-top: 18px;
        font-size: 12px;
      }
    
      .footer-bottom p {
        margin-left: calc(50% - 42vw);
      }
    
      /* === SCROLL BUTTON === */
      #scrollUpBtn {
        bottom: 18px;
        right: 18px;
        font-size: 18px;
        padding: 11px;
      }
    
      /* === GLOW EFFECTS === */
      .glow-center {
        display: none;
      }
    
      .glow-center2 {
        width: 380px;
        height: 280px;
        filter: blur(100px);
        opacity: 0.18;
      }
    
      .glow-center3 {
        width: 450px;
        height: 250px;
        filter: blur(95px);
        opacity: 0.16;
      }
    
      /* === BURGER MENU - HIDE ON TABLET === */
      .burger-toggle,
      .burger-overlay,
      .burger-nav {
        display: none !important;
      }
    
      /* === TEXT BLOCKS === */
      .text-block {
        padding: 32px;
        max-width: 850px;
        margin: 0 auto 38px auto;
        border-radius: 13px;
      }
    
      .text-block h3 {
        font-size: 1.55rem;
        margin-bottom: 17px;
      }
    
      .text-block p {
        margin-bottom: 15px;
        padding-bottom: 9px;
      }
    
      /* === LEGAL BUTTONS === */
      .legal-buttons {
        gap: 14px;
        margin: 28px 0;
      }
    
      .toggle-btn,
      .static-link {
        padding: 11px 19px;
        font-size: 14px;
      }
    
      /* === COOKIE POPUP === */
      .cookie-popup {
        max-width: 360px;
        padding: 28px;
      }
    
      .cookie-icon {
        width: 56px;
        height: 56px;
      }
    
      .cookie-text h3 {
        font-size: 19px;
      }
    
      .cookie-text p {
        font-size: 14px;
      }
    
      .cookie-btn {
        padding: 11px 19px;
        font-size: 14px;
      }
    
      /* === BACKGROUND CANVAS === */
      #cyberBackground {
        height: 180vh;
      }
    
      /* === 3D PERSPECTIVE CARDS (DESKTOP STYLE) === */
      .scroll-card:nth-child(1) {
        transform: rotateY(-25deg) translateZ(15px) translateX(30px);
      }
    
      .scroll-card:nth-child(2) {
        transform: rotateY(-15deg) translateZ(4px);
      }
    
      .scroll-card:nth-child(3) {
        transform: rotateY(8deg) translateZ(0);
      }
    
      .scroll-card:nth-child(4) {
        transform: rotateY(15deg) translateZ(4px);
      }
    
      .scroll-card:nth-child(5) {
        transform: rotateY(25deg) translateZ(15px) translateX(-30px);
      }
    
      .scroll-card:hover {
        transform: rotateY(0deg) translateZ(100px) scale(1.04);
        filter: brightness(1.25);
      }
    
      /* === INSTAGRAM PROFILE (if present) === */
      .instagram-profile {
        padding: 35px;
        margin-top: -450px;
        gap: 35px;
      }
    
      .insta-left {
        max-width: 320px;
      }
    
      .insta-avatar {
        width: 75px;
        height: 75px;
      }
    
      .insta-username {
        font-size: 17px;
      }
    
      .insta-grid {
        grid-template-columns: repeat(3, 95px);
        gap: 7px;
      }
    
      .insta-grid img {
        width: 95px;
        height: 95px;
      }
    
      .insta-middle {
        max-width: 230px;
      }
    
      .insta-right a {
        font-size: 14px;
      }
    
      /* === ACCESSIBILITY === */
      [id] {
        scroll-margin-top: calc(var(--qb-h) + 18px);
      }
    
      /* === TOUCH IMPROVEMENTS === */
      .scroll-card,
      .service-item,
      .case-thumb,
      .btn,
      .request-btn,
      .apply-btn,
      .cookie-btn,
      .toggle-btn,
      .static-link,
      .footer-icons a {
        -webkit-tap-highlight-color: rgba(255, 157, 0, 0.2);
      }
    
      /* === ANIMATIONS REFINEMENT === */
      @media (hover: hover) and (pointer: fine) {
        .scroll-card:hover {
          transform: rotateY(0deg) translateZ(110px) scale(1.05);
        }
      }
    
      /* === ENSURE NO MOBILE STYLES LEAK === */
      .header.hide {
        transform: none !important;
      }
    
      /* === PREVENT TEXT SELECTION ON INTERACTIVE ELEMENTS === */
      .scroll-card,
      .service-card,
      .glow-card,
      .case-thumb,
      .step-icon {
        user-select: none;
        -webkit-user-select: none;
      }
    
    /* === END TABLET ADAPTATION === */
}