/* OSTIN INTERNATIONAL CO., LIMITED — self-contained static website */
:root{--night:#121432;--night-deep:#0c0e28;--night-card:#212448;--accent:#a3374c;--accent-light:#cf6575;--ivory:#f6f5f1;--ivory-dark:#e8e6df;--sand:#d1c7b4;--khaki:#b3b093;--ink:#1b1c3d;--text-muted:#73768c;--max:1248px;--radius:16px}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--night);color:var(--ivory);font-family:Inter,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}img,svg{display:block;max-width:100%}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit;text-decoration:none}:focus-visible{outline:3px solid #ef9b99;outline-offset:5px}::selection{background:#d0bdba;color:var(--night)}.shell{width:min(var(--max),calc(100% - 88px));margin-inline:auto}.skip-link{position:fixed;z-index:1000;left:16px;top:-90px;color:var(--night);background:white;padding:12px 16px}.skip-link:focus{top:12px}
/* navigation */
.site-header{height:100px;position:sticky;top:0;z-index:40;background:rgba(14,16,45,.965);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:20px;min-width:0}.brand-badge{width:146px;height:80px;background:#fff;display:grid;place-items:center;flex:0 0 auto;border-radius:7px 50px 50px 7px;overflow:hidden}.brand-badge img{object-fit:contain;width:120px;height:78px}.brand-name{font-size:17px;letter-spacing:.075em;white-space:nowrap;font-weight:650;line-height:1.15}.brand-name span{display:block}.brand-name .brand-suffix{font-size:12px;color:#abb1c7;font-weight:400;letter-spacing:.13em;margin-top:7px}.desktop-nav{display:flex;align-items:center;gap:35px;font-size:13px;color:#dadce9}.desktop-nav a:not(.nav-contact){transition:color .2s ease}.desktop-nav a:hover,.desktop-nav a[aria-current="true"]{color:white}.nav-contact{border:1px solid rgba(255,255,255,.34);padding:13px 19px;border-radius:4px;transition:background .2s,border .2s}.nav-contact span{margin-left:14px;color:#dd97a0}.nav-contact:hover{background:rgba(255,255,255,.1);border-color:white}.menu-toggle{display:none;width:46px;height:45px;background:transparent;border:1px solid #555874;align-items:center;flex-direction:column;justify-content:center;gap:5px;cursor:pointer}.menu-toggle span{width:20px;height:1.5px;background:#fff;transition:transform .2s,opacity .2s}.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}.mobile-nav[hidden]{display:none}
/* hero */
.hero{position:relative;overflow:hidden;background:linear-gradient(145deg,#17193c 0%,#111331 50%,#0e1029 100%)}.hero::before{content:"";position:absolute;top:-360px;left:-250px;width:800px;height:800px;border:1px solid rgba(255,255,255,.045);border-radius:50%;pointer-events:none}.hero::after{content:"";position:absolute;top:-210px;left:-100px;width:490px;height:490px;border:1px solid rgba(255,255,255,.055);border-radius:50%;pointer-events:none}.hero-accent{position:absolute;left:0;top:0;width:6px;height:100%;background:linear-gradient(180deg,#a5374e,transparent 74%)}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;min-height:645px;align-items:center;gap:50px;padding:78px 0 63px}.hero-copy{position:relative;z-index:2}.eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:12px;letter-spacing:.16em;font-size:11px;font-weight:700;line-height:1.5}.eyebrow{color:#c1b1ab}.eyebrow-rule{background:var(--accent-light);width:31px;height:2px;display:inline-block}.hero h1,.section-intro h2,.products h2,.why-section h2,.contact-section h2{font-weight:500;letter-spacing:-.052em;line-height:1.08}.hero h1{font-size:clamp(48px,5.2vw,76px);margin:30px 0 26px;max-width:750px}.hero h1 em,.section-intro h2 em,.products h2 em,.why-section h2 em,.contact-section h2 em{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.05em}.hero h1 em{color:var(--sand)}.hero-copy>p{max-width:540px;font-size:16px;line-height:1.85;color:#c4c6d5}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:28px;margin-top:40px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid transparent;border-radius:3px;padding:17px 24px;cursor:pointer;font-size:13px;font-weight:700;transition:transform .2s,background .2s,color .2s}.button:hover{transform:translateY(-2px)}.button-light{background:#f5f3ec;color:#1d1d3d}.button-light:hover{background:#e7d5ca}.button span{font-size:16px}.text-link{display:inline-flex;gap:13px;align-items:center;color:#d2cbd0;font-size:13px;font-weight:650}.text-link span{color:#dd7788;font-size:19px;transition:transform .2s}.text-link:hover span{transform:translateY(4px)}.hero-keywords{display:flex;align-items:center;flex-wrap:wrap;gap:13px;font-size:10px;letter-spacing:.13em;font-weight:650;color:#8990aa;margin-top:69px}.keyword-dot{width:3px;height:3px;border-radius:50%;background:#b95062}.hero-art{position:relative;align-self:stretch;min-height:535px;margin-right:calc((min(var(--max),100vw - 88px) - 100vw)/2);margin-top:-24px;margin-bottom:-18px;background:#293047;overflow:hidden;border-radius:4px 0 0 4px;box-shadow:-23px 32px 70px rgba(0,0,0,.24)}.hero-art:after{content:"";pointer-events:none;position:absolute;inset:0;border:1px solid rgba(255,255,255,.15)}.hero-art img{width:100%;height:100%;object-fit:cover;object-position:center}.hero-art-label{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;gap:16px;min-height:64px;padding:0 28px;background:rgba(14,16,37,.78);backdrop-filter:blur(15px);font-size:10px;font-weight:650;letter-spacing:.16em}.art-label-line{width:24px;height:1px;background:#c86d7b}.art-number{margin-left:auto;color:#acaec0}.hero-bottom{display:flex;justify-content:space-between;gap:20px;padding:22px 0 28px;border-top:1px solid rgba(255,255,255,.12);font-size:10px;letter-spacing:.16em;color:#969ab1}.hero-bottom i{font-style:normal;color:#b85969;padding:0 8px}
/* about */
.section-light{background:var(--ivory);color:var(--ink)}.about{padding:115px 0 116px}.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(64px,9vw,150px)}.section-kicker{color:var(--accent);font-size:11px}.section-no{background:var(--accent);color:white;padding:5px 7px;border-radius:2px;letter-spacing:0}.section-intro h2{font-size:clamp(43px,4.5vw,63px);margin:27px 0 0;max-width:480px}.section-intro h2 em{color:var(--accent)}.about-content>h3{margin:0 0 14px;font-size:16px;letter-spacing:.02em}.about-content>p{color:#5a5c68;font-size:16px;line-height:1.9;margin:0}.mission-block{display:grid;grid-template-columns:45px 1fr;gap:17px;margin-top:41px;padding:32px 34px;background:#eae6dd;border-left:3px solid var(--accent)}.mission-icon{font-size:24px;color:var(--accent);line-height:1}.mission-block h3{margin:0 0 10px;font-size:17px}.mission-block p{margin:0;color:#585968;line-height:1.8;font-size:14px}
/* products */
.products{padding:107px 0 120px;background:#17193e}.products-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:38px}.products-heading .section-kicker{color:#c47f8b}.products h2{font-size:clamp(43px,4.5vw,64px);margin:21px 0 0}.products h2 em{color:#c3b8a9}.products-heading>p{max-width:370px;color:#aeb0c7;font-size:14px;line-height:1.7}.products-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.product-card{background:#212448;border:1px solid rgba(255,255,255,.12);border-radius:4px;overflow:hidden;transition:transform .3s ease,border-color .3s}.product-card:hover{transform:translateY(-5px);border-color:#686b8d}.product-image{position:relative;aspect-ratio:1.82;overflow:hidden;background:#7b7b82}.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.product-card:hover .product-image img{transform:scale(1.045)}.product-number{position:absolute;left:22px;bottom:20px;font-size:10px;letter-spacing:.15em;font-weight:750;padding:12px 15px;background:rgba(16,19,48,.88);color:white}.product-details{padding:30px 31px 34px}.product-title{display:flex;align-items:center;gap:15px;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.16)}.product-title h3{margin:0;font-size:22px;font-weight:600;letter-spacing:-.02em}.product-icon{width:40px;height:40px;border:1px solid rgba(255,255,255,.2);display:grid;place-items:center;color:#dda1a6}.product-icon svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}.product-list{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:0}.product-list li{color:#e3e3ed;font-size:14px;padding:12px 0 12px 25px;position:relative;line-height:1.4}.product-list li:before{content:"";position:absolute;left:0;top:20px;width:7px;height:7px;border:1px solid #c86a7a;transform:rotate(45deg)}
/* benefits */
.why-section{background:#b4b194;color:#1b1e3c;padding:109px 0 120px}.why-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(60px,10vw,155px);align-items:start}.why-section .section-kicker{color:#5d2d42}.why-section .section-no{background:#2d2d45}.why-section h2{font-size:clamp(43px,4.6vw,64px);margin:26px 0 21px}.why-section h2 em{color:#74384f}.why-intro>p{font-size:15px;line-height:1.8;color:#515065}.decor-lines{display:flex;align-items:center;gap:10px;margin-top:57px}.decor-lines i{height:3px;width:90px;background:#87384e}.decor-lines i:nth-child(2){width:34px;background:#70705d}.decor-lines i:nth-child(3){width:15px;background:#70705d}.benefits-list{list-style:none;padding:0;margin:0;border-top:1px solid rgba(28,30,62,.25)}.benefits-list li{display:flex;align-items:center;gap:23px;padding:22px 0;border-bottom:1px solid rgba(28,30,62,.25);font-size:17px;line-height:1.4;font-weight:550}.benefit-check{width:33px;height:33px;border:1px solid rgba(28,30,62,.45);display:grid;place-items:center;flex:0 0 auto;font-size:15px;color:#863c50}
/* contact */
.contact-section{position:relative;overflow:hidden;background:#a0374d;color:#fff;padding:112px 0}.contact-section:before{position:absolute;content:"";width:580px;height:580px;border:1px solid rgba(255,255,255,.13);border-radius:50%;left:-180px;bottom:-470px}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:start}.contact-section .section-kicker{color:#f8d8d7}.contact-section .section-no{background:#fff;color:#a0374d}.contact-section h2{font-size:clamp(50px,5vw,76px);margin:24px 0 25px}.contact-section h2 em{color:#f0cec5}.contact-section .contact-grid>div>p{font-size:13px;letter-spacing:.075em;color:#f0c9ce}.address-card{background:#812e42;border:1px solid rgba(255,255,255,.23);padding:35px 36px 20px;border-radius:4px}.address-label{display:flex;align-items:center;justify-content:space-between;font-size:11px;letter-spacing:.15em;color:#e4b7bd;font-weight:700}.address-label span{font-size:19px}.address-card address{font-style:normal;font-size:clamp(18px,2vw,23px);line-height:1.6;letter-spacing:-.02em;font-weight:500;margin-top:27px;overflow-wrap:anywhere}.contact-actions{display:flex;align-items:center;gap:23px;flex-wrap:wrap;margin-top:35px}.button-small{padding:14px 18px}.map-link{font-size:12px;white-space:nowrap;color:#f9e7ea}.map-link span{margin-left:7px}.map-link:hover{text-decoration:underline}.copy-feedback{min-height:16px;color:#f0d8da;font-size:12px;margin:13px 0 0}
.footer{background:var(--night-deep);padding:23px 0}.footer-inner{display:flex;align-items:center;gap:23px}.footer-logo{width:83px;height:62px;border-radius:5px 29px 29px 5px;background:#fff;display:grid;place-items:center}.footer-logo img{width:73px;height:61px;object-fit:contain}.footer-inner>div{display:grid;gap:8px}.footer-inner strong{letter-spacing:.07em;font-size:12px}.footer-inner small{color:#989db7;font-size:11px}.back-to-top{margin-left:auto;color:#d9dce8;font-size:12px}.back-to-top:hover{color:white}
@media(max-width:1140px){.shell{width:min(var(--max),calc(100% - 60px))}.desktop-nav{gap:19px}.brand{gap:12px}.brand-badge{width:107px;height:70px}.brand-badge img{width:102px;height:67px}.brand-name{font-size:14px}.hero-grid{gap:32px}.hero-art{margin-right:-30px}.hero h1{font-size:clamp(46px,5.3vw,64px)}.hero-keywords{margin-top:45px}}
@media(max-width:900px){.site-header{height:78px}.desktop-nav{display:none}.menu-toggle{display:flex}.brand-badge{width:100px;height:62px}.brand-badge img{width:96px;height:62px}.mobile-nav:not([hidden]){display:flex;position:absolute;top:78px;left:0;right:0;background:#111331;flex-direction:column;padding:16px 30px 26px;box-shadow:0 20px 30px #0003;border-bottom:1px solid #424569}.mobile-nav a{display:block;padding:17px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:15px}.hero-grid{min-height:auto;padding:64px 0 45px;grid-template-columns:1fr}.hero h1{max-width:800px;font-size:clamp(52px,7.5vw,76px)}.hero-copy>p{max-width:700px}.hero-art{min-height:390px;max-height:520px;margin:10px 0 0;border-radius:4px}.hero-art img{height:440px}.hero-keywords{margin-top:32px}.about-grid,.why-grid{gap:40px;grid-template-columns:1fr}.about{padding:85px 0}.section-intro h2{max-width:780px}.why-section{padding:85px 0}.products{padding:80px 0}.contact-grid{gap:40px}}
@media(max-width:700px){.shell{width:calc(100% - 36px)}.brand-badge{height:58px;width:89px}.brand-badge img{width:86px;height:57px}.brand-name{font-size:12px;letter-spacing:.065em}.brand-name .brand-suffix{font-size:10px;margin-top:5px}.hero-grid{padding:56px 0 38px}.hero h1{font-size:clamp(43px,10.5vw,63px);margin:26px 0 22px}.eyebrow{font-size:9px;gap:9px}.eyebrow-rule{width:19px}.hero-copy>p{font-size:15px;line-height:1.75}.hero-actions{gap:18px;margin-top:29px}.hero-keywords{font-size:9px;gap:9px}.hero-art{min-height:290px;margin-top:2px}.hero-art img{height:340px}.hero-art-label{min-height:54px;padding:0 17px;font-size:9px}.hero-bottom{flex-wrap:wrap;gap:10px;font-size:9px;padding:18px 0}.products-heading{display:block}.products-heading>p{margin:23px 0 0}.products-grid{grid-template-columns:1fr;gap:24px}.products{padding:75px 0}.product-image{aspect-ratio:1.78}.product-details{padding:25px 22px}.about,.why-section{padding:75px 0}.section-intro h2,.products h2,.why-section h2{font-size:clamp(42px,10vw,54px)}.about-content>p{font-size:15px}.mission-block{padding:23px 21px;grid-template-columns:26px 1fr;gap:14px}.mission-block p{font-size:14px}.benefits-list li{font-size:15px;gap:16px;padding:20px 0}.why-section h2{margin-top:24px}.decor-lines{margin-top:30px}.contact-section{padding:75px 0}.contact-grid{grid-template-columns:1fr;gap:24px}.contact-section h2{font-size:63px}.contact-section .contact-grid>div>p{font-size:12px}.address-card{padding:28px 24px 12px}.address-card address{font-size:19px}.footer-inner{gap:12px}.footer-logo{height:54px;width:75px}.footer-logo img{width:71px;height:51px}.footer-inner strong{font-size:10px}.footer-inner small{font-size:10px}.back-to-top{font-size:10px;white-space:nowrap}}
@media(max-width:390px){.brand-name{font-size:11px}.brand-badge{width:78px}.brand-badge img{width:75px}.hero h1{font-size:42px}.text-link{font-size:12px}.button{padding:15px 16px}.contact-section h2{font-size:56px}.address-card address{font-size:17px}.contact-actions{gap:14px}.footer-logo{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
