/* Noluvio simple online utilities — original, mobile-first, self-hosted. */
.utility-hero{background:radial-gradient(ellipse at 82% 27%,#1e64bf99,transparent 43%),linear-gradient(128deg,#08182e,#103657);color:#f3faff;overflow:hidden}
.utility-hero-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(25px,5vw,75px);align-items:center;padding-block:clamp(58px,7vw,100px)}
.utility-back{color:#8fd6fd;display:inline-block;font-size:12px;font-weight:780;margin-bottom:24px;text-decoration:none}
.utility-back:hover{color:#fff}
.utility-kicker{color:#0057ff;font-weight:850;font-size:11px;letter-spacing:.15em;margin:0 0 14px;text-transform:uppercase}
.utility-hero .utility-kicker,.utility-upsell .utility-kicker{color:#69f4c7}
.utility-hero h1{font-size:clamp(44px,5.4vw,77px);font-weight:850;line-height:1.04;letter-spacing:-.058em;max-width:830px;margin:0 0 19px}
.utility-hero-grid>div:first-child>p:not(.utility-kicker){max-width:670px;color:#c2ddeb;font-size:clamp(15px,1.45vw,19px);line-height:1.75}
.utility-trust{display:flex;gap:10px 21px;flex-wrap:wrap;align-items:center;color:#a7eccd;font-size:11px;margin-top:25px;font-weight:760}
.utility-trust icon{font-style:normal}
.utility-hero-visual{min-height:330px;display:grid;place-items:center;position:relative;isolation:isolate}
.utility-hero-visual:before{content:"";position:absolute;inset:10% 0;z-index:-1;border:2px solid #44c5ff2a;border-radius:50%;transform:rotate(-20deg)}
.utility-hero-window{width:min(100%,465px);border:1px solid #6897bf;border-radius:21px;background:#0b2442;padding:18px;box-shadow:0 31px 75px #001325aa;transform:rotate(-2deg)}
.utility-hero-window>.utility-dots{display:inline-block;letter-spacing:4px;font-size:10px;color:#84abc6}
.utility-hero-window>small{float:right;font-size:9px;color:#b9d9ed;letter-spacing:.08em}
.utility-file-tiles{display:flex;justify-content:center;align-items:center;gap:10px;padding:31px 14px 22px;margin-top:14px;border-radius:13px;background:radial-gradient(circle at 75% 20%,#33dacc61,transparent 46%),linear-gradient(135deg,#064fad,#0b325c)}
.utility-file-tile{background:#fff;color:#12385c;border:1px solid #cfe2f1;border-radius:12px;padding:18px 15px;box-shadow:8px 10px 26px #001c376b;width:118px;height:145px;transform:rotate(-7deg)}
.utility-file-tile.tile-b{transform:rotate(6deg)}
.utility-file-tile b{display:block;font-size:23px;letter-spacing:-.04em;margin-bottom:19px;color:#0057ff}
.utility-file-tile i{display:block;height:6px;background:#cbdfee;border-radius:5px;margin-block:11px}
.utility-file-tile i:nth-of-type(2){width:70%}
.utility-center-arrow{font-size:30px;color:#aaffde;font-weight:850}
.utility-hero-window>p{color:#bbdbef;letter-spacing:.11em;font-size:10px;font-weight:850;text-align:center;margin:16px 0 3px}
.utility-work{padding:clamp(65px,8vw,100px) 0;background:#f6f9fd}
.utility-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.7fr);gap:35px;align-items:end;margin-bottom:30px}
.utility-section-head h2{font-size:clamp(31px,4vw,54px);letter-spacing:-.05em;line-height:1.12;margin:0;color:#112d4b}
.utility-section-head>p{color:#607a8d;font-size:14px;line-height:1.8;max-width:490px;justify-self:end;margin:0}
.utility-lab{display:grid;grid-template-columns:minmax(280px,.81fr) minmax(0,1.19fr);gap:19px;align-items:start}
.utility-panel{background:#fff;border:1px solid #d5e3ef;border-radius:19px;padding:clamp(19px,2.6vw,33px);box-shadow:0 11px 31px #143c5b0c;min-width:0}
.utility-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #d9e7f1;padding-bottom:16px;margin-bottom:22px}
.utility-panel-head strong{font-size:16px;font-weight:860;color:#193a56}
.utility-panel-head span{color:#0057ff;font-size:10px;font-weight:850;letter-spacing:.10em;white-space:nowrap}
.utility-panel .field{margin-bottom:18px}
.utility-panel .field label{font-size:12px}
.utility-panel input[type=file]{background:#f5faff;cursor:pointer;font-size:12px;min-width:0}
.utility-panel input[type=file]::file-selector-button{border:1px solid #aad1ef;background:#e8f3ff;color:#06519d;border-radius:8px;padding:8px 11px;margin-inline-end:10px;cursor:pointer;font-size:12px;font-weight:800}
.utility-panel .field small,.utility-panel .help{color:#647c90;font-size:11px;line-height:1.65}
.utility-input-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.utility-check{display:inline-flex;align-items:center;gap:11px;color:#30566e;font-size:12px;font-weight:750;cursor:pointer;margin:-5px 0 21px}
.utility-check input{width:18px;height:18px;accent-color:#0057ff}
.utility-primary{min-height:52px;border:0;background:#0057ff;color:#fff;font-size:13px;font-weight:850;border-radius:11px;padding:12px 20px;width:100%;display:inline-flex;justify-content:center;align-items:center}
.utility-primary:hover{background:#0544bc}
.utility-primary:disabled{background:#d8e5ee;color:#5d788d;cursor:not-allowed}
.utility-status{font-size:11px;line-height:1.6;color:#275b7b;margin:15px 0 0;min-height:20px}
.utility-image-stage{display:grid;place-items:center;min-height:310px;padding:18px;background:repeating-conic-gradient(#eef4f8 0% 25%,#e3edf5 0% 50%) 50%/24px 24px;border-radius:13px;overflow:hidden;text-align:center;color:#55758e;font-size:14px}
.utility-image-stage canvas{max-width:100%;max-height:410px;width:auto;height:auto;object-fit:contain;box-shadow:0 8px 25px #1538552f;border:1px solid #c2d6e3}
.utility-image-stage canvas[hidden],.utility-image-stage p[hidden]{display:none}
.utility-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}
.utility-info-grid>div{border:1px solid #dce8f0;border-radius:10px;padding:14px;min-width:0}
.utility-info-grid small{display:block;font-size:10px;letter-spacing:.1em;color:#608095;font-weight:790;margin-bottom:7px}
.utility-info-grid strong{display:block;font-size:12px;color:#203b57;overflow-wrap:anywhere;line-height:1.5}
.utility-caption{color:#6d8495;font-size:11px;line-height:1.7;margin:17px 0 0}
.utility-steps-mini{display:grid;gap:8px;margin:0 0 20px}
.utility-steps-mini span{display:block;background:#f0f6fb;border-left:3px solid #0057ff;border-radius:6px;padding:9px 12px;color:#365c79;font-size:12px;font-weight:760}
.utility-pdf-stage{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:15px;align-items:start;max-height:650px;overflow:auto;background:#e7f0f7;border-radius:12px;padding:15px}
.utility-placeholder{color:#647d90;font-size:12px}
.utility-print-sheet{position:relative;display:grid;place-items:center;background:#fff;border:1px solid #ccdae4;box-shadow:0 5px 17px #25486623;aspect-ratio:210/297;min-width:0;padding:12px}
.utility-print-sheet img{display:block;object-fit:contain;max-height:100%;max-width:100%;width:100%;height:100%}
.utility-sheet-number{position:absolute;top:10px;right:10px;font-size:10px;font-weight:800;color:#51718a;background:#fffdfdce;padding:4px 6px}
.utility-sheet-watermark{position:absolute;left:4%;right:4%;top:50%;transform:translateY(-50%) rotate(-23deg);pointer-events:none;text-align:center;color:rgba(28,67,100,.30);font-size:clamp(12px,1.6vw,23px);font-weight:950;letter-spacing:.07em;overflow-wrap:anywhere}
.utility-row-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.utility-row-actions button{background:#ebf4fe;color:#0057d2;border:1px solid #bddaf6;border-radius:10px;padding:10px 13px;font-size:12px;font-weight:830}
.utility-row-actions small{color:#607a8d;font-size:11px}
.utility-extra-rows{display:grid;gap:11px;margin-bottom:20px}
.utility-line-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(55px,.4fr) minmax(75px,.55fr) auto;gap:9px;border:1px solid #dce6f0;border-radius:11px;padding:11px;background:#f7fbff;align-items:end}
.utility-line-row label{display:flex;flex-direction:column;gap:5px;font-size:10px;font-weight:750;color:#496a80;min-width:0}
.utility-line-row input{min-height:38px;width:100%;border:1px solid #c7d7e6;border-radius:7px;padding:6px;font-size:12px}
.utility-remove-line{min-height:38px;border:1px solid #e3c2bf;background:#fff1ee;border-radius:8px;padding:7px 8px;font-size:11px;color:#994c49}
.utility-invoice-page{position:relative;background:#fff;padding:clamp(24px,3vw,44px);min-height:590px;border:1px solid #d6e3ef;box-shadow:0 9px 27px #193b5618;color:#173751;overflow:hidden}
.utility-invoice-top{display:flex;align-items:center;justify-content:space-between;gap:11px;margin-bottom:37px;border-bottom:2px solid #0057ff;padding-bottom:16px}
.utility-invoice-top strong{font-size:23px;font-weight:880;letter-spacing:-.05em}
.utility-invoice-top span{font-size:9px;color:#4e8ba9;letter-spacing:.09em;font-weight:800}
.utility-invoice-columns{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:28px}
.utility-invoice-columns small{font-size:10px;display:block;color:#6b8798;font-weight:800;letter-spacing:.07em;margin-bottom:8px}
.utility-invoice-columns strong{display:block;font-size:13px;overflow-wrap:anywhere}
.utility-invoice-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:21px;font-size:11px;color:#57768a}
.utility-invoice-table{font-size:11px}
.utility-invoice-thead,.utility-invoice-line{display:grid;grid-template-columns:minmax(0,2fr) 45px minmax(55px,.65fr) minmax(60px,.7fr);gap:10px;align-items:start;padding:11px 3px;border-bottom:1px solid #d7e5f0}
.utility-invoice-thead{background:#ecf5ff;color:#21547c;font-weight:870;padding:13px 8px}
.utility-invoice-line{color:#3a5d77}
.utility-invoice-line>span:first-child{overflow-wrap:anywhere}
.utility-invoice-line>span:not(:first-child){text-align:end;overflow-wrap:anywhere}
.utility-invoice-summary{display:grid;gap:10px;margin:24px 0 0 auto;max-width:220px;font-size:12px}
.utility-invoice-summary>div{display:flex;justify-content:space-between;gap:10px;color:#57768c}
.utility-invoice-summary strong{color:#15334f}
.utility-invoice-grand{border-top:2px solid #0057ff;padding-top:14px;font-size:15px;font-weight:850}
.utility-invoice-note{font-size:11px;color:#5f7d92;margin:35px 0;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}
.utility-invoice-watermark{position:absolute;top:50%;left:3%;right:3%;text-align:center;transform:rotate(-19deg);color:rgba(0,80,170,.21);font-size:clamp(16px,2.3vw,30px);font-weight:950;letter-spacing:.035em;pointer-events:none}
.utility-guide{background:#eaf2fa;padding-block:clamp(58px,7vw,92px)}
.utility-guidance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.utility-guidance-grid article{background:#fff;border:1px solid #d9e6f1;border-radius:17px;padding:clamp(20px,2.5vw,33px)}
.utility-guidance-grid h3{font-size:22px;line-height:1.3;letter-spacing:-.035em;color:#183853;margin:0 0 13px}
.utility-guidance-grid p{font-size:13px;line-height:1.85;color:#526f84;margin:0 0 15px}
.utility-guidance-grid a{color:#0057ff;text-decoration:underline}
.utility-upsell{background:linear-gradient(120deg,#082541,#123e64);padding-block:70px;color:#eaf9ff}
.utility-upsell-inner{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}
.utility-upsell h2{font-size:clamp(29px,3.4vw,45px);letter-spacing:-.047em;color:#fff;line-height:1.13;margin:0 0 14px}
.utility-upsell p:not(.utility-kicker){color:#c5dbe9;font-size:13px;line-height:1.8;max-width:780px}
.utility-action{display:inline-flex;align-items:center;justify-content:center;background:#22e08a;border-radius:11px;padding:14px 19px;color:#08342c;font-size:12px;font-weight:850;min-height:50px}
.utility-action:hover{background:#7af3c3;text-decoration:none}
.utility-ar{padding:55px 0;background:#f4f9fd}
.utility-ar h2{font-size:29px;color:#0c3555;letter-spacing:-.035em}
.utility-ar p{font-size:14px;color:#496e86;line-height:1.85;max-width:950px}
@media(max-width:1000px){.utility-hero-grid{grid-template-columns:1fr .85fr}.utility-guidance-grid{gap:13px}}
@media(max-width:760px){
 .wrap{width:calc(100% - 35px)}.nav{flex-wrap:wrap;padding-block:14px;min-height:auto;gap:13px}
 .nav-links{order:3;min-width:100%;width:100%;overflow-x:auto;white-space:nowrap;padding-block:8px;scrollbar-width:thin;gap:14px;font-size:12px}
 .utility-hero-grid{grid-template-columns:1fr;gap:22px;padding-block:56px}
 .utility-hero-visual{min-height:250px}.utility-hero-window{max-width:440px}
 .utility-hero h1{font-size:clamp(40px,9vw,65px)}
 .utility-section-head{grid-template-columns:1fr;gap:12px}
 .utility-section-head>p{justify-self:start}
 .utility-lab{grid-template-columns:1fr}
 .utility-guidance-grid{grid-template-columns:1fr}
 .utility-upsell-inner{grid-template-columns:1fr;gap:19px}
 .utility-action{justify-self:start}
}
@media(max-width:460px){.utility-input-grid,.utility-info-grid{grid-template-columns:1fr}.utility-line-row{grid-template-columns:1fr 1fr}.utility-line-row label:first-child{grid-column:1/-1}.utility-hero-visual{min-height:220px}.utility-file-tile{height:117px;width:100px;padding:13px}.utility-hero-window{transform:none}.utility-panel{padding:18px}.utility-invoice-page{padding:16px}.utility-invoice-thead,.utility-invoice-line{grid-template-columns:minmax(0,1.35fr) 22px 48px 58px;gap:5px;font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.utility-hero-window,.utility-file-tile,.utility-sheet-watermark{transition:none}}
@media(forced-colors:active){.utility-primary,.utility-action,.utility-line-row,.utility-invoice-watermark{border:2px solid ButtonText}}
@media print{
 @page{size:A4 portrait;margin:10mm}
 html,body{background:#fff!important;color:#000!important}
 .top,.announce,.utility-hero,.utility-guide,.utility-upsell,.utility-ar,.footer,.utility-section-head,.utility-panel:not(.utility-result),.utility-panel-head,.utility-caption,.utility-info-grid{display:none!important}
 .utility-work{padding:0!important;background:#fff!important}
 .utility-lab{display:block!important}
 .wrap{width:100%!important;max-width:none!important;padding:0!important}
 .utility-panel.utility-result{background:#fff!important;border:0!important;box-shadow:none!important;padding:0!important}
 .utility-pdf-stage{display:block!important;overflow:visible!important;max-height:none!important;padding:0!important;background:#fff!important}
 .utility-print-sheet{width:100%!important;height:275mm!important;aspect-ratio:auto!important;border:0!important;box-shadow:none!important;padding:5mm!important;margin:0!important;page-break-after:always;break-after:page}
 .utility-print-sheet:last-child{page-break-after:auto;break-after:auto}
 .utility-print-sheet img{max-width:100%!important;max-height:100%!important;object-fit:contain!important}
 .utility-sheet-watermark{font-size:23pt!important;color:rgba(20,60,100,.30)!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
 .utility-image-stage{border:0!important}
 .utility-invoice-page{border:0!important;box-shadow:none!important;padding:10mm!important;min-height:0!important;overflow:visible!important}
 .utility-invoice-watermark{font-size:24pt!important;color:rgba(0,80,170,.23)!important}
}

/* Keyboard focus must be unmistakable on light and dark utility surfaces. */
.utility-primary:focus-visible,.utility-action:focus-visible,.utility-back:focus-visible,
.utility-row-actions button:focus-visible,.utility-remove-line:focus-visible,
.utility-check:focus-within,.utility-panel input:focus-visible,
.utility-panel select:focus-visible,.utility-panel textarea:focus-visible{
  outline:3px solid #00a9ff;outline-offset:3px;
}

/* Real FAQs for utility-specific questions rather than duplicate keyword doorway pages. */
.utility-faq{background:#fff;padding:clamp(54px,7vw,88px) 0;border-top:1px solid #d9e7f1}
.utility-faq h2{font-size:clamp(26px,3.2vw,42px);letter-spacing:-.045em;line-height:1.15;margin:0 0 28px;max-width:850px;color:#123b5d}
.utility-faq details{border-bottom:1px solid #d8e4f0;padding:20px 0;max-width:950px}
.utility-faq summary{font-size:15px;font-weight:820;line-height:1.5;color:#173953;cursor:pointer}
.utility-faq summary:focus-visible{outline:3px solid #0057ff;outline-offset:3px}
.utility-faq details p{font-size:13px;line-height:1.8;color:#557187;max-width:890px;margin:12px 0 0}
@media print{.utility-faq{display:none!important}}


/* Contextual professional-service upsell: optional and separate from free file output. */
.utility-inline-upgrade{display:inline-flex;align-items:center;gap:8px;min-height:40px;margin:15px 0 0;color:#0057cf;font-size:12px;font-weight:850;text-decoration:underline;text-underline-offset:3px;line-height:1.5}
.utility-inline-upgrade:hover{color:#083b80}
.utility-inline-upgrade:focus-visible,.utility-secondary-action:focus-visible{outline:3px solid #00a9ff;outline-offset:3px}
.utility-upsell-actions{display:grid;gap:10px;min-width:220px;align-items:center}
.utility-secondary-action{font-size:12px;font-weight:790;color:#c8e8fa;border-bottom:1px solid #84c8e9;display:inline-flex;justify-content:center;min-height:36px;align-items:center;text-align:center}
.utility-secondary-action:hover{color:#fff}
@media(max-width:760px){.utility-upsell-actions{justify-items:start}.utility-secondary-action{justify-content:flex-start}}
@media print{.utility-inline-upgrade,.utility-upsell-actions{display:none!important}}
