/*
Theme Name: WhyOptionTrading Blocks
Description: Native Gutenberg presentation of the WhyOptionTrading site.
Author: Trading Trainer
Template: twentytwentyfive
Version: 1.0.0
Text Domain: tt-whyoptiontrading-blocks
*/

/* Native block settings define colors, type and ordinary spacing. These rules
 * cover the old site's shared layout and its asymmetric, six-post review grid. */
/* The live theme explicitly smooths text and enables legibility shaping. */
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block: 0; }
.wot-container { width: calc(100% - 60px); max-width: 1170px; margin-inline: auto; }
.wot-header { background: #fff; border-bottom: 3px solid #002b38; }
.wot-header-row { min-height: 121px; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.wot-header-row .wp-block-site-title { margin: 0; color: #28262b; font-size: 40px; line-height: 1.2; font-weight: 700; letter-spacing: -.7px; }
.wot-header-actions { display: flex; align-items: center; gap: 60px; }
.wot-header .wp-block-navigation { gap: 12px; }
.wot-header .wp-block-navigation-item + .wp-block-navigation-item::before { content: '/'; color: #6e68e0; margin-right: 12px; }
/* Beat core Navigation's repeated-class selector while keeping the native
 * current-menu-item/aria-current state responsible for the active page. */
.wot-header .wp-block-navigation .current-menu-item > a { color: #65df92; text-decoration: underline; text-underline-offset: 5px; }
.wot-header .wp-block-search .wp-block-search__button { padding: 0; color: #8a8a8a; background: transparent; align-items: center; justify-content: center; }
.wot-header .wp-block-search .wp-block-search__button svg { width: 18px; height: 18px; }
/* The second native Search block belongs to the opened menu. Keep the
 * existing desktop search toggle separate, without cloning forms in JS. */
.wot-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wot-mobile-search { display: none; }
.wot-header .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open { padding: 24px; box-sizing: border-box; }
/* Core's opened-menu rules are more specific than its ordinary link rules. */
.wot-header .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 56px; align-items: stretch; gap: 24px; }
.wot-header .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container { width: 100%; align-items: stretch; gap: 0; }
.wot-header .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item { width: 100%; align-items: stretch; }
.wot-header .wp-block-navigation .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content { padding: 16px 12px; border-bottom: 1px solid rgb(255 255 255 / 12%); }
.wot-header .is-menu-open .wp-block-navigation-item + .wp-block-navigation-item::before { content: none; }
.wot-header .wot-mobile-search { width: 100%; margin: 0; font-size: 14px; letter-spacing: normal; text-transform: none; }
.wot-header .wot-mobile-search .wp-block-search__inside-wrapper { padding: 4px 12px; border: 0; border-radius: 28px; background: rgb(255 255 255 / 10%); }
.wot-header .wot-mobile-search .wp-block-search__input { min-width: 0; padding: 0; border: 0; background: transparent; color: #fff; font: inherit; }
.wot-header .wot-mobile-search .wp-block-search__input::placeholder { color: #ccc; opacity: 1; }
.wot-header .wot-mobile-search .wp-block-search__button { min-width: 32px; min-height: 36px; color: #fff; }
.wot-title-band { padding: 56px 0 64px; text-align: center; }
.wot-title-band h1 { margin: 0; font-size: 32px; }
.wot-about { padding: 64px 0; background: #fff; text-align: center; }
.wot-about p { margin-block: 0 26px; }
.wot-about .wp-block-buttons { margin-top: 20px; }
.wot-recent { padding: 48px 0 125px; }
.wot-recent h2 { margin-bottom: 20px; }
.is-style-wot-accent { width: 50px; border: 0; border-top: 2px solid #65df92; margin: 0 auto 12px; }
.wot-more-reviews { margin-top: 28px; }
.is-style-review-grid .wp-block-post-template { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 335px; gap: 30px; }
.is-style-review-grid .wp-block-post-template > li { margin: 0; min-width: 0; }
/* Query Loop owns ordering/content. Position only the six visible cards, using
 * the same wide/tall pattern as the live ThemeREX recent-news layout. */
.is-style-review-grid li:nth-child(1) { grid-area: 1 / 1 / 2 / 3; }
.is-style-review-grid li:nth-child(2) { grid-area: 1 / 3 / 3 / 4; }
.is-style-review-grid li:nth-child(3) { grid-area: 2 / 1 / 3 / 3; }
.is-style-review-grid li:nth-child(4) { grid-area: 3 / 2 / 4 / 4; }
.is-style-review-grid li:nth-child(5) { grid-area: 3 / 1 / 5 / 2; }
.is-style-review-grid li:nth-child(6) { grid-area: 4 / 2 / 5 / 4; }
.wot-review-tile { display: flex; height: 100%; background: #fff; }
.wot-review-tile > .wp-block-post-featured-image { flex: 0 0 50%; margin: 0; min-width: 0; }
.wot-review-tile .wp-block-post-featured-image a { display: block; height: 100%; }
.wot-review-tile .wp-block-post-featured-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.wot-review-copy { padding: 58px 30px 30px; min-width: 0; flex: 1; }
.wot-review-copy .wp-block-post-title { font-size: 18px; margin: 0 0 12px; line-height: 1.5; }
/* Inline anchors underline each wrapped line. A transparent border on hover
 * removes the line without changing the link's dimensions. */
.wot-review-copy .wp-block-post-title a, .wot-index-card .wp-block-post-title a { display: inline; border-bottom: 1px solid #0000ee; padding-bottom: 1px; transition: color .3s ease; }
.wot-review-copy .wp-block-post-title a:hover, .wot-index-card .wp-block-post-title a:hover { color: #54be73; border-bottom-color: transparent; }
.wot-review-copy .wp-block-post-excerpt { margin-top: 16px; }
.wot-review-copy .wp-block-post-excerpt__excerpt { font-size: 14px; line-height: 1.85; }
.wot-review-meta { display: flex; gap: 12px; color: #999; font: italic 12px/1.4 Georgia, serif; }
.wot-review-meta > * { margin: 0; }
.wot-review-meta .wp-block-post-comments-count::before { content: ''; display: inline-block; width: 8px; height: 6px; border: 1px solid #aaa; border-radius: 3px; margin-right: 5px; }
.is-style-review-grid li:nth-child(2) .wot-review-tile,
.is-style-review-grid li:nth-child(5) .wot-review-tile { flex-direction: column; }
.is-style-review-grid li:nth-child(2) .wp-block-post-featured-image,
.is-style-review-grid li:nth-child(5) .wp-block-post-featured-image { flex-basis: 335px; }
.is-style-review-grid li:nth-child(3) .wp-block-post-featured-image,
.is-style-review-grid li:nth-child(6) .wp-block-post-featured-image { order: 2; }
.wot-main { display: grid; grid-template-columns: minmax(0, 770px) minmax(0, 370px); gap: 30px; padding-block: 70px 100px; }
.wot-main > * { min-width: 0; margin: 0; }
.wot-article .wp-block-post-title { font-size: 34px; margin: 0 0 12px; }
.wot-article > .wp-block-post-featured-image { margin: 0 0 30px; }
.wot-article > .wp-block-post-featured-image img { width: 100%; height: auto; display: block; }
.wot-article .wp-block-post-content { display: flow-root; }
.wot-article .wp-block-post-content > * { margin-block-start: 0; margin-block-end: 26px; }
.wot-article .wp-block-post-content .alignleft { float: left; margin-right: 25px; margin-bottom: 15px; }
.wot-article .wp-block-post-content .aligncenter { margin-inline: auto; }
.wot-article .wp-block-image figcaption { font-size: 11px; text-align: center; font-style: italic; margin-top: 6px; }
.wot-article .wp-block-image img { max-width: 100%; height: auto; }
.wot-article .wp-block-post-content a { border-bottom: 1px solid #0000ee; }
.wot-article .wp-block-post-content a:hover { border-bottom-color: transparent; }
.wot-article .wp-block-separator { clear: both; border: 0; border-top: 1px solid #c4c4c4; margin-block: 24px; }
.wot-article .wp-block-list { padding-left: 22px; }
.wot-article .wp-block-audio audio { width: 100%; }
.wot-video { position: relative; aspect-ratio: 16/9; width: 100%; }
.wot-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.wot-post-navigation { display: flex; justify-content: space-between; gap: 30px; clear: both; border-block: 1px solid #eee; padding-block: 24px; margin-top: 30px; }
.wot-post-navigation > * { flex: 1; margin: 0; }
.wot-post-navigation .post-navigation-link-next { text-align: right; }
.is-style-sidebar-panel { background: #fff; margin-bottom: 30px; }
.is-style-sidebar-panel h2 { font-size: 24px; border-bottom: 1px solid #eee; padding: 24px 15px; margin: 0; }
.is-style-sidebar-panel .wp-block-latest-posts { padding: 18px 15px 25px; margin: 0; }
.is-style-sidebar-panel .wp-block-latest-posts li { margin-block-start: 0; border-bottom: 1px solid #eee; padding: 10px 0 10px 17px; font-size: 14px; line-height: 1.85; position: relative; }
.is-style-sidebar-panel .wp-block-latest-posts li::before { content: '✓'; position: absolute; left: 0; color: #aeb5c1; }
.is-style-sidebar-panel .wp-block-latest-posts a { color: #8a8a8a; }
.is-style-sidebar-panel .wp-block-search { padding: 30px 15px 40px; margin: 0; }
.is-style-sidebar-panel .wp-block-search__inside-wrapper { background: #f0f0f0; border: 0; border-radius: 30px; padding: 8px 16px; }
.is-style-sidebar-panel .wp-block-search__input { background: transparent; font-size: 12px; min-width: 0; border: 0; padding-inline: 0; }
.is-style-sidebar-panel .wp-block-search__button { background: transparent; color: #aeb5c1; padding: 0; }
.is-style-sidebar-panel .wp-block-search__button svg { width: 20px; }
.wot-index { padding-top: 0; }
.wot-index .wp-block-post-template > li { margin: 0 0 30px; }
.wot-index-card { background: #fff; padding: 35px 30px 20px; }
.wot-index-card > .wp-block-post-featured-image { margin: 0 0 14px; }
.wot-index-card .wp-block-post-featured-image img { display: block; width: 100%; height: auto; }
.wot-index-card .wp-block-post-title { font-size: 18px; margin: 0 0 10px; }
.wot-index-card .wp-block-post-terms { color: #8a8a8a; font-size: 12px; margin-bottom: 15px; }
.wot-index-card .wp-block-post-terms a { color: inherit; }
.wot-index-card .wp-block-post-excerpt { margin-top: 14px; }
.wot-index-card .wp-block-read-more { color: #b6a8a0; display: inline-block; margin-top: 20px; }
.wot-site-footer { background: #fff; border-top: 3px solid #002b38; }
.wot-footer-columns { display: grid; grid-template-columns: 370px 370px 1fr; gap: 30px; padding-block: 56px 90px; }
.wot-footer-columns > * { min-width: 0; margin: 0; }
.wot-footer-description .wp-block-image { margin: 0 0 42px; }
.wot-footer-description p { font-size: 14px; line-height: 1.85; margin: 0 0 26px; }
.wot-footer-contact p { color: #3d5f8e; margin-bottom: 8px; position: relative; padding-left: 26px; }
.wot-footer-contact a { color: inherit; }
.wot-contact-icon { position: absolute; left: 0; top: .25em; display: inline-block; width: 18px; height: 18px; background: currentColor; mask: var(--wot-contact-icon) center / contain no-repeat; }
.wot-contact-location { --wot-contact-icon: url('assets/icons/location.svg'); }
.wot-contact-phone { --wot-contact-icon: url('assets/icons/phone.svg'); }
.wot-contact-mail { --wot-contact-icon: url('assets/icons/mail.svg'); }
.wot-footer-reviews { padding-top: 18px; }
.wot-footer-reviews h2 { font-size: 18px; margin: 0 0 28px; }
.wot-footer-reviews .wp-block-latest-posts { margin: 0; padding: 0; }
.wot-footer-reviews .wp-block-latest-posts li { margin-bottom: 18px; line-height: 1.8; }
.wot-copyright { background: #f0f0f0; padding-block: 21px; font-size: 12px; color: #28262b; }
.wot-copyright p { margin: 0; }
.wot-page { padding-block: 70px; }
/* Pointer clicks never draw focus rings, including text inputs that browsers
 * otherwise match with :focus-visible. Keyboard navigation keeps a clear ring. */
html[data-wot-focus="pointer"] :is(a,button,input,textarea,select,summary,[tabindex]):focus { outline: none; box-shadow: none; }
html:not([data-wot-focus="pointer"]) :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible { outline: 2px solid #6e68e0; outline-offset: 3px; }
.wot-back-to-top { position: fixed; z-index: 100; right: 28px; bottom: 28px; display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 0; background: #28262b; color: #fff; cursor: pointer; }
.wot-back-to-top[hidden] { display: none; }
.wot-back-to-top:hover { background: #54be73; }
@media (max-width: 1262px) {
  .wot-container { max-width: 970px; }
  .wot-header-row .wp-block-site-title { font-size: 34px; }
  .wot-main { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
  .is-style-review-grid .wp-block-post-template { grid-auto-rows: 285px; }
  .is-style-review-grid li:nth-child(2) .wp-block-post-featured-image,
  .is-style-review-grid li:nth-child(5) .wp-block-post-featured-image { flex-basis: 285px; }
  .wot-review-copy { padding: 30px 22px; }
  .wot-footer-columns { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 959px) {
  .wot-container { max-width: 750px; }
  .wot-header-actions { gap: 24px; }
  .wot-main { grid-template-columns: minmax(0, 1fr) 230px; }
  .wot-review-copy .wp-block-post-title { font-size: 16px; }
  .wot-review-copy { padding: 25px 18px; }
  .wot-footer-columns { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .wot-container { width: calc(100% - 40px); max-width: 440px; }
  .wot-header-row { min-height: 100px; gap: 15px; }
  .wot-header-row .wp-block-site-title { font-size: 25px; letter-spacing: -.4px; }
  .wot-header-actions { gap: 16px; }
  .wot-header-actions > .wp-block-search { display: none; }
  .wot-header .wp-block-navigation-item + .wp-block-navigation-item::before { content: none; }
  .wot-title-band { padding: 35px 0; }
  .wot-title-band h1 { font-size: 25px; }
  .wot-about { padding-block: 45px; }
  .wot-about h2, .wot-recent h2 { font-size: 25px; }
  .wot-recent { padding-block: 35px 60px; }
  .is-style-review-grid .wp-block-post-template { display: flex; flex-direction: column; gap: 30px; }
  .wot-review-tile { flex-direction: column; }
  .wot-review-tile > .wp-block-post-featured-image { flex: auto; height: 260px; order: 0 !important; }
  .wot-review-copy { padding: 30px; }
  .wot-main { display: block; padding-block: 40px 60px; }
  .wot-main > aside { margin-top: 45px; }
  .wot-article .wp-block-post-title { font-size: 25px; }
  .wot-article .wp-block-post-content .alignleft { float: none; margin: 0 auto 20px; max-width: 100%; }
  .wot-index-card { padding: 24px 20px; }
  .wot-footer-columns { display: block; padding-block: 40px; }
  .wot-footer-columns > * + * { margin-top: 35px; }
  .wot-footer-reviews { padding-top: 0; }
  .wot-footer-description .wp-block-image { margin-bottom: 30px; }
  .wot-post-navigation { gap: 15px; font-size: 12px; }
}
/* The old header spans the viewport; article/footer content stays at 1170px. */
.wot-header-row.wot-container { max-width: none; }
.wot-header > *, .wot-site-footer > *, .wot-review-tile > * { margin-block: 0; }
.wot-review-copy > * { margin-block-start: 0; }
.wot-title-band { padding-bottom: 98px; }
.wot-main:not(.wot-index) { padding-top: 98px; padding-bottom: 84px; }
@media (min-width: 768px) and (max-width: 959px) {
  .wot-title-band { padding: 58px 0 85px; }
  .wot-title-band h1, .wot-about h2, .wot-recent h2 { font-size: 29.718px; }
  .wot-about { padding-block: 45.5px; }
}
@media (max-width: 959px) {
  body { font-size: 13px; line-height: 1.85; }
  .wot-header-row { min-height: 100px; justify-content: center; position: relative; }
  .wot-header-row .wp-block-site-title { font-size: 37px; }
  .wot-header-actions { position: absolute; left: 0; }
  .wot-header-actions > .wp-block-search { display: none; }
  .wot-header .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
  .wot-header .wp-block-navigation__responsive-container-open { display: flex; }
  .wot-header .wp-block-navigation-item + .wp-block-navigation-item::before { content: none; }
  .is-style-review-grid .wp-block-post-template { display: flex; flex-direction: column; gap: 26px; }
  .is-style-review-grid .wp-block-post-template > li { height: 306px; }
  .is-style-review-grid .wp-block-post-template li .wot-review-tile { flex-direction: row; }
  .is-style-review-grid .wp-block-post-template li .wp-block-post-featured-image { flex: 0 0 40%; height: 100%; order: 0; }
}
@media (max-width: 767px) {
  .wot-title-band { padding: 20px 0 42px; }
  .wot-main:not(.wot-index) { padding-block: 42px 60px; }
  .is-style-review-grid .wp-block-post-template > li { height: auto; }
  .is-style-review-grid .wp-block-post-template li .wot-review-tile { flex-direction: column; height: auto; }
  .is-style-review-grid .wp-block-post-template li .wp-block-post-featured-image { flex: 0 0 auto; height: 300px; width: 100%; }
}
@media (max-width: 479px) {
  body { font-size: 12px; line-height: 22.2px; }
  .wot-container, .wot-header-row.wot-container { max-width: 320px; }
  .wot-header-row { justify-content: flex-start; }
  .wot-header-row .wp-block-site-title { font-size: 30px; line-height: .75; max-width: 240px; }
  .wot-header-actions { left: auto; right: 0; }
  .wot-about { padding-block: 42px; }
  .wot-about h2, .wot-recent h2 { font-size: 24px; margin-bottom: 10px; }
  .wot-about p, .wot-article .wp-block-post-content p, .wot-footer-description p,
  .wot-review-copy .wp-block-post-excerpt__excerpt { font-size: 15px; line-height: 22.2px; }
  .wot-review-copy .wp-block-post-title { font-size: 15px; }
  .wot-footer-contact p { font-size: 12px; }
}
@media (min-width: 768px) and (max-width: 959px) {
  .wot-footer-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 959px) {
  .wot-main { display: block; }
  .wot-main > aside { margin-top: 52px; }
}
@media (max-width: 479px) {
  .wot-main > aside { margin-top: 36px; }
}
@media (min-width: 768px) and (max-width: 959px) {
  .wot-main:not(.wot-index) { padding-block: 91px 78px; }
  .wot-footer-description p { font-size: 13px; line-height: 24.05px; }
  .wot-footer-reviews h2 { font-size: 16.714px; }
}
@media (max-width: 479px) {
  .wot-header-row.wot-container { width: 100%; max-width: none; box-sizing: border-box; padding-inline: max(20px, calc((100vw - 320px) / 2)); }
  .wot-header-actions { right: 10px; }
  .wot-footer-reviews h2 { font-size: 15.428px; }
}
/* Combine the old title bar and page gutter into one editable title band. */
.wot-title-band { padding: 56px 0 100.4px; }
.wot-title-band h1 { line-height: 1.2; }
@media (max-width: 959px) {
  .wot-header { background: #fafafa; border-bottom: 0; }
}
@media (min-width: 768px) and (max-width: 959px) {
  .wot-title-band { padding: 58px 0 88px; }
  .wot-review-copy .wp-block-post-title { font-size: 16.714px; }
}
@media (max-width: 479px) {
  .wot-title-band { padding: 40px 0 24.5px; }
  .wot-title-band h1 { font-size: 24px; }
}
/* The live review list runs newest first. Native category-filtered Next/Previous
 * links preserve its neighbors; put newer on the left and older on the right. */
.wot-post-navigation .post-navigation-link-next,
.wot-post-navigation .post-navigation-link-previous { display: flex; align-items: center; gap: 12px; font-size: 14px; }
.wot-post-navigation .post-navigation-link-next { justify-content: flex-start; text-align: left; border-right: 1px solid #eee; padding-right: 24px; }
.wot-post-navigation .post-navigation-link-previous { justify-content: flex-end; text-align: right; }
/* Match core's arrow-selector specificity so its direction transform cannot
 * undo the flipped glyphs after we reverse the chronological layout. */
.wot-post-navigation .wp-block-post-navigation-link > .wp-block-post-navigation-link__arrow-next { order: -1; transform: rotate(180deg); }
.wot-post-navigation .wp-block-post-navigation-link > .wp-block-post-navigation-link__arrow-previous { order: 1; transform: rotate(180deg); }