{"id":899,"date":"2026-07-28T22:39:45","date_gmt":"2026-07-28T22:39:45","guid":{"rendered":"https:\/\/teacherjm.com\/epja\/?page_id=899"},"modified":"2026-07-29T04:49:24","modified_gmt":"2026-07-29T04:49:24","slug":"899-2","status":"publish","type":"page","link":"https:\/\/teacherjm.com\/epja\/899-2\/","title":{"rendered":""},"content":{"rendered":"\n<style>\n    \/* Contenedor Grid a 2 columnas para tarjetas anchas *\/\n    .grid-bloques-teacher {\n        display: grid;\n        grid-template-columns: repeat(2, 1fr);\n        gap: 3.5rem; \n        max-width: 2200px;\n        width: 100%;\n        padding: 1.5rem;\n        box-sizing: border-box;\n    }\n\n    .bloque-wrapper {\n        perspective: 1500px;\n        min-height: 380px; \n        display: flex;\n        box-sizing: border-box;\n    }\n\n    .bloque {\n        position: relative;\n        width: 100%;\n        min-height: 380px;\n        transform: rotateY(0deg);\n        transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1);\n        transform-style: preserve-3d;\n        border-radius: 28px;\n        box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08);\n        cursor: pointer;\n    }\n\n    \/* Activadores del giro *\/\n    .bloque-wrapper:hover .bloque,\n    .bloque-wrapper.is-flipped .bloque {\n        transform: rotateY(180deg);\n    }\n\n    .cara {\n        position: absolute;\n        width: 100%;\n        height: 100%;\n        backface-visibility: hidden;\n        -webkit-backface-visibility: hidden;\n        border-radius: 28px;\n        padding: 2.5rem 3rem; \n        display: flex;\n        flex-direction: column;\n        align-items: flex-start;\n        border: 1px solid rgba(214, 226, 252, 0.5);\n        background: #ffffff;\n        box-sizing: border-box;\n        overflow: hidden;\n    }\n\n    .cara-back {\n        transform: rotateY(180deg);\n        background: #fafcff;\n        border-color: #c8daf8;\n    }\n\n    .cara .numero {\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        background: #eef4ff;\n        color: #1a3b6b;\n        font-weight: 700;\n        font-size: 1.8rem;\n        width: 65px;\n        height: 65px;\n        border-radius: 20px;\n        margin-bottom: 1.2rem;\n    }\n\n    .cara h3 {\n        font-family: inherit;\n        font-size: 2rem;\n        font-weight: 600;\n        color: #0b1f38;\n        margin: 0 0 0.8rem 0;\n        line-height: 1.2;\n    }\n\n    .cara p {\n        font-family: inherit;\n        font-size: 1.25rem;\n        line-height: 1.6;\n        color: #334d6e;\n        margin: 0 0 1.5rem 0;\n        flex: 1;\n    }\n\n    .cara .separador {\n        width: 100%;\n        height: 2px;\n        background: linear-gradient(to right, #dde7fc, transparent);\n        margin-bottom: 1.2rem;\n        border: 0;\n    }\n\n    .cara .pie {\n        font-size: 1rem;\n        font-weight: 600;\n        text-transform: uppercase;\n        letter-spacing: 0.05em;\n        color: #3d5f8a;\n        background: #f0f5fe;\n        padding: 0.4rem 1.2rem;\n        border-radius: 30px;\n        border: 1px solid #d2e0fb;\n    }\n\n    .cara-back .numero {\n        background: #e0ebff;\n        color: #10345e;\n    }\n\n    \/* Adaptaci\u00f3n responsiva pantallas medianas y m\u00f3viles *\/\n    @media (max-width: 1024px) {\n        .grid-bloques-teacher { gap: 2.5rem; padding: 1rem; }\n        .cara h3 { font-size: 1.7rem; }\n        .cara p { font-size: 1.1rem; }\n    }\n    @media (max-width: 768px) {\n        .grid-bloques-teacher { grid-template-columns: 1fr; }\n    }\n    @media (max-width: 480px) {\n        .bloque-wrapper, .bloque, .cara { min-height: 300px; }\n        .cara { padding: 1.5rem 1.2rem; }\n        .cara .numero { width: 50px; height: 50px; font-size: 1.4rem; }\n        .cara h3 { font-size: 1.4rem; }\n        .cara p { font-size: 1rem; }\n    }\n<\/style>\n<div class=\"grid-bloques-teacher\">\n    \n    <!-- TARJETA 1 -->\n    <div class=\"bloque-wrapper\" onclick=\"toggleTeacherCard(this)\">\n        <div class=\"bloque\">\n            <div class=\"cara cara-front\">\n                <div class=\"numero\">07<\/div>\n                <h3>HOW<\/h3>\n                <div class=\"separador\"><\/div>\n                <p>significa principalmente &#8220;c\u00f3mo&#8221; y se usa para preguntar por la manera, el modo, la cantidad o el estado de algo.<\/p>\n                <div class=\"pie\">Front<\/div>\n            <\/div>\n            <div class=\"cara cara-back\">\n                <div class=\"numero\">07<\/div>\n                <h4>* How are you today?<\/h4>\n                <h4>* How can we get a taxi?<\/h4>\n                <h4>* How did you go to the mountain?<\/h4>\n                <div class=\"separador\"><\/div>\n                <p> .<\/p>\n                <div class=\"pie\">Back<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- TARJETA 2 -->\n    <div class=\"bloque-wrapper\" onclick=\"toggleTeacherCard(this)\">\n        <div class=\"bloque\">\n            <div class=\"cara cara-front\">\n                <div class=\"numero\">08<\/div>\n                <h3>HOW FAR<\/h3>\n                <div class=\"separador\"><\/div>\n                <p>Significa &#8220;qu\u00e9 tan lejos&#8221; o &#8220;a qu\u00e9 distancia&#8221;. Se usa para preguntar por el espacio o los kil\u00f3metros entre dos lugares o cosas.<\/p>\n                <div class=\"pie\">Front<\/div>\n            <\/div>\n            <div class=\"cara cara-back\">\n                <div class=\"numero\">08<\/div>\n                <h4>* How far is the supermarket? <\/h4>\n                <h4>* How far is your house from the school? <\/h4>\n                <h4>* How far can you run? <\/h4>\n                <div class=\"separador\"><\/div>\n                <p> .<\/p>\n                <div class=\"pie\">Back<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- TARJETA 3 -->\n    <div class=\"bloque-wrapper\" onclick=\"toggleTeacherCard(this)\">\n        <div class=\"bloque\">\n            <div class=\"cara cara-front\">\n                <div class=\"numero\">09<\/div>\n                <h3>HOW LONG<\/h3>\n                <div class=\"separador\"><\/div>\n                <p>Significa \u201c\u00bfCu\u00e1nto tiempo?\u201d o \u201c\u00bfQu\u00e9 tan largo?\u201d. Se usa para preguntar por la duraci\u00f3n de un evento, el tiempo que toma hacer algo o la medida f\u00edsica de un objeto.<\/p>\n                <div class=\"pie\">Front<\/div>\n            <\/div>\n            <div class=\"cara cara-back\">\n                <div class=\"numero\">09<\/div>\n                <h4>* How long have you lived here?<\/h4>\n                <h4>* How long has she studied English?<\/h4>\n                <h4>* How long have you been living in Chile?<\/h4>\n                <div class=\"separador\"><\/div>\n                <p> .<\/p>\n                <div class=\"pie\">Back<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- TARJETA 4 -->\n    <div class=\"bloque-wrapper\" onclick=\"toggleTeacherCard(this)\">\n        <div class=\"bloque\">\n            <div class=\"cara cara-front\">\n                <div class=\"numero\">10<\/div>\n                <h3>HOW MANY<\/h3>\n                <div class=\"separador\"><\/div>\n                <p>se usa en ingl\u00e9s para preguntar por la cantidad de cosas que s\u00ed se pueden contar (sustantivos contables en plural). Significa &#8220;\u00bfcu\u00e1ntos?&#8221; o &#8220;\u00bfcu\u00e1ntas?&#8221; en espa\u00f1ol. Se usa con objetos, personas o animales que se pueden numerar uno a uno (como books, cars, people)<\/p>\n                <div class=\"pie\">Front<\/div>\n            <\/div>\n            <div class=\"cara cara-back\">\n                <div class=\"numero\">10<\/div>\n                <h4>* Why are you happy today?<\/h4>\n                <h4>* Why did you say it was raining?<\/h4>\n                <h4>* Why shoud I pay your bills?<\/h4>\n                <div class=\"separador\"><\/div>\n                <p> .<\/p>\n                <div class=\"pie\">Back<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- TARJETA 5 -->\n    <div class=\"bloque-wrapper\" onclick=\"toggleTeacherCard(this)\">\n        <div class=\"bloque\">\n            <div class=\"cara cara-front\">\n                <div class=\"numero\">11<\/div>\n                <h3>HOW MUCH<\/h3>\n                <div class=\"separador\"><\/div>\n                <p>Se usa para cosas que no se pueden contar de forma individual (como l\u00edquidos, dinero en general, tiempo o masa). Significa &#8220;\u00bfCu\u00e1nto?&#8221; o &#8220;\u00bfCu\u00e1nta?&#8221;.<\/p>\n                <div class=\"pie\">Front<\/div>\n            <\/div>\n            <div class=\"cara cara-back\">\n                <div class=\"numero\">11<\/div>\n                <h4>* How much water do you drink?<\/h4>\n                <h4>* How much time do we have?<\/h4>\n                <h4>* How much are the tickets? <\/h4>\n                <div class=\"separador\"><\/div>\n                <p> .<\/p>\n                <div class=\"pie\">Back<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- TARJETA 6 -->\n    <div class=\"bloque-wrapper\" onclick=\"toggleTeacherCard(this)\">\n        <div class=\"bloque\">\n            <div class=\"cara cara-front\">\n                <div class=\"numero\">12<\/div>\n                <h3>HOW OFTEN<\/h3>\n                <div class=\"separador\"><\/div>\n                <p> Se utiliza en ingl\u00e9s para preguntar por la frecuencia con la que se realiza una acci\u00f3n. Significa &#8220;\u00bfCada cu\u00e1nto?&#8221;, &#8220;\u00bfQu\u00e9 tan seguido?&#8221; o &#8220;\u00bfCon qu\u00e9 frecuencia?&#8221;<\/p>\n                <div class=\"pie\">Front<\/div>\n            <\/div>\n            <div class=\"cara cara-back\">\n                <div class=\"numero\">12<\/div>\n                <h4>* How often do you study English?<\/h4>\n                <h4>* How often does she go to the gym? <\/h4>\n                <h4>* How often does it rain in Santiago?<\/h4>\n                <div class=\"separador\"><\/div>\n                <p> .<\/p>\n                <div class=\"pie\">Back<\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n\n<\/div>\n<script>\n    function toggleTeacherCard(wrapper) {\n        if (wrapper) {\n            wrapper.classList.toggle('is-flipped');\n        }\n    }\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>07 HOW significa principalmente &#8220;c\u00f3mo&#8221; y se usa para preguntar por la manera, el modo, la cantidad o el estado de algo. Front 07 * How are you today? * How can we get a taxi? * How did you go to the mountain? . Back 08 HOW FAR Significa &#8220;qu\u00e9 tan lejos&#8221; o &#8220;a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-899","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/pages\/899","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/comments?post=899"}],"version-history":[{"count":8,"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/pages\/899\/revisions"}],"predecessor-version":[{"id":907,"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/pages\/899\/revisions\/907"}],"wp:attachment":[{"href":"https:\/\/teacherjm.com\/epja\/wp-json\/wp\/v2\/media?parent=899"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}