/* Facturas360 visual system. Does not change application logic. */
:root{--f360-navy:#061f39;--f360-deep:#082d4d;--f360-cyan:#12d9e7;--f360-text:#12324b;--f360-border:#d8e9f1}
.f360-site-header{position:relative;z-index:100;background:#061f39;color:#fff;border-bottom:1px solid #28516b;font-family:system-ui,-apple-system,'Segoe UI',sans-serif}
.f360-site-header *{box-sizing:border-box}
.f360-site-header .f360-site-inner{max-width:1220px;margin:auto;padding:13px 24px;min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.f360-site-header .f360-site-logo{font-weight:900;font-size:23px;letter-spacing:-.7px;color:white;text-decoration:none;white-space:nowrap}
.f360-site-header .f360-site-logo span{color:var(--f360-cyan)}
.f360-site-header .f360-site-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:clamp(9px,1.35vw,20px)}
.f360-site-header .f360-site-links a{color:#e9f7ff;text-decoration:none;font-size:13px;font-weight:650;white-space:nowrap}
.f360-site-header .f360-site-links a:hover{color:var(--f360-cyan)}
.f360-site-header .f360-site-links .f360-site-action{border:1px solid #5b819b;border-radius:9px;padding:9px 12px}
.f360-site-header .f360-site-links .f360-site-primary{background:var(--f360-cyan);color:#05243e;border-radius:9px;padding:10px 14px;font-weight:800}
.f360-site-header .f360-site-links .f360-site-primary:hover{background:#86f3f7;color:#05243e}
@media(max-width:900px){.f360-site-header .f360-site-inner{align-items:flex-start;flex-direction:column;gap:12px}.f360-site-header .f360-site-links{justify-content:flex-start;gap:12px 18px}}
/* Trades: preserve content and examples while bringing each page into the homepage style. */
body.f360-trade-page{background:#f3f8fc;color:var(--f360-text)}
body.f360-trade-page>header:not(.f360-site-header){display:none}
body.f360-trade-page main>.hero{background:linear-gradient(115deg,#06233e 0%,#104a6a 100%);color:#fff;padding:48px clamp(20px,5vw,65px);border-radius:22px;margin-top:32px;margin-bottom:35px;box-shadow:0 18px 45px #09253b24}
body.f360-trade-page main>.hero .muted{color:#8cecf3}
body.f360-trade-page main>.hero .lead{color:#e0edf5}
body.f360-trade-page main>.hero h1{color:white}
body.f360-trade-page .btn{background:#12d9e7;color:#05243e;border-radius:11px}
body.f360-trade-page .btn.alt{background:transparent;color:white;border:1px solid #9bdce7}
body.f360-trade-page .card,body.f360-trade-page .document{border-color:#d8e9f1;box-shadow:0 8px 25px #0a35500d;border-radius:17px}
body.f360-trade-page .card h3,body.f360-trade-page main h2{color:#0a3857}
body.f360-trade-page .related a{border-color:#b9dfe9;color:#0b4c68;background:#f1fbfd}
/* Main landing from Trades down: decorative treatment only, without affecting interactive controls. */
body.f360-landing #oficios{background:linear-gradient(145deg,#06243e,#0b4665);border-radius:24px;padding:clamp(24px,4vw,48px);color:#eaf9ff;box-shadow:0 20px 55px #06283b20;margin-top:35px;margin-bottom:35px}
body.f360-landing #oficios h2{color:white;font-size:clamp(27px,3.1vw,40px);letter-spacing:-.8px}
body.f360-landing #oficios>p{color:#bce4ee;max-width:760px}
body.f360-landing #oficios .oficios-grid{gap:16px}
body.f360-landing #oficios .oficio-card{background:#fff;color:#153a53;border:1px solid #b7e4ef;border-radius:16px;box-shadow:0 7px 20px #001d3519;transition:transform .2s,box-shadow .2s}
body.f360-landing #oficios .oficio-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px #001d3540}
body.f360-landing #oficios .oficio-card strong{color:#073d5d}
body.f360-landing #oficios .oficio-card em{color:#007e9a}
body.f360-landing #ejemplos,body.f360-landing #finanzas{background:#f3f9fc;border:1px solid #d8e9f1;border-radius:22px;padding:clamp(22px,3.5vw,44px)!important;margin-top:26px;margin-bottom:30px}
body.f360-landing #ejemplos h2,body.f360-landing #finanzas h2{color:#082f4d}
body.f360-landing #crear,body.f360-landing #precios{border-top:5px solid #0cbdd1}
body.f360-landing #crear>.wrap>.sh h2,body.f360-landing #precios>.wrap>.sh h2{letter-spacing:-.7px}
body.f360-landing #como,body.f360-landing #opiniones{border-radius:20px}
@media(max-width:650px){body.f360-landing #oficios{border-radius:15px;padding:20px}body.f360-trade-page main>.hero{padding:28px 22px;border-radius:15px}}

/* Shared 60px header, same identity as the approved main screenshot. */
.f360-site-header .f360-site-inner{min-height:60px;height:60px;max-width:1536px;padding:0 clamp(16px,2.5vw,40px);gap:14px}
.f360-site-header .f360-site-logo{display:inline-flex;align-items:center;gap:9px;font-size:clamp(16px,1.3vw,20px);line-height:1;font-weight:800;letter-spacing:-.4px}
.f360-site-header .f360-site-logo svg{width:30px;height:30px;flex:none}
.f360-site-header .f360-site-logo b{font-weight:800}
.f360-site-header .f360-site-logo span{color:#11d9e9}
.f360-site-header .f360-site-links{flex-wrap:nowrap;gap:clamp(7px,1vw,17px)}
.f360-site-header .f360-site-links a{font-size:clamp(11px,.88vw,14px)}
.f360-site-header .f360-site-links .f360-site-action{border-radius:8px;padding:9px 10px;background:#0b314f}
.f360-site-header .f360-site-links .f360-site-primary{padding:10px 12px}
@media(max-width:1100px){.f360-site-header .f360-site-inner{height:auto;min-height:60px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}.f360-site-header .f360-site-links{flex-wrap:wrap;justify-content:flex-start}}
@media(max-width:900px){.f360-site-header .f360-site-inner{flex-direction:row;align-items:center;gap:10px}.f360-site-header .f360-site-links{gap:8px 13px}}

/* Consistent branded header and account status across all public pages. */
.f360-site-header .f360-site-inner{min-height:74px;height:74px;max-width:1536px}
.f360-site-header .f360-site-logo{display:flex;align-items:center;flex:none;padding:0;min-width:0}
.f360-site-header .f360-site-logo img{display:block;width:200px;height:60px;object-fit:contain;max-width:100%}
.f360-site-header .f360-site-links .f360-site-action.is-signed-in{background:#0c4867;border-color:#1ce4ed;color:#aef8ff}
@media(max-width:1100px){.f360-site-header .f360-site-inner{height:auto;min-height:74px}}
@media(max-width:540px){.f360-site-header .f360-site-logo img{width:170px;height:51px}}
/* Shared in-page account overlay; the original homepage dialog owns all plan data. */
.f360-account-overlay{position:fixed;inset:0;z-index:2147483000;background:rgba(2,20,35,.74);display:flex;align-items:center;justify-content:center;padding:12px}
.f360-account-frame-wrap{position:relative;width:min(610px,100%);height:min(740px,96vh);border-radius:20px;overflow:hidden;background:transparent}
.f360-account-frame-wrap iframe{display:block;width:100%;height:100%;border:0;background:transparent}
.f360-account-close{position:absolute;right:8px;top:7px;z-index:5;width:36px;height:36px;border-radius:50%;border:1px solid #b6d9e5;background:#092d47;color:white;font-size:25px;cursor:pointer}
.f360-account-loading{position:absolute;top:48%;left:0;right:0;text-align:center;color:white;font:600 17px system-ui}

/* Final unified navigation fixes */
.f360-site-header + header:not(.f360-site-header){display:none!important}
.f360-account-frame-wrap{background:transparent!important;box-shadow:none!important}
.f360-account-frame-wrap iframe{background:transparent!important}
.f360-account-overlay{background:rgba(2,20,35,.64)!important}

/* The account iframe is invisible until cropped to the real account dialog. */
.f360-account-frame-wrap iframe{background:transparent!important}

/* Compact account panel: the embedded page is transparent and only its actual dialog is shown. */
.f360-account-frame-wrap{width:min(492px,calc(100vw - 24px))!important;height:min(640px,calc(100dvh - 28px))!important;background:transparent!important;border-radius:20px!important;box-shadow:none!important;}
.f360-account-frame-wrap iframe{width:100%!important;height:100%!important;background:transparent!important;border:0!important;clip-path:none!important;}


/* Footer compacto: copyright en renglón inferior centrado */
.f360-global-footer .f360-footer-bottom,.f360-global-footer .f360-footer-copy,.f360-global-footer .f360-footer-copyright {text-align:center!important;justify-content:center!important;width:100%!important}
.f360-global-footer .f360-footer-inner {max-width:1060px!important;margin-left:auto!important;margin-right:auto!important}