/* ==========================================================
   TML HEADER V9 — RELIABLE
   Prototype 1 colors + simplified modern mobile behavior
   ========================================================== */

.tmlhv9{
    --ivory:#FFF9F7;
    --blush:#FBEFEE;
    --wine:#681F3A;
    --rose:#D96C8A;
    --powder:#F2B6C5;
    --ink:#211A1D;
    --muted:#756A6E;
    --line:#EADDDD;
    --white:#FFFFFF;
    --shadow:0 18px 45px rgba(80,36,52,.11);
    width:100%;
    color:var(--ink);
    font-family:"DM Sans",Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
}
.tmlhv9,.tmlhv9 *{box-sizing:border-box}
.tmlhv9 a{text-decoration:none}
.tmlhv9 button,.tmlhv9 a{-webkit-tap-highlight-color:transparent}
.tmlhv9-container{width:min(1180px,calc(100% - 36px));margin-inline:auto}

/* Announcement */
.tmlhv9-strip{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:34px;
    padding:8px 16px;
    background:#681F3A!important;
    color:#fff!important;
    font-size:.82rem;
    line-height:1.25;
    letter-spacing:.03em;
    text-align:center;
}
.tmlhv9-strip strong{color:#FFD9E4!important;font-weight:700}
.tmlhv9-strip:hover strong{text-decoration:underline;text-underline-offset:3px}

/* Header */
.tmlhv9-header{
    position:relative;
    z-index:9990;
    background:rgba(255,249,247,.96)!important;
    border-bottom:1px solid rgba(234,221,221,.86)!important;
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
}
.tmlhv9-header.tmlhv9-sticky{position:sticky;top:0}
body.admin-bar .tmlhv9-header.tmlhv9-sticky{top:32px}

.tmlhv9-row{
    min-height:78px;
    display:grid;
    grid-template-columns:minmax(150px,190px) minmax(0,1fr) auto;
    align-items:center;
    gap:24px;
}

/* Image-only logo */
.tmlhv9-logo-slot{display:flex;align-items:center;min-width:0}
.tmlhv9-brand{display:inline-flex;align-items:center;max-width:100%}
.tmlhv9-logo-img,.tmlhv9-brand .custom-logo{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:178px!important;
    max-height:46px!important;
    object-fit:contain!important;
}

/* Desktop menu */
.tmlhv9-desktop-nav{min-width:0;overflow:visible}
.tmlhv9 .tmlhv9-menu{
    list-style:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    margin:0!important;
    padding:0!important;
}
.tmlhv9 .tmlhv9-menu>li{position:relative!important;margin:0!important;padding:0!important}
.tmlhv9 .tmlhv9-menu>li>a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:40px!important;
    padding:10px 10px!important;
    border:0!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#493D42!important;
    font-family:"DM Sans",Arial,sans-serif!important;
    font-size:.89rem!important;
    line-height:1!important;
    font-weight:400!important;
    white-space:nowrap!important;
    transition:background .18s ease,color .18s ease!important;
}
.tmlhv9 .tmlhv9-menu>li>a:hover,
.tmlhv9 .tmlhv9-menu>li:hover>a,
.tmlhv9 .tmlhv9-menu>li.current-menu-item>a,
.tmlhv9 .tmlhv9-menu>li.current-menu-ancestor>a{
    background:#FBEFEE!important;
    color:#681F3A!important;
}
.tmlhv9 .tmlhv9-menu>li.menu-item-has-children>a::after{
    content:"";
    width:6px;height:6px;margin-left:6px;margin-top:-3px;
    border-right:1.35px solid currentColor;
    border-bottom:1.35px solid currentColor;
    transform:rotate(45deg);
}

/* Desktop dropdown: CSS-first, no JS required */
.tmlhv9 .tmlhv9-menu .sub-menu{
    position:absolute!important;
    top:calc(100% + 8px)!important;
    left:50%!important;
    z-index:10020!important;
    min-width:230px!important;
    max-width:310px!important;
    margin:0!important;
    padding:8px!important;
    list-style:none!important;
    background:#fff!important;
    border:1px solid #EADDDD!important;
    border-radius:16px!important;
    box-shadow:0 18px 45px rgba(80,36,52,.11)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate(-50%,7px)!important;
    transition:opacity .16s ease,transform .16s ease,visibility .16s ease!important;
}
.tmlhv9 .tmlhv9-menu .sub-menu::before{
    content:"";position:absolute;left:0;right:0;top:-10px;height:11px;
}
.tmlhv9 .tmlhv9-menu>li:hover>.sub-menu,
.tmlhv9 .tmlhv9-menu>li:focus-within>.sub-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate(-50%,0)!important;
}
.tmlhv9 .tmlhv9-menu .sub-menu li{margin:0!important;padding:0!important}
.tmlhv9 .tmlhv9-menu .sub-menu a{
    display:block!important;
    width:100%!important;
    padding:10px 11px!important;
    border-radius:10px!important;
    background:transparent!important;
    color:#211A1D!important;
    font-family:"DM Sans",Arial,sans-serif!important;
    font-size:.85rem!important;
    line-height:1.35!important;
    font-weight:500!important;
    white-space:normal!important;
}
.tmlhv9 .tmlhv9-menu .sub-menu a:hover,
.tmlhv9 .tmlhv9-menu .sub-menu li.current-menu-item>a{
    background:#FBEFEE!important;
    color:#681F3A!important;
}

/* CTA */
.tmlhv9-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px}
.tmlhv9-cta{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:40px!important;
    padding:11px 17px!important;
    border-radius:999px!important;
    background:#681F3A!important;
    color:#fff!important;
    font-family:"DM Sans",Arial,sans-serif!important;
    font-size:.86rem!important;
    line-height:1!important;
    font-weight:700!important;
    white-space:nowrap!important;
}
.tmlhv9-cta:hover{
    background:#681F3A!important;
    color:#fff!important;
    transform:translateY(-1px);
    box-shadow:0 8px 24px rgba(104,31,58,.18);
}

/* Mobile trigger hidden unless media query explicitly shows it */
.tmlhv9-mobile-toggle{
    display:none!important;
    align-items:center!important;
    gap:9px!important;
    min-height:42px!important;
    padding:0 12px 0 14px!important;
    border:1px solid #EADDDD!important;
    border-radius:999px!important;
    background:#fff!important;
    color:#211A1D!important;
    font-family:"DM Sans",Arial,sans-serif!important;
    font-size:.82rem!important;
    line-height:1!important;
    font-weight:700!important;
    cursor:pointer!important;
}
.tmlhv9-mobile-icon{position:relative;display:block;width:17px;height:14px}
.tmlhv9-mobile-icon i{
    position:absolute;left:0;width:17px;height:1.5px;border-radius:999px;background:#681F3A;
    transition:transform .18s ease,top .18s ease;
}
.tmlhv9-mobile-icon i:first-child{top:4px}
.tmlhv9-mobile-icon i:last-child{top:10px}
.tmlhv9-mobile-toggle[aria-expanded=true] .tmlhv9-mobile-icon i:first-child{top:7px;transform:rotate(45deg)}
.tmlhv9-mobile-toggle[aria-expanded=true] .tmlhv9-mobile-icon i:last-child{top:7px;transform:rotate(-45deg)}

/* Mobile panel is a simple child of the sticky header.
   No fixed-position viewport math. */
.tmlhv9-mobile-panel{
    background:linear-gradient(180deg,#FFF9F7 0%,#fff 35%)!important;
    border-top:1px solid #EADDDD!important;
    box-shadow:0 18px 45px rgba(80,36,52,.08)!important;
}
.tmlhv9-mobile-panel[hidden]{display:none!important}
.tmlhv9-mobile-inner{
    width:min(100% - 24px,720px);
    max-height:calc(100dvh - 110px);
    margin-inline:auto;
    padding:18px 0 calc(18px + env(safe-area-inset-bottom));
    overflow-y:auto;
    overscroll-behavior:contain;
}
.tmlhv9-mobile-head{
    display:grid;
    gap:4px;
    padding:2px 3px 12px;
}
.tmlhv9-mobile-head span{
    color:#681F3A;
    font-size:.69rem;
    line-height:1;
    font-weight:700;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.tmlhv9-mobile-head small{
    color:#756A6E;
    font-size:.76rem;
    line-height:1.35;
}

/* Mobile menu */
.tmlhv9 .tmlhv9-mobile-menu{
    list-style:none!important;
    margin:0!important;
    padding:0!important;
}
.tmlhv9 .tmlhv9-mobile-menu>li{
    position:relative!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    margin:0!important;
    padding:0!important;
    border-bottom:1px solid #EADDDD!important;
}
.tmlhv9 .tmlhv9-mobile-menu>li>a{
    display:flex!important;
    align-items:center!important;
    min-height:54px!important;
    padding:13px 4px!important;
    color:#211A1D!important;
    font-family:"DM Sans",Arial,sans-serif!important;
    font-size:.98rem!important;
    line-height:1.2!important;
    font-weight:600!important;
}
.tmlhv9 .tmlhv9-mobile-menu>li.current-menu-item>a,
.tmlhv9 .tmlhv9-mobile-menu>li.current-menu-ancestor>a{
    color:#681F3A!important;
}
.tmlhv9-mobile-submenu-toggle{
    display:grid!important;
    place-items:center!important;
    width:40px!important;
    height:40px!important;
    margin-right:-2px!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:transparent!important;
    cursor:pointer!important;
}
.tmlhv9-mobile-submenu-toggle::before{
    content:"";
    width:8px;height:8px;
    border-right:1.5px solid #681F3A;
    border-bottom:1.5px solid #681F3A;
    transform:translateY(-2px) rotate(45deg);
    transition:transform .18s ease;
}
.tmlhv9-mobile-submenu-toggle[aria-expanded=true]{
    background:#FBEFEE!important;
}
.tmlhv9-mobile-submenu-toggle[aria-expanded=true]::before{
    transform:translateY(2px) rotate(225deg);
}
.tmlhv9 .tmlhv9-mobile-menu .sub-menu{
    grid-column:1/-1!important;
    width:100%!important;
    list-style:none!important;
    margin:0!important;
    padding:0 0 10px 12px!important;
    border-left:1px solid #EADDDD!important;
}
.tmlhv9 .tmlhv9-mobile-menu .sub-menu[hidden]{display:none!important}
.tmlhv9 .tmlhv9-mobile-menu .sub-menu li{margin:0!important;padding:0!important}
.tmlhv9 .tmlhv9-mobile-menu .sub-menu a{
    display:block!important;
    padding:9px 10px!important;
    border-radius:9px!important;
    color:#756A6E!important;
    font-family:"DM Sans",Arial,sans-serif!important;
    font-size:.87rem!important;
    line-height:1.35!important;
    font-weight:500!important;
}
.tmlhv9 .tmlhv9-mobile-menu .sub-menu a:hover,
.tmlhv9 .tmlhv9-mobile-menu .sub-menu li.current-menu-item>a{
    background:#FBEFEE!important;
    color:#681F3A!important;
}

/* Mobile useful actions */
.tmlhv9-mobile-footer{
    display:grid;
    gap:10px;
    padding-top:16px;
}
.tmlhv9-mobile-letter{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px!important;
    min-height:58px!important;
    padding:10px 14px!important;
    border:1px solid #EADDDD!important;
    border-radius:16px!important;
    background:#FBEFEE!important;
    color:#681F3A!important;
}
.tmlhv9-mobile-letter span:first-child{display:grid;gap:2px}
.tmlhv9-mobile-letter small{
    color:#756A6E!important;
    font-size:.66rem!important;
    line-height:1!important;
    font-weight:700!important;
    letter-spacing:.10em!important;
    text-transform:uppercase!important;
}
.tmlhv9-mobile-letter b{
    color:#681F3A!important;
    font-size:.87rem!important;
    line-height:1.2!important;
    font-weight:700!important;
}
.tmlhv9-mobile-academy{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    min-height:48px!important;
    padding:11px 18px!important;
    border-radius:999px!important;
    background:#681F3A!important;
    color:#fff!important;
    font-family:"DM Sans",Arial,sans-serif!important;
    font-size:.88rem!important;
    line-height:1!important;
    font-weight:700!important;
}

.tmlhv9-menu-warning{
    padding:9px 12px;
    border:1px dashed #EADDDD;
    border-radius:12px;
    color:#756A6E;
    font-size:.76rem;
    text-align:center;
}

/* Laptop tightening */
@media(min-width:821px) and (max-width:1180px){
    .tmlhv9-row{grid-template-columns:145px minmax(0,1fr) auto;gap:14px}
    .tmlhv9-logo-img,.tmlhv9-brand .custom-logo{max-width:145px!important;max-height:40px!important}
    .tmlhv9 .tmlhv9-menu{gap:2px!important}
    .tmlhv9 .tmlhv9-menu>li>a{padding:10px 7px!important;font-size:.80rem!important}
    .tmlhv9-cta{padding:10px 13px!important;font-size:.80rem!important}
}

/* Mobile/tablet breakpoint intentionally lower than earlier builds.
   This prevents the "hamburger on desktop" problem. */
@media(max-width:820px){
    .tmlhv9-row{grid-template-columns:1fr auto;gap:14px;min-height:68px}
    .tmlhv9-desktop-nav,.tmlhv9-cta{display:none!important}
    .tmlhv9-mobile-toggle{display:inline-flex!important}
    .tmlhv9-logo-img,.tmlhv9-brand .custom-logo{max-width:158px!important;max-height:40px!important}
}

@media(max-width:640px){
    .tmlhv9-container{width:min(100% - 24px,1180px)}
    .tmlhv9-row{min-height:66px}
    .tmlhv9-strip{font-size:.72rem;padding:7px 12px;gap:4px}
    .tmlhv9-logo-img,.tmlhv9-brand .custom-logo{max-width:146px!important;max-height:38px!important}
}

@media(max-width:460px){
    .tmlhv9-strip-copy{display:none!important}
    .tmlhv9-strip{font-size:.74rem}
}

@media(max-width:360px){
    .tmlhv9-mobile-label{display:none!important}
    .tmlhv9-mobile-toggle{width:42px!important;padding:0!important;justify-content:center!important}
}

@media(max-width:782px){
    body.admin-bar .tmlhv9-header.tmlhv9-sticky{top:46px}
}

@media(prefers-reduced-motion:reduce){
    .tmlhv9 *,
    .tmlhv9 *::before,
    .tmlhv9 *::after{
        transition-duration:.001ms!important;
        animation-duration:.001ms!important;
    }
}