/* Ta Trimbox (Le format fini de ton site) */
.preptika-canvas {
  position: relative;
  max-width: 520px;
  width: 100%;
  margin: 0 auto 12px auto; /* Centrage horizontal + espace bas */
  padding: 14px 20px;
  background: transparent; /* Fond transparent — thème sombre préservé */
  
  /* Ton pointillé orange Preptika */
  border: 1px dashed #FF6600; 
}

/* Réduction de la taille du titre hero à l'intérieur du canvas */
.preptika-canvas .hero-title {
  font-size: clamp(1.6rem, 4vw, 2.6rem);
  line-height: 1.15;
  margin: 0;
  text-align: center;
}


/* Sous-titre : centré + marge interne pour ne pas toucher les repères */
.preptika-canvas ~ .hero-subtitle {
  text-align: center !important;
  padding: 0 50px !important; /* Recul par rapport aux crop marks (40px débord + 10px air) */
  font-size: clamp(0.8rem, 1.8vw, 0.95rem) !important;
  line-height: 1.4 !important;
  max-width: 520px;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Le calque invisible qui génère les 8 traits de coupe */
.preptika-canvas::before {
  content: "";
  position: absolute;
  pointer-events: none;
  
  /* On déborde de 40px de chaque côté (30px de trait + 10px de blanc tournant) */
  top: -40px;
  bottom: -40px;
  left: -40px;
  right: -40px;

  /* Tracé des 8 filets (4 verticaux, 4 horizontaux) */
  background:
    /* --- AXES VERTICAUX (Largeur 1px, Hauteur 30px) --- */
    /* Haut-Gauche */ linear-gradient(#FF6600, #FF6600) no-repeat 40px 0px / 1px 30px,
    /* Haut-Droite */ linear-gradient(#FF6600, #FF6600) no-repeat calc(100% - 40px) 0px / 1px 30px,
    /* Bas-Gauche  */ linear-gradient(#FF6600, #FF6600) no-repeat 40px 100% / 1px 30px,
    /* Bas-Droite  */ linear-gradient(#FF6600, #FF6600) no-repeat calc(100% - 40px) 100% / 1px 30px,

    /* --- AXES HORIZONTAUX (Largeur 30px, Hauteur 1px) --- */
    /* Haut-Gauche */ linear-gradient(#FF6600, #FF6600) no-repeat 0px 40px / 30px 1px,
    /* Haut-Droite */ linear-gradient(#FF6600, #FF6600) no-repeat 100% 40px / 30px 1px,
    /* Bas-Gauche  */ linear-gradient(#FF6600, #FF6600) no-repeat 0px calc(100% - 40px) / 30px 1px,
    /* Bas-Droite  */ linear-gradient(#FF6600, #FF6600) no-repeat 100% calc(100% - 40px) / 30px 1px;
}
